@synergy-design-system/react 2.38.0 → 2.39.1

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.
@@ -27,4 +27,4 @@ var SynCombobox = createComponent({
27
27
  export {
28
28
  SynCombobox
29
29
  };
30
- //# sourceMappingURL=chunk.ZQEUVNBF.js.map
30
+ //# sourceMappingURL=chunk.S7IA5L2L.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/components/combobox.ts"],
4
- "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/combobox/combobox.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynChangeEvent } from '@synergy-design-system/components';\nimport type { SynClearEvent } from '@synergy-design-system/components';\nimport type { SynInputEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynShowEvent } from '@synergy-design-system/components';\nimport type { SynAfterShowEvent } from '@synergy-design-system/components';\nimport type { SynHideEvent } from '@synergy-design-system/components';\nimport type { SynAfterHideEvent } from '@synergy-design-system/components';\nimport type { SynInvalidEvent } from '@synergy-design-system/components';\nimport type { SynErrorEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-combobox';\nComponent.define('syn-combobox');\n\n/**\n * @summary Comboboxes allow you to choose items from a menu of predefined options.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-combobox--docs\n * @status stable\n *\n * @dependency syn-icon\n * @dependency syn-popup\n *\n * @slot - The listbox options. Must be `<syn-option>` elements.\n * You can use `<syn-optgroup>`'s to group items visually.\n * @slot label - The combobox's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the combobox.\n * @slot suffix - Used to append a presentational icon or similar element to the combobox.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot expand-icon - The icon to show when the control is expanded and collapsed.\n * Rotates on open and close.\n * @slot help-text - Text that describes how to use the combobox.\n * Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the control's value changes.\n * @event syn-clear - Emitted when the control's value is cleared.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-show - Emitted when the combobox's menu opens.\n * @event syn-after-show - Emitted after the combobox's menu opens and all animations are complete.\n * @event syn-hide - Emitted when the combobox's menu closes.\n * @event syn-after-hide - Emitted after the combobox's menu closes and all animations are complete.\n * @event syn-invalid - Emitted when the form control has been checked for validity\n * and its constraints aren't satisfied.\n * @event syn-error - Emitted when the combobox menu fails to open.\n *\n * @csspart form-control - The form control that wraps the label, combobox, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The combobox's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart combobox - The container the wraps the prefix, combobox, clear icon, and expand button.\n * @csspart prefix - The container that wraps the prefix slot.\n * @csspart suffix - The container that wraps the suffix slot.\n * @csspart display-input - The element that displays the selected option's label,\n * an `<input>` element.\n * @csspart listbox - The listbox container where the options are slotted\n * and the filtered options list exists.\n * @csspart filtered-listbox - The container that wraps the filtered options.\n * @csspart clear-button - The clear button.\n * @csspart expand-icon - The container that wraps the expand icon.\n * @csspart popup - The popup's exported `popup` part.\n * Use this to target the tooltip's popup container.\n *\n * @animation combobox.show - The animation to use when showing the combobox.\n * @animation combobox.hide - The animation to use when hiding the combobox.\n */\nexport const SynCombobox = createComponent({\n displayName: 'SynCombobox',\n elementClass: Component,\n events: {\n onSynChange: 'syn-change' as EventName<SynChangeEvent>,\n onSynClear: 'syn-clear' as EventName<SynClearEvent>,\n onSynInput: 'syn-input' as EventName<SynInputEvent>,\n onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n onSynShow: 'syn-show' as EventName<SynShowEvent>,\n onSynAfterShow: 'syn-after-show' as EventName<SynAfterShowEvent>,\n onSynHide: 'syn-hide' as EventName<SynHideEvent>,\n onSynAfterHide: 'syn-after-hide' as EventName<SynAfterHideEvent>,\n onSynInvalid: 'syn-invalid' as EventName<SynInvalidEvent>,\n onSynError: 'syn-error' as EventName<SynErrorEvent>,\n },\n react: React,\n tagName,\n});\n\nexport type { SynChangeEvent } from '@synergy-design-system/components';\nexport type { SynClearEvent } from '@synergy-design-system/components';\nexport type { SynInputEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynShowEvent } from '@synergy-design-system/components';\nexport type { SynAfterShowEvent } from '@synergy-design-system/components';\nexport type { SynHideEvent } from '@synergy-design-system/components';\nexport type { SynAfterHideEvent } from '@synergy-design-system/components';\nexport type { SynInvalidEvent } from '@synergy-design-system/components';\nexport type { SynErrorEvent } from '@synergy-design-system/components';\n"],
5
- "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAetB,IAAM,UAAU;AAChB,UAAU,OAAO,cAAc;AAsDxB,IAAM,cAAc,gBAAgB;AAAA,EACzC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
4
+ "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED @synergy-design-system/react wrappers for @synergy-design-system/components\n// Please do not edit this file directly!\n// It will get recreated when running pnpm build.\n// ---------------------------------------------------------------------\nimport * as React from 'react';\nimport { createComponent } from '@lit/react';\nimport Component from '@synergy-design-system/components/components/combobox/combobox.component.js';\n\nimport { type EventName } from '@lit/react';\nimport type { SynChangeEvent } from '@synergy-design-system/components';\nimport type { SynClearEvent } from '@synergy-design-system/components';\nimport type { SynInputEvent } from '@synergy-design-system/components';\nimport type { SynFocusEvent } from '@synergy-design-system/components';\nimport type { SynBlurEvent } from '@synergy-design-system/components';\nimport type { SynShowEvent } from '@synergy-design-system/components';\nimport type { SynAfterShowEvent } from '@synergy-design-system/components';\nimport type { SynHideEvent } from '@synergy-design-system/components';\nimport type { SynAfterHideEvent } from '@synergy-design-system/components';\nimport type { SynInvalidEvent } from '@synergy-design-system/components';\nimport type { SynErrorEvent } from '@synergy-design-system/components';\n\nconst tagName = 'syn-combobox';\nComponent.define('syn-combobox');\n\n/**\n * @summary Comboboxes allow you to choose items from a menu of predefined options.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-combobox--docs\n * @status stable\n *\n * @dependency syn-icon\n * @dependency syn-popup\n *\n * @slot - The listbox options. Must be `<syn-option>` elements.\n * You can use `<syn-optgroup>`'s to group items visually.\n * @slot label - The combobox's label. Alternatively, you can use the `label` attribute.\n * @slot prefix - Used to prepend a presentational icon or similar element to the combobox.\n * @slot suffix - Used to append a presentational icon or similar element to the combobox.\n * @slot clear-icon - An icon to use in lieu of the default clear icon.\n * @slot expand-icon - The icon to show when the control is expanded and collapsed.\n * Rotates on open and close.\n * @slot help-text - Text that describes how to use the combobox.\n * Alternatively, you can use the `help-text` attribute.\n *\n * @event syn-change - Emitted when the control's value changes.\n * @event syn-clear - Emitted when the control's value is cleared.\n * @event syn-input - Emitted when the control receives input.\n * @event syn-focus - Emitted when the control gains focus.\n * @event syn-blur - Emitted when the control loses focus.\n * @event syn-show - Emitted when the combobox's menu opens.\n * @event syn-after-show - Emitted after the combobox's menu opens and all animations are complete.\n * @event syn-hide - Emitted when the combobox's menu closes.\n * @event syn-after-hide - Emitted after the combobox's menu closes and all animations are complete.\n * @event syn-invalid - Emitted when the form control has been checked for validity\n * and its constraints aren't satisfied.\n * @event syn-error - Emitted when the combobox menu fails to open.\n *\n * @csspart form-control - The form control that wraps the label, combobox, and help text.\n * @csspart form-control-label - The label's wrapper.\n * @csspart form-control-input - The combobox's wrapper.\n * @csspart form-control-help-text - The help text's wrapper.\n * @csspart combobox - The container the wraps the prefix, combobox, clear icon, and expand button.\n * @csspart prefix - The container that wraps the prefix slot.\n * @csspart suffix - The container that wraps the suffix slot.\n * @csspart display-input - The element that displays the selected option's label,\n * an `<input>` element.\n * @csspart listbox - The listbox container where the options are slotted\n * and the filtered options list exists.\n * @csspart filtered-listbox - The container that wraps the filtered options.\n * @csspart clear-button - The clear button.\n * @csspart expand-icon - The container that wraps the expand icon.\n * @csspart popup - The popup's exported `popup` part.\n * Use this to target the tooltip's popup container.\n * @csspart no-results - The container that wraps the \"no results\" message.\n *\n * @animation combobox.show - The animation to use when showing the combobox.\n * @animation combobox.hide - The animation to use when hiding the combobox.\n */\nexport const SynCombobox = createComponent({\n displayName: 'SynCombobox',\n elementClass: Component,\n events: {\n onSynChange: 'syn-change' as EventName<SynChangeEvent>,\n onSynClear: 'syn-clear' as EventName<SynClearEvent>,\n onSynInput: 'syn-input' as EventName<SynInputEvent>,\n onSynFocus: 'syn-focus' as EventName<SynFocusEvent>,\n onSynBlur: 'syn-blur' as EventName<SynBlurEvent>,\n onSynShow: 'syn-show' as EventName<SynShowEvent>,\n onSynAfterShow: 'syn-after-show' as EventName<SynAfterShowEvent>,\n onSynHide: 'syn-hide' as EventName<SynHideEvent>,\n onSynAfterHide: 'syn-after-hide' as EventName<SynAfterHideEvent>,\n onSynInvalid: 'syn-invalid' as EventName<SynInvalidEvent>,\n onSynError: 'syn-error' as EventName<SynErrorEvent>,\n },\n react: React,\n tagName,\n});\n\nexport type { SynChangeEvent } from '@synergy-design-system/components';\nexport type { SynClearEvent } from '@synergy-design-system/components';\nexport type { SynInputEvent } from '@synergy-design-system/components';\nexport type { SynFocusEvent } from '@synergy-design-system/components';\nexport type { SynBlurEvent } from '@synergy-design-system/components';\nexport type { SynShowEvent } from '@synergy-design-system/components';\nexport type { SynAfterShowEvent } from '@synergy-design-system/components';\nexport type { SynHideEvent } from '@synergy-design-system/components';\nexport type { SynAfterHideEvent } from '@synergy-design-system/components';\nexport type { SynInvalidEvent } from '@synergy-design-system/components';\nexport type { SynErrorEvent } from '@synergy-design-system/components';\n"],
5
+ "mappings": ";AAKA,YAAY,WAAW;AACvB,SAAS,uBAAuB;AAChC,OAAO,eAAe;AAetB,IAAM,UAAU;AAChB,UAAU,OAAO,cAAc;AAuDxB,IAAM,cAAc,gBAAgB;AAAA,EACzC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AACF,CAAC;",
6
6
  "names": []
