@rcarls/rc-search-bar 0.5.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/CHANGELOG.md +133 -0
  2. package/README.md +74 -66
  3. package/dist/custom-elements.json +85 -23
  4. package/dist/{rc-search-bar-D0uhitIm.js → rc-search-bar-DFKw8RH2.js} +93 -256
  5. package/dist/rc-search-bar-DFKw8RH2.js.map +1 -0
  6. package/dist/rc-search-bar-define.js +5 -3
  7. package/dist/rc-search-bar-define.js.map +1 -1
  8. package/dist/rc-search-bar.js +3 -2
  9. package/dist/types/packages/rc-search-bar/src/index.d.ts +1 -1
  10. package/dist/types/packages/rc-search-bar/src/rc-search-bar.d.ts +24 -5
  11. package/package.json +2 -2
  12. package/dist/rc-search-bar-D0uhitIm.js.map +0 -1
  13. package/dist/types/packages/rc-search-bar/src/rc-search-bar.test.d.ts +0 -0
package/dist/{rc-search-bar-D0uhitIm.js → rc-search-bar-DFKw8RH2.js} RENAMED
@@ -1,209 +1,36 @@
1
- import { css as f, LitElement as g, html as d, nothing as _ } from "lit";
2
- import { property as r, state as n } from "lit/decorators.js";
3
- import { classMap as l } from "lit/directives/class-map.js";
4
- import { NativeChildController as m, keyInteraction as y } from "@rcarls/rc-common";
5
- const w = f`
6
- :host {
7
- display: inline-flex;
8
- position: relative;
9
- color-scheme: inherit;
10
- }
11
-
12
- [hidden] {
13
- display: none !important;
14
- }
15
-
16
- #root {
17
- display: flex;
18
- flex: 1 1 auto;
19
- align-items: center;
20
- min-inline-size: 0;
21
- gap: var(--rc-search-bar-gap, var(--rc-control-gap, 0.25em));
22
- block-size: var(--rc-search-bar-height, var(--rc-control-block-size, 2.5rem));
23
- padding-inline: var(--rc-search-bar-padding-inline, var(--rc-control-padding-inline, 0.75rem));
24
- border: var(
25
- --rc-search-bar-border,
26
- var(--rc-border, 1px solid var(--rc-border-color, ButtonBorder))
27
- );
28
- border-radius: var(
29
- --rc-search-bar-radius,
30
- var(--rc-control-radius, var(--rc-radius-sm, 0.125em))
31
- );
32
- box-shadow: var(--rc-search-bar-shadow, none);
33
- background: var(--rc-search-bar-bg, var(--rc-field, Field));
34
- color: var(--rc-search-bar-color, var(--rc-field-text, FieldText));
35
- font-family: var(--rc-font-family, inherit);
36
- font-size: var(--rc-font-size, inherit);
37
- line-height: var(--rc-line-height, normal);
38
- transition:
39
- background-color 120ms,
40
- border-color 120ms,
41
- box-shadow 120ms;
42
- }
43
-
44
- :host([data-interaction-mode='keyboard']) #root:focus-within {
45
- outline: var(--rc-focus-ring, auto);
46
- outline-offset: var(--rc-focus-ring-offset, 0);
47
- }
48
-
49
- /* No slotted search input: render no chrome at all. */
50
- #root.empty {
51
- block-size: auto;
52
- padding: 0;
53
- background: none;
54
- border: none;
55
- box-shadow: none;
56
- border-radius: 0;
57
- }
58
-
59
- #leading {
60
- display: flex;
61
- flex: none;
62
- align-items: center;
63
- color: var(--rc-search-bar-icon-color, GrayText);
64
- }
65
-
66
- #leading.empty {
67
- display: none;
68
- }
69
-
70
- ::slotted(input[type='search']) {
71
- flex: 1 1 auto;
72
- min-inline-size: 0;
73
- padding: 0;
74
- border: none;
75
- background: transparent;
76
- color: var(--rc-search-bar-input-color, inherit);
77
- font-family: var(--rc-search-bar-input-font-family, inherit);
78
- font-size: var(--rc-search-bar-input-font-size, inherit);
79
- outline: none;
80
- appearance: textfield;
81
- }
82
-
83
- #trailing {
84
- display: flex;
85
- flex: none;
86
- align-items: center;
87
- }
88
-
89
- #trailing.empty {
90
- display: none;
91
- }
92
-
93
- #clear {
94
- display: inline-grid;
95
- flex: none;
96
- place-items: center;
97
- min-inline-size: 24px;
98
- min-block-size: 24px;
99
- padding: 0;
100
- border: none;
101
- border-radius: 50%;
102
- background: none;
103
- color: var(--rc-search-bar-clear-color, GrayText);
104
- font: inherit;
105
- cursor: pointer;
106
- }
107
-
108
- #clear[inert] {
109
- visibility: hidden;
110
- }
111
-
112
- #clear:focus-visible {
113
- outline: var(--rc-focus-ring, auto);
114
- outline-offset: var(--rc-focus-ring-offset, 0);
115
- }
116
-
117
- #view {
118
- position: absolute;
119
- z-index: 1;
120
- inset-block-start: calc(100% + var(--rc-search-bar-view-offset, 0.25rem));
121
- inset-inline: 0;
122
- min-inline-size: 100%;
123
- }
124
-
125
- #view-surface {
126
- box-sizing: border-box;
127
- padding-block: var(--rc-search-bar-view-padding-block, 0.5rem);
128
- border: var(
129
- --rc-search-bar-view-border,
130
- var(--rc-search-bar-border, var(--rc-border, 1px solid var(--rc-border-color, ButtonBorder)))
131
- );
132
- border-radius: var(
133
- --rc-search-bar-view-radius,
134
- var(--rc-search-bar-radius, var(--rc-control-radius, var(--rc-radius-sm, 0.125em)))
135
- );
136
- box-shadow: var(--rc-search-bar-view-shadow, var(--rc-search-bar-shadow, none));
137
- background: var(--rc-search-bar-view-bg, var(--rc-search-bar-bg, var(--rc-field, Field)));
138
- color: var(
139
- --rc-search-bar-view-color,
140
- var(--rc-search-bar-color, var(--rc-field-text, FieldText))
141
- );
142
- font-family: var(--rc-font-family, inherit);
143
- font-size: var(--rc-font-size, inherit);
144
- }
145
-
146
- #view-surface.empty {
147
- display: none;
148
- }
149
-
150
- #suggestions {
151
- display: flex;
152
- flex-direction: column;
153
- }
154
-
155
- #suggestions ::slotted(*) {
156
- min-inline-size: 0;
157
- }
158
-
159
- [part='suggestion'] {
160
- display: flex;
161
- align-items: center;
162
- min-block-size: var(--rc-search-bar-suggestion-min-block-size, 2.75rem);
163
- padding-block: 0;
164
- padding-inline: var(--rc-search-bar-suggestion-padding-inline, 1rem);
165
- border: 0;
166
- background: transparent;
167
- color: inherit;
168
- font: inherit;
169
- text-align: start;
170
- cursor: pointer;
171
- }
172
-
173
- [part='suggestion']:hover,
174
- [part='suggestion']:focus-visible {
175
- background: var(--rc-search-bar-suggestion-hover-bg, ButtonFace);
176
- }
177
-
178
- [part='suggestion']:focus-visible {
179
- outline: var(--rc-focus-ring, auto);
180
- outline-offset: var(--rc-focus-ring-offset, 0);
181
- }
182
- `;
183
- var S = Object.defineProperty, L = Object.getOwnPropertyDescriptor, a = (p, e, t, i) => {
184
- for (var o = i > 1 ? void 0 : i ? L(e, t) : e, h = p.length - 1, u; h >= 0; h--)
185
- (u = p[h]) && (o = (i ? u(e, t, o) : u(o)) || o);
186
- return i && o && S(e, t, o), o;
1
+ import { css as _, LitElement as v, html as d, nothing as b } from "lit";
2
+ import { property as r, state as o } from "lit/decorators.js";
3
+ import { classMap as h } from "lit/directives/class-map.js";
4
+ import { MessagesController as f, NativeChildController as g, keyInteraction as m, cssText as y } from "@rcarls/rc-common";
5
+ const w = _`:host{color-scheme:inherit;display:inline-flex;position:relative}[hidden]{display:none!important}#root{align-items:center;gap:var(--rc-search-bar-gap,var(--rc-control-gap,.25em));min-inline-size:0;block-size:var(--rc-search-bar-height,var(--rc-control-block-size,2.5rem));padding-inline:var(--rc-search-bar-padding-inline,var(--rc-control-padding-inline,.75rem));border:var(--rc-search-bar-border,var(--rc-border,1px solid var(--rc-border-color,ButtonBorder)));border-radius:var(--rc-search-bar-radius,var(--rc-control-radius,var(--rc-radius-sm,.125em)));box-shadow:var(--rc-search-bar-shadow,none);background:var(--rc-search-bar-bg,var(--rc-field,Field));color:var(--rc-search-bar-color,var(--rc-field-text,FieldText));font-family:var(--rc-font-family,inherit);font-size:var(--rc-font-size,inherit);line-height:var(--rc-line-height,normal);flex:auto;transition:background-color .12s,border-color .12s,box-shadow .12s;display:flex}:host([data-interaction-mode=keyboard]) #root:focus-within{outline:var(--rc-focus-ring,auto);outline-offset:var(--rc-focus-ring-offset,0)}#root.empty{block-size:auto;box-shadow:none;background:0 0;border:none;border-radius:0;padding:0}#leading{color:var(--rc-search-bar-icon-color,GrayText);flex:none;align-items:center;display:flex}#leading.empty{display:none}::slotted(input[type=search]){min-inline-size:0;color:var(--rc-search-bar-input-color,inherit);font-family:var(--rc-search-bar-input-font-family,inherit);font-size:var(--rc-search-bar-input-font-size,inherit);appearance:textfield;background:0 0;border:none;outline:none;flex:auto;padding:0}#trailing{flex:none;align-items:center;display:flex}#trailing.empty{display:none}#clear{min-block-size:24px;min-inline-size:24px;color:var(--rc-search-bar-clear-color,GrayText);font:inherit;cursor:pointer;background:0 0;border:none;border-radius:50%;flex:none;place-items:center;padding:0;display:inline-grid}#clear[inert]{visibility:hidden}#clear:focus-visible{outline:var(--rc-focus-ring,auto);outline-offset:var(--rc-focus-ring-offset,0)}#view{z-index:1;min-inline-size:100%;position:absolute;inset-block-start:calc(100% + var(--rc-search-bar-view-offset,.25rem));inset-inline:0}#view-surface{box-sizing:border-box;padding-block:var(--rc-search-bar-view-padding-block,.5rem);border:var(--rc-search-bar-view-border,var(--rc-search-bar-border,var(--rc-border,1px solid var(--rc-border-color,ButtonBorder))));border-radius:var(--rc-search-bar-view-radius,var(--rc-search-bar-radius,var(--rc-control-radius,var(--rc-radius-sm,.125em))));box-shadow:var(--rc-search-bar-view-shadow,var(--rc-search-bar-shadow,none));background:var(--rc-search-bar-view-bg,var(--rc-search-bar-bg,var(--rc-field,Field)));color:var(--rc-search-bar-view-color,var(--rc-search-bar-color,var(--rc-field-text,FieldText)));font-family:var(--rc-font-family,inherit);font-size:var(--rc-font-size,inherit)}#view-surface.empty{display:none}#suggestions{flex-direction:column;display:flex}#suggestions ::slotted(*){min-inline-size:0}[part=suggestion]{min-block-size:var(--rc-search-bar-suggestion-min-block-size,2.75rem);padding-block:0;padding-inline:var(--rc-search-bar-suggestion-padding-inline,1rem);color:inherit;font:inherit;text-align:start;cursor:pointer;background:0 0;border:0;align-items:center;display:flex}[part=suggestion]:hover,[part=suggestion]:focus-visible{background:var(--rc-search-bar-suggestion-hover-bg,ButtonFace)}[part=suggestion]:focus-visible{outline:var(--rc-focus-ring,auto);outline-offset:var(--rc-focus-ring-offset,0)}`;
6
+ var S = Object.defineProperty, L = Object.getOwnPropertyDescriptor, a = (p, e, t, s) => {
7
+ for (var l = s > 1 ? void 0 : s ? L(e, t) : e, c = p.length - 1, u; c >= 0; c--)
8
+ (u = p[c]) && (l = (s ? u(e, t, l) : u(l)) || l);
9
+ return s && l && S(e, t, l), l;
187
10
  };
188
- const v = new CSSStyleSheet();
189
- v.replaceSync(
190
- `rc-search-bar:not([allow-native-clear]) input[type="search"]::-webkit-search-cancel-button
191
- { -webkit-appearance: none; display: none; }`
192
- );
193
- let b = !1;
194
- function I() {
195
- b || (document.adoptedStyleSheets = [...document.adoptedStyleSheets, v], b = !0);
196
- }
197
- const c = class c extends g {
11
+ const I = y`@layer rc-base{rc-search-bar>input[type=search]{min-block-size:0;min-inline-size:0;color:var(--rc-search-bar-input-color,inherit);font-family:var(--rc-search-bar-input-font-family,inherit);font-size:var(--rc-search-bar-input-font-size,inherit);box-shadow:none;appearance:textfield;background:0 0;border:0;border-radius:0;outline:0;flex:auto;padding:0}rc-search-bar>input[type=search]:focus-visible{box-shadow:none;border:0;outline:0}rc-search-bar:not([allow-native-clear])>input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;display:none}}`, x = Object.freeze({
12
+ clear: "Clear search"
13
+ });
14
+ var n;
15
+ const i = (n = class extends v {
198
16
  constructor() {
199
- super(...arguments), this.variant = "bar", this.debounce = 200, this.clearLabel = "Clear search", this.allowNativeClear = !1, this.showClearOnFocus = !1, this._open = !1, this._defaultOpen = !1, this._openInitialized = !1, this._value = void 0, this._defaultValue = void 0, this._valueSetByHost = !1, this._valueInitialized = !1, this._authorPlaceholder = !1, this._$inputRef = null, this._debounceTimer = void 0, this._$dataListRef = null, this._hasInput = !1, this._hasValue = !1, this._hasLeading = !1, this._hasTrailing = !1, this._inputDisabled = !1, this._hasSuggestionsSlot = !1, this._dataListSuggestions = [], this._disabledHost = void 0, this._focused = !1, this._onInputFocus = () => {
17
+ super(...arguments), this._messages = new f(
18
+ this,
19
+ "rc-search-bar",
20
+ x,
21
+ {
22
+ overrides: () => this.messages
23
+ }
24
+ ), this.variant = "bar", this.debounce = 200, this.allowNativeClear = !1, this.showClearOnFocus = !1, this._open = !1, this._defaultOpen = !1, this._openInitialized = !1, this._value = void 0, this._defaultValue = void 0, this._valueSetByHost = !1, this._valueInitialized = !1, this._authorPlaceholder = !1, this._$inputRef = null, this._debounceTimer = void 0, this._$dataListRef = null, this._hasInput = !1, this._hasValue = !1, this._hasLeading = !1, this._hasTrailing = !1, this._inputDisabled = !1, this._hasSuggestionsSlot = !1, this._dataListSuggestions = [], this._disabledHost = void 0, this._focused = !1, this._onInputFocus = () => {
200
25
  this._focused = !0, this.variant === "view" && this.showView();
201
- }, this._onInputBlur = () => {
202
- this._focused = !1;
26
+ }, this._onInputBlur = (e) => {
27
+ this._containsFocusTarget(e.relatedTarget) || (this._focused = !1);
28
+ }, this._onHostFocusOut = (e) => {
29
+ this._containsFocusTarget(e.relatedTarget) || (this._focused = !1);
203
30
  }, this._disabledObserver = new MutationObserver(() => {
204
31
  const e = this._$input();
205
32
  e && (this._inputDisabled = e.disabled, this._syncDataListSuggestions(e));
206
- }), this._dataListObserver = new MutationObserver(() => this._syncDataListSuggestions()), this._inputController = new m(this, {
33
+ }), this._dataListObserver = new MutationObserver(() => this._syncDataListSuggestions()), this._inputController = new g(this, {
207
34
  selector: ':scope > input[type="search"]',
208
35
  observe: { childList: !0, attributes: !0, attributeFilter: ["list"] },
209
36
  onChange: (e, t) => this._setupInput(e, t),
@@ -216,14 +43,24 @@ const c = class c extends g {
216
43
  e.key === "Escape" && this.open && (e.preventDefault(), this.closeView());
217
44
  };
218
45
  }
46
+ static _ensureBaseStyles(e) {
47
+ if (n._styledRoots.has(e))
48
+ return;
49
+ n._styledRoots.add(e);
50
+ const t = document.createElement("style");
51
+ t.setAttribute("data-rc-light-dom-base", "rc-search-bar"), t.textContent = I, e instanceof Document ? e.head.append(t) : e.append(t);
52
+ }
219
53
  get disabled() {
220
54
  return this._disabledHost ?? this._inputDisabled;
221
55
  }
222
56
  set disabled(e) {
223
57
  const t = this.disabled;
224
58
  this._disabledHost = e;
225
- const i = this._$input();
226
- i && (i.disabled = e), this.requestUpdate("disabled", t);
59
+ const s = this._$input();
60
+ s && (s.disabled = e), this.requestUpdate("disabled", t);
61
+ }
62
+ _containsFocusTarget(e) {
63
+ return e instanceof Node && (e === this || this.contains(e) || !!this.shadowRoot?.contains(e));
227
64
  }
228
65
  get open() {
229
66
  return this._open;
@@ -245,8 +82,8 @@ const c = class c extends g {
245
82
  set value(e) {
246
83
  const t = this.value;
247
84
  this._value = e, this._valueSetByHost = !0, this._valueInitialized = !0;
248
- const i = this._$input();
249
- i && (i.value = e), this._hasValue = e.length > 0, this.requestUpdate("value", t);
85
+ const s = this._$input();
86
+ s && (s.value = e), this._hasValue = e.length > 0, this.requestUpdate("value", t);
250
87
  }
251
88
  get defaultValue() {
252
89
  return this._defaultValue;
@@ -254,14 +91,14 @@ const c = class c extends g {
254
91
  set defaultValue(e) {
255
92
  const t = this._defaultValue;
256
93
  this._defaultValue = e;
257
- const i = this._$input();
258
- i && e !== void 0 && !this._valueInitialized && (i.value = e, this._hasValue = e.length > 0), this.requestUpdate("defaultValue", t);
94
+ const s = this._$input();
95
+ s && e !== void 0 && !this._valueInitialized && (s.value = e, this._hasValue = e.length > 0), this.requestUpdate("defaultValue", t);
259
96
  }
260
97
  connectedCallback() {
261
- super.connectedCallback(), I();
98
+ super.connectedCallback(), n._ensureBaseStyles(this.getRootNode()), this.addEventListener("focusout", this._onHostFocusOut);
262
99
  }
263
100
  disconnectedCallback() {
264
- super.disconnectedCallback(), this._focused = !1, this._open = !1, this._cancelPendingInput();
101
+ super.disconnectedCallback(), this.removeEventListener("focusout", this._onHostFocusOut), this._focused = !1, this._open = !1, this._cancelPendingInput();
265
102
  const e = this._$input();
266
103
  e?.removeEventListener("input", this._onNativeInput), e?.removeEventListener("focus", this._onInputFocus), e?.removeEventListener("blur", this._onInputBlur), e?.removeEventListener("keydown", this._onNativeKeyDown), this._disabledObserver.disconnect(), this._dataListObserver.disconnect();
267
104
  }
@@ -348,9 +185,9 @@ const c = class c extends g {
348
185
  subtree: !0,
349
186
  attributes: !0,
350
187
  attributeFilter: ["value", "label", "disabled"]
351
- })), this._dataListSuggestions = t ? Array.from(t.options).filter((i) => !i.disabled && i.value).map((i) => ({
352
- value: i.value,
353
- label: i.label || i.textContent?.trim() || i.value
188
+ })), this._dataListSuggestions = t ? Array.from(t.options).filter((s) => !s.disabled && s.value).map((s) => ({
189
+ value: s.value,
190
+ label: s.label || s.textContent?.trim() || s.value
354
191
  })) : [];
355
192
  }
356
193
  _selectDataListSuggestion(e) {
@@ -378,13 +215,13 @@ const c = class c extends g {
378
215
  <div
379
216
  id="root"
380
217
  part="root"
381
- class=${l({ empty: !this._hasInput })}
382
- ${y({ attributeTarget: this })}
218
+ class=${h({ empty: !this._hasInput })}
219
+ ${m({ attributeTarget: this })}
383
220
  >
384
221
  <span
385
222
  id="leading"
386
223
  part="leading"
387
- class=${l({ empty: !this._hasLeading || !this._hasInput })}
224
+ class=${h({ empty: !this._hasLeading || !this._hasInput })}
388
225
  >
389
226
  <slot name="leading" @slotchange=${this._onLeadingSlotChange}></slot>
390
227
  </span>
@@ -395,7 +232,7 @@ const c = class c extends g {
395
232
  id="clear"
396
233
  part="clear"
397
234
  type="button"
398
- aria-label=${this.clearLabel}
235
+ aria-label=${this._messages.value.clear}
399
236
  ?hidden=${!this._hasInput}
400
237
  ?inert=${this._hasInput && !this._hasValue && !(this.showClearOnFocus && this._focused)}
401
238
  ?disabled=${this._inputDisabled}
@@ -404,7 +241,7 @@ const c = class c extends g {
404
241
  <slot name="clear-icon"><span aria-hidden="true">&#10005;</span></slot>
405
242
  </button>
406
243
 
407
- <span id="trailing" part="trailing" class=${l({ empty: !this._hasTrailing })}>
244
+ <span id="trailing" part="trailing" class=${h({ empty: !this._hasTrailing })}>
408
245
  <slot name="trailing" @slotchange=${this._onTrailingSlotChange}></slot>
409
246
  </span>
410
247
  </div>
@@ -417,7 +254,7 @@ const c = class c extends g {
417
254
  }
418
255
  _renderSearchView() {
419
256
  if (this.variant !== "view" || !this.open)
420
- return _;
257
+ return b;
421
258
  const e = !this._hasSuggestionsSlot && this._dataListSuggestions.length > 0, t = !this._hasSuggestionsSlot && !e;
422
259
  return d`
423
260
  <div id="view">
@@ -425,23 +262,23 @@ const c = class c extends g {
425
262
  id="view-surface"
426
263
  part="view"
427
264
  ?hidden=${t}
428
- class=${l({
265
+ class=${h({
429
266
  empty: t
430
267
  })}
431
268
  >
432
269
  <div id="suggestions" part="suggestions">
433
270
  <slot name="suggestions" @slotchange=${this._onSuggestionsSlotChange}></slot>
434
271
  ${e ? this._dataListSuggestions.map(
435
- (i) => d`
272
+ (s) => d`
436
273
  <button
437
274
  part="suggestion"
438
275
  type="button"
439
- @click=${() => this._selectDataListSuggestion(i)}
276
+ @click=${() => this._selectDataListSuggestion(s)}
440
277
  >
441
- <span>${i.label}</span>
278
+ <span>${s.label}</span>
442
279
  </button>
443
280
  `
444
- ) : _}
281
+ ) : b}
445
282
  </div>
446
283
  </div>
447
284
  </div>
@@ -459,67 +296,67 @@ const c = class c extends g {
459
296
  const t = e.target;
460
297
  this._hasSuggestionsSlot = t.assignedElements({ flatten: !0 }).length > 0;
461
298
  }
462
- };
463
- c.styles = [w];
464
- let s = c;
299
+ }, n.styles = [w], n._styledRoots = /* @__PURE__ */ new Set(), n);
300
+ a([
301
+ r({ attribute: !1 })
302
+ ], i.prototype, "messages", 2);
465
303
  a([
466
304
  r({ type: String, reflect: !0 })
467
- ], s.prototype, "variant", 2);
305
+ ], i.prototype, "variant", 2);
468
306
  a([
469
307
  r({ type: Number })
470
- ], s.prototype, "debounce", 2);
471
- a([
472
- r({ type: String, attribute: "clear-label" })
473
- ], s.prototype, "clearLabel", 2);
308
+ ], i.prototype, "debounce", 2);
474
309
  a([
475
310
  r({ type: Boolean, attribute: "allow-native-clear", reflect: !0 })
476
- ], s.prototype, "allowNativeClear", 2);
311
+ ], i.prototype, "allowNativeClear", 2);
477
312
  a([
478
313
  r({ type: Boolean, attribute: "show-clear-on-focus" })
479
- ], s.prototype, "showClearOnFocus", 2);
314
+ ], i.prototype, "showClearOnFocus", 2);
480
315
  a([
481
316
  r({ type: Boolean, reflect: !0 })
482
- ], s.prototype, "disabled", 1);
317
+ ], i.prototype, "disabled", 1);
483
318
  a([
484
319
  r({ type: String })
485
- ], s.prototype, "placeholder", 2);
320
+ ], i.prototype, "placeholder", 2);
486
321
  a([
487
- n()
488
- ], s.prototype, "_hasInput", 2);
322
+ o()
323
+ ], i.prototype, "_hasInput", 2);
489
324
  a([
490
- n()
491
- ], s.prototype, "_hasValue", 2);
325
+ o()
326
+ ], i.prototype, "_hasValue", 2);
492
327
  a([
493
- n()
494
- ], s.prototype, "_hasLeading", 2);
328
+ o()
329
+ ], i.prototype, "_hasLeading", 2);
495
330
  a([
496
- n()
497
- ], s.prototype, "_hasTrailing", 2);
331
+ o()
332
+ ], i.prototype, "_hasTrailing", 2);
498
333
  a([
499
- n()
500
- ], s.prototype, "_inputDisabled", 2);
334
+ o()
335
+ ], i.prototype, "_inputDisabled", 2);
501
336
  a([
502
- n()
503
- ], s.prototype, "_hasSuggestionsSlot", 2);
337
+ o()
338
+ ], i.prototype, "_hasSuggestionsSlot", 2);
504
339
  a([
505
- n()
506
- ], s.prototype, "_dataListSuggestions", 2);
340
+ o()
341
+ ], i.prototype, "_dataListSuggestions", 2);
507
342
  a([
508
- n()
509
- ], s.prototype, "_focused", 2);
343
+ o()
344
+ ], i.prototype, "_focused", 2);
510
345
  a([
511
346
  r({ type: Boolean, reflect: !0 })
512
- ], s.prototype, "open", 1);
347
+ ], i.prototype, "open", 1);
513
348
  a([
514
349
  r({ type: Boolean, attribute: "default-open" })
515
- ], s.prototype, "defaultOpen", 1);
350
+ ], i.prototype, "defaultOpen", 1);
516
351
  a([
517
352
  r({ attribute: !1 })
518
- ], s.prototype, "value", 1);
353
+ ], i.prototype, "value", 1);
519
354
  a([
520
355
  r({ type: String, attribute: "default-value" })
521
- ], s.prototype, "defaultValue", 1);
356
+ ], i.prototype, "defaultValue", 1);
357
+ let E = i;
522
358
  export {
523
- s as R
359
+ x as D,
360
+ E as R
524
361
  };
