@redvars/peacock 3.8.2 → 3.8.4

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 (225) hide show
  1. package/dist/accordion-item.js +15 -6
  2. package/dist/accordion-item.js.map +1 -1
  3. package/dist/accordion.js +12 -11
  4. package/dist/accordion.js.map +1 -1
  5. package/dist/alert.js +1 -0
  6. package/dist/alert.js.map +1 -1
  7. package/dist/app-bar.js +1 -0
  8. package/dist/app-bar.js.map +1 -1
  9. package/dist/assets/components.css +1 -1
  10. package/dist/assets/components.css.map +1 -1
  11. package/dist/assets/styles.css +1 -1
  12. package/dist/assets/styles.css.map +1 -1
  13. package/dist/avatar.js +1 -0
  14. package/dist/avatar.js.map +1 -1
  15. package/dist/babel-DBsfpl3B.js +18 -0
  16. package/dist/babel-DBsfpl3B.js.map +1 -0
  17. package/dist/badge.js +1 -0
  18. package/dist/badge.js.map +1 -1
  19. package/dist/bottom-sheet.js +1 -0
  20. package/dist/bottom-sheet.js.map +1 -1
  21. package/dist/breadcrumb-item.js +1 -0
  22. package/dist/breadcrumb-item.js.map +1 -1
  23. package/dist/breadcrumb.js +1 -0
  24. package/dist/breadcrumb.js.map +1 -1
  25. package/dist/button-group.js +5 -4
  26. package/dist/button-group.js.map +1 -1
  27. package/dist/button.js +9 -8
  28. package/dist/button.js.map +1 -1
  29. package/dist/calendar-column-view.js +1 -0
  30. package/dist/calendar-column-view.js.map +1 -1
  31. package/dist/calendar-month-view.js +1 -0
  32. package/dist/calendar-month-view.js.map +1 -1
  33. package/dist/calendar.js +1 -0
  34. package/dist/calendar.js.map +1 -1
  35. package/dist/canvas.js +1 -0
  36. package/dist/canvas.js.map +1 -1
  37. package/dist/card.js +23 -7
  38. package/dist/card.js.map +1 -1
  39. package/dist/cb-compound-expression.js +1 -0
  40. package/dist/cb-compound-expression.js.map +1 -1
  41. package/dist/cb-divider.js +1 -0
  42. package/dist/cb-divider.js.map +1 -1
  43. package/dist/cb-expression.js +1 -0
  44. package/dist/cb-expression.js.map +1 -1
  45. package/dist/cb-predicate.js +1 -0
  46. package/dist/cb-predicate.js.map +1 -1
  47. package/dist/{chart-bar-CYoGNXnK.js → chart-bar-CapLbc2e.js} +2 -1
  48. package/dist/{chart-bar-CYoGNXnK.js.map → chart-bar-CapLbc2e.js.map} +1 -1
  49. package/dist/chart-bar.js +1 -1
  50. package/dist/chart-doughnut.js +1 -0
  51. package/dist/chart-doughnut.js.map +1 -1
  52. package/dist/chart-pie.js +1 -0
  53. package/dist/chart-pie.js.map +1 -1
  54. package/dist/chart-stacked-bar.js +1 -1
  55. package/dist/checkbox.js +1 -0
  56. package/dist/checkbox.js.map +1 -1
  57. package/dist/chip.js +1 -0
  58. package/dist/chip.js.map +1 -1
  59. package/dist/clock.js +1 -0
  60. package/dist/clock.js.map +1 -1
  61. package/dist/code-editor.js +1 -0
  62. package/dist/code-editor.js.map +1 -1
  63. package/dist/code-highlighter.js +75 -11212
  64. package/dist/code-highlighter.js.map +1 -1
  65. package/dist/color-picker.js +701 -0
  66. package/dist/color-picker.js.map +1 -0
  67. package/dist/condition-builder.js +1 -0
  68. package/dist/condition-builder.js.map +1 -1
  69. package/dist/container.js +1 -0
  70. package/dist/container.js.map +1 -1
  71. package/dist/custom-elements-jsdocs.json +103 -10
  72. package/dist/custom-elements.json +1212 -586
  73. package/dist/divider.js +1 -0
  74. package/dist/divider.js.map +1 -1
  75. package/dist/dropdown-button.js +1 -0
  76. package/dist/dropdown-button.js.map +1 -1
  77. package/dist/elevation.js +1 -0
  78. package/dist/elevation.js.map +1 -1
  79. package/dist/empty-state.js +1 -0
  80. package/dist/empty-state.js.map +1 -1
  81. package/dist/estree-C2LDzX4U.js +47 -0
  82. package/dist/estree-C2LDzX4U.js.map +1 -0
  83. package/dist/fab.js +2 -3
  84. package/dist/fab.js.map +1 -1
  85. package/dist/field.js +1 -0
  86. package/dist/field.js.map +1 -1
  87. package/dist/{flow-designer-node-DsVwQTac.js → flow-designer-node-CGSm6cUH.js} +2 -1
  88. package/dist/{flow-designer-node-DsVwQTac.js.map → flow-designer-node-CGSm6cUH.js.map} +1 -1
  89. package/dist/flow-designer-node.js +1 -1
  90. package/dist/flow-designer.js +1 -1
  91. package/dist/html-D22sQuVy.js +27 -0
  92. package/dist/html-D22sQuVy.js.map +1 -0
  93. package/dist/html-editor.js +1 -0
  94. package/dist/html-editor.js.map +1 -1
  95. package/dist/icon-button.js +6 -5
  96. package/dist/icon-button.js.map +1 -1
  97. package/dist/icon.js +1 -0
  98. package/dist/icon.js.map +1 -1
  99. package/dist/index-_g_oLekF.js +14095 -0
  100. package/dist/index-_g_oLekF.js.map +1 -0
  101. package/dist/index.js +5 -4
  102. package/dist/index.js.map +1 -1
  103. package/dist/item.js +4 -2
  104. package/dist/item.js.map +1 -1
  105. package/dist/link.js +1 -0
  106. package/dist/link.js.map +1 -1
  107. package/dist/{list-D6JLh1uh.js → list-BBmnHm8f.js} +196 -20
  108. package/dist/list-BBmnHm8f.js.map +1 -0
  109. package/dist/list.js +2 -2
  110. package/dist/loader.js +6 -2
  111. package/dist/loader.js.map +1 -1
  112. package/dist/menu-item.js +104 -33
  113. package/dist/menu-item.js.map +1 -1
  114. package/dist/menu.js +5 -18
  115. package/dist/menu.js.map +1 -1
  116. package/dist/modal.js +1 -0
  117. package/dist/modal.js.map +1 -1
  118. package/dist/navigation-rail-item.js +22 -6
  119. package/dist/navigation-rail-item.js.map +1 -1
  120. package/dist/navigation-rail.js +23 -20
  121. package/dist/navigation-rail.js.map +1 -1
  122. package/dist/notification-manager.js +1 -0
  123. package/dist/notification-manager.js.map +1 -1
  124. package/dist/notification.js +1 -0
  125. package/dist/notification.js.map +1 -1
  126. package/dist/number-counter.js +1 -0
  127. package/dist/number-counter.js.map +1 -1
  128. package/dist/pagination.js +1 -0
  129. package/dist/pagination.js.map +1 -1
  130. package/dist/pierre-dark-DFWl0m-C.js +4 -0
  131. package/dist/pierre-dark-DFWl0m-C.js.map +1 -0
  132. package/dist/pierre-light-BEkAPImt.js +4 -0
  133. package/dist/pierre-light-BEkAPImt.js.map +1 -0
  134. package/dist/popover-content.js +1 -0
  135. package/dist/popover-content.js.map +1 -1
  136. package/dist/popover.js +1 -0
  137. package/dist/popover.js.map +1 -1
  138. package/dist/postcss-BhbitHaI.js +64 -0
  139. package/dist/postcss-BhbitHaI.js.map +1 -0
  140. package/dist/radio.js +1 -0
  141. package/dist/radio.js.map +1 -1
  142. package/dist/search.js +1 -0
  143. package/dist/search.js.map +1 -1
  144. package/dist/segmented-button-group.js +1 -0
  145. package/dist/segmented-button-group.js.map +1 -1
  146. package/dist/segmented-button.js +1 -0
  147. package/dist/segmented-button.js.map +1 -1
  148. package/dist/{select-Dwtk0RIU.js → select-D85kpjUt.js} +28 -7
  149. package/dist/{select-Dwtk0RIU.js.map → select-D85kpjUt.js.map} +1 -1
  150. package/dist/side-sheet.js +2 -1
  151. package/dist/side-sheet.js.map +1 -1
  152. package/dist/skeleton.js +1 -0
  153. package/dist/skeleton.js.map +1 -1
  154. package/dist/snackbar.js +1 -0
  155. package/dist/snackbar.js.map +1 -1
  156. package/dist/spinner.js +1 -0
  157. package/dist/spinner.js.map +1 -1
  158. package/dist/split-button.js +1 -0
  159. package/dist/split-button.js.map +1 -1
  160. package/dist/src/accordion/accordion-item.d.ts +1 -1
  161. package/dist/src/accordion/accordion.d.ts +3 -3
  162. package/dist/src/button/button/button.d.ts +2 -2
  163. package/dist/src/button/button-group/button-group.d.ts +4 -4
  164. package/dist/src/code-highlighter/code-highlighter.d.ts +2 -2
  165. package/dist/src/color-picker/color-picker.d.ts +85 -0
  166. package/dist/src/color-picker/index.d.ts +1 -0
  167. package/dist/src/index.d.ts +1 -0
  168. package/dist/src/item/item.d.ts +0 -1
  169. package/dist/src/list/list-item.d.ts +3 -1
  170. package/dist/src/list/list.d.ts +24 -0
  171. package/dist/src/menu/menu-item/menu-item.d.ts +1 -2
  172. package/dist/standalone-Ccq0tWwA.js +32 -0
  173. package/dist/standalone-Ccq0tWwA.js.map +1 -0
  174. package/dist/sub-menu.js +7 -1
  175. package/dist/sub-menu.js.map +1 -1
  176. package/dist/svg.js +1 -0
  177. package/dist/svg.js.map +1 -1
  178. package/dist/tab-group.js +1 -0
  179. package/dist/tab-group.js.map +1 -1
  180. package/dist/tab-panel.js +1 -0
  181. package/dist/tab-panel.js.map +1 -1
  182. package/dist/tab.js +1 -0
  183. package/dist/tab.js.map +1 -1
  184. package/dist/table.js +1 -0
  185. package/dist/table.js.map +1 -1
  186. package/dist/tabs.js +1 -0
  187. package/dist/tabs.js.map +1 -1
  188. package/dist/toolbar.js +1 -0
  189. package/dist/toolbar.js.map +1 -1
  190. package/dist/tooltip.js +1 -0
  191. package/dist/tooltip.js.map +1 -1
  192. package/dist/tsconfig.tsbuildinfo +1 -1
  193. package/package.json +1 -1
  194. package/readme.md +3 -3
  195. package/scss/mixin.scss +2 -0
  196. package/src/accordion/accordion-item.ts +16 -6
  197. package/src/accordion/accordion.scss +2 -2
  198. package/src/accordion/accordion.ts +7 -7
  199. package/src/button/button/button-base.scss +2 -1
  200. package/src/button/button/button-layers.scss +2 -6
  201. package/src/button/button/button.ts +3 -3
  202. package/src/button/button-group/button-group.ts +4 -4
  203. package/src/button/fab/fab.ts +0 -4
  204. package/src/card/card.scss +18 -5
  205. package/src/code-highlighter/code-highlighter.ts +94 -39
  206. package/src/color-picker/color-picker.scss +217 -0
  207. package/src/color-picker/color-picker.ts +478 -0
  208. package/src/color-picker/index.ts +1 -0
  209. package/src/index.ts +1 -0
  210. package/src/item/item.scss +3 -1
  211. package/src/item/item.ts +0 -1
  212. package/src/list/list-item.scss +5 -1
  213. package/src/list/list-item.ts +40 -14
  214. package/src/list/list.ts +164 -2
  215. package/src/loader.ts +4 -0
  216. package/src/menu/menu/menu.scss +4 -18
  217. package/src/menu/menu/menu.ts +0 -1
  218. package/src/menu/menu-item/menu-item.scss +73 -43
  219. package/src/menu/menu-item/menu-item.ts +60 -27
  220. package/src/menu/sub-menu/sub-menu.scss +5 -1
  221. package/src/navigation-rail/navigation-rail-item.scss +25 -8
  222. package/src/navigation-rail/navigation-rail.scss +25 -22
  223. package/src/side-sheet/side-sheet.ts +1 -1
  224. package/src/sidebar-menu/sidebar-menu-item.scss +14 -7
  225. package/dist/list-D6JLh1uh.js.map +0 -1