7
7
  }
@@ -59,6 +59,7 @@ import type { SynErrorEvent } from '@synergy-design-system/components';
59
59
  * @csspart expand-icon - The container that wraps the expand icon.
60
60
  * @csspart popup - The popup's exported `popup` part.
61
61
  * Use this to target the tooltip's popup container.
62
+ * @csspart no-results - The container that wraps the "no results" message.
62
63
  *
63
64
  * @animation combobox.show - The animation to use when showing the combobox.
64
65
  * @animation combobox.hide - The animation to use when hiding the combobox.
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  SynCombobox
3
- } from "../chunks/chunk.ZQEUVNBF.js";
3
+ } from "../chunks/chunk.S7IA5L2L.js";
4
4
  export {
5
5
  SynCombobox
6
6
  };
package/dist/index.js CHANGED
@@ -99,7 +99,7 @@ import {
99
99
  } from "./chunks/chunk.GKMBLOJD.js";
100
100
  import {
101
101
  SynCombobox
102
- } from "./chunks/chunk.ZQEUVNBF.js";
102
+ } from "./chunks/chunk.S7IA5L2L.js";
103
103
  import {
104
104
  SynDetails
105
105
  } from "./chunks/chunk.2B5NFH4D.js";
@@ -277,6 +277,7 @@ export type SynCustomElement<SynElement extends HTMLElement, Events extends SynE
277
277
  * @csspart expand-icon - The container that wraps the expand icon.
