Skip to content

feat: add optional search button#289

Open
cubmic wants to merge 4 commits intomainfrom
287-input-suche-button
Open

feat: add optional search button#289
cubmic wants to merge 4 commits intomainfrom
287-input-suche-button

Conversation

@cubmic
Copy link
Contributor

@cubmic cubmic commented Jun 12, 2025

Sali Dan,
Kannst Du darüber schauen:

  • submitLabel param & @leu:submit event hinzugefügt
  • Storybook 'Input -> Search With Submit' hinzugefügt
  • Der Button ist disabled, solange value leer ist, was meinst Du ist das sinnvoll ?

LG

@cubmic cubmic linked an issue Jun 12, 2025 that may be closed by this pull request
@daenub daenub force-pushed the 287-input-suche-button branch from 6e20fee to 7907dec Compare June 26, 2025 15:37
* @fires {CustomEvent} input - Dispatched when the value of the input element changes.
* @fires {CustomEvent} change - Dispatched when the value of the input element changes and the input element loses focus.
*
* @tagname leu-input
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Das ist noch der falsche Element Name

} as const

/**
* A text input element.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy Paste überbleibsel vom Input Element

submitLabel?: string

@state()
private _identifier: string = ""
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wie schon bilateral besprochen. Den _identifier brauchts nicht mehr. id ist auf den Scope vom Shadow DOM beschränkt.

* If the id attribute is set, the value of the id attribute is returned.
* Otherwise a random id is generated and returned.
*/
private getId() {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Obsolet. Wie schon oben erwähnt.


import styles from "./search.css"

export const SEARCH_SIZES = {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Die definierten Konstante würde ich in die Story verschieben, da sie nur dort verwendet wird. Bin das jetzt auch bei den anderen Components am nachziehen

@daenub
Copy link
Member

daenub commented Jun 26, 2025

@cubmic

Mir sind visuell noch ein zwei Dinge aufgefallen:

  • Der Text (nicht das Label) und das Such Icon verändern die Farbe, wenn das Feld fokusiert wird.
  • Sollte das Such Icon nicht auch ein Button sein? Der Submit Button sollte ja laut Design bei < 840 zum Such Icon wechseln.
  • Der Label Text ist nicht gleich ausgerichtet wie der Input Text. Er hängt leicht nach oben

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Input: Suche Button

2 participants