package/dist/index.js CHANGED
@@ -17,7 +17,7 @@ export { Ripple } from './ripple.js';
17
17
  import './accordion-item.js';
18
18
  export { Accordion } from './accordion.js';
19
19
  export { Link } from './link.js';
20
- export { C as ChipSet, a as CircularProgress, D as DatePicker, I as Input, L as LinearProgress, N as NumberField, S as Select, b as SidebarMenu, c as SidebarMenuItem, d as SidebarSubMenu, e as Switch, T as Tag, f as Textarea, g as TimePicker, U as UrlField } from './select-Dwtk0RIU.js';
20
+ export { C as ChipSet, a as CircularProgress, D as DatePicker, I as Input, L as LinearProgress, N as NumberField, S as Select, b as SidebarMenu, c as SidebarMenuItem, d as SidebarSubMenu, e as Switch, T as Tag, f as Textarea, g as TimePicker, U as UrlField } from './select-D85kpjUt.js';
21
21
  export { Chip } from './chip.js';
22
22
  export { Skeleton } from './skeleton.js';
23
23
  export { Field } from './field.js';
@@ -34,7 +34,7 @@ export { BreadcrumbItem } from './breadcrumb-item.js';
34
34
  export { Menu } from './menu.js';
35
35
  export { MenuItem } from './menu-item.js';
36
36
  export { SubMenu } from './sub-menu.js';
37
- export { L as List, a as ListItem } from './list-D6JLh1uh.js';
37
+ export { L as List, a as ListItem } from './list-BBmnHm8f.js';
38
38
  export { Item } from './item.js';
39
39
  export { CodeHighlighter } from './code-highlighter.js';
40
40
  export { default as CodeEditor } from './code-editor.js';
@@ -46,6 +46,7 @@ export { TabGroup } from './tab-group.js';
46
46
  export { TabPanel } from './tab-panel.js';
47
47
  export { Tabs } from './tabs.js';
48
48
  export { Slider } from './slider.js';
49
+ export { ColorPicker } from './color-picker.js';
49
50
  export { ChartDoughnut } from './chart-doughnut.js';
50
51
  export { ChartPie } from './chart-pie.js';
51
52
  export { ChartBar } from './chart-bar.js';
@@ -73,7 +74,7 @@ export { CalendarColumnView } from './calendar-column-view.js';
73
74
  export { CalendarMonthView } from './calendar-month-view.js';
74
75
  export { Canvas } from './canvas.js';
75
76
  export { FlowDesigner } from './flow-designer.js';
76
- export { F as FlowDesignerNode } from './flow-designer-node-DsVwQTac.js';
77
+ export { F as FlowDesignerNode } from './flow-designer-node-CGSm6cUH.js';
77
78
  export { ConditionBuilder } from './condition-builder.js';
78
79
  export { CbPredicate } from './cb-predicate.js';
79
80
  export { CbCompoundExpression } from './cb-compound-expression.js';
@@ -109,7 +110,7 @@ import './is-dark-mode-DOcaw4Yq.js';
109
110
  import './transform-DSwFSqzD.js';
110
111
  import './pie-Dz0IDiPt.js';
111
112
  import './array-D5vjT2Xm.js';
112
- import './chart-bar-CYoGNXnK.js';
113
+ import './chart-bar-CapLbc2e.js';
113
114
  import './calendar-event-BrQ_SEKD.js';
114
115
  import './event-manager-DTyX2uYD.js';