278
278
  * @csspart popup - The popup's exported `popup` part.
279
279
  * Use this to target the tooltip's popup container.
280
+ * @csspart no-results - The container that wraps the "no results" message.
280
281
  *
281
282
  * @animation combobox.show - The animation to use when showing the combobox.
282
283
  * @animation combobox.hide - The animation to use when hiding the combobox.
@@ -1853,6 +1854,7 @@ declare module 'react' {
1853
1854
  * @csspart expand-icon - The container that wraps the expand icon.
1854
1855
  * @csspart popup - The popup's exported `popup` part.
1855
1856
  * Use this to target the tooltip's popup container.
1857
+ * @csspart no-results - The container that wraps the "no results" message.
1856
1858
  *
1857
1859
  * @animation combobox.show - The animation to use when showing the combobox.
1858
1860
  * @animation combobox.hide - The animation to use when hiding the combobox.
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  },
6
6
  "dependencies": {
7
7
  "@lit/react": "^1.0.7",
8
- "@synergy-design-system/components": "^2.38.0"
8
+ "@synergy-design-system/components": "^2.39.1"
9
9
  },
10
10
  "description": "React wrappers for the Synergy Design System",
11
11
  "exports": {
@@ -43,12 +43,12 @@
43
43
  "directory": "packages/react"
44
44
  },
45
45
  "type": "module",
46
- "version": "2.38.0",
46
+ "version": "2.39.1",
47
47
  "devDependencies": {
48
48
  "@types/react": "^19.1.8",
49
49
  "react": "^19.1.0"
50
50
  },
51
51
  "peerDependencies": {
52
- "@synergy-design-system/tokens": "^2.20.1"
52
+ "@synergy-design-system/tokens": "^2.21.0"
53
53
  }
54
54
  }