@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.
- package/CHANGELOG.md +133 -0
- package/README.md +74 -66
- package/dist/custom-elements.json +85 -23
- package/dist/{rc-search-bar-D0uhitIm.js → rc-search-bar-DFKw8RH2.js} +93 -256
- package/dist/rc-search-bar-DFKw8RH2.js.map +1 -0
- package/dist/rc-search-bar-define.js +5 -3
- package/dist/rc-search-bar-define.js.map +1 -1
- package/dist/rc-search-bar.js +3 -2
- package/dist/types/packages/rc-search-bar/src/index.d.ts +1 -1
- package/dist/types/packages/rc-search-bar/src/rc-search-bar.d.ts +24 -5
- package/package.json +2 -2
- package/dist/rc-search-bar-D0uhitIm.js.map +0 -1
- package/dist/types/packages/rc-search-bar/src/rc-search-bar.test.d.ts +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,138 @@
|
|
|
1
1
|
# @rcarls/rc-search-bar
|
|
2
2
|
|
|
3
|
+
## 0.7.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 079e025: Standardize component styling contracts for the breaking 0.7 release.
|
|
8
|
+
|
|
9
|
+
BREAKING CHANGE: Rename the Markdown editor's `--rme-*` properties to
|
|
10
|
+
`--rc-markdown-editor-*`, `--rc-app-bar-background` to `--rc-app-bar-bg`,
|
|
11
|
+
`--rc-textarea-radius` to `--rc-textarea-border-radius`, the transfer-list
|
|
12
|
+
`--rc-transfer-list-panel-*` properties to `--rc-transfer-list-listbox-*`,
|
|
13
|
+
`--rc-chip-group-webkit-scrollbar-display` to
|
|
14
|
+
`--rc-chip-group-scrollbar-display`, and `--rc-text` to `--rc-field-text`.
|
|
15
|
+
Compatibility aliases are intentionally not provided.
|
|
16
|
+
|
|
17
|
+
BREAKING CHANGE: Replace `--rc-select-chip-padding-inline` and
|
|
18
|
+
`--rc-combobox-chip-padding-inline` with explicit `*-padding-inline-start` and
|
|
19
|
+
`*-padding-inline-end` tokens. Generated removable chips now reserve the full
|
|
20
|
+
remove target and its edge offset, so their indicator cannot overlap label text.
|
|
21
|
+
|
|
22
|
+
Add canonical app-bar elevation, transfer-list listbox radius, and textarea
|
|
23
|
+
line-action tokens. Add logical `rc-chip` inline-padding properties so themes
|
|
24
|
+
can implement Material's icon-aware spacing without overriding authored child
|
|
25
|
+
styles. Make `rc-field` consume the shared semantic token layer,
|
|
26
|
+
and place the `rc-chip` and `rc-search-bar` light-DOM structural styles in the
|
|
27
|
+
`rc-base` cascade layer so normal consumer rules override them.
|
|
28
|
+
|
|
29
|
+
Prevent decorative, `aria-hidden` trailing list content from intercepting a
|
|
30
|
+
whole-row action target, and keep segmented-list item geometry from leaking
|
|
31
|
+
into nested standard lists.
|
|
32
|
+
|
|
33
|
+
Remove unused Material navigation-rail toggle tokens and obsolete list-item
|
|
34
|
+
theme tokens. Register the segmented-button private theme seam and enforce
|
|
35
|
+
token ownership, documentation, removed-name, selector-budget, and cascade
|
|
36
|
+
layer contracts through the component architecture audit.
|
|
37
|
+
|
|
38
|
+
- 54d9ead: Localize every component's built-in text. Button names, role
|
|
39
|
+
descriptions, announcements, and default labels now resolve per key from
|
|
40
|
+
the element's `messages` property, then from text registered with
|
|
41
|
+
`registerMessages(locale, catalog)` in `@rcarls/rc-common`, then from the
|
|
42
|
+
English defaults. The locale is the element's own `lang`, else
|
|
43
|
+
`<html lang>`; an ancestor's `lang` is ignored, because it usually marks
|
|
44
|
+
content rather than the interface. Components re-render when that locale
|
|
45
|
+
changes or new text is registered. `RcMessageCatalog` types the catalog,
|
|
46
|
+
and each package adds its scope to it.
|
|
47
|
+
|
|
48
|
+
Numbers a component formats as text follow the same locale:
|
|
49
|
+
`rc-progress`'s default percentage and `rc-splitter`'s `aria-valuetext`
|
|
50
|
+
use `Intl.NumberFormat`. `TypeaheadController` matches prefixes with an
|
|
51
|
+
`Intl.Collator`, so case and accents are ignored the way the locale
|
|
52
|
+
ignores them, and takes a `locale` option. `ItemsCollectionController`'s
|
|
53
|
+
`setCreateOption(text, label?)` takes the option's visible text from its
|
|
54
|
+
caller.
|
|
55
|
+
|
|
56
|
+
`rc-transfer-list`'s direction arrows are now decorative: screen readers
|
|
57
|
+
read only the action name, and the arrows turn over in RTL.
|
|
58
|
+
|
|
59
|
+
**Breaking:** chrome-text properties are replaced by `messages`. Migrate:
|
|
60
|
+
|
|
61
|
+
- `rc-search-bar` `clear-label` / `clearLabel` → `messages.clear`
|
|
62
|
+
- `rc-adaptive-menu` `overflow-label` / `overflowLabel` → `messages.overflow`
|
|
63
|
+
- `rc-chip-group` `show-all-label` / `showAllLabel` and `show-less-label` /
|
|
64
|
+
`showLessLabel` → `messages.showAll` and `messages.showLess`
|
|
65
|
+
- `rc-select` and `rc-combobox` `dialog-confirm-label` /
|
|
66
|
+
`dialogConfirmLabel` and `dialog-cancel-label` / `dialogCancelLabel` →
|
|
67
|
+
`messages.done` and `messages.cancel`
|
|
68
|
+
- `rc-editor-toolbar` `label` → `messages.toolbar`
|
|
69
|
+
|
|
70
|
+
Per-instance names stay attributes, but now default to `undefined` and fall
|
|
71
|
+
back to a message: `label` on `rc-adaptive-menu`, `rc-chip-group`,
|
|
72
|
+
`rc-menubar`, and `rc-splitter`; `available-label` and `selected-label`
|
|
73
|
+
on `rc-transfer-list`; `low-label` and `high-label` on `rc-range-slider`.
|
|
74
|
+
Read the resolved name from the rendered `aria-label` instead of the
|
|
75
|
+
property.
|
|
76
|
+
|
|
77
|
+
### Patch Changes
|
|
78
|
+
|
|
79
|
+
- 5c006de: Ship component CSS minified. Package builds now run the CSS in Lit `css` styles
|
|
80
|
+
and light-DOM structural styles through Lightning CSS, removing comments and
|
|
81
|
+
whitespace while keeping source maps that resolve to each template. Rendered
|
|
82
|
+
styles are unchanged.
|
|
83
|
+
|
|
84
|
+
`@rcarls/rc-common` adds `cssText`, an identity tag that marks a plain CSS
|
|
85
|
+
string for minification. `rc-chip`, `rc-disclosure`, and `rc-accordion` now
|
|
86
|
+
depend on `@rcarls/rc-common` for it.
|
|
87
|
+
|
|
88
|
+
- 2599c19: With `show-clear-on-focus`, Tab from the input now lands on the clear button and keeps focus there. The search bar stays focused while focus moves between its input and its own controls, so the button no longer turns inert while receiving focus and drops it to the page.
|
|
89
|
+
- Updated dependencies [e3dfa59]
|
|
90
|
+
- Updated dependencies [50d5610]
|
|
91
|
+
- Updated dependencies [9ee769c]
|
|
92
|
+
- Updated dependencies [1179f24]
|
|
93
|
+
- Updated dependencies [595fe37]
|
|
94
|
+
- Updated dependencies [38cd00c]
|
|
95
|
+
- Updated dependencies [5c006de]
|
|
96
|
+
- Updated dependencies [a6553ff]
|
|
97
|
+
- Updated dependencies [2205478]
|
|
98
|
+
- Updated dependencies [4341311]
|
|
99
|
+
- Updated dependencies [899bb5e]
|
|
100
|
+
- Updated dependencies [25fcfe0]
|
|
101
|
+
- Updated dependencies [51f6403]
|
|
102
|
+
- Updated dependencies [9caca6b]
|
|
103
|
+
- Updated dependencies [b764a3c]
|
|
104
|
+
- Updated dependencies [54d9ead]
|
|
105
|
+
- Updated dependencies [b9175e9]
|
|
106
|
+
- Updated dependencies [c8b762b]
|
|
107
|
+
- Updated dependencies [55e1e7f]
|
|
108
|
+
- Updated dependencies [f1ca82d]
|
|
109
|
+
- Updated dependencies [b87f27b]
|
|
110
|
+
- Updated dependencies [32ebead]
|
|
111
|
+
- Updated dependencies [bfefedd]
|
|
112
|
+
- Updated dependencies [c130173]
|
|
113
|
+
- Updated dependencies [11680b6]
|
|
114
|
+
- Updated dependencies [223d36c]
|
|
115
|
+
- Updated dependencies [7b91a44]
|
|
116
|
+
- Updated dependencies [aa04ead]
|
|
117
|
+
- Updated dependencies [ac65b5b]
|
|
118
|
+
- Updated dependencies [afcfef8]
|
|
119
|
+
- Updated dependencies [11ef1ad]
|
|
120
|
+
- @rcarls/rc-common@0.7.0
|
|
121
|
+
|
|
122
|
+
## 0.6.0
|
|
123
|
+
|
|
124
|
+
### Patch Changes
|
|
125
|
+
|
|
126
|
+
- ffcbf11: Add adaptive chip-group layouts, native-backed filter chips, and shared
|
|
127
|
+
input-chip rendering. Native-backed chips preserve controlled host state,
|
|
128
|
+
follow form resets when uncontrolled, and accept native link actions. Groups
|
|
129
|
+
restore author-owned chip variants when coordination ends. Keep search input
|
|
130
|
+
chrome inside the search surface and align contextual icon sizes with Material 3.
|
|
131
|
+
- Updated dependencies [6683eb9]
|
|
132
|
+
- Updated dependencies [ee7ba6c]
|
|
133
|
+
- Updated dependencies [30eb232]
|
|
134
|
+
- @rcarls/rc-common@0.6.0
|
|
135
|
+
|
|
3
136
|
## 0.5.0
|
|
4
137
|
|
|
5
138
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -43,9 +43,9 @@ import { RCSearchBar } from '@rcarls/rc-search-bar';
|
|
|
43
43
|
</script>
|
|
44
44
|
```
|
|
45
45
|
|
|
46
|
-
The component's
|
|
47
|
-
background, and outline so it blends into the wrapper chrome without a
|
|
48
|
-
reset.
|
|
46
|
+
The component's `rc-base` light-DOM layer strips the slotted input's native
|
|
47
|
+
border, background, and outline so it blends into the wrapper chrome without a
|
|
48
|
+
consumer reset. Normal author rules outside a layer override that structural base.
|
|
49
49
|
|
|
50
50
|
The native WebKit cancel button is suppressed automatically. Set
|
|
51
51
|
`allow-native-clear` to restore it.
|
|
@@ -56,77 +56,77 @@ The native WebKit cancel button is suppressed automatically. Set
|
|
|
56
56
|
|
|
57
57
|
### Properties / attributes
|
|
58
58
|
|
|
59
|
-
| Property | Attribute | Type
|
|
60
|
-
| ------------------ | --------------------- |
|
|
61
|
-
| `variant` | `variant` | `'bar' \| 'view'`
|
|
62
|
-
| `open` | `open` | `boolean`
|
|
63
|
-
| `defaultOpen` | `default-open` | `boolean`
|
|
64
|
-
| `value` | None | `string`
|
|
65
|
-
| `defaultValue` | `default-value` | `string \| undefined`
|
|
66
|
-
| `debounce` | `debounce` | `number`
|
|
67
|
-
| `
|
|
68
|
-
| `
|
|
69
|
-
| `
|
|
70
|
-
| `
|
|
59
|
+
| Property | Attribute | Type | Default | Description |
|
|
60
|
+
| ------------------ | --------------------- | ------------------------------------------- | ----------- | --------------------------------------------------------------------------------------- |
|
|
61
|
+
| `variant` | `variant` | `'bar' \| 'view'` | `'bar'` | Presentation mode: docked field or expandable search view |
|
|
62
|
+
| `open` | `open` | `boolean` | `false` | Controlled search view open state; host writes are silent |
|
|
63
|
+
| `defaultOpen` | `default-open` | `boolean` | `false` | Initial uncontrolled search view open state |
|
|
64
|
+
| `value` | None | `string` | `''` | Current search value; reads from the native input, host writes are silent |
|
|
65
|
+
| `defaultValue` | `default-value` | `string \| undefined` | `undefined` | Initial uncontrolled value hint, applied once |
|
|
66
|
+
| `debounce` | `debounce` | `number` | `200` | Debounce window in ms for `rc-search-bar-input`; `0` dispatches synchronously |
|
|
67
|
+
| `allowNativeClear` | `allow-native-clear` | `boolean` | `false` | When set, restores the browser's native WebKit cancel button |
|
|
68
|
+
| `showClearOnFocus` | `show-clear-on-focus` | `boolean` | `false` | When set, shows the clear button on focus even with no value (Apple HIG cancel pattern) |
|
|
69
|
+
| `placeholder` | `placeholder` | `string \| undefined` | `undefined` | Mirrored onto the input unless the author already set one |
|
|
70
|
+
| `messages` | None | `Partial<RCSearchBarMessages> \| undefined` | `undefined` | Built-in text overrides; see Localization |
|
|
71
71
|
|
|
72
72
|
### CSS custom properties
|
|
73
73
|
|
|
74
|
-
| Property
|
|
75
|
-
|
|
|
76
|
-
| `--rc-search-bar-border`
|
|
77
|
-
| `--rc-search-bar-shadow`
|
|
78
|
-
| `--rc-search-bar-bg`
|
|
79
|
-
| `--rc-search-bar-color`
|
|
80
|
-
| `--rc-search-bar-icon-color`
|
|
81
|
-
| `--rc-search-bar-clear-color`
|
|
82
|
-
| `--rc-search-bar-radius`
|
|
83
|
-
| `--rc-search-bar-height`
|
|
84
|
-
| `--rc-search-bar-padding-inline`
|
|
85
|
-
| `--rc-search-bar-gap`
|
|
86
|
-
| `--rc-search-bar-input-color`
|
|
87
|
-
| `--rc-search-bar-input-font-family`
|
|
88
|
-
| `--rc-search-bar-input-font-size`
|
|
89
|
-
| `--rc-search-bar-view-bg`
|
|
90
|
-
| `--rc-search-bar-view-color`
|
|
91
|
-
| `--rc-search-bar-view-radius`
|
|
92
|
-
| `--rc-search-bar-view-shadow`
|
|
93
|
-
| `--rc-search-bar-view-border`
|
|
94
|
-
| `--rc-search-bar-view-offset`
|
|
95
|
-
| `--rc-search-bar-view-padding-block`
|
|
96
|
-
| `--rc-search-bar-suggestion-min-block-size` | `2.75rem`
|
|
97
|
-
| `--rc-search-bar-suggestion-padding-inline` | `1rem`
|
|
98
|
-
| `--rc-search-bar-suggestion-hover-bg`
|
|
74
|
+
| Property | Default | Description |
|
|
75
|
+
| ------------------------------------------- | ------------------------------------------- | ------------------------------------------------------ |
|
|
76
|
+
| `--rc-search-bar-border` | `1px solid ButtonBorder` | Border; M3 theme uses elevation instead |
|
|
77
|
+
| `--rc-search-bar-shadow` | `none` | Elevation shadow; M3 sets Level 1 at rest |
|
|
78
|
+
| `--rc-search-bar-bg` | `Field` | Wrapper background |
|
|
79
|
+
| `--rc-search-bar-color` | `FieldText` | Wrapper text color |
|
|
80
|
+
| `--rc-search-bar-icon-color` | `GrayText` | Leading icon color |
|
|
81
|
+
| `--rc-search-bar-clear-color` | `GrayText` | Clear button glyph color |
|
|
82
|
+
| `--rc-search-bar-radius` | `var(--rc-control-radius, 0.125em)` | Wrapper border radius |
|
|
83
|
+
| `--rc-search-bar-height` | `var(--rc-control-block-size, 2.5rem)` | Wrapper block size |
|
|
84
|
+
| `--rc-search-bar-padding-inline` | `var(--rc-control-padding-inline, 0.75rem)` | Wrapper horizontal padding |
|
|
85
|
+
| `--rc-search-bar-gap` | `var(--rc-control-gap, 0.25em)` | Gap between icon, input, and clear button |
|
|
86
|
+
| `--rc-search-bar-input-color` | inherit | Input text color |
|
|
87
|
+
| `--rc-search-bar-input-font-family` | inherit | Input font family |
|
|
88
|
+
| `--rc-search-bar-input-font-size` | inherit | Input font size |
|
|
89
|
+
| `--rc-search-bar-view-bg` | `var(--rc-search-bar-bg)` | Search view panel background |
|
|
90
|
+
| `--rc-search-bar-view-color` | `var(--rc-search-bar-color)` | Search view panel text color |
|
|
91
|
+
| `--rc-search-bar-view-radius` | `var(--rc-search-bar-radius)` | Search view panel radius |
|
|
92
|
+
| `--rc-search-bar-view-shadow` | `var(--rc-search-bar-shadow)` | Search view panel elevation |
|
|
93
|
+
| `--rc-search-bar-view-border` | `var(--rc-search-bar-border)` | Search view panel border |
|
|
94
|
+
| `--rc-search-bar-view-offset` | `0.25rem` | Gap between the search bar and the view panel below it |
|
|
95
|
+
| `--rc-search-bar-view-padding-block` | `0.5rem` | Search view suggestion list block padding |
|
|
96
|
+
| `--rc-search-bar-suggestion-min-block-size` | `2.75rem` | Datalist-derived suggestion row minimum block size |
|
|
97
|
+
| `--rc-search-bar-suggestion-padding-inline` | `1rem` | Datalist-derived suggestion inline padding |
|
|
98
|
+
| `--rc-search-bar-suggestion-hover-bg` | `ButtonFace` | Datalist-derived suggestion hover/focus background |
|
|
99
99
|
|
|
100
100
|
### CSS parts
|
|
101
101
|
|
|
102
|
-
| Part
|
|
103
|
-
|
|
|
104
|
-
| `root`
|
|
105
|
-
| `leading`
|
|
106
|
-
| `trailing`
|
|
107
|
-
| `clear`
|
|
108
|
-
| `view`
|
|
109
|
-
| `suggestions` | `div`
|
|
110
|
-
| `suggestion`
|
|
102
|
+
| Part | Element | Description |
|
|
103
|
+
| ------------- | ------------- | ------------------------------------ |
|
|
104
|
+
| `root` | wrapper `div` | The field chrome |
|
|
105
|
+
| `leading` | `span` | Wrapper around the leading icon slot |
|
|
106
|
+
| `trailing` | `span` | Wrapper around the trailing slot |
|
|
107
|
+
| `clear` | `button` | The clear button |
|
|
108
|
+
| `view` | `div` | Search view panel |
|
|
109
|
+
| `suggestions` | `div` | Suggestions container |
|
|
110
|
+
| `suggestion` | `button` | Datalist-derived suggestion button |
|
|
111
111
|
|
|
112
112
|
### Slots
|
|
113
113
|
|
|
114
|
-
| Slot
|
|
115
|
-
|
|
|
116
|
-
| _(default)_
|
|
117
|
-
| `leading`
|
|
118
|
-
| `clear-icon`
|
|
119
|
-
| `trailing`
|
|
120
|
-
| `suggestions` | Rich search view suggestions; takes precedence over datalist suggestions
|
|
114
|
+
| Slot | Description |
|
|
115
|
+
| ------------- | ------------------------------------------------------------------------- |
|
|
116
|
+
| _(default)_ | The required native `<input type="search">` |
|
|
117
|
+
| `leading` | Decorative leading icon; mark it `aria-hidden="true"` |
|
|
118
|
+
| `clear-icon` | Optional glyph replacing the default ✕ in the clear button |
|
|
119
|
+
| `trailing` | Optional content after the clear button (supplementary badges or actions) |
|
|
120
|
+
| `suggestions` | Rich search view suggestions; takes precedence over datalist suggestions |
|
|
121
121
|
|
|
122
122
|
### Events
|
|
123
123
|
|
|
124
|
-
| Event
|
|
125
|
-
|
|
|
126
|
-
| `rc-search-bar-input`
|
|
127
|
-
| `rc-search-bar-clear`
|
|
128
|
-
| `rc-search-bar-toggle`
|
|
129
|
-
| `rc-search-bar-suggestion-select` | `{ value: string, label: string }` | Fired when a datalist-derived suggestion is activated
|
|
124
|
+
| Event | Detail | Description |
|
|
125
|
+
| --------------------------------- | ---------------------------------- | --------------------------------------------------------------------------- |
|
|
126
|
+
| `rc-search-bar-input` | `{ value: string }` | Debounced after typing; fired immediately (pending timer canceled) on clear |
|
|
127
|
+
| `rc-search-bar-clear` | `{}` | Fired when the clear button is activated |
|
|
128
|
+
| `rc-search-bar-toggle` | `{ open: boolean }` | Fired when user interaction opens or closes the search view |
|
|
129
|
+
| `rc-search-bar-suggestion-select` | `{ value: string, label: string }` | Fired when a datalist-derived suggestion is activated |
|
|
130
130
|
|
|
131
131
|
### Search view suggestions
|
|
132
132
|
|
|
@@ -141,6 +141,14 @@ icons, supporting text, actions, or stronger AT/styling control.
|
|
|
141
141
|
|
|
142
142
|
---
|
|
143
143
|
|
|
144
|
+
## Localization
|
|
145
|
+
|
|
146
|
+
Built-in text follows the element's own `lang`, else `<html lang>`, and never an
|
|
147
|
+
ancestor's `lang`, which usually marks content. Override it per element with the
|
|
148
|
+
`messages` property, or for every instance with `registerMessages()` from
|
|
149
|
+
`@rcarls/rc-common` under `rc-search-bar`. Keys: `clear`. See the
|
|
150
|
+
[rc-common Localization section](https://github.com/richardcarls/rc-webcomponents/tree/develop/packages/rc-common#localization).
|
|
151
|
+
|
|
144
152
|
## Accessibility notes
|
|
145
153
|
|
|
146
154
|
- The component writes no ARIA to the input because `type="search"` already exposes
|
|
@@ -148,14 +156,14 @@ icons, supporting text, actions, or stronger AT/styling control.
|
|
|
148
156
|
input with `label[for]`, a wrapping `<label>`, or `aria-label`.
|
|
149
157
|
- The component adds no `role="search"` landmark; wrap in `<search>` or
|
|
150
158
|
`<form role="search">` when the bar is the page's search landmark.
|
|
151
|
-
- The clear button is a real `<button>` with a
|
|
152
|
-
(`clear
|
|
159
|
+
- The clear button is a real `<button>` with a localizable `aria-label`
|
|
160
|
+
(the `clear` message) and a ≥24×24 px hit target. Activating it returns focus to
|
|
153
161
|
the input before the button hides, so focus is never dropped.
|
|
154
162
|
- The native WebKit cancel button is suppressed automatically via an adopted
|
|
155
163
|
document stylesheet. Set `allow-native-clear` to restore it. When restored,
|
|
156
164
|
it clears through the normal input path (a debounced `rc-search-bar-input`
|
|
157
165
|
with an empty value) and never fires `rc-search-bar-clear`.
|
|
158
166
|
- Set `show-clear-on-focus` to show the clear button whenever the input is
|
|
159
|
-
focused (Apple HIG cancel pattern). Consider `clear
|
|
160
|
-
mode. The `rc-search-bar-clear` event fires even when the value is empty,
|
|
167
|
+
focused (Apple HIG cancel pattern). Consider setting the `clear` message to
|
|
168
|
+
`Cancel` in this mode. The `rc-search-bar-clear` event fires even when the value is empty,
|
|
161
169
|
allowing the host to dismiss a search overlay.
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"name": "*",
|
|
36
36
|
"declaration": {
|
|
37
37
|
"name": "*",
|
|
38
|
-
"module": "src/rc-search-bar"
|
|
38
|
+
"module": "src/rc-search-bar.js"
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
]
|
|
@@ -44,9 +44,16 @@
|
|
|
44
44
|
"kind": "javascript-module",
|
|
45
45
|
"path": "src/rc-search-bar.ts",
|
|
46
46
|
"declarations": [
|
|
47
|
+
{
|
|
48
|
+
"kind": "variable",
|
|
49
|
+
"name": "DEFAULT_SEARCH_BAR_MESSAGES",
|
|
50
|
+
"type": {
|
|
51
|
+
"text": "Readonly<RCSearchBarMessages>"
|
|
52
|
+
}
|
|
53
|
+
},
|
|
47
54
|
{
|
|
48
55
|
"kind": "class",
|
|
49
|
-
"description": "Search field wrapper for a native <input type=\"search\"> with icon chrome, clear button,\nand debounced events.\n\nThe native input is required and stays in light DOM as the source of\ntruth, so form submission, `label[for]`/wrapping-label association, and\npre-upgrade behavior are preserved. Without a slotted search input the\ncomponent renders no chrome and stays inert.\n\nThe native WebKit cancel button is suppressed by default via an\nadopted document stylesheet. Set `allow-native-clear` to restore it.\nWhen 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`.",
|
|
56
|
+
"description": "Search field wrapper for a native <input type=\"search\"> with icon chrome, clear button,\nand debounced events.\n\nThe native input is required and stays in light DOM as the source of\ntruth, so form submission, `label[for]`/wrapping-label association, and\npre-upgrade behavior are preserved. Without a slotted search input the\ncomponent renders no chrome and stays inert.\n\nThe native WebKit cancel button is suppressed by default via an\nadopted document stylesheet. Set `allow-native-clear` to restore it.\nWhen 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\nBuilt-in text (the clear button name) follows the element's own `lang`, else\n`<html lang>`: per element through `messages`, or for every instance\nthrough `registerMessages()` from `@rcarls/rc-common` under `rc-search-bar`.",
|
|
50
57
|
"name": "RCSearchBar",
|
|
51
58
|
"cssProperties": [
|
|
52
59
|
{
|
|
@@ -215,6 +222,48 @@
|
|
|
215
222
|
}
|
|
216
223
|
],
|
|
217
224
|
"members": [
|
|
225
|
+
{
|
|
226
|
+
"kind": "field",
|
|
227
|
+
"name": "messages",
|
|
228
|
+
"type": {
|
|
229
|
+
"text": "Partial<RCSearchBarMessages> | undefined"
|
|
230
|
+
},
|
|
231
|
+
"description": "Built-in text overrides; unset keys fall back to registered text, then English."
|
|
232
|
+
},
|
|
233
|
+
{
|
|
234
|
+
"kind": "field",
|
|
235
|
+
"name": "_messages",
|
|
236
|
+
"privacy": "private",
|
|
237
|
+
"readonly": true,
|
|
238
|
+
"default": "new MessagesController( this, 'rc-search-bar', DEFAULT_SEARCH_BAR_MESSAGES, { overrides: () => this.messages, }, )"
|
|
239
|
+
},
|
|
240
|
+
{
|
|
241
|
+
"kind": "field",
|
|
242
|
+
"name": "_styledRoots",
|
|
243
|
+
"privacy": "private",
|
|
244
|
+
"static": true,
|
|
245
|
+
"readonly": true,
|
|
246
|
+
"default": "new Set<Document | ShadowRoot>()"
|
|
247
|
+
},
|
|
248
|
+
{
|
|
249
|
+
"kind": "method",
|
|
250
|
+
"name": "_ensureBaseStyles",
|
|
251
|
+
"privacy": "private",
|
|
252
|
+
"static": true,
|
|
253
|
+
"return": {
|
|
254
|
+
"type": {
|
|
255
|
+
"text": "void"
|
|
256
|
+
}
|
|
257
|
+
},
|
|
258
|
+
"parameters": [
|
|
259
|
+
{
|
|
260
|
+
"name": "root",
|
|
261
|
+
"type": {
|
|
262
|
+
"text": "Document | ShadowRoot"
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
]
|
|
266
|
+
},
|
|
218
267
|
{
|
|
219
268
|
"kind": "field",
|
|
220
269
|
"name": "variant",
|
|
@@ -236,16 +285,6 @@
|
|
|
236
285
|
"description": "Debounce window in ms for `rc-search-bar-input`; `0` dispatches synchronously.",
|
|
237
286
|
"attribute": "debounce"
|
|
238
287
|
},
|
|
239
|
-
{
|
|
240
|
-
"kind": "field",
|
|
241
|
-
"name": "clearLabel",
|
|
242
|
-
"type": {
|
|
243
|
-
"text": "string"
|
|
244
|
-
},
|
|
245
|
-
"default": "'Clear search'",
|
|
246
|
-
"description": "Accessible label for the clear button.",
|
|
247
|
-
"attribute": "clear-label"
|
|
248
|
-
},
|
|
249
288
|
{
|
|
250
289
|
"kind": "field",
|
|
251
290
|
"name": "allowNativeClear",
|
|
@@ -264,7 +303,7 @@
|
|
|
264
303
|
"text": "boolean"
|
|
265
304
|
},
|
|
266
305
|
"default": "false",
|
|
267
|
-
"description": "When set, the clear button is visible whenever the input is focused.\n\nMatching the Apple HIG \"cancel\" pattern.\nConsider setting `clear
|
|
306
|
+
"description": "When set, the clear button is visible whenever the input is focused.\n\nMatching the Apple HIG \"cancel\" pattern.\nConsider setting `messages.clear` to `Cancel` in this mode.",
|
|
268
307
|
"attribute": "show-clear-on-focus"
|
|
269
308
|
},
|
|
270
309
|
{
|
|
@@ -479,6 +518,30 @@
|
|
|
479
518
|
"privacy": "private",
|
|
480
519
|
"readonly": true
|
|
481
520
|
},
|
|
521
|
+
{
|
|
522
|
+
"kind": "field",
|
|
523
|
+
"name": "_onHostFocusOut",
|
|
524
|
+
"privacy": "private",
|
|
525
|
+
"readonly": true
|
|
526
|
+
},
|
|
527
|
+
{
|
|
528
|
+
"kind": "method",
|
|
529
|
+
"name": "_containsFocusTarget",
|
|
530
|
+
"privacy": "private",
|
|
531
|
+
"return": {
|
|
532
|
+
"type": {
|
|
533
|
+
"text": "boolean"
|
|
534
|
+
}
|
|
535
|
+
},
|
|
536
|
+
"parameters": [
|
|
537
|
+
{
|
|
538
|
+
"name": "target",
|
|
539
|
+
"type": {
|
|
540
|
+
"text": "EventTarget | null"
|
|
541
|
+
}
|
|
542
|
+
}
|
|
543
|
+
]
|
|
544
|
+
},
|
|
482
545
|
{
|
|
483
546
|
"kind": "field",
|
|
484
547
|
"name": "_disabledObserver",
|
|
@@ -889,15 +952,6 @@
|
|
|
889
952
|
"default": "200",
|
|
890
953
|
"fieldName": "debounce"
|
|
891
954
|
},
|
|
892
|
-
{
|
|
893
|
-
"description": "Accessible label for the clear button.",
|
|
894
|
-
"name": "clear-label",
|
|
895
|
-
"type": {
|
|
896
|
-
"text": "string"
|
|
897
|
-
},
|
|
898
|
-
"default": "'Clear search'",
|
|
899
|
-
"fieldName": "clearLabel"
|
|
900
|
-
},
|
|
901
955
|
{
|
|
902
956
|
"description": "When set, leaves the browser's native WebKit cancel button visible.",
|
|
903
957
|
"name": "allow-native-clear",
|
|
@@ -908,7 +962,7 @@
|
|
|
908
962
|
"fieldName": "allowNativeClear"
|
|
909
963
|
},
|
|
910
964
|
{
|
|
911
|
-
"description": "When set, the clear button is visible whenever the input is focused.\n\nMatching the Apple HIG \"cancel\" pattern.\nConsider setting `clear
|
|
965
|
+
"description": "When set, the clear button is visible whenever the input is focused.\n\nMatching the Apple HIG \"cancel\" pattern.\nConsider setting `messages.clear` to `Cancel` in this mode.",
|
|
912
966
|
"name": "show-clear-on-focus",
|
|
913
967
|
"type": {
|
|
914
968
|
"text": "boolean"
|
|
@@ -966,6 +1020,14 @@
|
|
|
966
1020
|
}
|
|
967
1021
|
],
|
|
968
1022
|
"exports": [
|
|
1023
|
+
{
|
|
1024
|
+
"kind": "js",
|
|
1025
|
+
"name": "DEFAULT_SEARCH_BAR_MESSAGES",
|
|
1026
|
+
"declaration": {
|
|
1027
|
+
"name": "DEFAULT_SEARCH_BAR_MESSAGES",
|
|
1028
|
+
"module": "src/rc-search-bar.ts"
|
|
1029
|
+
}
|
|
1030
|
+
},
|
|
969
1031
|
{
|
|
970
1032
|
"kind": "js",
|
|
971
1033
|
"name": "RCSearchBar",
|