115
116
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/item.js CHANGED
@@ -13,6 +13,7 @@ let e;function r(r){return (n,o)=>e$1(n,o,{get(){return (this.renderRoot??(e??=d
13
13
 
14
14
  var css_248z = i`* {
15
15
  box-sizing: border-box;
16
+ -webkit-tap-highlight-color: transparent;
16
17
  }
17
18
 
18
19
  .screen-reader-only {
@@ -27,6 +28,7 @@ var css_248z = i`* {
27
28
  --item-container-color: transparent;
28
29
  --item-height: 3rem;
29
30
  --item-multiline-height: 4rem;
31
+ --item-label-text-color: var(--color-on-surface);
30
32
  }
31
33
 
32
34
  :host {
@@ -44,7 +46,8 @@ var css_248z = i`* {
44
46
  padding-block: 0.625rem;
45
47
  padding-inline: var(--item-padding-inline, 1rem);
46
48
  overflow: hidden;
47
- color: var(--item-label-text-color, var(--color-on-surface));
49
+ color: var(--item-label-text-color);
50
+ --icon-color: var(--item-label-text-color);
48
51
  opacity: var(--item-label-text-opacity, 1);
49
52
  font-family: var(--item-label-font-family, var(--typography-body-large-font-family)) !important;
50
53
  font-size: var(--item-label-font-size, var(--typography-body-large-font-size)) !important;
@@ -125,7 +128,6 @@ var css_248z = i`* {
125
128
  * <wc-item>
126
129
  * <wc-icon slot="start" name="notifications"></wc-icon>
127
130
  *
128
- * <span slot="overline">Settings</span>
129
131
  * <span slot="headline">Notifications</span>
130
132
  * <span slot="supporting-text">Manage alerts and reminders</span>
131
133
  *
package/dist/item.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"item.js","sources":["../node_modules/@lit/reactive-element/decorators/query-all.js","../../src/item/item.ts"],"sourcesContent":["import{desc as t}from\"./base.js\";\n/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\nlet e;function r(r){return(n,o)=>t(n,o,{get(){return(this.renderRoot??(e??=document.createDocumentFragment())).querySelectorAll(r)}})}export{r as queryAll};\n//# sourceMappingURL=query-all.js.map\n","import { html, LitElement } from 'lit';\nimport { property, queryAll } from 'lit/decorators.js';\nimport styles from './item.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport { mixinDelegatesAria } from '@/__internal/aria/delegate.js';\nimport { mixinElementInternals } from '@/__internal/mixins/element-internals.js';\n\nimport { hasMeaningfulContent } from '@/__internal/utils/observe-slot-change.js';\n\n/**\n * @label Item\n * @tag wc-item\n * @rawTag item\n *\n * @summary A primitive element used to build higher-level item components such as menu-item, navigation-item, and list-item. Provides start, text, and end slots for flexible content composition.\n *\n * @example\n * ```html\n * <wc-item>\n * <wc-icon slot=\"start\" name=\"notifications\"></wc-icon>\n *\n * <span slot=\"overline\">Settings</span>\n * <span slot=\"headline\">Notifications</span>\n * <span slot=\"supporting-text\">Manage alerts and reminders</span>\n *\n * <span slot=\"trailing-supporting-text\">3</span>\n * <wc-icon slot=\"end\" name=\"chevron_right\"></wc-icon>\n * </wc-item>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Item extends mixinDelegatesAria(\n mixinElementInternals(LitElement),\n) {\n static styles = [styles];\n\n /**\n * Only needed for SSR.\n *\n * Add this attribute when an item has two lines to avoid a Flash Of Unstyled\n * Content. This attribute is not needed for single line items or items with\n * three or more lines.\n */\n @property({ type: Boolean, reflect: true }) multiline = false;\n\n @queryAll('.text slot') private readonly textSlots!: HTMLSlotElement[];\n\n private __hasNamedSlot(...names: string[]) {\n return names.some(name =>\n Array.from(this.children).some(\n child => child.getAttribute('slot') === name,\n ),\n );\n }\n\n override render() {\n const hasStart = this.__hasNamedSlot('start');\n const hasEnd = this.__hasNamedSlot('end');\n const hasTrailingSupportingText = this.__hasNamedSlot(\n 'trailing-supporting-text',\n );\n\n return html`\n <slot name=\"container\"></slot>\n\n <div class=\"item\">\n <slot class=\"non-text\" name=\"start\" ?hidden=${!hasStart}></slot>\n <div class=\"text\">\n <slot name=\"overline\" @slotchange=${this.handleTextSlotChange}></slot>\n <slot\n class=\"default-slot\"\n @slotchange=${this.handleTextSlotChange}\n ></slot>\n <slot name=\"headline\" @slotchange=${this.handleTextSlotChange}></slot>\n <slot\n name=\"supporting-text\"\n @slotchange=${this.handleTextSlotChange}\n ></slot>\n </div>\n <slot\n class=\"non-text\"\n name=\"trailing-supporting-text\"\n ?hidden=${!hasTrailingSupportingText}\n ></slot>\n <slot class=\"non-text\" name=\"end\" ?hidden=${!hasEnd}></slot>\n </div>\n `;\n }\n\n private handleTextSlotChange() {\n // Check if there's more than one text slot with content. If so, the item is\n // multiline, which has a different min-height than single line items.\n let isMultiline = false;\n let slotsWithContent = 0;\n for (const slot of this.textSlots) {\n if (hasMeaningfulContent(slot)) {\n slotsWithContent += 1;\n }\n\n if (slotsWithContent > 1) {\n isMultiline = true;\n break;\n }\n }\n\n this.multiline = isMultiline;\n }\n}\n"],"names":["t","LitElement","html","styles","property","queryAll"],"mappings":";;;;;;AACA;AACA;AACA;AACA;AACA;AACA,IAAI,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,OAAM,CAAC,CAAC,CAAC,CAAC,GAAGA,GAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,OAAM,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC,sBAAsB,EAAE,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACGrI;;;;;;;;;;;;;;;;;;;;;AAqBG;AAEI,IAAM,IAAI,GAAV,MAAM,IAAK,SAAQ,kBAAkB,CAC1C,qBAAqB,CAACC,GAAU,CAAC,CAClC,CAAA;AAFM,IAAA,WAAA,GAAA;;AAKL;;;;;;AAMG;QACyC,IAAA,CAAA,SAAS,GAAG,KAAK;IAgE/D;IA5DU,cAAc,CAAC,GAAG,KAAe,EAAA;AACvC,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,IACpB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC5B,KAAK,IAAI,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,IAAI,CAC7C,CACF;IACH;IAES,MAAM,GAAA;QACb,MAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC;QAC7C,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC;QACzC,MAAM,yBAAyB,GAAG,IAAI,CAAC,cAAc,CACnD,0BAA0B,CAC3B;AAED,QAAA,OAAOC,CAAI,CAAA;;;;AAIuC,oDAAA,EAAA,CAAC,QAAQ,CAAA;;AAEjB,4CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;AAG7C,wBAAA,EAAA,IAAI,CAAC,oBAAoB;;AAEL,4CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;AAG7C,wBAAA,EAAA,IAAI,CAAC,oBAAoB;;;;;;AAM/B,kBAAA,EAAA,CAAC,yBAAyB;;AAEM,kDAAA,EAAA,CAAC,MAAM,CAAA;;KAEtD;IACH;IAEQ,oBAAoB,GAAA;;;QAG1B,IAAI,WAAW,GAAG,KAAK;QACvB,IAAI,gBAAgB,GAAG,CAAC;AACxB,QAAA,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,SAAS,EAAE;AACjC,YAAA,IAAI,oBAAoB,CAAC,IAAI,CAAC,EAAE;gBAC9B,gBAAgB,IAAI,CAAC;YACvB;AAEA,YAAA,IAAI,gBAAgB,GAAG,CAAC,EAAE;gBACxB,WAAW,GAAG,IAAI;gBAClB;YACF;QACF;AAEA,QAAA,IAAI,CAAC,SAAS,GAAG,WAAW;IAC9B;;AAxEO,IAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AASoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAoB,CAAA,EAAA,IAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAErB,UAAA,CAAA;IAAxCC,CAAQ,CAAC,YAAY;AAAiD,CAAA,EAAA,IAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAd5D,IAAI,GAAA,UAAA,CAAA;IADhB;AACY,CAAA,EAAA,IAAI,CA4EhB;;;;","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"item.js","sources":["../node_modules/@lit/reactive-element/decorators/query-all.js","../../src/item/item.ts"],"sourcesContent":["import{desc as t}from\"./base.js\";\n/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\nlet e;function r(r){return(n,o)=>t(n,o,{get(){return(this.renderRoot??(e??=document.createDocumentFragment())).querySelectorAll(r)}})}export{r as queryAll};\n//# sourceMappingURL=query-all.js.map\n","import { html, LitElement } from 'lit';\nimport { property, queryAll } from 'lit/decorators.js';\nimport styles from './item.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport { mixinDelegatesAria } from '@/__internal/aria/delegate.js';\nimport { mixinElementInternals } from '@/__internal/mixins/element-internals.js';\n\nimport { hasMeaningfulContent } from '@/__internal/utils/observe-slot-change.js';\n\n/**\n * @label Item\n * @tag wc-item\n * @rawTag item\n *\n * @summary A primitive element used to build higher-level item components such as menu-item, navigation-item, and list-item. Provides start, text, and end slots for flexible content composition.\n *\n * @example\n * ```html\n * <wc-item>\n * <wc-icon slot=\"start\" name=\"notifications\"></wc-icon>\n *\n * <span slot=\"headline\">Notifications</span>\n * <span slot=\"supporting-text\">Manage alerts and reminders</span>\n *\n * <span slot=\"trailing-supporting-text\">3</span>\n * <wc-icon slot=\"end\" name=\"chevron_right\"></wc-icon>\n * </wc-item>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Item extends mixinDelegatesAria(\n mixinElementInternals(LitElement),\n) {\n static styles = [styles];\n\n /**\n * Only needed for SSR.\n *\n * Add this attribute when an item has two lines to avoid a Flash Of Unstyled\n * Content. This attribute is not needed for single line items or items with\n * three or more lines.\n */\n @property({ type: Boolean, reflect: true }) multiline = false;\n\n @queryAll('.text slot') private readonly textSlots!: HTMLSlotElement[];\n\n private __hasNamedSlot(...names: string[]) {\n return names.some(name =>\n Array.from(this.children).some(\n child => child.getAttribute('slot') === name,\n ),\n );\n }\n\n override render() {\n const hasStart = this.__hasNamedSlot('start');\n const hasEnd = this.__hasNamedSlot('end');\n const hasTrailingSupportingText = this.__hasNamedSlot(\n 'trailing-supporting-text',\n );\n\n return html`\n <slot name=\"container\"></slot>\n\n <div class=\"item\">\n <slot class=\"non-text\" name=\"start\" ?hidden=${!hasStart}></slot>\n <div class=\"text\">\n <slot name=\"overline\" @slotchange=${this.handleTextSlotChange}></slot>\n <slot\n class=\"default-slot\"\n @slotchange=${this.handleTextSlotChange}\n ></slot>\n <slot name=\"headline\" @slotchange=${this.handleTextSlotChange}></slot>\n <slot\n name=\"supporting-text\"\n @slotchange=${this.handleTextSlotChange}\n ></slot>\n </div>\n <slot\n class=\"non-text\"\n name=\"trailing-supporting-text\"\n ?hidden=${!hasTrailingSupportingText}\n ></slot>\n <slot class=\"non-text\" name=\"end\" ?hidden=${!hasEnd}></slot>\n </div>\n `;\n }\n\n private handleTextSlotChange() {\n // Check if there's more than one text slot with content. If so, the item is\n // multiline, which has a different min-height than single line items.\n let isMultiline = false;\n let slotsWithContent = 0;\n for (const slot of this.textSlots) {\n if (hasMeaningfulContent(slot)) {\n slotsWithContent += 1;\n }\n\n if (slotsWithContent > 1) {\n isMultiline = true;\n break;\n }\n }\n\n this.multiline = isMultiline;\n }\n}\n"],"names":["t","LitElement","html","styles","property","queryAll"],"mappings":";;;;;;AACA;AACA;AACA;AACA;AACA;AACA,IAAI,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,OAAM,CAAC,CAAC,CAAC,CAAC,GAAGA,GAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,OAAM,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC,sBAAsB,EAAE,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACGrI;;;;;;;;;;;;;;;;;;;;AAoBG;AAEI,IAAM,IAAI,GAAV,MAAM,IAAK,SAAQ,kBAAkB,CAC1C,qBAAqB,CAACC,GAAU,CAAC,CAClC,CAAA;AAFM,IAAA,WAAA,GAAA;;AAKL;;;;;;AAMG;QACyC,IAAA,CAAA,SAAS,GAAG,KAAK;IAgE/D;IA5DU,cAAc,CAAC,GAAG,KAAe,EAAA;AACvC,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,IACpB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC5B,KAAK,IAAI,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,IAAI,CAC7C,CACF;IACH;IAES,MAAM,GAAA;QACb,MAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC;QAC7C,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC;QACzC,MAAM,yBAAyB,GAAG,IAAI,CAAC,cAAc,CACnD,0BAA0B,CAC3B;AAED,QAAA,OAAOC,CAAI,CAAA;;;;AAIuC,oDAAA,EAAA,CAAC,QAAQ,CAAA;;AAEjB,4CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;AAG7C,wBAAA,EAAA,IAAI,CAAC,oBAAoB;;AAEL,4CAAA,EAAA,IAAI,CAAC,oBAAoB,CAAA;;;AAG7C,wBAAA,EAAA,IAAI,CAAC,oBAAoB;;;;;;AAM/B,kBAAA,EAAA,CAAC,yBAAyB;;AAEM,kDAAA,EAAA,CAAC,MAAM,CAAA;;KAEtD;IACH;IAEQ,oBAAoB,GAAA;;;QAG1B,IAAI,WAAW,GAAG,KAAK;QACvB,IAAI,gBAAgB,GAAG,CAAC;AACxB,QAAA,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,SAAS,EAAE;AACjC,YAAA,IAAI,oBAAoB,CAAC,IAAI,CAAC,EAAE;gBAC9B,gBAAgB,IAAI,CAAC;YACvB;AAEA,YAAA,IAAI,gBAAgB,GAAG,CAAC,EAAE;gBACxB,WAAW,GAAG,IAAI;gBAClB;YACF;QACF;AAEA,QAAA,IAAI,CAAC,SAAS,GAAG,WAAW;IAC9B;;AAxEO,IAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AASoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAoB,CAAA,EAAA,IAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAErB,UAAA,CAAA;IAAxCC,CAAQ,CAAC,YAAY;AAAiD,CAAA,EAAA,IAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAd5D,IAAI,GAAA,UAAA,CAAA;IADhB;AACY,CAAA,EAAA,IAAI,CA4EhB;;;;","x_google_ignoreList":[0]}
package/dist/link.js CHANGED
@@ -6,6 +6,7 @@ import './property-B49QQ8pS.js';
6
6
 
7
7
  var css_248z = i`* {
8
8
  box-sizing: border-box;
9
+ -webkit-tap-highlight-color: transparent;
9
10
  }
10
11
 
11
12
  .screen-reader-only {
package/dist/link.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"link.js","sources":["../../src/link/link.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport NativeHyperlinkMixin from '@/__internal/mixins/NativeHyperlinkMixin.js';\nimport styles from './link.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Link\n * @tag wc-link\n * @rawTag link\n * @summary The link component is used to navigate to a new page or section within the current page.\n * @cssprop --link-color - Controls the color of the link.\n * @tags navigation\n *\n * @example\n * ```html\n * <wc-link href=\"#\">Link</wc-link>\n * ```\n */\n@IndividualComponent\nexport class Link extends NativeHyperlinkMixin(LitElement) {\n static styles = [styles];\n\n render() {\n return html`<a\n class=${classMap({\n link: true,\n })}\n href=${this.href}\n ?download=${this.download}\n target=${this.target}\n ?rel=${this.rel}\n ?tabindex=${this.parentElement?.tabIndex}\n >\n <slot></slot>\n </a>`;\n }\n}\n"],"names":["LitElement","html","classMap","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AAEI,IAAM,IAAI,GAAV,MAAM,IAAK,SAAQ,oBAAoB,CAACA,GAAU,CAAC,CAAA;IAGxD,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA,CAAA;AACD,YAAA,EAAAC,CAAQ,CAAC;AACf,YAAA,IAAI,EAAE,IAAI;SACX,CAAC;AACK,WAAA,EAAA,IAAI,CAAC,IAAI;AACJ,gBAAA,EAAA,IAAI,CAAC,QAAQ;AAChB,aAAA,EAAA,IAAI,CAAC,MAAM;AACb,WAAA,EAAA,IAAI,CAAC,GAAG;kBACH,IAAI,CAAC,aAAa,EAAE,QAAQ;;;SAGrC;IACP;;AAfO,IAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AADb,IAAI,GAAA,UAAA,CAAA;IADhB;AACY,CAAA,EAAA,IAAI,CAiBhB;;;;"}
1
+ {"version":3,"file":"link.js","sources":["../../src/link/link.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport NativeHyperlinkMixin from '@/__internal/mixins/NativeHyperlinkMixin.js';\nimport styles from './link.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Link\n * @tag wc-link\n * @rawTag link\n * @summary The link component is used to navigate to a new page or section within the current page.\n * @cssprop --link-color - Controls the color of the link.\n * @tags navigation\n *\n * @example\n * ```html\n * <wc-link href=\"#\">Link</wc-link>\n * ```\n */\n@IndividualComponent\nexport class Link extends NativeHyperlinkMixin(LitElement) {\n static styles = [styles];\n\n render() {\n return html`<a\n class=${classMap({\n link: true,\n })}\n href=${this.href}\n ?download=${this.download}\n target=${this.target}\n ?rel=${this.rel}\n ?tabindex=${this.parentElement?.tabIndex}\n >\n <slot></slot>\n </a>`;\n }\n}\n"],"names":["LitElement","html","classMap","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AAEI,IAAM,IAAI,GAAV,MAAM,IAAK,SAAQ,oBAAoB,CAACA,GAAU,CAAC,CAAA;IAGxD,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA,CAAA;AACD,YAAA,EAAAC,CAAQ,CAAC;AACf,YAAA,IAAI,EAAE,IAAI;SACX,CAAC;AACK,WAAA,EAAA,IAAI,CAAC,IAAI;AACJ,gBAAA,EAAA,IAAI,CAAC,QAAQ;AAChB,aAAA,EAAA,IAAI,CAAC,MAAM;AACb,WAAA,EAAA,IAAI,CAAC,GAAG;kBACH,IAAI,CAAC,aAAa,EAAE,QAAQ;;;SAGrC;IACP;;AAfO,IAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AADb,IAAI,GAAA,UAAA,CAAA;IADhB;AACY,CAAA,EAAA,IAAI,CAiBhB;;;;"}
@@ -1,8 +1,8 @@
1
1
  import { i, a as i$1, A, b, _ as __decorate, I as IndividualComponent } from './IndividualComponent-Bdwyrvd6.js';
2
2
  import { n } from './property-B49QQ8pS.js';
3
+ import { r } from './state-DkTK9EGF.js';
3
4
  import { e } from './class-map-DG7CA1et.js';
4
5
  import { e as e$1 } from './query-CHb9Ft_d.js';
5
- import { o } from './if-defined-BXZpRQ4P.js';
6
6
  import { i as isLink } from './is-link-Dk2OV3PM.js';
7
7
  import { i as isActivationClick, d as dispatchActivationClick } from './dispatch-event-utils-CuEqjlPT.js';
8
8
  import { m as mixinBaseButton, a as mixinHyperlink } from './hyperlink-DLvb6MXE.js';
@@ -10,6 +10,7 @@ import { m as mixinDelegatesAria, a as mixinElementInternals } from './element-i
10
10
 
11
11
  var css_248z$1 = i`* {
12
12
  box-sizing: border-box;
13
+ -webkit-tap-highlight-color: transparent;
13
14
  }
14
15
 
15
16
  .screen-reader-only {
@@ -31,6 +32,7 @@ var css_248z$1 = i`* {
31
32
 
32
33
  var css_248z = i`* {
33
34
  box-sizing: border-box;
35
+ -webkit-tap-highlight-color: transparent;
34
36
  }
35
37
 
36
38
  .screen-reader-only {
@@ -61,6 +63,7 @@ var css_248z = i`* {
61
63
  text-decoration: none;
62
64
  color: inherit;
63
65
  cursor: pointer;
66
+ outline: none;
64
67
  }
65
68
  .native-link:link, .native-link:visited, .native-link:hover, .native-link:active {
66
69
  text-decoration: none;
@@ -70,7 +73,6 @@ var css_248z = i`* {
70
73
  .list-item {
71
74
  position: relative;
72
75
  width: 100%;
73
- cursor: pointer;
74
76
  text-align: start;
75
77
  }
76
78
  .list-item .list-item-content {
@@ -122,6 +124,11 @@ var css_248z = i`* {
122
124
  --skeleton-container-shape-end-end: var(--shape-corner-medium);
123
125
  }
124
126
 
127
+ :host([actionable]:not([disabled]):not([soft-disabled])),
128
+ :host([href]:not([disabled]):not([soft-disabled])) {
129
+ cursor: pointer;
130
+ }
131
+
125
132
  :host(:not([skeleton])) .skeleton {
126
133
  display: none;
127
134
  }
@@ -178,6 +185,7 @@ class ListItem extends mixinBaseButton(mixinHyperlink(mixinDelegatesAria(mixinEl
178
185
  this.selected = false;
179
186
  /** When true, renders the list-item in a loading skeleton state. */
180
187
  this.skeleton = false;
188
+ this.actionable = false;
181
189
  this.__dispatchClick = (event) => {
182
190
  // If the button is soft-disabled or a disabled link, we need to explicitly
183
191
  // prevent the click from propagating to other event listeners as well as
@@ -211,8 +219,12 @@ class ListItem extends mixinBaseButton(mixinHyperlink(mixinDelegatesAria(mixinEl
211
219
  __hasNamedSlot(...names) {
212
220
  return names.some(name => Array.from(this.children).some(child => child.getAttribute('slot') === name));
213
221
  }
222
+ isClickable() {
223
+ return this.actionable || isLink(this);
224
+ }
214
225
  render() {
215
226
  const isElementLink = isLink(this);
227
+ const clickable = this.isClickable();
216
228
  const cssClasses = {
217
229
  'list-item': true,
218
230
  'native-button': !isElementLink,
@@ -220,6 +232,17 @@ class ListItem extends mixinBaseButton(mixinHyperlink(mixinDelegatesAria(mixinEl
220
232
  };
221
233
  // Needed for closure conformance
222
234
  const { ariaLabel } = this;
235
+ if (!clickable) {
236
+ return b `
237
+ <div
238
+ id="list-item"
239
+ class=${e(cssClasses)}
240
+ aria-label="${ariaLabel || A}"
241
+ >
242
+ ${this.renderContent(clickable)}
243
+ </div>
244
+ `;
245
+ }
223
246
  if (!isElementLink) {
224
247
  return b `
225
248
  <button
@@ -230,7 +253,7 @@ class ListItem extends mixinBaseButton(mixinHyperlink(mixinDelegatesAria(mixinEl
230
253
  ?aria-disabled=${this.softDisabled}
231
254
  @click=${this.__dispatchClick}
232
255
  >
233
- ${this.renderContent()}
256
+ ${this.renderContent(clickable)}
234
257
  </button>
235
258
  `;
236
259
  }
@@ -240,30 +263,36 @@ class ListItem extends mixinBaseButton(mixinHyperlink(mixinDelegatesAria(mixinEl
240
263
  class=${e(cssClasses)}
241
264
  href=${this.href}
242
265
  target=${this.target}
243
- rel=${o(this.rel)}
244
- download=${o(this.download)}
266
+ ?rel=${this.rel}
267
+ ?download=${this.download}
245
268
  tabindex=${this.disabled ? '-1' : '0'}
246
269
  aria-disabled=${String(this.disabled || this.softDisabled)}
247
270
  @click=${this.__dispatchClick}
248
271
  >
249
- ${this.renderContent()}
272
+ ${this.renderContent(clickable)}
250
273
  </a>
251
274
  `;
252
275
  }
253
- renderContent() {
276
+ renderContent(clickable) {
254
277
  const hasLeading = this.__hasNamedSlot('leading');
255
278
  const hasTrailingSupportingText = this.__hasNamedSlot('trailing-supporting-text');
256
279
  const hasTrailing = this.__hasNamedSlot('trailing');
257
280
  return b `
258
- <wc-item class="list-item-content">
259
- <wc-focus-ring
260
- class="focus-ring"
261
- for="list-item"
262
- slot="container"
263
- ></wc-focus-ring>
264
- <div class="background" slot="container"></div>
265
- <wc-ripple class="ripple" for="list-item" slot="container"></wc-ripple>
266
- <wc-skeleton class="skeleton" slot="container"></wc-skeleton>
281
+ <wc-item class="list-item-content" ?inert=${clickable}>
282
+ ${clickable
283
+ ? b `<wc-focus-ring
284
+ class="focus-ring"
285
+ for="list-item"
286
+ slot="container"
287
+ ></wc-focus-ring>
288
+ <div class="background" slot="container"></div>
289
+ <wc-ripple
290
+ class="ripple"
291
+ for="list-item"
292
+ slot="container"
293
+ ></wc-ripple>
294
+ <wc-skeleton class="skeleton" slot="container"></wc-skeleton> `
295
+ : null}
267
296
 
268
297
  <slot name="leading" slot="start" ?hidden=${!hasLeading}></slot>
269
298
  <slot name="overline" slot="overline"></slot>
@@ -294,10 +323,14 @@ __decorate([
294
323
  __decorate([
295
324
  n({ type: Boolean, reflect: true })
296
325
  ], ListItem.prototype, "skeleton", void 0);
326
+ __decorate([
327
+ n({ type: Boolean, reflect: true })
328
+ ], ListItem.prototype, "actionable", void 0);
297
329
  __decorate([
298
330
  e$1('#list-item')
299
331
  ], ListItem.prototype, "itemElement", void 0);
300
332
 
333
+ var List_1;
301
334
  /**
302
335
  * @label List
303
336
  * @tag wc-list
@@ -313,19 +346,159 @@ __decorate([
313
346
  * Inbox
314
347
  * <span slot="trailing">24</span>
315
348
  * </wc-list-item>
349
+ * <wc-list-item>
350
+ * <wc-avatar slot="leading" name="Shivaji Varma"></wc-avatar>
351
+ * Shivaji Varma
352
+ * <span slot="supporting-text">Software Engineer</span>
353
+ * <span slot="trailing-supporting-text">7</span>
354
+ * <wc-icon slot="trailing" name="chevron_right"></wc-icon>
355
+ * </wc-list-item>
316
356
  * </wc-list>
317
357
  * ```
318
358
  * @tags display
319
359
  */
320
- let List = class List extends i$1 {
360
+ let List = List_1 = class List extends i$1 {
321
361
  constructor() {
322
362
  super(...arguments);
323
363
  /** */
324
364
  this.variant = 'standard';
365
+ /** Index of the currently active item within the clickable items list. */
366
+ this.activeIndex = -1;
367
+ // ── Handlers ──────────────────────────────────────────────────────────────
368
+ this._onKeyDown = (event) => {
369
+ if (!this._isEventFromThisList(event))
370
+ return;
371
+ const eventItem = this._clickableItemFromEvent(event);
372
+ if (eventItem) {
373
+ this._setActiveItem(eventItem);
374
+ }
375
+ switch (event.key) {
376
+ case 'ArrowDown':
377
+ event.preventDefault();
378
+ this._setActiveByOffset(1);
379
+ break;
380
+ case 'ArrowUp':
381
+ event.preventDefault();
382
+ this._setActiveByOffset(-1);
383
+ break;
384
+ case 'Home':
385
+ event.preventDefault();
386
+ this._setBoundaryActive(0);
387
+ break;
388
+ case 'End':
389
+ event.preventDefault();
390
+ this._setBoundaryActive(Math.max(this._clickableItems().length - 1, 0));
391
+ break;
392
+ }
393
+ };
394
+ this._onClick = (event) => {
395
+ const item = this._clickableItemFromEvent(event);
396
+ if (!item)
397
+ return;
398
+ this._setActiveItem(item);
399
+ };
400
+ this._onSlotChange = () => {
401
+ this._syncRovingTabIndex();
402
+ };
325
403
  }
326
404
  connectedCallback() {
327
405
  super.connectedCallback();
328
406
  this.setAttribute('role', 'list');
407
+ this.addEventListener('keydown', this._onKeyDown);
408
+ this.addEventListener('click', this._onClick);
409
+ }
410
+ disconnectedCallback() {
411
+ this.removeEventListener('keydown', this._onKeyDown);
412
+ this.removeEventListener('click', this._onClick);
413
+ super.disconnectedCallback();
414
+ }
415
+ focus() {
416
+ const target = this._getActiveItem() ?? this._getFirstClickableItem();
417
+ target?.focus();
418
+ }
419
+ // ── Items ─────────────────────────────────────────────────────────────────
420
+ get items() {
421
+ const slot = this.shadowRoot?.querySelector('slot');
422
+ const elements = slot?.assignedElements({ flatten: true }) ?? [];
423
+ return elements.filter(el => el instanceof ListItem);
424
+ }
425
+ _clickableItems() {
426
+ return this.items.filter(item => item.isClickable());
427
+ }
428
+ // ── Roving tabindex ───────────────────────────────────────────────────────
429
+ _syncRovingTabIndex() {
430
+ const allItems = this.items;
431
+ const clickable = this._clickableItems();
432
+ for (const item of allItems) {
433
+ item.tabIndex = -1;
434
+ }
435
+ if (!clickable.length) {
436
+ this.activeIndex = -1;
437
+ return;
438
+ }
439
+ if (this.activeIndex < 0 || this.activeIndex >= clickable.length) {
440
+ this.activeIndex = 0;
441
+ }
442
+ clickable[this.activeIndex].tabIndex = 0;
443
+ }
444
+ _setActiveByOffset(offset) {
445
+ const clickable = this._clickableItems();
446
+ if (!clickable.length)
447
+ return;
448
+ if (this.activeIndex < 0) {
449
+ this.activeIndex = 0;
450
+ }
451
+ else {
452
+ const count = clickable.length;
453
+ this.activeIndex = (this.activeIndex + offset + count) % count;
454
+ }
455
+ this._syncRovingTabIndex();
456
+ clickable[this.activeIndex]?.focus();
457
+ }
458
+ _setBoundaryActive(index) {
459
+ const clickable = this._clickableItems();
460
+ if (!clickable.length)
461
+ return;
462
+ this.activeIndex = index;
463
+ this._syncRovingTabIndex();
464
+ clickable[this.activeIndex]?.focus();
465
+ }
466
+ _getActiveItem() {
467
+ const clickable = this._clickableItems();
468
+ if (!clickable.length || this.activeIndex < 0)
469
+ return null;
470
+ return clickable[this.activeIndex] ?? null;
471
+ }
472
+ _getFirstClickableItem() {
473
+ return this._clickableItems()[0] ?? null;
474
+ }
475
+ // ── Event helpers ─────────────────────────────────────────────────────────
476
+ _isEventFromThisList(event) {
477
+ const path = event.composedPath();
478
+ const sourceList = path.find(target => target instanceof List_1);
479
+ return sourceList === this;
480
+ }
481
+ _clickableItemFromEvent(event) {
482
+ if (!this._isEventFromThisList(event))
483
+ return null;
484
+ const path = event.composedPath();
485
+ const clickable = this._clickableItems();
486
+ for (const target of path) {
487
+ if (target instanceof ListItem) {
488
+ const owned = clickable.find(item => item === target);
489
+ if (owned)
490
+ return owned;
491
+ }
492
+ }
493
+ return null;
494
+ }
495
+ _setActiveItem(item) {
496
+ const clickable = this._clickableItems();
497
+ const nextIndex = clickable.indexOf(item);
498
+ if (nextIndex < 0)
499
+ return;
500
+ this.activeIndex = nextIndex;
501
+ this._syncRovingTabIndex();
329
502
  }
330
503
  render() {
331
504
  const cssClasses = {
@@ -334,7 +507,7 @@ let List = class List extends i$1 {
334
507
  };
335
508
  return b `
336
509
  <div class=${e(cssClasses)}>
337
- <slot></slot>
510
+ <slot @slotchange=${this._onSlotChange}></slot>
338
511
  </div>
339
512
  `;
340
513
  }
@@ -344,9 +517,12 @@ List.Item = ListItem;
344
517
  __decorate([
345
518
  n({ type: String, reflect: true })
346
519
  ], List.prototype, "variant", void 0);
347
- List = __decorate([
520
+ __decorate([
521
+ r()
522
+ ], List.prototype, "activeIndex", void 0);
523
+ List = List_1 = __decorate([
348
524
  IndividualComponent
349
525
  ], List);
350
526
 
351
527
  export { List as L, ListItem as a };
352
- //# sourceMappingURL=list-D6JLh1uh.js.map
528
+ //# sourceMappingURL=list-BBmnHm8f.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"list-BBmnHm8f.js","sources":["../../src/list/list-item.ts","../../src/list/list.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport styles from './list-item.scss';\nimport { isLink } from '@/__internal/utils/is-link.js';\nimport {\n dispatchActivationClick,\n isActivationClick,\n} from '@/__internal/utils/dispatch-event-utils.js';\nimport { ARIAMixinStrict } from '@/__internal/aria/aria.js';\nimport { mixinBaseButton } from '@/button/base-button/base-button.js';\nimport { mixinHyperlink } from '@/__internal/mixins/hyperlink.js';\nimport { mixinDelegatesAria } from '@/__internal/aria/delegate.js';\nimport { mixinElementInternals } from '@/__internal/mixins/element-internals.js';\n\n/**\n * @label List Item\n * @tag wc-list-item\n * @rawTag list-item\n *\n * @summary A list item with leading, trailing and content slots.\n *\n * @example\n * ```html\n * <wc-list-item selected>\n * <wc-icon slot=\"leading\" name=\"person\"></wc-icon>\n * Profile\n * <wc-icon slot=\"trailing\" name=\"chevron_right\"></wc-icon>\n * </wc-list-item>\n * ```\n * @tags display\n */\nexport class ListItem extends mixinBaseButton(\n mixinHyperlink(mixinDelegatesAria(mixinElementInternals(LitElement))),\n) {\n // ── Static ───────────────────────────────────────────────────────────────\n\n /** @nocollapse */ // eslint-disable-next-line\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n };\n\n static styles = [styles];\n\n @property({ type: Boolean, reflect: true }) selected = false;\n\n /** When true, renders the list-item in a loading skeleton state. */\n @property({ type: Boolean, reflect: true }) skeleton: boolean = false;\n\n @property({ type: Boolean, reflect: true })\n actionable: boolean = false;\n\n @query('#list-item') readonly itemElement!: HTMLElement | null;\n\n constructor() {\n super();\n this.addEventListener('click', this.__dispatchClickWithThrottle);\n }\n\n connectedCallback() {\n // eslint-disable-next-line wc/guard-super-call\n super.connectedCallback();\n\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'listitem');\n }\n }\n\n override focus() {\n this.itemElement?.focus();\n }\n\n override blur() {\n this.itemElement?.blur();\n }\n\n __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n // If the button is soft-disabled or a disabled link, we need to explicitly\n // prevent the click from propagating to other event listeners as well as\n // prevent the default action.\n if (this.softDisabled || (this.disabled && this.href) || this.skeleton) {\n event.stopImmediatePropagation();\n event.preventDefault();\n return;\n }\n\n if (!isActivationClick(event) || !this.itemElement) {\n return;\n }\n\n this.focus();\n dispatchActivationClick(this.itemElement);\n };\n\n private __hasNamedSlot(...names: string[]) {\n return names.some(name =>\n Array.from(this.children).some(\n child => child.getAttribute('slot') === name,\n ),\n );\n }\n\n isClickable() {\n return this.actionable || isLink(this);\n }\n\n render() {\n const isElementLink = isLink(this);\n const clickable = this.isClickable();\n\n const cssClasses = {\n 'list-item': true,\n 'native-button': !isElementLink,\n 'native-link': isElementLink,\n };\n\n // Needed for closure conformance\n const { ariaLabel } = this as ARIAMixinStrict;\n\n if (!clickable) {\n return html`\n <div\n id=\"list-item\"\n class=${classMap(cssClasses)}\n aria-label=\"${ariaLabel || nothing}\"\n >\n ${this.renderContent(clickable)}\n </div>\n `;\n }\n\n if (!isElementLink) {\n return html`\n <button\n id=\"list-item\"\n class=${classMap(cssClasses)}\n ?disabled=${this.disabled}\n aria-label=\"${ariaLabel || nothing}\"\n ?aria-disabled=${this.softDisabled}\n @click=${this.__dispatchClick}\n >\n ${this.renderContent(clickable)}\n </button>\n `;\n }\n\n return html`\n <a\n id=\"list-item\"\n class=${classMap(cssClasses)}\n href=${this.href}\n target=${this.target}\n ?rel=${this.rel}\n ?download=${this.download}\n tabindex=${this.disabled ? '-1' : '0'}\n aria-disabled=${String(this.disabled || this.softDisabled)}\n @click=${this.__dispatchClick}\n >\n ${this.renderContent(clickable)}\n </a>\n `;\n }\n\n renderContent(clickable: boolean) {\n const hasLeading = this.__hasNamedSlot('leading');\n const hasTrailingSupportingText = this.__hasNamedSlot(\n 'trailing-supporting-text',\n );\n const hasTrailing = this.__hasNamedSlot('trailing');\n\n return html`\n <wc-item class=\"list-item-content\" ?inert=${clickable}>\n ${clickable\n ? html`<wc-focus-ring\n class=\"focus-ring\"\n for=\"list-item\"\n slot=\"container\"\n ></wc-focus-ring>\n <div class=\"background\" slot=\"container\"></div>\n <wc-ripple\n class=\"ripple\"\n for=\"list-item\"\n slot=\"container\"\n ></wc-ripple>\n <wc-skeleton class=\"skeleton\" slot=\"container\"></wc-skeleton> `\n : null}\n\n <slot name=\"leading\" slot=\"start\" ?hidden=${!hasLeading}></slot>\n <slot name=\"overline\" slot=\"overline\"></slot>\n <slot name=\"headline\" slot=\"headline\"></slot>\n <slot></slot>\n <slot name=\"supporting-text\" slot=\"supporting-text\"></slot>\n\n <slot\n name=\"trailing-supporting-text\"\n slot=\"trailing-supporting-text\"\n ?hidden=${!hasTrailingSupportingText}\n ></slot>\n <slot name=\"trailing\" slot=\"end\" ?hidden=${!hasTrailing}></slot>\n </wc-item>\n `;\n }\n}\n","import { LitElement, html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './list.scss';\nimport { ListItem } from './list-item.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label List\n * @tag wc-list\n * @rawTag list\n *\n * @summary A list container for one or more list items.\n *\n * @example\n * ```html\n * <wc-list>\n * <wc-list-item>\n * <wc-icon slot=\"leading\" name=\"inbox\"></wc-icon>\n * Inbox\n * <span slot=\"trailing\">24</span>\n * </wc-list-item>\n * <wc-list-item>\n * <wc-avatar slot=\"leading\" name=\"Shivaji Varma\"></wc-avatar>\n * Shivaji Varma\n * <span slot=\"supporting-text\">Software Engineer</span>\n * <span slot=\"trailing-supporting-text\">7</span>\n * <wc-icon slot=\"trailing\" name=\"chevron_right\"></wc-icon>\n * </wc-list-item>\n * </wc-list>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class List extends LitElement {\n static styles = [styles];\n\n static Item = ListItem;\n\n /** */\n @property({ type: String, reflect: true }) variant: 'standard' | 'segmented' =\n 'standard';\n\n /** Index of the currently active item within the clickable items list. */\n @state() private activeIndex = -1;\n\n connectedCallback() {\n super.connectedCallback();\n this.setAttribute('role', 'list');\n this.addEventListener('keydown', this._onKeyDown);\n this.addEventListener('click', this._onClick);\n }\n\n disconnectedCallback() {\n this.removeEventListener('keydown', this._onKeyDown);\n this.removeEventListener('click', this._onClick);\n super.disconnectedCallback();\n }\n\n override focus() {\n const target = this._getActiveItem() ?? this._getFirstClickableItem();\n target?.focus();\n }\n\n // ── Items ─────────────────────────────────────────────────────────────────\n\n get items(): ListItem[] {\n const slot = this.shadowRoot?.querySelector('slot');\n const elements = slot?.assignedElements({ flatten: true }) ?? [];\n return elements.filter(el => el instanceof ListItem) as ListItem[];\n }\n\n private _clickableItems() {\n return this.items.filter(item => item.isClickable());\n }\n\n // ── Roving tabindex ───────────────────────────────────────────────────────\n\n private _syncRovingTabIndex() {\n const allItems = this.items;\n const clickable = this._clickableItems();\n\n for (const item of allItems) {\n item.tabIndex = -1;\n }\n\n if (!clickable.length) {\n this.activeIndex = -1;\n return;\n }\n\n if (this.activeIndex < 0 || this.activeIndex >= clickable.length) {\n this.activeIndex = 0;\n }\n\n clickable[this.activeIndex].tabIndex = 0;\n }\n\n private _setActiveByOffset(offset: 1 | -1) {\n const clickable = this._clickableItems();\n if (!clickable.length) return;\n\n if (this.activeIndex < 0) {\n this.activeIndex = 0;\n } else {\n const count = clickable.length;\n this.activeIndex = (this.activeIndex + offset + count) % count;\n }\n\n this._syncRovingTabIndex();\n clickable[this.activeIndex]?.focus();\n }\n\n private _setBoundaryActive(index: number) {\n const clickable = this._clickableItems();\n if (!clickable.length) return;\n\n this.activeIndex = index;\n this._syncRovingTabIndex();\n clickable[this.activeIndex]?.focus();\n }\n\n private _getActiveItem() {\n const clickable = this._clickableItems();\n if (!clickable.length || this.activeIndex < 0) return null;\n return clickable[this.activeIndex] ?? null;\n }\n\n private _getFirstClickableItem() {\n return this._clickableItems()[0] ?? null;\n }\n\n // ── Event helpers ─────────────────────────────────────────────────────────\n\n private _isEventFromThisList(event: Event) {\n const path = event.composedPath();\n const sourceList = path.find(target => target instanceof List);\n return sourceList === this;\n }\n\n private _clickableItemFromEvent(event: Event) {\n if (!this._isEventFromThisList(event)) return null;\n const path = event.composedPath();\n const clickable = this._clickableItems();\n for (const target of path) {\n if (target instanceof ListItem) {\n const owned = clickable.find(item => item === target);\n if (owned) return owned;\n }\n }\n return null;\n }\n\n private _setActiveItem(item: ListItem) {\n const clickable = this._clickableItems();\n const nextIndex = clickable.indexOf(item);\n if (nextIndex < 0) return;\n this.activeIndex = nextIndex;\n this._syncRovingTabIndex();\n }\n\n // ── Handlers ──────────────────────────────────────────────────────────────\n\n private _onKeyDown = (event: KeyboardEvent) => {\n if (!this._isEventFromThisList(event)) return;\n\n const eventItem = this._clickableItemFromEvent(event);\n if (eventItem) {\n this._setActiveItem(eventItem);\n }\n\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this._setActiveByOffset(1);\n break;\n case 'ArrowUp':\n event.preventDefault();\n this._setActiveByOffset(-1);\n break;\n case 'Home':\n event.preventDefault();\n this._setBoundaryActive(0);\n break;\n case 'End':\n event.preventDefault();\n this._setBoundaryActive(Math.max(this._clickableItems().length - 1, 0));\n break;\n default:\n break;\n }\n };\n\n private _onClick = (event: Event) => {\n const item = this._clickableItemFromEvent(event);\n if (!item) return;\n this._setActiveItem(item);\n };\n\n private _onSlotChange = () => {\n this._syncRovingTabIndex();\n };\n\n render() {\n const cssClasses = {\n list: true,\n [`variant-${this.variant}`]: true,\n };\n\n return html`\n <div class=${classMap(cssClasses)}>\n <slot @slotchange=${this._onSlotChange}></slot>\n </div>\n `;\n }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property","query","state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA;;;;;;;;;;;;;;;;AAgBG;AACG,MAAO,QAAS,SAAQ,eAAe,CAC3C,cAAc,CAAC,kBAAkB,CAAC,qBAAqB,CAACA,GAAU,CAAC,CAAC,CAAC,CACtE,CAAA;AAqBC,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;QAXmC,IAAA,CAAA,QAAQ,GAAG,KAAK;;QAGhB,IAAA,CAAA,QAAQ,GAAY,KAAK;QAGrE,IAAA,CAAA,UAAU,GAAY,KAAK;AA0B3B,QAAA,IAAA,CAAA,eAAe,GAAG,CAAC,KAAiC,KAAI;;;;AAItD,YAAA,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACtE,KAAK,CAAC,wBAAwB,EAAE;gBAChC,KAAK,CAAC,cAAc,EAAE;gBACtB;YACF;YAEA,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;gBAClD;YACF;YAEA,IAAI,CAAC,KAAK,EAAE;AACZ,YAAA,uBAAuB,CAAC,IAAI,CAAC,WAAW,CAAC;AAC3C,QAAA,CAAC;QApCC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,2BAA2B,CAAC;IAClE;IAEA,iBAAiB,GAAA;;QAEf,KAAK,CAAC,iBAAiB,EAAE;QAEzB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;AAC9B,YAAA,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC;QACvC;IACF;IAES,KAAK,GAAA;AACZ,QAAA,IAAI,CAAC,WAAW,EAAE,KAAK,EAAE;IAC3B;IAES,IAAI,GAAA;AACX,QAAA,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE;IAC1B;IAoBQ,cAAc,CAAC,GAAG,KAAe,EAAA;AACvC,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,IACpB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC5B,KAAK,IAAI,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,IAAI,CAC7C,CACF;IACH;IAEA,WAAW,GAAA;QACT,OAAO,IAAI,CAAC,UAAU,IAAI,MAAM,CAAC,IAAI,CAAC;IACxC;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC;AAClC,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,EAAE;AAEpC,QAAA,MAAM,UAAU,GAAG;AACjB,YAAA,WAAW,EAAE,IAAI;YACjB,eAAe,EAAE,CAAC,aAAa;AAC/B,YAAA,aAAa,EAAE,aAAa;SAC7B;;AAGD,QAAA,MAAM,EAAE,SAAS,EAAE,GAAG,IAAuB;QAE7C,IAAI,CAAC,SAAS,EAAE;AACd,YAAA,OAAOC,CAAI,CAAA;;;kBAGCC,CAAQ,CAAC,UAAU,CAAC;AACd,sBAAA,EAAA,SAAS,IAAIC,CAAO,CAAA;;AAEhC,UAAA,EAAA,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC;;OAElC;QACH;QAEA,IAAI,CAAC,aAAa,EAAE;AAClB,YAAA,OAAOF,CAAI,CAAA;;;kBAGCC,CAAQ,CAAC,UAAU,CAAC;AAChB,oBAAA,EAAA,IAAI,CAAC,QAAQ;AACX,sBAAA,EAAA,SAAS,IAAIC,CAAO,CAAA;AACjB,yBAAA,EAAA,IAAI,CAAC,YAAY;AACzB,iBAAA,EAAA,IAAI,CAAC,eAAe;;AAE3B,UAAA,EAAA,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC;;OAElC;QACH;AAEA,QAAA,OAAOF,CAAI,CAAA;;;gBAGCC,CAAQ,CAAC,UAAU,CAAC;AACrB,aAAA,EAAA,IAAI,CAAC,IAAI;AACP,eAAA,EAAA,IAAI,CAAC,MAAM;AACb,aAAA,EAAA,IAAI,CAAC,GAAG;AACH,kBAAA,EAAA,IAAI,CAAC,QAAQ;mBACd,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,GAAG;wBACrB,MAAM,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,CAAC;AACjD,eAAA,EAAA,IAAI,CAAC,eAAe;;AAE3B,QAAA,EAAA,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC;;KAElC;IACH;AAEA,IAAA,aAAa,CAAC,SAAkB,EAAA;QAC9B,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC;QACjD,MAAM,yBAAyB,GAAG,IAAI,CAAC,cAAc,CACnD,0BAA0B,CAC3B;QACD,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;AAEnD,QAAA,OAAOD,CAAI,CAAA;kDACmC,SAAS,CAAA;UACjD;cACEA,CAAI,CAAA,CAAA;;;;;;;;;;;AAW6D,4EAAA;AACnE,cAAE,IAAI;;AAEoC,kDAAA,EAAA,CAAC,UAAU,CAAA;;;;;;;;;AAS3C,kBAAA,EAAA,CAAC,yBAAyB;;AAEK,iDAAA,EAAA,CAAC,WAAW,CAAA;;KAE1D;IACH;;AAvKA;AAEA;AACgB,QAAA,CAAA,iBAAiB,GAAmB;AAClD,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,cAAc,EAAE,IAAI;AACrB,CAHgC;AAK1B,QAAA,CAAA,MAAM,GAAG,CAACG,QAAM,CAAC;AAEoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAmB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAGjB,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAA4B,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAGtE,UAAA,CAAA;IADCA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AACd,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAEE,UAAA,CAAA;IAA7BC,GAAK,CAAC,YAAY;AAA4C,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;;;AC/CjE;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;AAEI,IAAM,IAAI,GAAA,MAAA,GAAV,MAAM,IAAK,SAAQN,GAAU,CAAA;AAA7B,IAAA,WAAA,GAAA;;;QAMsC,IAAA,CAAA,OAAO,GAChD,UAAU;;QAGK,IAAA,CAAA,WAAW,GAAG,EAAE;;AAuHzB,QAAA,IAAA,CAAA,UAAU,GAAG,CAAC,KAAoB,KAAI;AAC5C,YAAA,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC;gBAAE;YAEvC,MAAM,SAAS,GAAG,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC;YACrD,IAAI,SAAS,EAAE;AACb,gBAAA,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC;YAChC;AAEA,YAAA,QAAQ,KAAK,CAAC,GAAG;AACf,gBAAA,KAAK,WAAW;oBACd,KAAK,CAAC,cAAc,EAAE;AACtB,oBAAA,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;oBAC1B;AACF,gBAAA,KAAK,SAAS;oBACZ,KAAK,CAAC,cAAc,EAAE;AACtB,oBAAA,IAAI,CAAC,kBAAkB,CAAC,EAAE,CAAC;oBAC3B;AACF,gBAAA,KAAK,MAAM;oBACT,KAAK,CAAC,cAAc,EAAE;AACtB,oBAAA,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;oBAC1B;AACF,gBAAA,KAAK,KAAK;oBACR,KAAK,CAAC,cAAc,EAAE;AACtB,oBAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;oBACvE;;AAIN,QAAA,CAAC;AAEO,QAAA,IAAA,CAAA,QAAQ,GAAG,CAAC,KAAY,KAAI;YAClC,MAAM,IAAI,GAAG,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC;AAChD,YAAA,IAAI,CAAC,IAAI;gBAAE;AACX,YAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;AAC3B,QAAA,CAAC;QAEO,IAAA,CAAA,aAAa,GAAG,MAAK;YAC3B,IAAI,CAAC,mBAAmB,EAAE;AAC5B,QAAA,CAAC;IAcH;IAzKE,iBAAiB,GAAA;QACf,KAAK,CAAC,iBAAiB,EAAE;AACzB,QAAA,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC;QACjC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,UAAU,CAAC;QACjD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC;IAC/C;IAEA,oBAAoB,GAAA;QAClB,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,UAAU,CAAC;QACpD,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC;QAChD,KAAK,CAAC,oBAAoB,EAAE;IAC9B;IAES,KAAK,GAAA;QACZ,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,EAAE,IAAI,IAAI,CAAC,sBAAsB,EAAE;QACrE,MAAM,EAAE,KAAK,EAAE;IACjB;;AAIA,IAAA,IAAI,KAAK,GAAA;QACP,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC;AACnD,QAAA,MAAM,QAAQ,GAAG,IAAI,EAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,IAAI,EAAE;AAChE,QAAA,OAAO,QAAQ,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,YAAY,QAAQ,CAAe;IACpE;IAEQ,eAAe,GAAA;AACrB,QAAA,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;IACtD;;IAIQ,mBAAmB,GAAA;AACzB,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK;AAC3B,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE;AAExC,QAAA,KAAK,MAAM,IAAI,IAAI,QAAQ,EAAE;AAC3B,YAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;QACpB;AAEA,QAAA,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE;AACrB,YAAA,IAAI,CAAC,WAAW,GAAG,EAAE;YACrB;QACF;AAEA,QAAA,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,IAAI,SAAS,CAAC,MAAM,EAAE;AAChE,YAAA,IAAI,CAAC,WAAW,GAAG,CAAC;QACtB;QAEA,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,QAAQ,GAAG,CAAC;IAC1C;AAEQ,IAAA,kBAAkB,CAAC,MAAc,EAAA;AACvC,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE;QACxC,IAAI,CAAC,SAAS,CAAC,MAAM;YAAE;AAEvB,QAAA,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC,EAAE;AACxB,YAAA,IAAI,CAAC,WAAW,GAAG,CAAC;QACtB;aAAO;AACL,YAAA,MAAM,KAAK,GAAG,SAAS,CAAC,MAAM;AAC9B,YAAA,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,WAAW,GAAG,MAAM,GAAG,KAAK,IAAI,KAAK;QAChE;QAEA,IAAI,CAAC,mBAAmB,EAAE;QAC1B,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE;IACtC;AAEQ,IAAA,kBAAkB,CAAC,KAAa,EAAA;AACtC,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE;QACxC,IAAI,CAAC,SAAS,CAAC,MAAM;YAAE;AAEvB,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;QACxB,IAAI,CAAC,mBAAmB,EAAE;QAC1B,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE;IACtC;IAEQ,cAAc,GAAA;AACpB,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE;QACxC,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC;AAAE,YAAA,OAAO,IAAI;QAC1D,OAAO,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,IAAI;IAC5C;IAEQ,sBAAsB,GAAA;QAC5B,OAAO,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI;IAC1C;;AAIQ,IAAA,oBAAoB,CAAC,KAAY,EAAA;AACvC,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE;AACjC,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,MAAM,YAAY,MAAI,CAAC;QAC9D,OAAO,UAAU,KAAK,IAAI;IAC5B;AAEQ,IAAA,uBAAuB,CAAC,KAAY,EAAA;AAC1C,QAAA,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC;AAAE,YAAA,OAAO,IAAI;AAClD,QAAA,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE;AACjC,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE;AACxC,QAAA,KAAK,MAAM,MAAM,IAAI,IAAI,EAAE;AACzB,YAAA,IAAI,MAAM,YAAY,QAAQ,EAAE;AAC9B,gBAAA,MAAM,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,KAAK,MAAM,CAAC;AACrD,gBAAA,IAAI,KAAK;AAAE,oBAAA,OAAO,KAAK;YACzB;QACF;AACA,QAAA,OAAO,IAAI;IACb;AAEQ,IAAA,cAAc,CAAC,IAAc,EAAA;AACnC,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE;QACxC,MAAM,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC;QACzC,IAAI,SAAS,GAAG,CAAC;YAAE;AACnB,QAAA,IAAI,CAAC,WAAW,GAAG,SAAS;QAC5B,IAAI,CAAC,mBAAmB,EAAE;IAC5B;IA4CA,MAAM,GAAA;AACJ,QAAA,MAAM,UAAU,GAAG;AACjB,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,CAAC,WAAW,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI;SAClC;AAED,QAAA,OAAOC,CAAI,CAAA;mBACIC,CAAQ,CAAC,UAAU,CAAC,CAAA;AACX,0BAAA,EAAA,IAAI,CAAC,aAAa,CAAA;;KAEzC;IACH;;AAnLO,IAAA,CAAA,MAAM,GAAG,CAACE,UAAM,CAAC;AAEjB,IAAA,CAAA,IAAI,GAAG,QAAH;AAGgC,UAAA,CAAA;IAA1CC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC5B,CAAA,EAAA,IAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAGI,UAAA,CAAA;AAAhB,IAAAE,CAAK;AAA4B,CAAA,EAAA,IAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AAVvB,IAAI,GAAA,MAAA,GAAA,UAAA,CAAA;IADhB;AACY,CAAA,EAAA,IAAI,CAqLhB;;;;"}
package/dist/list.js CHANGED
@@ -1,11 +1,11 @@
1
1
  import './IndividualComponent-Bdwyrvd6.js';
2
2
  import './property-B49QQ8pS.js';
3
+ import './state-DkTK9EGF.js';
3
4
  import './class-map-DG7CA1et.js';
4
- export { L as List } from './list-D6JLh1uh.js';
5
+ export { L as List } from './list-BBmnHm8f.js';
5
6
  import './directive-ZPhl09Yt.js';
6
7
  import './query-CHb9Ft_d.js';
7
8
  import './base-Cl6v8-BZ.js';
8
- import './if-defined-BXZpRQ4P.js';
9
9
  import './is-link-Dk2OV3PM.js';
10
10
  import './dispatch-event-utils-CuEqjlPT.js';
11
11
  import './hyperlink-DLvb6MXE.js';
package/dist/loader.js CHANGED
@@ -13,7 +13,7 @@ import { SegmentedButton } from './segmented-button.js';
13
13
  import { SegmentedButtonGroup } from './segmented-button-group.js';
14
14
  import { SplitButton } from './split-button.js';
15
15
  import { DropdownButton } from './dropdown-button.js';
16
- import { S as Select, d as SidebarSubMenu, c as SidebarMenuItem, b as SidebarMenu, e as Switch, g as TimePicker, D as DatePicker, f as Textarea, N as NumberField, U as UrlField, I as Input, a as CircularProgress, L as LinearProgress, T as Tag, C as ChipSet } from './select-Dwtk0RIU.js';
16
+ import { S as Select, d as SidebarSubMenu, c as SidebarMenuItem, b as SidebarMenu, e as Switch, g as TimePicker, D as DatePicker, f as Textarea, N as NumberField, U as UrlField, I as Input, a as CircularProgress, L as LinearProgress, T as Tag, C as ChipSet } from './select-D85kpjUt.js';
17
17
  import { Field } from './field.js';
18
18
  import { Checkbox } from './checkbox.js';
19
19
  import { Radio } from './radio.js';
@@ -21,7 +21,7 @@ import { Menu } from './menu.js';
21
21
  import { MenuItem } from './menu-item.js';
22
22
  import { SubMenu } from './sub-menu.js';
23
23
  import { Item } from './item.js';
24
- import { a as ListItem, L as List } from './list-D6JLh1uh.js';
24
+ import { a as ListItem, L as List } from './list-BBmnHm8f.js';
25
25
  import { Accordion } from './accordion.js';
26
26
  import { Link } from './link.js';
27
27
  import { Chip } from './chip.js';
@@ -41,6 +41,7 @@ import { Tabs } from './tabs.js';
41
41
  import { Tab } from './tab.js';
42
42
  import { TabPanel } from './tab-panel.js';
43
43
  import { Slider } from './slider.js';
44
+ import { ColorPicker } from './color-picker.js';
44
45
  import { Table } from './table.js';
45
46
  import { Pagination } from './pagination.js';
46
47
  import { Card } from './card.js';
@@ -415,6 +416,9 @@ const loaderConfig = {
415
416
  'wc-slider': {
416
417
  CustomElementClass: Slider,
417
418
  },
419
+ 'wc-color-picker': {
420
+ CustomElementClass: ColorPicker,
421
+ },
418
422
  'wc-table': {
419
423
  CustomElementClass: Table,
420
424
  },