525
- //# sourceMappingURL=rc-search-bar-D0uhitIm.js.map
362
+ //# sourceMappingURL=rc-search-bar-DFKw8RH2.js.map
package/dist/rc-search-bar-DFKw8RH2.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rc-search-bar-DFKw8RH2.js","sources":["../src/rc-search-bar.styles.ts","../src/rc-search-bar.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const searchBarStyles = css`\n :host {\n display: inline-flex;\n position: relative;\n color-scheme: inherit;\n }\n\n [hidden] {\n display: none !important;\n }\n\n #root {\n display: flex;\n flex: 1 1 auto;\n align-items: center;\n min-inline-size: 0;\n gap: var(--rc-search-bar-gap, var(--rc-control-gap, 0.25em));\n block-size: var(--rc-search-bar-height, var(--rc-control-block-size, 2.5rem));\n padding-inline: var(--rc-search-bar-padding-inline, var(--rc-control-padding-inline, 0.75rem));\n border: var(\n --rc-search-bar-border,\n var(--rc-border, 1px solid var(--rc-border-color, ButtonBorder))\n );\n border-radius: var(\n --rc-search-bar-radius,\n var(--rc-control-radius, var(--rc-radius-sm, 0.125em))\n );\n box-shadow: var(--rc-search-bar-shadow, none);\n background: var(--rc-search-bar-bg, var(--rc-field, Field));\n color: var(--rc-search-bar-color, var(--rc-field-text, FieldText));\n font-family: var(--rc-font-family, inherit);\n font-size: var(--rc-font-size, inherit);\n line-height: var(--rc-line-height, normal);\n transition:\n background-color 120ms,\n border-color 120ms,\n box-shadow 120ms;\n }\n\n :host([data-interaction-mode='keyboard']) #root:focus-within {\n outline: var(--rc-focus-ring, auto);\n outline-offset: var(--rc-focus-ring-offset, 0);\n }\n\n /* No slotted search input: render no chrome at all. */\n #root.empty {\n block-size: auto;\n padding: 0;\n background: none;\n border: none;\n box-shadow: none;\n border-radius: 0;\n }\n\n #leading {\n display: flex;\n flex: none;\n align-items: center;\n color: var(--rc-search-bar-icon-color, GrayText);\n }\n\n #leading.empty {\n display: none;\n }\n\n ::slotted(input[type='search']) {\n flex: 1 1 auto;\n min-inline-size: 0;\n padding: 0;\n border: none;\n background: transparent;\n color: var(--rc-search-bar-input-color, inherit);\n font-family: var(--rc-search-bar-input-font-family, inherit);\n font-size: var(--rc-search-bar-input-font-size, inherit);\n outline: none;\n appearance: textfield;\n }\n\n #trailing {\n display: flex;\n flex: none;\n align-items: center;\n }\n\n #trailing.empty {\n display: none;\n }\n\n #clear {\n display: inline-grid;\n flex: none;\n place-items: center;\n min-inline-size: 24px;\n min-block-size: 24px;\n padding: 0;\n border: none;\n border-radius: 50%;\n background: none;\n color: var(--rc-search-bar-clear-color, GrayText);\n font: inherit;\n cursor: pointer;\n }\n\n #clear[inert] {\n visibility: hidden;\n }\n\n #clear:focus-visible {\n outline: var(--rc-focus-ring, auto);\n outline-offset: var(--rc-focus-ring-offset, 0);\n }\n\n #view {\n position: absolute;\n z-index: 1;\n inset-block-start: calc(100% + var(--rc-search-bar-view-offset, 0.25rem));\n inset-inline: 0;\n min-inline-size: 100%;\n }\n\n #view-surface {\n box-sizing: border-box;\n padding-block: var(--rc-search-bar-view-padding-block, 0.5rem);\n border: var(\n --rc-search-bar-view-border,\n var(--rc-search-bar-border, var(--rc-border, 1px solid var(--rc-border-color, ButtonBorder)))\n );\n border-radius: var(\n --rc-search-bar-view-radius,\n var(--rc-search-bar-radius, var(--rc-control-radius, var(--rc-radius-sm, 0.125em)))\n );\n box-shadow: var(--rc-search-bar-view-shadow, var(--rc-search-bar-shadow, none));\n background: var(--rc-search-bar-view-bg, var(--rc-search-bar-bg, var(--rc-field, Field)));\n color: var(\n --rc-search-bar-view-color,\n var(--rc-search-bar-color, var(--rc-field-text, FieldText))\n );\n font-family: var(--rc-font-family, inherit);\n font-size: var(--rc-font-size, inherit);\n }\n\n #view-surface.empty {\n display: none;\n }\n\n #suggestions {\n display: flex;\n flex-direction: column;\n }\n\n #suggestions ::slotted(*) {\n min-inline-size: 0;\n }\n\n [part='suggestion'] {\n display: flex;\n align-items: center;\n min-block-size: var(--rc-search-bar-suggestion-min-block-size, 2.75rem);\n padding-block: 0;\n padding-inline: var(--rc-search-bar-suggestion-padding-inline, 1rem);\n border: 0;\n background: transparent;\n color: inherit;\n font: inherit;\n text-align: start;\n cursor: pointer;\n }\n\n [part='suggestion']:hover,\n [part='suggestion']:focus-visible {\n background: var(--rc-search-bar-suggestion-hover-bg, ButtonFace);\n }\n\n [part='suggestion']:focus-visible {\n outline: var(--rc-focus-ring, auto);\n outline-offset: var(--rc-focus-ring-offset, 0);\n }\n`;\n\nexport default searchBarStyles;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport {\n cssText,\n keyInteraction,\n MessagesController,\n NativeChildController,\n warnMissingDirectChild,\n} from '@rcarls/rc-common';\n\nimport searchBarStyles from './rc-search-bar.styles.js';\n\nconst LIGHT_DOM_CSS = cssText`\n@layer rc-base {\n rc-search-bar > input[type='search'] {\n flex: 1 1 auto;\n min-inline-size: 0;\n min-block-size: 0;\n padding: 0;\n border: 0;\n border-radius: 0;\n background: transparent;\n color: var(--rc-search-bar-input-color, inherit);\n font-family: var(--rc-search-bar-input-font-family, inherit);\n font-size: var(--rc-search-bar-input-font-size, inherit);\n outline: 0;\n box-shadow: none;\n appearance: textfield;\n }\n\n rc-search-bar > input[type='search']:focus-visible {\n border: 0;\n outline: 0;\n box-shadow: none;\n }\n\n rc-search-bar:not([allow-native-clear])\n > input[type='search']::-webkit-search-cancel-button {\n -webkit-appearance: none;\n display: none;\n }\n}\n`;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'rc-search-bar': RCSearchBar;\n }\n\n interface HTMLElementEventMap {\n 'rc-search-bar-input': CustomEvent<RCSearchBarInputDetail>;\n 'rc-search-bar-clear': CustomEvent<Record<string, never>>;\n 'rc-search-bar-toggle': CustomEvent<RCSearchBarToggleDetail>;\n 'rc-search-bar-suggestion-select': CustomEvent<RCSearchBarSuggestionSelectDetail>;\n }\n}\n\nexport interface RCSearchBarInputDetail {\n /** The native input's value at dispatch time. */\n value: string;\n}\n\nexport interface RCSearchBarToggleDetail {\n /** Whether the search view is open after the user action. */\n open: boolean;\n}\n\nexport interface RCSearchBarSuggestionSelectDetail {\n /** Value written to the native search input. */\n value: string;\n\n /** Human-readable option label, when different from value. */\n label: string;\n}\n\nexport type RCSearchBarVariant = 'bar' | 'view';\n\ninterface RCSearchBarSuggestion {\n value: string;\n label: string;\n}\n\n/** Built-in text of `rc-search-bar`. */\nexport interface RCSearchBarMessages {\n /** Accessible name of the clear button, such as `Cancel` with `show-clear-on-focus`. */\n clear: string;\n}\n\nexport const DEFAULT_SEARCH_BAR_MESSAGES: Readonly<RCSearchBarMessages> = Object.freeze({\n clear: 'Clear search',\n});\n\ndeclare module '@rcarls/rc-common' {\n interface RcMessageCatalog {\n 'rc-search-bar': RCSearchBarMessages;\n }\n}\n\n/**\n * Search field wrapper for a native <input type=\"search\"> with icon chrome, clear button,\n * and debounced events.\n *\n * The native input is required and stays in light DOM as the source of\n * truth, so form submission, `label[for]`/wrapping-label association, and\n * pre-upgrade behavior are preserved. Without a slotted search input the\n * component renders no chrome and stays inert.\n *\n * The native WebKit cancel button is suppressed by default via an\n * adopted document stylesheet. Set `allow-native-clear` to restore it.\n * When restored, the native button clears through the normal input path\n * (a debounced `rc-search-bar-input` with an empty value) and never fires\n * `rc-search-bar-clear`.\n *\n * Built-in text (the clear button name) follows the element's own `lang`, else\n * `<html lang>`: per element through `messages`, or for every instance\n * through `registerMessages()` from `@rcarls/rc-common` under `rc-search-bar`.\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-search-bar rc-search-bar docs}\n *\n * @slot - The required native `<input type=\"search\">`\n * @slot leading - Decorative leading icon; mark it `aria-hidden=\"true\"`\n * @slot trailing - Optional trailing content after the clear button\n * @slot clear-icon - Optional glyph replacing the default clear glyph\n * @slot suggestions - Rich search view suggestions; takes precedence over\n * datalist-derived suggestions.\n *\n * @fires rc-search-bar-input - Debounced after typing, immediate on clear;\n * `detail: { value }`\n * @fires rc-search-bar-clear - When the clear button is activated\n * @fires rc-search-bar-toggle - When user interaction opens or closes the\n * search view; `detail: { open }`\n * @fires rc-search-bar-suggestion-select - When a datalist-derived suggestion\n * is activated; `detail: { value, label }`\n *\n * @attr variant - Presentation mode: docked search bar or expandable search view.\n * @attr debounce - Debounce window in ms for `rc-search-bar-input`; `0` dispatches synchronously.\n * @attr allow-native-clear - When set, leaves the browser's native WebKit cancel button visible.\n * @attr show-clear-on-focus - When set, the clear button is visible whenever the input is focused.\n * @attr disabled - Disables the component and mirrors the state to the slotted input.\n * @attr placeholder - Placeholder mirrored onto the native input; a consumer `placeholder`\n * attribute on the input itself is always honored instead.\n * @attr open - Whether the search view panel is open. Host writes are silent.\n * @attr default-open - Initial uncontrolled search view open state.\n * @attr default-value - Initial uncontrolled value hint, applied once.\n *\n * @cssprop [--rc-search-bar-border=1px solid ButtonBorder] - Wrapper border; set to `none` in M3 theme (uses elevation instead)\n * @cssprop [--rc-search-bar-shadow=none] - Wrapper box-shadow for elevation; M3 theme sets Level 1 at rest\n * @cssprop [--rc-search-bar-bg=Field] - Wrapper background\n * @cssprop [--rc-search-bar-color=FieldText] - Wrapper text color\n * @cssprop [--rc-search-bar-icon-color=GrayText] - Leading icon color\n * @cssprop [--rc-search-bar-clear-color=GrayText] - Clear button glyph color\n * @cssprop [--rc-search-bar-radius=var(--rc-control-radius,0.125em)] - Wrapper border radius\n * @cssprop [--rc-search-bar-height=var(--rc-control-block-size,2.5rem)] - Wrapper block size\n * @cssprop [--rc-search-bar-padding-inline=var(--rc-control-padding-inline,0.75rem)] - Wrapper horizontal padding\n * @cssprop [--rc-search-bar-gap=var(--rc-control-gap,0.25em)] - Gap between icon, input, and clear button\n * @cssprop [--rc-search-bar-input-font-size] - Input font size (inherits when unset)\n * @cssprop [--rc-search-bar-input-font-family] - Input font family (inherits when unset)\n * @cssprop [--rc-search-bar-input-color] - Input text color (inherits when unset)\n * @cssprop [--rc-search-bar-view-bg=var(--rc-search-bar-bg)] - Search view panel background\n * @cssprop [--rc-search-bar-view-color=var(--rc-search-bar-color)] - Search view panel text color\n * @cssprop [--rc-search-bar-view-radius=var(--rc-search-bar-radius)] - Search view panel radius\n * @cssprop [--rc-search-bar-view-shadow=var(--rc-search-bar-shadow)] - Search view panel shadow\n * @cssprop [--rc-search-bar-view-border=var(--rc-search-bar-border)] - Search view panel border\n * @cssprop [--rc-search-bar-view-offset=0.25rem] - Gap between the search bar and the view panel below it\n * @cssprop [--rc-search-bar-view-padding-block=0.5rem] - Search view suggestion list block padding\n * @cssprop [--rc-search-bar-suggestion-min-block-size=2.75rem] - Datalist-derived suggestion row minimum block size\n * @cssprop [--rc-search-bar-suggestion-padding-inline=1rem] - Datalist-derived suggestion inline padding\n * @cssprop [--rc-search-bar-suggestion-hover-bg=ButtonFace] - Datalist-derived suggestion hover/focus background\n * @csspart root - The wrapper element\n * @csspart leading - Wrapper around the leading icon slot\n * @csspart trailing - Wrapper around the trailing slot\n * @csspart clear - The clear button\n * @csspart view - Search view panel\n * @csspart suggestions - Suggestions container\n * @csspart suggestion - Datalist-derived suggestion button\n */\nexport class RCSearchBar extends LitElement {\n static styles = [searchBarStyles];\n\n /** Built-in text overrides; unset keys fall back to registered text, then English. */\n @property({ attribute: false })\n messages: Partial<RCSearchBarMessages> | undefined;\n\n private readonly _messages = new MessagesController(\n this,\n 'rc-search-bar',\n DEFAULT_SEARCH_BAR_MESSAGES,\n {\n overrides: () => this.messages,\n },\n );\n\n private static readonly _styledRoots = new Set<Document | ShadowRoot>();\n\n private static _ensureBaseStyles(root: Document | ShadowRoot): void {\n if (RCSearchBar._styledRoots.has(root)) {\n return;\n }\n\n RCSearchBar._styledRoots.add(root);\n\n const style = document.createElement('style');\n\n style.setAttribute('data-rc-light-dom-base', 'rc-search-bar');\n style.textContent = LIGHT_DOM_CSS;\n\n if (root instanceof Document) {\n root.head.append(style);\n } else {\n root.append(style);\n }\n }\n\n /** Presentation mode: docked search bar or expandable search view. */\n @property({ type: String, reflect: true })\n variant: RCSearchBarVariant = 'bar';\n\n /** Debounce window in ms for `rc-search-bar-input`; `0` dispatches synchronously. */\n @property({ type: Number })\n debounce = 200;\n\n /** When set, leaves the browser's native WebKit cancel button visible. */\n @property({ type: Boolean, attribute: 'allow-native-clear', reflect: true })\n allowNativeClear = false;\n\n /**\n * When set, the clear button is visible whenever the input is focused.\n *\n * Matching the Apple HIG \"cancel\" pattern.\n * Consider setting `messages.clear` to `Cancel` in this mode.\n */\n @property({ type: Boolean, attribute: 'show-clear-on-focus' })\n showClearOnFocus = false;\n\n /** Disables the component and mirrors the state to the slotted input. */\n @property({ type: Boolean, reflect: true })\n get disabled(): boolean {\n // _disabledHost holds what the host last set; fall back to what the input\n // actually reports (kept in sync by the MutationObserver).\n return this._disabledHost ?? this._inputDisabled;\n }\n\n set disabled(value: boolean) {\n const old = this.disabled;\n\n this._disabledHost = value;\n\n const $input = this._$input();\n\n if ($input) {\n $input.disabled = value;\n }\n\n this.requestUpdate('disabled', old);\n }\n\n /**\n * Placeholder mirrored onto the native input.\n *\n * Consumer `placeholder` attribute is always honored.\n */\n @property({ type: String })\n placeholder?: string;\n\n private _open = false;\n\n private _defaultOpen = false;\n\n private _openInitialized = false;\n\n private _value: string | undefined = undefined;\n\n private _defaultValue: string | undefined = undefined;\n\n private _valueSetByHost = false;\n\n /** True once an author value, host write, or user input owns the value. */\n private _valueInitialized = false;\n\n private _authorPlaceholder = false;\n\n private _$inputRef: WeakRef<HTMLInputElement> | null = null;\n\n private _debounceTimer: ReturnType<typeof setTimeout> | undefined = undefined;\n\n private _$dataListRef: WeakRef<HTMLDataListElement> | null = null;\n\n @state()\n private _hasInput = false;\n\n @state()\n private _hasValue = false;\n\n @state()\n private _hasLeading = false;\n\n @state()\n private _hasTrailing = false;\n\n @state()\n private _inputDisabled = false;\n\n @state()\n private _hasSuggestionsSlot = false;\n\n @state()\n private _dataListSuggestions: RCSearchBarSuggestion[] = [];\n\n // Tracks the last value written via the disabled setter so the getter and\n // Lit's reflect can return it before the input is slotted.\n private _disabledHost: boolean | undefined = undefined;\n\n @state()\n private _focused = false;\n\n private readonly _onInputFocus = (): void => {\n this._focused = true;\n\n if (this.variant === 'view') {\n this.showView();\n }\n };\n\n // Focus moving from the input to the component's own controls (the clear\n // button shown on focus, suggestions) keeps it focused; otherwise the clear\n // button would turn inert while it receives Tab focus and drop focus to\n // <body>. Event retargeting reports a move into the shadow root as the host.\n private readonly _onInputBlur = (e: FocusEvent): void => {\n if (!this._containsFocusTarget(e.relatedTarget)) {\n this._focused = false;\n }\n };\n\n private readonly _onHostFocusOut = (e: FocusEvent): void => {\n if (!this._containsFocusTarget(e.relatedTarget)) {\n this._focused = false;\n }\n };\n\n private _containsFocusTarget(target: EventTarget | null): boolean {\n return (\n target instanceof Node &&\n (target === this || this.contains(target) || Boolean(this.shadowRoot?.contains(target)))\n );\n }\n\n private readonly _disabledObserver = new MutationObserver(() => {\n const $input = this._$input();\n\n if ($input) {\n this._inputDisabled = $input.disabled;\n this._syncDataListSuggestions($input);\n }\n });\n\n private readonly _dataListObserver = new MutationObserver(() => this._syncDataListSuggestions());\n\n private readonly _inputController = new NativeChildController<HTMLInputElement>(this, {\n selector: ':scope > input[type=\"search\"]',\n observe: { childList: true, attributes: true, attributeFilter: ['list'] },\n onChange: ($input, $previousInput) => this._setupInput($input, $previousInput),\n onMissing: () => {\n if (import.meta.env.DEV) {\n warnMissingDirectChild(this, {\n selector: ':scope > input[type=\"search\"]',\n message:\n '[rc-search-bar] No direct child <input type=\"search\"> found. ' +\n 'Place a native search input inside <rc-search-bar>.',\n });\n }\n },\n });\n\n /** Whether the search view panel is open. Host writes are silent. */\n @property({ type: Boolean, reflect: true })\n get open(): boolean {\n return this._open;\n }\n\n set open(value: boolean) {\n const oldValue = this._open;\n\n this._open = value;\n this._openInitialized = true;\n\n this.requestUpdate('open', oldValue);\n }\n\n /** Initial uncontrolled search view open state. */\n @property({ type: Boolean, attribute: 'default-open' })\n get defaultOpen(): boolean {\n return this._defaultOpen;\n }\n\n set defaultOpen(value: boolean) {\n const oldValue = this._defaultOpen;\n\n this._defaultOpen = value;\n\n if (!this._openInitialized) {\n this._open = value;\n }\n\n this.requestUpdate('defaultOpen', oldValue);\n }\n\n /**\n * The current search value. Reads from the native input when present.\n * Host writes are silent (no events) and win over slotted author values.\n */\n @property({ attribute: false })\n get value(): string {\n return this._$input()?.value ?? this._value ?? this._defaultValue ?? '';\n }\n\n set value(value: string) {\n const oldValue = this.value;\n\n this._value = value;\n this._valueSetByHost = true;\n this._valueInitialized = true;\n\n const $input = this._$input();\n\n if ($input) {\n $input.value = value;\n }\n\n this._hasValue = value.length > 0;\n\n this.requestUpdate('value', oldValue);\n }\n\n /**\n * Initial uncontrolled value hint. Applied once, and only when neither an\n * author `value`, a host `value` write, nor user input owns the value.\n */\n @property({ type: String, attribute: 'default-value' })\n get defaultValue(): string | undefined {\n return this._defaultValue;\n }\n\n set defaultValue(value: string | undefined) {\n const oldValue = this._defaultValue;\n\n this._defaultValue = value;\n\n const $input = this._$input();\n\n if ($input && value !== undefined && !this._valueInitialized) {\n $input.value = value;\n this._hasValue = value.length > 0;\n }\n\n this.requestUpdate('defaultValue', oldValue);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n RCSearchBar._ensureBaseStyles(this.getRootNode() as Document | ShadowRoot);\n this.addEventListener('focusout', this._onHostFocusOut);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('focusout', this._onHostFocusOut);\n\n this._focused = false;\n this._open = false;\n this._cancelPendingInput();\n\n const $input = this._$input();\n\n $input?.removeEventListener('input', this._onNativeInput);\n $input?.removeEventListener('focus', this._onInputFocus);\n $input?.removeEventListener('blur', this._onInputBlur);\n $input?.removeEventListener('keydown', this._onNativeKeyDown);\n\n this._disabledObserver.disconnect();\n this._dataListObserver.disconnect();\n }\n\n protected override updated(changed: PropertyValues<this>): void {\n if (changed.has('placeholder')) {\n const $input = this._$input();\n\n if ($input) {\n this._applyPlaceholder($input);\n }\n }\n\n if (changed.has('variant') && this.variant !== 'view' && this._open) {\n const oldOpen = this._open;\n\n this._open = false;\n this.requestUpdate('open', oldOpen);\n }\n }\n\n private _$input(): HTMLInputElement | null {\n return this._$inputRef?.deref() ?? null;\n }\n\n private _handleSlotChange(): void {\n this._inputController.sync();\n }\n\n private _setupInput(\n $input: HTMLInputElement | null,\n $previousInput: HTMLInputElement | null,\n ): void {\n if ($previousInput && $previousInput !== $input) {\n $previousInput.removeEventListener('input', this._onNativeInput);\n $previousInput.removeEventListener('focus', this._onInputFocus);\n $previousInput.removeEventListener('blur', this._onInputBlur);\n $previousInput.removeEventListener('keydown', this._onNativeKeyDown);\n }\n\n this._disabledObserver.disconnect();\n this._dataListObserver.disconnect();\n this._focused = false;\n\n this._$inputRef = $input ? new WeakRef($input) : null;\n this._hasInput = $input !== null;\n this._authorPlaceholder = $input?.hasAttribute('placeholder') ?? false;\n\n if (!$input) {\n this._hasValue = false;\n this._dataListSuggestions = [];\n this._$dataListRef = null;\n\n return;\n }\n\n // Deferred reads keep framework render cycles (e.g. SolidJS) untouched.\n queueMicrotask(() => {\n if (!$input.isConnected) {\n return;\n }\n\n if (this._valueSetByHost) {\n $input.value = this._value ?? '';\n } else if ($input.value) {\n // An author-provided value wins over defaultValue.\n this._valueInitialized = true;\n } else if (this._defaultValue !== undefined && !this._valueInitialized) {\n $input.value = this._defaultValue;\n }\n\n this._applyPlaceholder($input);\n\n if (this._disabledHost !== undefined) {\n $input.disabled = this._disabledHost;\n }\n\n this._inputDisabled = $input.disabled;\n this._hasValue = $input.value.length > 0;\n this._syncDataListSuggestions($input);\n\n if (\n import.meta.env.DEV &&\n !$input.labels?.length &&\n !$input.getAttribute('aria-label') &&\n !$input.getAttribute('aria-labelledby')\n ) {\n console.warn(\n '[rc-search-bar] Slotted <input type=\"search\"> has no accessible name.',\n 'Add aria-label, wrap in <label>, or use <label for=\"...\">.',\n $input,\n );\n }\n\n this._bindInput($input);\n });\n }\n\n private _bindInput($input: HTMLInputElement): void {\n $input.addEventListener('input', this._onNativeInput);\n $input.addEventListener('focus', this._onInputFocus);\n $input.addEventListener('blur', this._onInputBlur);\n $input.addEventListener('keydown', this._onNativeKeyDown);\n\n this._disabledObserver.observe($input, { attributeFilter: ['disabled', 'list'] });\n }\n\n private _applyPlaceholder($input: HTMLInputElement): void {\n if (this.placeholder === undefined || this._authorPlaceholder) {\n return;\n }\n\n $input.placeholder = this.placeholder;\n }\n\n private readonly _onNativeInput = (e: Event): void => {\n const $input = e.currentTarget as HTMLInputElement;\n\n this._valueInitialized = true;\n this._hasValue = $input.value.length > 0;\n this._scheduleInputEvent($input.value);\n };\n\n private readonly _onNativeKeyDown = (e: KeyboardEvent): void => {\n if (e.key === 'Escape' && this.open) {\n e.preventDefault();\n this.closeView();\n }\n };\n\n private _scheduleInputEvent(value: string): void {\n this._cancelPendingInput();\n\n if (this.debounce <= 0) {\n this._dispatchInput(value);\n\n return;\n }\n\n this._debounceTimer = setTimeout(() => {\n this._debounceTimer = undefined;\n this._dispatchInput(value);\n }, this.debounce);\n }\n\n private _cancelPendingInput(): void {\n if (this._debounceTimer === undefined) {\n return;\n }\n\n clearTimeout(this._debounceTimer);\n this._debounceTimer = undefined;\n }\n\n private _dispatchInput(value: string): void {\n this.dispatchEvent(\n new CustomEvent<RCSearchBarInputDetail>('rc-search-bar-input', {\n bubbles: true,\n composed: true,\n detail: { value },\n }),\n );\n }\n\n private _setUserOpen(open: boolean): void {\n if (this._open === open) {\n return;\n }\n\n const oldOpen = this._open;\n\n this._open = open;\n this._openInitialized = true;\n this.requestUpdate('open', oldOpen);\n\n this.dispatchEvent(\n new CustomEvent<RCSearchBarToggleDetail>('rc-search-bar-toggle', {\n bubbles: true,\n composed: true,\n detail: { open },\n }),\n );\n }\n\n /** Opens the search view and fires `rc-search-bar-toggle` when it changes. */\n public showView(): void {\n if (this.variant !== 'view' || this.disabled) {\n return;\n }\n\n this._setUserOpen(true);\n }\n\n /** Closes the search view and fires `rc-search-bar-toggle` when it changes. */\n public closeView(): void {\n this._setUserOpen(false);\n }\n\n /** Toggles the search view and fires `rc-search-bar-toggle` when it changes. */\n public toggleView(): void {\n this.open ? this.closeView() : this.showView();\n }\n\n private _syncDataListSuggestions($input = this._$input()): void {\n const $dataList = $input?.list ?? null;\n\n if (this._$dataListRef?.deref() !== $dataList) {\n this._dataListObserver.disconnect();\n this._$dataListRef = $dataList ? new WeakRef($dataList) : null;\n\n if ($dataList) {\n this._dataListObserver.observe($dataList, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['value', 'label', 'disabled'],\n });\n }\n }\n\n this._dataListSuggestions = $dataList\n ? Array.from($dataList.options)\n .filter(($option) => !$option.disabled && $option.value)\n .map(($option) => ({\n value: $option.value,\n label: $option.label || $option.textContent?.trim() || $option.value,\n }))\n : [];\n }\n\n private _selectDataListSuggestion(suggestion: RCSearchBarSuggestion): void {\n const $input = this._$input();\n\n if (!$input) {\n return;\n }\n\n this._cancelPendingInput();\n\n $input.value = suggestion.value;\n this._valueInitialized = true;\n this._hasValue = suggestion.value.length > 0;\n\n this.dispatchEvent(\n new CustomEvent<RCSearchBarSuggestionSelectDetail>('rc-search-bar-suggestion-select', {\n bubbles: true,\n composed: true,\n detail: suggestion,\n }),\n );\n\n this._dispatchInput(suggestion.value);\n $input.focus();\n this.closeView();\n }\n\n private _handleClear(): void {\n const $input = this._$input();\n\n if (!$input) {\n return;\n }\n\n this._cancelPendingInput();\n\n $input.value = '';\n\n this._valueInitialized = true;\n this._hasValue = false;\n\n this.dispatchEvent(\n new CustomEvent('rc-search-bar-clear', {\n bubbles: true,\n composed: true,\n detail: {},\n }),\n );\n\n this._dispatchInput('');\n\n // Refocus before the re-render hides the button, so focus never drops\n // to <body>.\n $input.focus();\n }\n\n protected override render() {\n return html`\n <div\n id=\"root\"\n part=\"root\"\n class=${classMap({ empty: !this._hasInput })}\n ${keyInteraction({ attributeTarget: this })}\n >\n <span\n id=\"leading\"\n part=\"leading\"\n class=${classMap({ empty: !this._hasLeading || !this._hasInput })}\n >\n <slot name=\"leading\" @slotchange=${this._onLeadingSlotChange}></slot>\n </span>\n\n <slot @slotchange=${this._handleSlotChange}></slot>\n\n <button\n id=\"clear\"\n part=\"clear\"\n type=\"button\"\n aria-label=${this._messages.value.clear}\n ?hidden=${!this._hasInput}\n ?inert=${this._hasInput && !this._hasValue && !(this.showClearOnFocus && this._focused)}\n ?disabled=${this._inputDisabled}\n @click=${this._handleClear}\n >\n <slot name=\"clear-icon\"><span aria-hidden=\"true\">&#10005;</span></slot>\n </button>\n\n <span id=\"trailing\" part=\"trailing\" class=${classMap({ empty: !this._hasTrailing })}>\n <slot name=\"trailing\" @slotchange=${this._onTrailingSlotChange}></slot>\n </span>\n </div>\n ${this._renderSearchView()}\n `;\n }\n\n /** Programmatically clears the value and fires rc-search-bar-clear + rc-search-bar-input. */\n public clear(): void {\n this._handleClear();\n }\n\n private _renderSearchView() {\n if (this.variant !== 'view' || !this.open) {\n return nothing;\n }\n\n const hasDataListSuggestions =\n !this._hasSuggestionsSlot && this._dataListSuggestions.length > 0;\n const empty = !this._hasSuggestionsSlot && !hasDataListSuggestions;\n\n return html`\n <div id=\"view\">\n <div\n id=\"view-surface\"\n part=\"view\"\n ?hidden=${empty}\n class=${classMap({\n empty,\n })}\n >\n <div id=\"suggestions\" part=\"suggestions\">\n <slot name=\"suggestions\" @slotchange=${this._onSuggestionsSlotChange}></slot>\n ${hasDataListSuggestions\n ? this._dataListSuggestions.map(\n (suggestion) => html`\n <button\n part=\"suggestion\"\n type=\"button\"\n @click=${() => this._selectDataListSuggestion(suggestion)}\n >\n <span>${suggestion.label}</span>\n </button>\n `,\n )\n : nothing}\n </div>\n </div>\n </div>\n `;\n }\n\n private _onLeadingSlotChange(e: Event): void {\n const $slot = e.target as HTMLSlotElement;\n\n this._hasLeading = $slot.assignedElements().length > 0;\n }\n\n private _onTrailingSlotChange(e: Event): void {\n const $slot = e.target as HTMLSlotElement;\n\n this._hasTrailing = $slot.assignedElements().length > 0;\n }\n\n private _onSuggestionsSlotChange(e: Event): void {\n const $slot = e.target as HTMLSlotElement;\n\n this._hasSuggestionsSlot = $slot.assignedElements({ flatten: true }).length > 0;\n }\n}\n\nexport default RCSearchBar;\n"],"names":["searchBarStyles","css","LIGHT_DOM_CSS","cssText","DEFAULT_SEARCH_BAR_MESSAGES","_RCSearchBar","_a","LitElement","MessagesController","$input","NativeChildController","$previousInput","root","style","value","old","target","oldValue","changed","oldOpen","open","$dataList","$option","suggestion","html","classMap","keyInteraction","nothing","hasDataListSuggestions","empty","$slot","__decorateClass","property","state","RCSearchBar"],"mappings":"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"}
package/dist/rc-search-bar-define.js CHANGED
@@ -1,6 +1,8 @@
1
- import { R as e } from "./rc-search-bar-D0uhitIm.js";
2
- customElements.get("rc-search-bar") || customElements.define("rc-search-bar", e);
1
+ import { R as r } from "./rc-search-bar-DFKw8RH2.js";
2
+ import { D as t } from "./rc-search-bar-DFKw8RH2.js";
3
+ customElements.get("rc-search-bar") || customElements.define("rc-search-bar", r);
3
4
  export {
4
- e as RCSearchBar
5
+ t as DEFAULT_SEARCH_BAR_MESSAGES,
6
+ r as RCSearchBar
5
7
  };
6
8
  //# sourceMappingURL=rc-search-bar-define.js.map
package/dist/rc-search-bar-define.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"rc-search-bar-define.js","sources":["../src/define.ts"],"sourcesContent":["import { RCSearchBar } from './index.js';\n\ncustomElements.get('rc-search-bar') || customElements.define('rc-search-bar', RCSearchBar);\n\nexport * from './index.js';\n"],"names":["RCSearchBar"],"mappings":";AAEA,eAAe,IAAI,eAAe,KAAK,eAAe,OAAO,iBAAiBA,CAAW;"}
1
+ {"version":3,"file":"rc-search-bar-define.js","sources":["../src/define.ts"],"sourcesContent":["import { RCSearchBar } from './index.js';\n\ncustomElements.get('rc-search-bar') || customElements.define('rc-search-bar', RCSearchBar);\n\nexport * from './index.js';\n"],"names":["RCSearchBar"],"mappings":";;AAEA,eAAe,IAAI,eAAe,KAAK,eAAe,OAAO,iBAAiBA,CAAW;"}
package/dist/rc-search-bar.js CHANGED
@@ -1,5 +1,6 @@
1
- import { R as e } from "./rc-search-bar-D0uhitIm.js";
1
+ import { D as r, R as A } from "./rc-search-bar-DFKw8RH2.js";
2
2
  export {
3
- e as RCSearchBar
3
+ r as DEFAULT_SEARCH_BAR_MESSAGES,
4
+ A as RCSearchBar
4
5
  };
5
6
  //# sourceMappingURL=rc-search-bar.js.map
package/dist/types/packages/rc-search-bar/src/index.d.ts CHANGED
@@ -1 +1 @@
1
- export * from './rc-search-bar';
1
+ export * from './rc-search-bar.js';