@scouterna/ui-webc 3.1.0 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (149) hide show
  1. package/dist/cjs/{index-BPpKjjvS.js → index-Vd3hlPvW.js} +35 -4
  2. package/dist/cjs/{inputMixin-D0IzcaXz.js → inputMixin-BsRV69ob.js} +1 -1
  3. package/dist/cjs/loader.cjs.js +2 -2
  4. package/dist/cjs/scout-app-bar.cjs.entry.js +2 -2
  5. package/dist/cjs/scout-avatar.cjs.entry.js +39 -0
  6. package/dist/cjs/scout-bottom-bar-item.cjs.entry.js +2 -2
  7. package/dist/cjs/scout-bottom-bar.cjs.entry.js +2 -2
  8. package/dist/cjs/scout-button.cjs.entry.js +1 -1
  9. package/dist/cjs/scout-card.cjs.entry.js +1 -1
  10. package/dist/cjs/scout-checkbox_2.cjs.entry.js +2 -2
  11. package/dist/cjs/scout-divider.cjs.entry.js +1 -1
  12. package/dist/cjs/scout-drawer.cjs.entry.js +841 -0
  13. package/dist/cjs/scout-field.cjs.entry.js +1 -1
  14. package/dist/cjs/scout-input.cjs.entry.js +2 -2
  15. package/dist/cjs/scout-link.cjs.entry.js +1 -1
  16. package/dist/cjs/scout-list-view-item.cjs.entry.js +14 -3
  17. package/dist/cjs/scout-list-view-subheader.cjs.entry.js +1 -1
  18. package/dist/cjs/scout-list-view.cjs.entry.js +7 -5
  19. package/dist/cjs/scout-loader.cjs.entry.js +1 -1
  20. package/dist/cjs/scout-segmented-control.cjs.entry.js +88 -0
  21. package/dist/cjs/scout-select.cjs.entry.js +3 -3
  22. package/dist/cjs/scout-stack.cjs.entry.js +3 -3
  23. package/dist/cjs/scout-switch.cjs.entry.js +3 -3
  24. package/dist/cjs/scout-tabs-tab.cjs.entry.js +2 -2
  25. package/dist/cjs/scout-tabs.cjs.entry.js +3 -3
  26. package/dist/cjs/ui-webc.cjs.js +2 -2
  27. package/dist/collection/collection-manifest.json +3 -0
  28. package/dist/collection/components/app-bar/app-bar.css +5 -1
  29. package/dist/collection/components/avatar/assets/fallbackImage.png +0 -0
  30. package/dist/collection/components/avatar/avatar.css +7 -0
  31. package/dist/collection/components/avatar/avatar.js +88 -0
  32. package/dist/collection/components/bottom-bar/bottom-bar.css +7 -2
  33. package/dist/collection/components/bottom-bar-item/bottom-bar-item.css +16 -2
  34. package/dist/collection/components/drawer/drawer.css +157 -0
  35. package/dist/collection/components/drawer/drawer.js +323 -0
  36. package/dist/collection/components/list-view/list-view.css +7 -2
  37. package/dist/collection/components/list-view/list-view.js +6 -4
  38. package/dist/collection/components/list-view-item/list-view-item.css +16 -4
  39. package/dist/collection/components/list-view-item/list-view-item.js +37 -1
  40. package/dist/collection/components/segmented-control/segmented-control.css +68 -0
  41. package/dist/collection/components/segmented-control/segmented-control.js +185 -0
  42. package/dist/collection/components/select/select.js +1 -1
  43. package/dist/collection/components/stack/stack.js +2 -2
  44. package/dist/collection/components/switch/switch.js +1 -1
  45. package/dist/collection/components/tabs/tabs.js +2 -2
  46. package/dist/collection/components/tabs-tab/tabs-tab.js +1 -1
  47. package/dist/components/index.js +1 -1
  48. package/dist/components/p-BO7j9O37.js +1 -0
  49. package/dist/components/p-CpD1flSg.js +1 -0
  50. package/dist/components/p-DLiFilsh.js +1 -0
  51. package/dist/components/{p-Qv5q0SGa.js → p-lrqW957X.js} +1 -1
  52. package/dist/components/scout-app-bar.js +1 -1
  53. package/dist/components/scout-avatar.d.ts +11 -0
  54. package/dist/components/scout-avatar.js +1 -0
  55. package/dist/components/scout-bottom-bar-item.js +1 -1
  56. package/dist/components/scout-bottom-bar.js +1 -1
  57. package/dist/components/scout-button.js +1 -1
  58. package/dist/components/scout-card.js +1 -1
  59. package/dist/components/scout-checkbox.js +1 -1
  60. package/dist/components/scout-divider.js +1 -1
  61. package/dist/components/scout-drawer.d.ts +11 -0
  62. package/dist/components/scout-drawer.js +1 -0
  63. package/dist/components/scout-field.js +1 -1
  64. package/dist/components/scout-input.js +1 -1
  65. package/dist/components/scout-link.js +1 -1
  66. package/dist/components/scout-list-view-item.js +1 -1
  67. package/dist/components/scout-list-view-subheader.js +1 -1
  68. package/dist/components/scout-list-view.js +1 -1
  69. package/dist/components/scout-loader.js +1 -1
  70. package/dist/components/scout-radio-button.js +1 -1
  71. package/dist/components/scout-segmented-control.d.ts +11 -0
  72. package/dist/components/scout-segmented-control.js +1 -0
  73. package/dist/components/scout-select.js +1 -1
  74. package/dist/components/scout-stack.js +1 -1
  75. package/dist/components/scout-switch.js +1 -1
  76. package/dist/components/scout-tabs-tab.js +1 -1
  77. package/dist/components/scout-tabs.js +1 -1
  78. package/dist/custom-elements.json +516 -1
  79. package/dist/esm/{index-CBq_WkdR.js → index-BtN0bCWb.js} +35 -5
  80. package/dist/esm/{inputMixin-CArDsEiI.js → inputMixin-DC4hF1Lp.js} +1 -1
  81. package/dist/esm/loader.js +3 -3
  82. package/dist/esm/scout-app-bar.entry.js +2 -2
  83. package/dist/esm/scout-avatar.entry.js +37 -0
  84. package/dist/esm/scout-bottom-bar-item.entry.js +2 -2
  85. package/dist/esm/scout-bottom-bar.entry.js +2 -2
  86. package/dist/esm/scout-button.entry.js +1 -1
  87. package/dist/esm/scout-card.entry.js +1 -1
  88. package/dist/esm/scout-checkbox_2.entry.js +2 -2
  89. package/dist/esm/scout-divider.entry.js +1 -1
  90. package/dist/esm/scout-drawer.entry.js +839 -0
  91. package/dist/esm/scout-field.entry.js +1 -1
  92. package/dist/esm/scout-input.entry.js +2 -2
  93. package/dist/esm/scout-link.entry.js +1 -1
  94. package/dist/esm/scout-list-view-item.entry.js +14 -3
  95. package/dist/esm/scout-list-view-subheader.entry.js +1 -1
  96. package/dist/esm/scout-list-view.entry.js +7 -5
  97. package/dist/esm/scout-loader.entry.js +1 -1
  98. package/dist/esm/scout-segmented-control.entry.js +86 -0
  99. package/dist/esm/scout-select.entry.js +3 -3
  100. package/dist/esm/scout-stack.entry.js +3 -3
  101. package/dist/esm/scout-switch.entry.js +3 -3
  102. package/dist/esm/scout-tabs-tab.entry.js +2 -2
  103. package/dist/esm/scout-tabs.entry.js +3 -3
  104. package/dist/esm/ui-webc.js +3 -3
  105. package/dist/types/components/avatar/avatar.d.ts +16 -0
  106. package/dist/types/components/drawer/drawer.d.ts +53 -0
  107. package/dist/types/components/list-view-item/list-view-item.d.ts +7 -0
  108. package/dist/types/components/segmented-control/segmented-control.d.ts +40 -0
  109. package/dist/types/components/tabs/tabs.d.ts +1 -1
  110. package/dist/types/components.d.ts +264 -2
  111. package/dist/ui-webc/assets/fallbackImage.png +0 -0
  112. package/dist/ui-webc/p-0b313ae9.entry.js +1 -0
  113. package/dist/ui-webc/p-1c5b40f5.entry.js +1 -0
  114. package/dist/ui-webc/p-214dc4e4.entry.js +1 -0
  115. package/dist/ui-webc/{p-a153023c.entry.js → p-2d773911.entry.js} +1 -1
  116. package/dist/ui-webc/{p-c0696c1f.entry.js → p-4d676928.entry.js} +1 -1
  117. package/dist/ui-webc/p-4d905b20.entry.js +1 -0
  118. package/dist/ui-webc/{p-f8a4ef3d.entry.js → p-5b0e6de5.entry.js} +1 -1
  119. package/dist/ui-webc/p-6bd3258b.entry.js +1 -0
  120. package/dist/ui-webc/p-6fea31a0.entry.js +1 -0
  121. package/dist/ui-webc/{p-6287efe7.entry.js → p-70c0acea.entry.js} +1 -1
  122. package/dist/ui-webc/p-74bd1d24.entry.js +1 -0
  123. package/dist/ui-webc/{p-0e444b1f.entry.js → p-8c81f27f.entry.js} +1 -1
  124. package/dist/ui-webc/{p-ff537388.entry.js → p-9c8d24b2.entry.js} +1 -1
  125. package/dist/ui-webc/p-9e3739c6.entry.js +1 -0
  126. package/dist/ui-webc/p-BtN0bCWb.js +2 -0
  127. package/dist/ui-webc/{p-6xDaXBJm.js → p-DMdnqqlQ.js} +1 -1
  128. package/dist/ui-webc/{p-b699617e.entry.js → p-a26bd0db.entry.js} +1 -1
  129. package/dist/ui-webc/{p-a2c09e05.entry.js → p-cec7a021.entry.js} +1 -1
  130. package/dist/ui-webc/p-d0fc1cd6.entry.js +1 -0
  131. package/dist/ui-webc/p-d76c67a5.entry.js +1 -0
  132. package/dist/ui-webc/{p-8f5965aa.entry.js → p-d88cbd78.entry.js} +1 -1
  133. package/dist/ui-webc/{p-f8099e5b.entry.js → p-db109100.entry.js} +1 -1
  134. package/dist/ui-webc/{p-6825e415.entry.js → p-ee796725.entry.js} +1 -1
  135. package/dist/ui-webc/{p-189879c2.entry.js → p-f1fb33e9.entry.js} +1 -1
  136. package/dist/ui-webc/ui-webc.css +2 -2
  137. package/dist/ui-webc/ui-webc.esm.js +1 -1
  138. package/package.json +2 -1
  139. package/dist/components/p-B72iGJNe.js +0 -1
  140. package/dist/components/p-CXXyN7aY.js +0 -1
  141. package/dist/components/p-DxVqa2PR.js +0 -1
  142. package/dist/ui-webc/p-60cd6c7e.entry.js +0 -1
  143. package/dist/ui-webc/p-78126f74.entry.js +0 -1
  144. package/dist/ui-webc/p-CBq_WkdR.js +0 -2
  145. package/dist/ui-webc/p-c4f7cfa2.entry.js +0 -1
  146. package/dist/ui-webc/p-cdc127de.entry.js +0 -1
  147. package/dist/ui-webc/p-db40c987.entry.js +0 -1
  148. package/dist/ui-webc/p-ef34d84c.entry.js +0 -1
  149. package/dist/ui-webc/p-f799b2d8.entry.js +0 -1
@@ -8,12 +8,14 @@ import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
8
8
  import { ItemType } from "./components/bottom-bar-item/bottom-bar-item";
9
9
  import { Size, Variant } from "./components/button/button";
10
10
  import { InputMode, InputType, Size as Size1, Variant as Variant1 } from "./components/input/input";
11
- import { ItemType as ItemType1 } from "./components/list-view-item/list-view-item";
11
+ import { ActionType, ItemType as ItemType1 } from "./components/list-view-item/list-view-item";
12
+ import { Size as Size2 } from "./components/segmented-control/segmented-control";
12
13
  import { Direction, GapSize } from "./components/stack/stack";
13
14
  export { ItemType } from "./components/bottom-bar-item/bottom-bar-item";
14
15
  export { Size, Variant } from "./components/button/button";
15
16
  export { InputMode, InputType, Size as Size1, Variant as Variant1 } from "./components/input/input";
16
- export { ItemType as ItemType1 } from "./components/list-view-item/list-view-item";
17
+ export { ActionType, ItemType as ItemType1 } from "./components/list-view-item/list-view-item";
18
+ export { Size as Size2 } from "./components/segmented-control/segmented-control";
17
19
  export { Direction, GapSize } from "./components/stack/stack";
18
20
  export namespace Components {
19
21
  /**
@@ -24,6 +26,22 @@ export namespace Components {
24
26
  interface ScoutAppBar {
25
27
  "titleText"?: string;
26
28
  }
29
+ /**
30
+ * The avatar component is used to display the user's profile picture.
31
+ * Wrap it with a container, to determine its size, since it scales to fit container.
32
+ */
33
+ interface ScoutAvatar {
34
+ /**
35
+ * The name of the user.
36
+ * @default ""
37
+ */
38
+ "alt": string;
39
+ /**
40
+ * The source URL of the user image.
41
+ * @default ""
42
+ */
43
+ "imageSrc": string;
44
+ }
27
45
  /**
28
46
  * The bottom bar component is used in the Jamboree26 app to provide
29
47
  * navigation at the bottom of the screen.
@@ -129,6 +147,48 @@ export namespace Components {
129
147
  }
130
148
  interface ScoutDivider {
131
149
  }
150
+ interface ScoutDrawer {
151
+ /**
152
+ * Back button label.
153
+ * @default ""
154
+ */
155
+ "backButtonLabel": string;
156
+ /**
157
+ * Disable backdrop for the drawer.
158
+ * @default false
159
+ */
160
+ "disableBackdrop": boolean;
161
+ /**
162
+ * Disable drawer content padding. Use only if you have specific use case and you need to use full width.
163
+ * @default false
164
+ */
165
+ "disableContentPadding": boolean;
166
+ /**
167
+ * Exit button label.
168
+ * @default ""
169
+ */
170
+ "exitButtonLabel": string;
171
+ /**
172
+ * Heading within the sheet.
173
+ * @default ""
174
+ */
175
+ "heading": string;
176
+ /**
177
+ * Open/close state of the drawer.
178
+ * @default false
179
+ */
180
+ "open": boolean;
181
+ /**
182
+ * Render back button.
183
+ * @default false
184
+ */
185
+ "showBackButton": boolean;
186
+ /**
187
+ * Render exit button.
188
+ * @default false
189
+ */
190
+ "showExitButton": boolean;
191
+ }
132
192
  /**
133
193
  * The field component is used to wrap form fields with a label, help text, and
134
194
  * error messages. It automatically captures validation events from its child
@@ -222,6 +282,11 @@ export namespace Components {
222
282
  interface ScoutListView {
223
283
  }
224
284
  interface ScoutListViewItem {
285
+ /**
286
+ * The action to display on the right side of the item. For example, a chevron. This is purely visual and does not affect the behavior of the item in any way. Not visible when the type is "radio" or "checkbox".
287
+ * @default null
288
+ */
289
+ "action": ActionType;
225
290
  "checked"?: boolean;
226
291
  "disabled"?: boolean;
227
292
  "href"?: string;
@@ -277,6 +342,26 @@ export namespace Components {
277
342
  "validity"?: string;
278
343
  "value": string;
279
344
  }
345
+ /**
346
+ * The segmented control component presents a set of options where exactly one
347
+ * option is active at a time.
348
+ * The component displays an indicator under the selected option and emits a
349
+ * `scoutChange` event when the user picks a different option, so you can update
350
+ * `value`.
351
+ * Use button elements as the slotted segment options.
352
+ */
353
+ interface ScoutSegmentedControl {
354
+ /**
355
+ * Visual size of the segmented control. Use `small` for dense layouts and `medium` for the default size.
356
+ * @default "medium"
357
+ */
358
+ "size": Size2;
359
+ /**
360
+ * Zero-based index of the currently active segment.
361
+ * @default 0
362
+ */
363
+ "value": number;
364
+ }
280
365
  /**
281
366
  * The select component is a dropdown menu that allows users to select one
282
367
  * option from a list. When used in a form, make sure to wrap it in a Field
@@ -365,6 +450,10 @@ export interface ScoutCheckboxCustomEvent<T> extends CustomEvent<T> {
365
450
  detail: T;
366
451
  target: HTMLScoutCheckboxElement;
367
452
  }
453
+ export interface ScoutDrawerCustomEvent<T> extends CustomEvent<T> {
454
+ detail: T;
455
+ target: HTMLScoutDrawerElement;
456
+ }
368
457
  export interface ScoutInputCustomEvent<T> extends CustomEvent<T> {
369
458
  detail: T;
370
459
  target: HTMLScoutInputElement;
@@ -381,6 +470,10 @@ export interface ScoutRadioButtonCustomEvent<T> extends CustomEvent<T> {
381
470
  detail: T;
382
471
  target: HTMLScoutRadioButtonElement;
383
472
  }
473
+ export interface ScoutSegmentedControlCustomEvent<T> extends CustomEvent<T> {
474
+ detail: T;
475
+ target: HTMLScoutSegmentedControlElement;
476
+ }
384
477
  export interface ScoutSelectCustomEvent<T> extends CustomEvent<T> {
385
478
  detail: T;
386
479
  target: HTMLScoutSelectElement;
@@ -405,6 +498,16 @@ declare global {
405
498
  prototype: HTMLScoutAppBarElement;
406
499
  new (): HTMLScoutAppBarElement;
407
500
  };
501
+ /**
502
+ * The avatar component is used to display the user's profile picture.
503
+ * Wrap it with a container, to determine its size, since it scales to fit container.
504
+ */
505
+ interface HTMLScoutAvatarElement extends Components.ScoutAvatar, HTMLStencilElement {
506
+ }
507
+ var HTMLScoutAvatarElement: {
508
+ prototype: HTMLScoutAvatarElement;
509
+ new (): HTMLScoutAvatarElement;
510
+ };
408
511
  /**
409
512
  * The bottom bar component is used in the Jamboree26 app to provide
410
513
  * navigation at the bottom of the screen.
@@ -511,6 +614,24 @@ declare global {
511
614
  prototype: HTMLScoutDividerElement;
512
615
  new (): HTMLScoutDividerElement;
513
616
  };
617
+ interface HTMLScoutDrawerElementEventMap {
618
+ "backButtonClicked": void;
619
+ "exitButtonClicked": void;
620
+ }
621
+ interface HTMLScoutDrawerElement extends Components.ScoutDrawer, HTMLStencilElement {
622
+ addEventListener<K extends keyof HTMLScoutDrawerElementEventMap>(type: K, listener: (this: HTMLScoutDrawerElement, ev: ScoutDrawerCustomEvent<HTMLScoutDrawerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
623
+ addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
624
+ addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
625
+ addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
626
+ removeEventListener<K extends keyof HTMLScoutDrawerElementEventMap>(type: K, listener: (this: HTMLScoutDrawerElement, ev: ScoutDrawerCustomEvent<HTMLScoutDrawerElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
627
+ removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
628
+ removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
629
+ removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
630
+ }
631
+ var HTMLScoutDrawerElement: {
632
+ prototype: HTMLScoutDrawerElement;
633
+ new (): HTMLScoutDrawerElement;
634
+ };
514
635
  /**
515
636
  * The field component is used to wrap form fields with a label, help text, and
516
637
  * error messages. It automatically captures validation events from its child
@@ -645,6 +766,31 @@ declare global {
645
766
  prototype: HTMLScoutRadioButtonElement;
646
767
  new (): HTMLScoutRadioButtonElement;
647
768
  };
769
+ interface HTMLScoutSegmentedControlElementEventMap {
770
+ "scoutChange": { value: number };
771
+ }
772
+ /**
773
+ * The segmented control component presents a set of options where exactly one
774
+ * option is active at a time.
775
+ * The component displays an indicator under the selected option and emits a
776
+ * `scoutChange` event when the user picks a different option, so you can update
777
+ * `value`.
778
+ * Use button elements as the slotted segment options.
779
+ */
780
+ interface HTMLScoutSegmentedControlElement extends Components.ScoutSegmentedControl, HTMLStencilElement {
781
+ addEventListener<K extends keyof HTMLScoutSegmentedControlElementEventMap>(type: K, listener: (this: HTMLScoutSegmentedControlElement, ev: ScoutSegmentedControlCustomEvent<HTMLScoutSegmentedControlElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
782
+ addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
783
+ addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
784
+ addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
785
+ removeEventListener<K extends keyof HTMLScoutSegmentedControlElementEventMap>(type: K, listener: (this: HTMLScoutSegmentedControlElement, ev: ScoutSegmentedControlCustomEvent<HTMLScoutSegmentedControlElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
786
+ removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
787
+ removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
788
+ removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
789
+ }
790
+ var HTMLScoutSegmentedControlElement: {
791
+ prototype: HTMLScoutSegmentedControlElement;
792
+ new (): HTMLScoutSegmentedControlElement;
793
+ };
648
794
  interface HTMLScoutSelectElementEventMap {
649
795
  "scoutInputChange": {
650
796
  value: string;
@@ -753,12 +899,14 @@ declare global {
753
899
  };
754
900
  interface HTMLElementTagNameMap {
755
901
  "scout-app-bar": HTMLScoutAppBarElement;
902
+ "scout-avatar": HTMLScoutAvatarElement;
756
903
  "scout-bottom-bar": HTMLScoutBottomBarElement;
757
904
  "scout-bottom-bar-item": HTMLScoutBottomBarItemElement;
758
905
  "scout-button": HTMLScoutButtonElement;
759
906
  "scout-card": HTMLScoutCardElement;
760
907
  "scout-checkbox": HTMLScoutCheckboxElement;
761
908
  "scout-divider": HTMLScoutDividerElement;
909
+ "scout-drawer": HTMLScoutDrawerElement;
762
910
  "scout-field": HTMLScoutFieldElement;
763
911
  "scout-input": HTMLScoutInputElement;
764
912
  "scout-link": HTMLScoutLinkElement;
@@ -767,6 +915,7 @@ declare global {
767
915
  "scout-list-view-subheader": HTMLScoutListViewSubheaderElement;
768
916
  "scout-loader": HTMLScoutLoaderElement;
769
917
  "scout-radio-button": HTMLScoutRadioButtonElement;
918
+ "scout-segmented-control": HTMLScoutSegmentedControlElement;
770
919
  "scout-select": HTMLScoutSelectElement;
771
920
  "scout-stack": HTMLScoutStackElement;
772
921
  "scout-switch": HTMLScoutSwitchElement;
@@ -783,6 +932,22 @@ declare namespace LocalJSX {
783
932
  interface ScoutAppBar {
784
933
  "titleText"?: string;
785
934
  }
935
+ /**
936
+ * The avatar component is used to display the user's profile picture.
937
+ * Wrap it with a container, to determine its size, since it scales to fit container.
938
+ */
939
+ interface ScoutAvatar {
940
+ /**
941
+ * The name of the user.
942
+ * @default ""
943
+ */
944
+ "alt"?: string;
945
+ /**
946
+ * The source URL of the user image.
947
+ * @default ""
948
+ */
949
+ "imageSrc"?: string;
950
+ }
786
951
  /**
787
952
  * The bottom bar component is used in the Jamboree26 app to provide
788
953
  * navigation at the bottom of the screen.
@@ -921,6 +1086,56 @@ declare namespace LocalJSX {
921
1086
  }
922
1087
  interface ScoutDivider {
923
1088
  }
1089
+ interface ScoutDrawer {
1090
+ /**
1091
+ * Back button label.
1092
+ * @default ""
1093
+ */
1094
+ "backButtonLabel"?: string;
1095
+ /**
1096
+ * Disable backdrop for the drawer.
1097
+ * @default false
1098
+ */
1099
+ "disableBackdrop"?: boolean;
1100
+ /**
1101
+ * Disable drawer content padding. Use only if you have specific use case and you need to use full width.
1102
+ * @default false
1103
+ */
1104
+ "disableContentPadding"?: boolean;
1105
+ /**
1106
+ * Exit button label.
1107
+ * @default ""
1108
+ */
1109
+ "exitButtonLabel"?: string;
1110
+ /**
1111
+ * Heading within the sheet.
1112
+ * @default ""
1113
+ */
1114
+ "heading"?: string;
1115
+ /**
1116
+ * Fired when clicking backButton (<-)
1117
+ */
1118
+ "onBackButtonClicked"?: (event: ScoutDrawerCustomEvent<void>) => void;
1119
+ /**
1120
+ * Fired when clicking backButton (X). Also sent when clicking the backdrop.
1121
+ */
1122
+ "onExitButtonClicked"?: (event: ScoutDrawerCustomEvent<void>) => void;
1123
+ /**
1124
+ * Open/close state of the drawer.
1125
+ * @default false
1126
+ */
1127
+ "open"?: boolean;
1128
+ /**
1129
+ * Render back button.
1130
+ * @default false
1131
+ */
1132
+ "showBackButton"?: boolean;
1133
+ /**
1134
+ * Render exit button.
1135
+ * @default false
1136
+ */
1137
+ "showExitButton"?: boolean;
1138
+ }
924
1139
  /**
925
1140
  * The field component is used to wrap form fields with a label, help text, and
926
1141
  * error messages. It automatically captures validation events from its child
@@ -1045,6 +1260,11 @@ declare namespace LocalJSX {
1045
1260
  interface ScoutListView {
1046
1261
  }
1047
1262
  interface ScoutListViewItem {
1263
+ /**
1264
+ * The action to display on the right side of the item. For example, a chevron. This is purely visual and does not affect the behavior of the item in any way. Not visible when the type is "radio" or "checkbox".
1265
+ * @default null
1266
+ */
1267
+ "action"?: ActionType;
1048
1268
  "checked"?: boolean;
1049
1269
  "disabled"?: boolean;
1050
1270
  "href"?: string;
@@ -1132,6 +1352,30 @@ declare namespace LocalJSX {
1132
1352
  "validity"?: string;
1133
1353
  "value"?: string;
1134
1354
  }
1355
+ /**
1356
+ * The segmented control component presents a set of options where exactly one
1357
+ * option is active at a time.
1358
+ * The component displays an indicator under the selected option and emits a
1359
+ * `scoutChange` event when the user picks a different option, so you can update
1360
+ * `value`.
1361
+ * Use button elements as the slotted segment options.
1362
+ */
1363
+ interface ScoutSegmentedControl {
1364
+ /**
1365
+ * Emitted when the active segment changes as a result of a user click. The `value` in the event detail is the zero-based index of the newly selected segment.
1366
+ */
1367
+ "onScoutChange"?: (event: ScoutSegmentedControlCustomEvent<{ value: number }>) => void;
1368
+ /**
1369
+ * Visual size of the segmented control. Use `small` for dense layouts and `medium` for the default size.
1370
+ * @default "medium"
1371
+ */
1372
+ "size"?: Size2;
1373
+ /**
1374
+ * Zero-based index of the currently active segment.
1375
+ * @default 0
1376
+ */
1377
+ "value"?: number;
1378
+ }
1135
1379
  /**
1136
1380
  * The select component is a dropdown menu that allows users to select one
1137
1381
  * option from a list. When used in a form, make sure to wrap it in a Field
@@ -1271,12 +1515,14 @@ declare namespace LocalJSX {
1271
1515
  }
1272
1516
  interface IntrinsicElements {
1273
1517
  "scout-app-bar": ScoutAppBar;
1518
+ "scout-avatar": ScoutAvatar;
1274
1519
  "scout-bottom-bar": ScoutBottomBar;
1275
1520
  "scout-bottom-bar-item": ScoutBottomBarItem;
1276
1521
  "scout-button": ScoutButton;
1277
1522
  "scout-card": ScoutCard;
1278
1523
  "scout-checkbox": ScoutCheckbox;
1279
1524
  "scout-divider": ScoutDivider;
1525
+ "scout-drawer": ScoutDrawer;
1280
1526
  "scout-field": ScoutField;
1281
1527
  "scout-input": ScoutInput;
1282
1528
  "scout-link": ScoutLink;
@@ -1285,6 +1531,7 @@ declare namespace LocalJSX {
1285
1531
  "scout-list-view-subheader": ScoutListViewSubheader;
1286
1532
  "scout-loader": ScoutLoader;
1287
1533
  "scout-radio-button": ScoutRadioButton;
1534
+ "scout-segmented-control": ScoutSegmentedControl;
1288
1535
  "scout-select": ScoutSelect;
1289
1536
  "scout-stack": ScoutStack;
1290
1537
  "scout-switch": ScoutSwitch;
@@ -1302,6 +1549,11 @@ declare module "@stencil/core" {
1302
1549
  * native-like navigation experience.
1303
1550
  */
1304
1551
  "scout-app-bar": LocalJSX.ScoutAppBar & JSXBase.HTMLAttributes<HTMLScoutAppBarElement>;
1552
+ /**
1553
+ * The avatar component is used to display the user's profile picture.
1554
+ * Wrap it with a container, to determine its size, since it scales to fit container.
1555
+ */
1556
+ "scout-avatar": LocalJSX.ScoutAvatar & JSXBase.HTMLAttributes<HTMLScoutAvatarElement>;
1305
1557
  /**
1306
1558
  * The bottom bar component is used in the Jamboree26 app to provide
1307
1559
  * navigation at the bottom of the screen.
@@ -1330,6 +1582,7 @@ declare module "@stencil/core" {
1330
1582
  */
1331
1583
  "scout-checkbox": LocalJSX.ScoutCheckbox & JSXBase.HTMLAttributes<HTMLScoutCheckboxElement>;
1332
1584
  "scout-divider": LocalJSX.ScoutDivider & JSXBase.HTMLAttributes<HTMLScoutDividerElement>;
1585
+ "scout-drawer": LocalJSX.ScoutDrawer & JSXBase.HTMLAttributes<HTMLScoutDrawerElement>;
1333
1586
  /**
1334
1587
  * The field component is used to wrap form fields with a label, help text, and
1335
1588
  * error messages. It automatically captures validation events from its child
@@ -1354,6 +1607,15 @@ declare module "@stencil/core" {
1354
1607
  * label, help text, and error messages.
1355
1608
  */
1356
1609
  "scout-radio-button": LocalJSX.ScoutRadioButton & JSXBase.HTMLAttributes<HTMLScoutRadioButtonElement>;
1610
+ /**
1611
+ * The segmented control component presents a set of options where exactly one
1612
+ * option is active at a time.
1613
+ * The component displays an indicator under the selected option and emits a
1614
+ * `scoutChange` event when the user picks a different option, so you can update
1615
+ * `value`.
1616
+ * Use button elements as the slotted segment options.
1617
+ */
1618
+ "scout-segmented-control": LocalJSX.ScoutSegmentedControl & JSXBase.HTMLAttributes<HTMLScoutSegmentedControlElement>;
1357
1619
  /**
1358
1620
  * The select component is a dropdown menu that allows users to select one
1359
1621
  * option from a list. When used in a form, make sure to wrap it in a Field
@@ -0,0 +1 @@
1
+ import{M as r,r as a,c as e,h as t}from"./p-BtN0bCWb.js";import{i}from"./p-DMdnqqlQ.js";const o=class extends(r(i)){constructor(r){super(),a(this,r),this.scoutInputChange=e(this,"scoutInputChange"),this.scoutBlur=e(this,"scoutBlur"),this.scoutValidate=e(this,"scoutValidate"),this._scoutValidityChanged=e(this,"_scoutValidityChanged"),this._scoutInvalid=e(this,"_scoutInvalid"),this._scoutFieldId=e(this,"_scoutFieldId"),this.scoutChecked=e(this,"scoutChecked")}toggled=!1;disabled=!1;ariaLabelledby;label;scoutChecked;onChange(r){const a=r.target;this.scoutChecked.emit({checked:a.checked,element:a})}render(){return t(this.label?.length?"label":"div",{key:"6d15a65d5338857bcecb4f5e80dce58d37c03153"},this.label,t("span",{key:"b398f86314685fe31394fe35eef10a515f5d9936",class:"inlineDivider"}),t("input",{key:"555d43eb9526f3831a127b316fa4142140056fb6",ref:r=>this.setInputRef(r),id:this.ariaId,type:"checkbox",class:"switch","aria-labelledby":this.ariaLabelledby,"aria-disabled":this.disabled,disabled:this.disabled,checked:this.toggled,onChange:r=>{this.onInput(),this.onChange(r)},onBlur:()=>this.onBlur(),onInvalid:()=>this.onInvalid()}))}static get delegatesFocus(){return!0}static get watchers(){return{validity:[{runValidation:0}]}}};o.style='.switch{width:var(--spacing-10);height:var(--spacing-6);-moz-appearance:none;appearance:none;-webkit-appearance:none;border-radius:var(--spacing-8);background-color:var(--color-text-brand-inverse);border:2px solid var(--color-gray-300);position:relative;display:flex;align-content:center;justify-content:center;transition-property:border-color;transition-duration:0.3s;transition-timing-function:ease-in-out;cursor:pointer;--switch-ball-padding:calc(var(--spacing-1) / 4);--switch-ball-size:calc(var(--spacing-5) - var(--switch-ball-padding) * 2)}@media (hover: hover){.switch:hover{transition-property:none;border-color:var(--color-gray-400);background-color:var(--color-background-brand-subtle-hovered)}}.switch:active{background-color:var(--color-background-brand-subtle-pressed)}.switch:checked{border-color:var(--color-background-brand-base)}@media (hover: hover){.switch:hover::before{background-color:var(--color-gray-400)}}.switch::before{content:"";background-color:var(--color-gray-300);width:var(--switch-ball-size);height:var(--switch-ball-size);border-radius:50%;position:absolute;top:var(--switch-ball-padding);left:var(--switch-ball-padding);transition-duration:0.3s;transition-property:left, right}.switch:checked::before{content:"";background-color:var(--color-background-brand-base);left:calc(100% - (var(--switch-ball-size) + var(--switch-ball-padding)));left:calc(100% - calc(var(--switch-ball-size) + var(--switch-ball-padding)))}.switch:disabled{pointer-events:none;background-color:var(--color-gray-100);border-color:var(--color-gray-100)}.switch:disabled::before{background-color:var(--color-gray-300)}label{display:flex;flex-direction:row-reverse;align-items:center;font:var(--type-label-base);color:var(--color-text-base)}.inlineDivider{width:var(--spacing-2)}';export{o as scout_switch}
@@ -0,0 +1 @@
1
+ import{r as t,d as e,h as s}from"./p-BtN0bCWb.js";const c=class{constructor(e){t(this,e)}get el(){return e(this)}onScoutChecked(t){const{checked:e,element:s}=t.detail;if("radio"!==s.type||!s.name||!e)return;const c=this.el.querySelectorAll("scout-list-view-item"),i=[];c.forEach((t=>{const e=t.shadowRoot?.querySelectorAll(`input[type="radio"][name="${CSS.escape(s.name)}"]`);e?.forEach((t=>{t!==s&&i.push(t)}))}));for(const t of i)t.checked=!1}render(){return s("div",{key:"a2c79ce8e0fe8028cb7b093f6bf64961a0ef4d05",class:"list",role:"list"},s("slot",{key:"6a147fbbb385c80325211e9cb009b6af0678dbb6"}))}static get delegatesFocus(){return!0}};c.style=".list{width:100%;display:flex;flex-direction:column;padding:var(--spacing-2);gap:2px}";export{c as scout_list_view}
@@ -0,0 +1 @@
1
+ import{r as i,c as t,h as e,H as o}from"./p-BtN0bCWb.js";const r=class{constructor(e){i(this,e),this.scoutClick=t(this,"scoutClick")}icon;primary;secondary;type="button";action=null;href;target;rel;name;value;checked;disabled;scoutClick;render(){return e(o,{key:"a91a63b4ed66f3ea5139f83d0024b342cd7095d1",role:"listitem"},e("link"===this.type?"a":"radio"===this.type||"checkbox"===this.type?"label":"button",{key:"9c4e5c7e24c0f152f5e13b77a91c9eff0f73192d",class:"button",..."link"===this.type?{href:this.href,target:this.target,rel:this.rel??("_blank"===this.target?"noopener noreferrer":void 0)}:{},onClick:()=>this.scoutClick.emit()},this.getPrefix(),this.getContent(),this.getSuffix()))}getPrefix(){return this.icon?e("div",{class:"prefix-icon",innerHTML:this.icon}):null}getContent(){return e("div",{class:"content"},this.primary&&e("div",{class:"primary"},this.primary),this.secondary&&e("div",{class:"secondary"},this.secondary))}getSuffix(){return"radio"===this.type?e("scout-radio-button",{name:this.name,value:this.value,checked:this.checked,disabled:this.disabled}):"checkbox"===this.type?e("scout-checkbox",{name:this.name,value:this.value,checked:this.checked,disabled:this.disabled}):"chevron"===this.action?e("div",{class:"suffix-icon"},e("div",{class:"icon",style:{"--icon":"url(data:image/svg+xml;base64,PHN2ZwogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB3aWR0aD0iMjQiCiAgaGVpZ2h0PSIyNCIKICB2aWV3Qm94PSIwIDAgMjQgMjQiCiAgZmlsbD0ibm9uZSIKICBzdHJva2U9ImN1cnJlbnRDb2xvciIKICBzdHJva2Utd2lkdGg9IjIiCiAgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIgogIHN0cm9rZS1saW5lam9pbj0icm91bmQiCiAgY2xhc3M9Imljb24gaWNvbi10YWJsZXIgaWNvbnMtdGFibGVyLW91dGxpbmUgaWNvbi10YWJsZXItY2hldnJvbi1yaWdodCIKPgogIDxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPgogIDxwYXRoIGQ9Ik05IDZsNiA2bC02IDYiIC8+Cjwvc3ZnPg==)"}})):null}static get delegatesFocus(){return!0}};r.style=":host{display:flex}.button{flex:1;display:flex;align-items:center;text-align:inherit;min-height:var(--spacing-12);color:var(--color-text-base);padding:var(--spacing-4) var(--spacing-4);cursor:pointer;border:1px solid rgba(0, 0, 0, 0.05);background-color:var(--color-white);-webkit-text-decoration:none;text-decoration:none;border-radius:6px}:host(:first-of-type) .button{border-top-left-radius:var(--spacing-4);border-top-right-radius:var(--spacing-4)}:host(:last-of-type) .button{border-bottom-left-radius:var(--spacing-4);border-bottom-right-radius:var(--spacing-4)}@media (hover: hover){.button:hover{background-color:var(--color-background-brand-subtle-hovered);border-color:rgba(0, 0, 0, 0.03)}}.prefix-icon,.suffix-icon{display:flex;align-items:center;height:var(--spacing-6);color:var(--color-neutral-700)}.prefix-icon svg,.suffix-icon svg,.prefix-icon .icon,.suffix-icon .icon{width:var(--spacing-6);height:var(--spacing-6)}.prefix-icon{justify-content:flex-start;width:var(--spacing-10)}.suffix-icon{justify-content:flex-end;width:var(--spacing-8)}.suffix-icon .icon{background-color:currentColor;-webkit-mask-image:var(--icon);mask-image:var(--icon);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.content{flex:1;display:flex;flex-direction:column;justify-content:center}.primary{font:var(--type-body-base)}.secondary{font:var(--type-body-sm);color:var(--color-neutral-700)}";export{r as scout_list_view_item}
@@ -1 +1 @@
1
- import{M as t,r as s,c as a,h as i,H as r}from"./p-CBq_WkdR.js";import{i as o}from"./p-6xDaXBJm.js";const e=class extends(t(o)){constructor(t){super(),s(this,t),this.scoutInputChange=a(this,"scoutInputChange"),this.scoutBlur=a(this,"scoutBlur"),this.scoutValidate=a(this,"scoutValidate"),this._scoutValidityChanged=a(this,"_scoutValidityChanged"),this._scoutInvalid=a(this,"_scoutInvalid"),this._scoutFieldId=a(this,"_scoutFieldId")}size="medium";variant="default";type="text";inputmode;pattern;value="";name;disabled=!1;placeholder;render(){return i(r,{key:"800efa151d522ef1d7a483128baa6c0958dcd100",class:`${"large"===this.size?"large":""} ${"elevated"===this.variant?"elevated":""}`},i("input",{key:"92756a5cdf529455fffaadcbcdd2bc36a5087c65",ref:t=>this.setInputRef(t),id:this.ariaId,type:this.type,name:this.name,inputMode:this.inputmode,pattern:this.pattern,class:"input",value:this.value,disabled:this.disabled,placeholder:this.placeholder,onInput:()=>this.onInput(),onBlur:()=>this.onBlur(),onInvalid:()=>this.onInvalid()}))}static get watchers(){return{validity:[{runValidation:0}]}}};e.style=".sc-scout-input-h{display:flex;height:var(--spacing-10);--scout-input-padding:var(--spacing-2);--scout-input-border-radius:var(--spacing-2);--scout-input-type:var(--type-body-base)}.large.sc-scout-input-h{height:var(--spacing-14);--scout-input-padding:var(--spacing-3);--scout-input-border-radius:var(--spacing-3);--scout-input-type:var(--type-body-lg)}.input.sc-scout-input{flex:1;padding:var(--scout-input-padding);font:var(--scout-input-type);border:1px solid var(--color-gray-300);border-radius:var(--scout-input-border-radius);background-color:var(--color-white);color:var(--color-text-base)}.input.sc-scout-input:disabled{background-color:var(--color-gray-100);color:var(--color-gray-700);cursor:not-allowed}.elevated.sc-scout-input-h .input.sc-scout-input{box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);border-color:transparent}";export{e as scout_input}
1
+ import{M as t,r as s,c as a,h as i,H as r}from"./p-BtN0bCWb.js";import{i as o}from"./p-DMdnqqlQ.js";const e=class extends(t(o)){constructor(t){super(),s(this,t),this.scoutInputChange=a(this,"scoutInputChange"),this.scoutBlur=a(this,"scoutBlur"),this.scoutValidate=a(this,"scoutValidate"),this._scoutValidityChanged=a(this,"_scoutValidityChanged"),this._scoutInvalid=a(this,"_scoutInvalid"),this._scoutFieldId=a(this,"_scoutFieldId")}size="medium";variant="default";type="text";inputmode;pattern;value="";name;disabled=!1;placeholder;render(){return i(r,{key:"800efa151d522ef1d7a483128baa6c0958dcd100",class:`${"large"===this.size?"large":""} ${"elevated"===this.variant?"elevated":""}`},i("input",{key:"92756a5cdf529455fffaadcbcdd2bc36a5087c65",ref:t=>this.setInputRef(t),id:this.ariaId,type:this.type,name:this.name,inputMode:this.inputmode,pattern:this.pattern,class:"input",value:this.value,disabled:this.disabled,placeholder:this.placeholder,onInput:()=>this.onInput(),onBlur:()=>this.onBlur(),onInvalid:()=>this.onInvalid()}))}static get watchers(){return{validity:[{runValidation:0}]}}};e.style=".sc-scout-input-h{display:flex;height:var(--spacing-10);--scout-input-padding:var(--spacing-2);--scout-input-border-radius:var(--spacing-2);--scout-input-type:var(--type-body-base)}.large.sc-scout-input-h{height:var(--spacing-14);--scout-input-padding:var(--spacing-3);--scout-input-border-radius:var(--spacing-3);--scout-input-type:var(--type-body-lg)}.input.sc-scout-input{flex:1;padding:var(--scout-input-padding);font:var(--scout-input-type);border:1px solid var(--color-gray-300);border-radius:var(--scout-input-border-radius);background-color:var(--color-white);color:var(--color-text-base)}.input.sc-scout-input:disabled{background-color:var(--color-gray-100);color:var(--color-gray-700);cursor:not-allowed}.elevated.sc-scout-input-h .input.sc-scout-input{box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);border-color:transparent}";export{e as scout_input}
@@ -1 +1 @@
1
- import{M as o,r as e,c as a,h as r}from"./p-CBq_WkdR.js";import{i as t}from"./p-6xDaXBJm.js";const c=class extends(o(t)){constructor(o){super(),e(this,o),this.scoutInputChange=a(this,"scoutInputChange"),this.scoutBlur=a(this,"scoutBlur"),this.scoutValidate=a(this,"scoutValidate"),this._scoutValidityChanged=a(this,"_scoutValidityChanged"),this._scoutInvalid=a(this,"_scoutInvalid"),this._scoutFieldId=a(this,"_scoutFieldId"),this.scoutChecked=a(this,"scoutChecked")}checked=!1;disabled=!1;ariaLabelledby;label;value;name;scoutChecked;onChange(o){const e=o.target;this.scoutChecked.emit({checked:e.checked,element:e})}render(){return r(this.label?.length?"label":"div",{key:"67b42b2b686fffecf891da832236fde663b740dc"},r("input",{key:"81821918d102e1ca809915c14a20aa0847f46e30",ref:o=>this.setInputRef(o),id:this.ariaId,type:"checkbox",value:this.value,name:this.name,class:"checkbox",style:{"--icon-checkbox":"url(data:image/svg+xml;base64,PHN2ZwogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB3aWR0aD0iMjQiCiAgaGVpZ2h0PSIyNCIKICB2aWV3Qm94PSIwIDAgMjQgMjQiCiAgZmlsbD0ibm9uZSIKICBzdHJva2U9ImN1cnJlbnRDb2xvciIKICBzdHJva2Utd2lkdGg9IjIiCiAgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIgogIHN0cm9rZS1saW5lam9pbj0icm91bmQiCiAgY2xhc3M9Imljb24gaWNvbi10YWJsZXIgaWNvbnMtdGFibGVyLW91dGxpbmUgaWNvbi10YWJsZXItY2hlY2siCj4KICA8cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KICA8cGF0aCBkPSJNNSAxMmw1IDVsMTAgLTEwIiAvPgo8L3N2Zz4=)"},"aria-labelledby":this.ariaLabelledby,"aria-disabled":this.disabled,disabled:this.disabled,checked:this.checked,onChange:o=>{this.onInput(),this.onChange(o)},onBlur:()=>this.onBlur(),onInvalid:()=>this.onInvalid()}),this.label)}static get watchers(){return{validity:[{runValidation:0}]}}};c.style='.checkbox.sc-scout-checkbox{width:var(--spacing-6);height:var(--spacing-6);-moz-appearance:none;appearance:none;-webkit-appearance:none;display:flex;align-content:center;justify-content:center;border-radius:3px;background-color:var(--color-text-brand-inverse);border:2px solid var(--color-gray-300);position:relative}@media (hover: hover){.checkbox.sc-scout-checkbox:hover{border:2px solid var(--color-gray-400);box-shadow:inset 0px 0px 5px 5px var(--color-background-brand-subtle-hovered);cursor:pointer}}.checkbox.sc-scout-checkbox:active{background-color:var(--color-background-brand-subtle-pressed)}@media (hover: hover){.checkbox.sc-scout-checkbox:checked:hover{background-color:var(--color-background-brand-hovered);border-color:var(--color-background-brand-hovered);box-shadow:none}}.checkbox.sc-scout-checkbox:checked{background-color:var(--color-background-brand-base);border-color:var(--color-background-brand-base)}.checkbox.sc-scout-checkbox::after{content:"";position:absolute;width:var(--spacing-10);height:var(--spacing-10);top:50%;left:50%;transform:translate(-50%, -50%)}.checkbox.sc-scout-checkbox:checked::before{content:"";background-color:var(--color-text-brand-inverse);width:var(--spacing-6);height:var(--spacing-6);position:absolute;top:50%;left:50%;right:0;bottom:0;transform:translate(-50%, -50%);-webkit-mask-image:var(--icon-checkbox);mask-image:var(--icon-checkbox);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.checkbox.sc-scout-checkbox:disabled{pointer-events:none;background-color:var(--color-gray-100);border-color:var(--color-gray-100)}label.sc-scout-checkbox{display:flex;align-items:center;gap:var(--spacing-2);font:var(--type-label-base);color:var(--color-text-base)}';const s=class extends(o(t)){constructor(o){super(),e(this,o),this.scoutInputChange=a(this,"scoutInputChange"),this.scoutBlur=a(this,"scoutBlur"),this.scoutValidate=a(this,"scoutValidate"),this._scoutValidityChanged=a(this,"_scoutValidityChanged"),this._scoutInvalid=a(this,"_scoutInvalid"),this._scoutFieldId=a(this,"_scoutFieldId"),this.scoutChecked=a(this,"scoutChecked")}checked=!1;disabled=!1;ariaLabelledby;label;value;name;scoutChecked;onChange(o){const e=o.target;this.scoutChecked.emit({checked:e.checked,element:e})}render(){return r(this.label?.length?"label":"div",{key:"22df090dcbf2f2b4b14b7cad8d34500295045f70"},r("input",{key:"3bcc5022fa6202fd1fe733c1a8430f7ed1a54cf4",ref:o=>this.setInputRef(o),id:this.ariaId,type:"radio",value:this.value,name:this.name,class:"radio","aria-labelledby":this.ariaLabelledby,"aria-disabled":this.disabled,disabled:this.disabled,checked:this.checked,onChange:o=>{this.onInput(),this.onChange(o)},onBlur:()=>this.onBlur(),onInvalid:()=>this.onInvalid()}),this.label)}static get watchers(){return{validity:[{runValidation:0}]}}};s.style='.radio.sc-scout-radio-button{width:var(--spacing-6);height:var(--spacing-6);-moz-appearance:none;appearance:none;-webkit-appearance:none;display:flex;align-content:center;justify-content:center;border-radius:100%;background-color:var(--color-white);border:2px solid var(--color-gray-300);position:relative}@media (hover: hover){.radio.sc-scout-radio-button:hover{border:2px solid var(--color-gray-400);box-shadow:inset 0px 0px 5px 5px var(--color-background-brand-subtle-hovered);cursor:pointer}}.radio.sc-scout-radio-button:active{background-color:var(--color-background-brand-subtle-pressed)}@media (hover: hover){.radio.sc-scout-radio-button:checked:hover{border-color:var(--color-background-brand-hovered);box-shadow:none}.radio.sc-scout-radio-button:checked:hover::before{background-color:var(--color-background-brand-hovered)}}.radio.sc-scout-radio-button:checked{border-color:var(--color-background-brand-base)}.radio.sc-scout-radio-button::after{content:"";position:absolute;width:var(--spacing-10);height:var(--spacing-10);top:50%;left:50%;transform:translate(-50%, -50%)}.radio.sc-scout-radio-button:checked::before{content:"";background-color:var(--color-background-brand-base);width:var(--spacing-4);height:var(--spacing-4);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:100%}.radio.sc-scout-radio-button:disabled{pointer-events:none;background-color:var(--color-gray-100);border-color:var(--color-gray-100)}label.sc-scout-radio-button{display:flex;align-items:center;gap:var(--spacing-2);font:var(--type-label-base);color:var(--color-text-base)}';export{c as scout_checkbox,s as scout_radio_button}
1
+ import{M as o,r as e,c as a,h as r}from"./p-BtN0bCWb.js";import{i as t}from"./p-DMdnqqlQ.js";const c=class extends(o(t)){constructor(o){super(),e(this,o),this.scoutInputChange=a(this,"scoutInputChange"),this.scoutBlur=a(this,"scoutBlur"),this.scoutValidate=a(this,"scoutValidate"),this._scoutValidityChanged=a(this,"_scoutValidityChanged"),this._scoutInvalid=a(this,"_scoutInvalid"),this._scoutFieldId=a(this,"_scoutFieldId"),this.scoutChecked=a(this,"scoutChecked")}checked=!1;disabled=!1;ariaLabelledby;label;value;name;scoutChecked;onChange(o){const e=o.target;this.scoutChecked.emit({checked:e.checked,element:e})}render(){return r(this.label?.length?"label":"div",{key:"67b42b2b686fffecf891da832236fde663b740dc"},r("input",{key:"81821918d102e1ca809915c14a20aa0847f46e30",ref:o=>this.setInputRef(o),id:this.ariaId,type:"checkbox",value:this.value,name:this.name,class:"checkbox",style:{"--icon-checkbox":"url(data:image/svg+xml;base64,PHN2ZwogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB3aWR0aD0iMjQiCiAgaGVpZ2h0PSIyNCIKICB2aWV3Qm94PSIwIDAgMjQgMjQiCiAgZmlsbD0ibm9uZSIKICBzdHJva2U9ImN1cnJlbnRDb2xvciIKICBzdHJva2Utd2lkdGg9IjIiCiAgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIgogIHN0cm9rZS1saW5lam9pbj0icm91bmQiCiAgY2xhc3M9Imljb24gaWNvbi10YWJsZXIgaWNvbnMtdGFibGVyLW91dGxpbmUgaWNvbi10YWJsZXItY2hlY2siCj4KICA8cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KICA8cGF0aCBkPSJNNSAxMmw1IDVsMTAgLTEwIiAvPgo8L3N2Zz4=)"},"aria-labelledby":this.ariaLabelledby,"aria-disabled":this.disabled,disabled:this.disabled,checked:this.checked,onChange:o=>{this.onInput(),this.onChange(o)},onBlur:()=>this.onBlur(),onInvalid:()=>this.onInvalid()}),this.label)}static get watchers(){return{validity:[{runValidation:0}]}}};c.style='.checkbox.sc-scout-checkbox{width:var(--spacing-6);height:var(--spacing-6);-moz-appearance:none;appearance:none;-webkit-appearance:none;display:flex;align-content:center;justify-content:center;border-radius:3px;background-color:var(--color-text-brand-inverse);border:2px solid var(--color-gray-300);position:relative}@media (hover: hover){.checkbox.sc-scout-checkbox:hover{border:2px solid var(--color-gray-400);box-shadow:inset 0px 0px 5px 5px var(--color-background-brand-subtle-hovered);cursor:pointer}}.checkbox.sc-scout-checkbox:active{background-color:var(--color-background-brand-subtle-pressed)}@media (hover: hover){.checkbox.sc-scout-checkbox:checked:hover{background-color:var(--color-background-brand-hovered);border-color:var(--color-background-brand-hovered);box-shadow:none}}.checkbox.sc-scout-checkbox:checked{background-color:var(--color-background-brand-base);border-color:var(--color-background-brand-base)}.checkbox.sc-scout-checkbox::after{content:"";position:absolute;width:var(--spacing-10);height:var(--spacing-10);top:50%;left:50%;transform:translate(-50%, -50%)}.checkbox.sc-scout-checkbox:checked::before{content:"";background-color:var(--color-text-brand-inverse);width:var(--spacing-6);height:var(--spacing-6);position:absolute;top:50%;left:50%;right:0;bottom:0;transform:translate(-50%, -50%);-webkit-mask-image:var(--icon-checkbox);mask-image:var(--icon-checkbox);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.checkbox.sc-scout-checkbox:disabled{pointer-events:none;background-color:var(--color-gray-100);border-color:var(--color-gray-100)}label.sc-scout-checkbox{display:flex;align-items:center;gap:var(--spacing-2);font:var(--type-label-base);color:var(--color-text-base)}';const s=class extends(o(t)){constructor(o){super(),e(this,o),this.scoutInputChange=a(this,"scoutInputChange"),this.scoutBlur=a(this,"scoutBlur"),this.scoutValidate=a(this,"scoutValidate"),this._scoutValidityChanged=a(this,"_scoutValidityChanged"),this._scoutInvalid=a(this,"_scoutInvalid"),this._scoutFieldId=a(this,"_scoutFieldId"),this.scoutChecked=a(this,"scoutChecked")}checked=!1;disabled=!1;ariaLabelledby;label;value;name;scoutChecked;onChange(o){const e=o.target;this.scoutChecked.emit({checked:e.checked,element:e})}render(){return r(this.label?.length?"label":"div",{key:"22df090dcbf2f2b4b14b7cad8d34500295045f70"},r("input",{key:"3bcc5022fa6202fd1fe733c1a8430f7ed1a54cf4",ref:o=>this.setInputRef(o),id:this.ariaId,type:"radio",value:this.value,name:this.name,class:"radio","aria-labelledby":this.ariaLabelledby,"aria-disabled":this.disabled,disabled:this.disabled,checked:this.checked,onChange:o=>{this.onInput(),this.onChange(o)},onBlur:()=>this.onBlur(),onInvalid:()=>this.onInvalid()}),this.label)}static get watchers(){return{validity:[{runValidation:0}]}}};s.style='.radio.sc-scout-radio-button{width:var(--spacing-6);height:var(--spacing-6);-moz-appearance:none;appearance:none;-webkit-appearance:none;display:flex;align-content:center;justify-content:center;border-radius:100%;background-color:var(--color-white);border:2px solid var(--color-gray-300);position:relative}@media (hover: hover){.radio.sc-scout-radio-button:hover{border:2px solid var(--color-gray-400);box-shadow:inset 0px 0px 5px 5px var(--color-background-brand-subtle-hovered);cursor:pointer}}.radio.sc-scout-radio-button:active{background-color:var(--color-background-brand-subtle-pressed)}@media (hover: hover){.radio.sc-scout-radio-button:checked:hover{border-color:var(--color-background-brand-hovered);box-shadow:none}.radio.sc-scout-radio-button:checked:hover::before{background-color:var(--color-background-brand-hovered)}}.radio.sc-scout-radio-button:checked{border-color:var(--color-background-brand-base)}.radio.sc-scout-radio-button::after{content:"";position:absolute;width:var(--spacing-10);height:var(--spacing-10);top:50%;left:50%;transform:translate(-50%, -50%)}.radio.sc-scout-radio-button:checked::before{content:"";background-color:var(--color-background-brand-base);width:var(--spacing-4);height:var(--spacing-4);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:100%}.radio.sc-scout-radio-button:disabled{pointer-events:none;background-color:var(--color-gray-100);border-color:var(--color-gray-100)}label.sc-scout-radio-button{display:flex;align-items:center;gap:var(--spacing-2);font:var(--type-label-base);color:var(--color-text-base)}';export{c as scout_checkbox,s as scout_radio_button}
@@ -0,0 +1 @@
1
+ import{r as t,h as a,H as s}from"./p-BtN0bCWb.js";var e;!function(t){t.xs="2",t.s="4",t.m="8",t.l="12",t.xl="16",t.xxl="20"}(e||(e={}));const c=class{constructor(a){t(this,a)}direction="row";gapSize="m";render(){return a(s,{key:"cf8f24869700a8f07be858433970b07f77a15c70",style:{"--stack-flex-direction":`${this.direction}`,"--stack-gap-spacing":`var(--spacing-${e[this.gapSize]})`}},a("slot",{key:"5673836639ec9e40da4e6558b8e42029dda5ff95"}))}static get delegatesFocus(){return!0}};c.style=":host{display:flex;width:100%;flex-direction:var(--stack-flex-direction);gap:var(--stack-gap-spacing)}";export{c as scout_stack}
@@ -1 +1 @@
1
- import{r as o,c as t,h as r,H as a}from"./p-CBq_WkdR.js";const n=class{constructor(r){o(this,r),this.scoutClick=t(this,"scoutClick")}type="button";href;target;rel;size="medium";variant="outlined";icon;iconPosition="after";iconOnly=!1;scoutClick;render(){const o="link"===this.type?"a":"button",t="link"===this.type?{href:this.href,target:this.target,rel:this.rel??("_blank"===this.target?"noopener noreferrer":void 0)}:{type:this.type},n=this.icon&&r("span",{key:"9a16653774acda8b34ff428fbe21cca1e481c9e4",class:"icon",innerHTML:this.icon});return r(a,{key:"05da4122d7e1b6e80c5230b43c42de366c2a570a","data-size":this.size,"data-icon-only":this.iconOnly},r(o,{key:"d95abeb01118b1c00439aa66b308302bcded9871",class:`button ${this.variant}`,onClick:()=>this.scoutClick.emit(),...t},"before"===this.iconPosition&&n,r("span",{key:"623acd0ca7b801027515f52e5ff984769ccee5d8",class:"content"},r("slot",{key:"17ba121fdc0522f7a7857d7d8abd937fe51d105b"})),"after"===this.iconPosition&&n))}};n.style='scout-button{display:inline-block;height:var(--spacing-10);font:var(--type-body-base)}scout-button[data-size="large"]{height:var(--spacing-12);font:var(--type-body-lg)}scout-button .button{flex:1;display:inline-flex;width:100%;height:100%;align-items:center;justify-content:center;gap:var(--spacing-3);padding:0 var(--spacing-4);border-radius:var(--spacing-2);border:1px solid transparent;cursor:pointer;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box}scout-button[data-size="large"] .button{padding:0 var(--spacing-5)}scout-button .icon{width:var(--spacing-5);height:var(--spacing-5);margin:0 calc(var(--spacing-1) * -1)}scout-button .icon svg{width:100%;height:100%}scout-button[data-icon-only] .button{aspect-ratio:1 / 1;justify-content:center;padding:0}scout-button[data-icon-only] .icon{margin:0}scout-button[data-icon-only] .content{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}scout-button .button.primary{background-color:var(--color-background-brand-base);color:var(--color-text-brand-inverse)}@media (hover: hover){scout-button .button.primary:hover{background-color:var(--color-background-brand-hovered)}}scout-button .button.primary:active{background-color:var(--color-background-brand-pressed)}scout-button .button.outlined{background-color:transparent;border-color:var(--color-background-brand-subtle-base);color:var(--color-text-brand-base)}@media (hover: hover){scout-button .button.outlined:hover{background-color:var(--color-background-brand-subtle-hovered)}}scout-button .button.outlined:active{background-color:var(--color-background-brand-subtle-pressed)}scout-button .button.text{background-color:transparent;border-color:transparent;color:var(--color-text-brand-base)}@media (hover: hover){scout-button .button.text:hover{background-color:var(--color-background-brand-subtle-hovered)}}scout-button .button.text:active{background-color:var(--color-background-brand-subtle-pressed)}scout-button .button.caution{background-color:var(--color-background-caution-bold-base);color:var(--color-text-caution-bold-base)}@media (hover: hover){scout-button .button.caution:hover{background-color:var(--color-background-caution-bold-hovered)}}scout-button .button.caution:active{background-color:var(--color-background-caution-bold-pressed)}scout-button .button.danger{background-color:var(--color-background-danger-bold-base);color:var(--color-text-danger-bold-base)}@media (hover: hover){scout-button .button.danger:hover{background-color:var(--color-background-danger-bold-hovered)}}scout-button .button.danger:active{background-color:var(--color-background-danger-bold-pressed)}';export{n as scout_button}
1
+ import{r as o,c as t,h as r,H as a}from"./p-BtN0bCWb.js";const n=class{constructor(r){o(this,r),this.scoutClick=t(this,"scoutClick")}type="button";href;target;rel;size="medium";variant="outlined";icon;iconPosition="after";iconOnly=!1;scoutClick;render(){const o="link"===this.type?"a":"button",t="link"===this.type?{href:this.href,target:this.target,rel:this.rel??("_blank"===this.target?"noopener noreferrer":void 0)}:{type:this.type},n=this.icon&&r("span",{key:"9a16653774acda8b34ff428fbe21cca1e481c9e4",class:"icon",innerHTML:this.icon});return r(a,{key:"05da4122d7e1b6e80c5230b43c42de366c2a570a","data-size":this.size,"data-icon-only":this.iconOnly},r(o,{key:"d95abeb01118b1c00439aa66b308302bcded9871",class:`button ${this.variant}`,onClick:()=>this.scoutClick.emit(),...t},"before"===this.iconPosition&&n,r("span",{key:"623acd0ca7b801027515f52e5ff984769ccee5d8",class:"content"},r("slot",{key:"17ba121fdc0522f7a7857d7d8abd937fe51d105b"})),"after"===this.iconPosition&&n))}};n.style='scout-button{display:inline-block;height:var(--spacing-10);font:var(--type-body-base)}scout-button[data-size="large"]{height:var(--spacing-12);font:var(--type-body-lg)}scout-button .button{flex:1;display:inline-flex;width:100%;height:100%;align-items:center;justify-content:center;gap:var(--spacing-3);padding:0 var(--spacing-4);border-radius:var(--spacing-2);border:1px solid transparent;cursor:pointer;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box}scout-button[data-size="large"] .button{padding:0 var(--spacing-5)}scout-button .icon{width:var(--spacing-5);height:var(--spacing-5);margin:0 calc(var(--spacing-1) * -1)}scout-button .icon svg{width:100%;height:100%}scout-button[data-icon-only] .button{aspect-ratio:1 / 1;justify-content:center;padding:0}scout-button[data-icon-only] .icon{margin:0}scout-button[data-icon-only] .content{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}scout-button .button.primary{background-color:var(--color-background-brand-base);color:var(--color-text-brand-inverse)}@media (hover: hover){scout-button .button.primary:hover{background-color:var(--color-background-brand-hovered)}}scout-button .button.primary:active{background-color:var(--color-background-brand-pressed)}scout-button .button.outlined{background-color:transparent;border-color:var(--color-background-brand-subtle-base);color:var(--color-text-brand-base)}@media (hover: hover){scout-button .button.outlined:hover{background-color:var(--color-background-brand-subtle-hovered)}}scout-button .button.outlined:active{background-color:var(--color-background-brand-subtle-pressed)}scout-button .button.text{background-color:transparent;border-color:transparent;color:var(--color-text-brand-base)}@media (hover: hover){scout-button .button.text:hover{background-color:var(--color-background-brand-subtle-hovered)}}scout-button .button.text:active{background-color:var(--color-background-brand-subtle-pressed)}scout-button .button.caution{background-color:var(--color-background-caution-bold-base);color:var(--color-text-caution-bold-base)}@media (hover: hover){scout-button .button.caution:hover{background-color:var(--color-background-caution-bold-hovered)}}scout-button .button.caution:active{background-color:var(--color-background-caution-bold-pressed)}scout-button .button.danger{background-color:var(--color-background-danger-bold-base);color:var(--color-text-danger-bold-base)}@media (hover: hover){scout-button .button.danger:hover{background-color:var(--color-background-danger-bold-hovered)}}scout-button .button.danger:active{background-color:var(--color-background-danger-bold-pressed)}';export{n as scout_button}
@@ -0,0 +1 @@
1
+ import{r as t,h as s,a as r}from"./p-BtN0bCWb.js";const a=class{constructor(s){t(this,s)}imageSrc="";alt="";render(){return s("img",{src:(()=>{if(this.imageSrc)return this.imageSrc;try{return r("assets/fallbackImage.png")}catch(t){return console.info("In storybook, rendering from storybook asset"),"fallbackImage.png"}})(),alt:this.alt})}static get delegatesFocus(){return!0}static get assetsDirs(){return["assets"]}};a.style=":host{display:flex;aspect-ratio:1 / 1}img{border-radius:50%}";export{a as scout_avatar}
@@ -0,0 +1 @@
1
+ import{r,h as t,H as o}from"./p-BtN0bCWb.js";const s=class{constructor(t){r(this,t)}render(){return t(o,{key:"6a4d3d0bed1689875ec867b16f0c77f391662fc8"})}static get delegatesFocus(){return!0}};s.style=":host{display:block;height:1px;background-color:var(--color-gray-200)}";export{s as scout_divider}
@@ -1 +1 @@
1
- import{r as e,a as t,h as a}from"./p-CBq_WkdR.js";const l=class{constructor(t){e(this,t)}label;helpText;inputId;errorText=null;errorHidden=!1;get hostElement(){return t(this)}catchFieldId(e){e.stopPropagation(),this.inputId=e.detail}handleValidation(e){const{element:t}=e.detail;this.errorHidden=!0,this.errorText=t.validity.valid?null:t.validationMessage}showError(){this.errorHidden=!1}render(){return a("div",{key:"b2b20acd9c1e41294bfbb8ce7e450e23142c5606",class:"field"},a("label",{key:"7b375df7d5a5e4bbe44ae963775c58a6c27b5479",htmlFor:this.inputId,class:"label"},this.label),a("slot",{key:"c5783c044aa82977cd21a56df4f838af95bc0bf3"}),a("p",{key:"38df5a4f28432e046bb95fed66d6c1972e1d7adc",class:"error-text","aria-live":"polite"},!this.errorHidden&&this.errorText),this.helpText&&a("p",{key:"1f84da3fad92b45ac1cf3b8d1fad75276b7f8359",class:"help-text"},this.helpText))}};l.style=".field.sc-scout-field{display:flex;flex-direction:column}.label.sc-scout-field{font:var(--type-label-sm);font-weight:600;color:var(--color-text-base)}.error-text.sc-scout-field{font:var(--type-label-sm);color:var(--color-text-danger-base);margin:var(--spacing-1) 0 0 0}.error-text.sc-scout-field:empty{margin:0}.help-text.sc-scout-field{font:var(--type-label-sm);color:var(--color-gray-600);margin:var(--spacing-1) 0 0 0}";export{l as scout_field}
1
+ import{r as e,d as t,h as a}from"./p-BtN0bCWb.js";const l=class{constructor(t){e(this,t)}label;helpText;inputId;errorText=null;errorHidden=!1;get hostElement(){return t(this)}catchFieldId(e){e.stopPropagation(),this.inputId=e.detail}handleValidation(e){const{element:t}=e.detail;this.errorHidden=!0,this.errorText=t.validity.valid?null:t.validationMessage}showError(){this.errorHidden=!1}render(){return a("div",{key:"b2b20acd9c1e41294bfbb8ce7e450e23142c5606",class:"field"},a("label",{key:"7b375df7d5a5e4bbe44ae963775c58a6c27b5479",htmlFor:this.inputId,class:"label"},this.label),a("slot",{key:"c5783c044aa82977cd21a56df4f838af95bc0bf3"}),a("p",{key:"38df5a4f28432e046bb95fed66d6c1972e1d7adc",class:"error-text","aria-live":"polite"},!this.errorHidden&&this.errorText),this.helpText&&a("p",{key:"1f84da3fad92b45ac1cf3b8d1fad75276b7f8359",class:"help-text"},this.helpText))}};l.style=".field.sc-scout-field{display:flex;flex-direction:column}.label.sc-scout-field{font:var(--type-label-sm);font-weight:600;color:var(--color-text-base)}.error-text.sc-scout-field{font:var(--type-label-sm);color:var(--color-text-danger-base);margin:var(--spacing-1) 0 0 0}.error-text.sc-scout-field:empty{margin:0}.help-text.sc-scout-field{font:var(--type-label-sm);color:var(--color-gray-600);margin:var(--spacing-1) 0 0 0}";export{l as scout_field}
@@ -0,0 +1 @@
1
+ import{r as t,c as s,d as a,h as e,H as i}from"./p-BtN0bCWb.js";const r=class{constructor(a){t(this,a),this.scoutChange=s(this,"scoutChange")}value=0;scoutChange;widths=[];lefts=[];get el(){return a(this)}render(){return e(i,{key:"929deee05337a8f617c4e429db7b79a210d4aa9d"},e("slot",{key:"1fe4833315de956310d25206d5bcc5cd82be93cf"}),this.getIndicator())}componentDidLoad(){this.updateChildrenClasses(),this.calculateIndicatorSizes()}getIndicator(){return e("div",{"aria-hidden":"true",class:"indicator",style:{width:`${this.widths[this.value]||0}px`,transform:`translateX(${this.lefts[this.value]||0}px)`}})}handleClick(t){const s=t.target,a=Array.from(this.el.children).indexOf(s);-1!==a&&a!==this.value&&this.scoutChange.emit({value:a})}updateChildrenClasses(){Array.from(this.el.children).forEach(((t,s)=>{const a=t;s===this.value?a.setAttribute("data-active","true"):a.removeAttribute("data-active")}))}calculateIndicatorSizes(){this.widths=Array.from(this.el.children).map((t=>t.offsetWidth)),this.lefts=this.widths.map(((t,s)=>this.widths.slice(0,s).reduce(((t,s)=>t+s),0)))}static get delegatesFocus(){return!0}static get watchers(){return{value:[{updateChildrenClasses:0},{calculateIndicatorSizes:0}]}}};r.style=":host{position:relative;width:100%;display:flex;height:var(--spacing-12);--tabs-indicator-height:2px}.indicator{position:absolute;bottom:0;left:0;width:0;height:var(--tabs-indicator-height);background-color:var(--color-background-brand-base);transition:all 0.3s ease}";export{r as scout_tabs}
@@ -1 +1 @@
1
- import{r as t,h as r}from"./p-CBq_WkdR.js";const a=class{constructor(r){t(this,r)}render(){return r("button",{key:"59f92f5a3d9b5a022a78d9adc7756bda10b68be3",class:"button-native",type:"button"},r("div",{key:"96fc99711da308360451041dd44e21391c08d6eb",class:"inner-container"},r("slot",{key:"83234bf67c2605179c7d80febbc6d0fbff730670"})))}static get delegatesFocus(){return!0}};a.style=":host{flex:1;display:block;width:auto}.button-native{position:relative;display:block;width:100%;height:100%;color:var(--color-gray-600);background-color:transparent;border:none;cursor:pointer;padding:var(--spacing-1) var(--spacing-1) calc(var(--spacing-1) + var(--tabs-indicator-height)) var(--spacing-1);font-weight:500;text-transform:uppercase;font-size:0.875rem;letter-spacing:0.04em}.inner-container{display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:var(--spacing-2);background-color:transparent}.button-native:hover{color:var(--color-text-base)}.button-native:hover .inner-container{background-color:var(--color-background-brand-subtle-hovered)}:host([data-active]) .button-native{color:var(--color-text-base)}";export{a as scout_tabs_tab}
1
+ import{r as t,h as a}from"./p-BtN0bCWb.js";const e=class{constructor(a){t(this,a)}render(){return a("button",{key:"ba1a973a3eaf5e02ca19525aa1bb66616d5b56ac",class:"button-native",type:"button"},a("div",{key:"f0daa636e1b3d0058d198e469e0f4874c37a7ca1",class:"inner-container"},a("slot",{key:"19587f0a7794cbfa646c383e0b57ffb90ce4b67c"})))}static get delegatesFocus(){return!0}};e.style=":host{flex:1;display:block;width:auto}.button-native{position:relative;display:block;width:100%;height:100%;color:var(--color-gray-600);background-color:transparent;border:none;cursor:pointer;padding:var(--spacing-1) var(--spacing-1) calc(var(--spacing-1) + var(--tabs-indicator-height)) var(--spacing-1);font-weight:500;text-transform:uppercase;font-size:0.875rem;letter-spacing:0.04em}.inner-container{display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:var(--spacing-2);background-color:transparent}.button-native:hover{color:var(--color-text-base)}.button-native:hover .inner-container{background-color:var(--color-background-brand-subtle-hovered)}:host([data-active]) .button-native{color:var(--color-text-base)}";export{e as scout_tabs_tab}
@@ -1 +1 @@
1
- import{r as t,c as e,h as r}from"./p-CBq_WkdR.js";const o=class{constructor(r){t(this,r),this.scoutLinkClick=e(this,"scoutLinkClick")}href;label;rel;linkAriaLabel;type="link";target="_self";scoutLinkClick;render(){if("button"===this.type)return r("button",{type:"button","aria-label":this.linkAriaLabel||"",onClick:()=>this.scoutLinkClick.emit()},this.label);if(!this.href)throw new Error("Href is requied when type is set to link");return r("a",{href:this.href,target:this.target,"aria-label":this.linkAriaLabel||"",rel:this.rel??("_blank"===this.target?"noopener noreferrer":void 0)},this.label)}static get delegatesFocus(){return!0}};o.style=":host{display:inline}a,button{color:var(--color-text-brand-base);-webkit-text-decoration:none;text-decoration:none}@media (hover: hover){a:hover,button:hover{-webkit-text-decoration:underline;text-decoration:underline;color:var(--color-background-brand-hover)}}a:active,button:active{color:var(--color-background-brand-pressed)}button{display:inline;background:none;border:none;padding:0;cursor:pointer}";export{o as scout_link}
1
+ import{r as t,c as e,h as r}from"./p-BtN0bCWb.js";const o=class{constructor(r){t(this,r),this.scoutLinkClick=e(this,"scoutLinkClick")}href;label;rel;linkAriaLabel;type="link";target="_self";scoutLinkClick;render(){if("button"===this.type)return r("button",{type:"button","aria-label":this.linkAriaLabel||"",onClick:()=>this.scoutLinkClick.emit()},this.label);if(!this.href)throw new Error("Href is requied when type is set to link");return r("a",{href:this.href,target:this.target,"aria-label":this.linkAriaLabel||"",rel:this.rel??("_blank"===this.target?"noopener noreferrer":void 0)},this.label)}static get delegatesFocus(){return!0}};o.style=":host{display:inline}a,button{color:var(--color-text-brand-base);-webkit-text-decoration:none;text-decoration:none}@media (hover: hover){a:hover,button:hover{-webkit-text-decoration:underline;text-decoration:underline;color:var(--color-background-brand-hover)}}a:active,button:active{color:var(--color-background-brand-pressed)}button{display:inline;background:none;border:none;padding:0;cursor:pointer}";export{o as scout_link}
@@ -0,0 +1 @@
1
+ import{r as n,c as t,d as r,h as e}from"./p-BtN0bCWb.js";var o="data-focus-lock",i=function(n){for(var t=Array(n.length),r=0;r<n.length;++r)t[r]=n[r];return t},a=function(n){return Array.isArray(n)?n:[n]},u=function(n){return Array.isArray(n)?n[0]:n},c=function(n){return n.parentNode&&n.parentNode.nodeType===Node.DOCUMENT_FRAGMENT_NODE?n.parentNode.host:n.parentNode},s=function(n){return n===document||n&&n.nodeType===Node.DOCUMENT_NODE},d=function(n,t){var r=n.get(t);if(void 0!==r)return r;var e=function(n,t){return!n||s(n)||!function(n){if(n.nodeType!==Node.ELEMENT_NODE)return!1;var t=window.getComputedStyle(n,null);return!(!t||!t.getPropertyValue||"none"!==t.getPropertyValue("display")&&"hidden"!==t.getPropertyValue("visibility"))}(n)&&t(c(n))}(t,d.bind(void 0,n));return n.set(t,e),e},f=function(n,t){var r=n.get(t);if(void 0!==r)return r;var e=function(n,t){return!(n&&!s(n))||!!p(n)&&t(c(n))}(t,f.bind(void 0,n));return n.set(t,e),e},l=function(n){return n.dataset},h=function(n){return"INPUT"===n.tagName},v=function(n){return h(n)&&"radio"===n.type},p=function(n){var t=n.getAttribute("data-no-autofocus");return![!0,"true",""].includes(t)},b=function(n){var t;return Boolean(n&&(null===(t=l(n))||void 0===t?void 0:t.focusGuard))},m=function(n){return!b(n)},w=function(n){return Boolean(n)},g=function(n,t){var r=n.tabIndex-t.tabIndex;if(r){if(!n.tabIndex)return 1;if(!t.tabIndex)return-1}return r||n.index-t.index},k=function(n,t){return i(n).map((function(n,t){return{node:n,index:t,tabIndex:n.tabIndex}})).filter((function(n){return!t||n.tabIndex>=0})).sort(g)},x=["button:enabled","select:enabled","textarea:enabled","input:enabled","a[href]","area[href]","summary","iframe","object","embed","audio[controls]","video[controls]","[tabindex]","[contenteditable]","[autofocus]"].join(","),y=function(n){return i((n.shadowRoot||n).children).reduce((function(n,t){return n.concat(t.matches(x)?[t]:[],y(t))}),[])},B=function(n){return n.reduce((function(n,t){var r,e=y(t),o=(r=[]).concat.apply(r,e.map((function(n){return function(n){var t;return n instanceof HTMLIFrameElement&&(null===(t=n.contentDocument)||void 0===t?void 0:t.body)?B([n.contentDocument.body]):[n]}(n)})));return n.concat(o,t.parentNode?i(t.parentNode.querySelectorAll(x)).filter((function(n){return n===t})):[])}),[])},C=function(n,t){return i(n).filter((function(n){return d(t,n)})).filter((function(n){return function(n){return!((h(n)||function(n){return"BUTTON"===n.tagName}(n))&&("hidden"===n.type||n.disabled))}(n)}))},M=function(n,t){return void 0===t&&(t=new Map),i(n).filter((function(n){return f(t,n)}))},O=function(n,t){return k(C(B(n),t),!1)},L=function(n,t){return n.shadowRoot?L(n.shadowRoot,t):!(void 0===Object.getPrototypeOf(n).contains||!Object.getPrototypeOf(n).contains.call(n,t))||i(n.children).some((function(n){var r;if(n instanceof HTMLIFrameElement){var e=null===(r=n.contentDocument)||void 0===r?void 0:r.body;return!!e&&L(e,t)}return L(n,t)}))},N=function(n){return n.parentNode?N(n.parentNode):n},T=function(n){return a(n).filter(Boolean).reduce((function(n,t){var r=t.getAttribute(o);return n.push.apply(n,r?function(n){for(var t=new Set,r=n.length,e=0;e<r;e+=1)for(var o=e+1;o<r;o+=1){var i=n[e].compareDocumentPosition(n[o]);(i&Node.DOCUMENT_POSITION_CONTAINED_BY)>0&&t.add(o),(i&Node.DOCUMENT_POSITION_CONTAINS)>0&&t.add(e)}return n.filter((function(n,r){return!t.has(r)}))}(i(N(t).querySelectorAll("[".concat(o,'="').concat(r,'"]:not([').concat("data-focus-lock-disabled",'="disabled"])')))):[t]),n}),[])},j=function(n){if(void 0===n&&(n=document),n&&n.activeElement){var t=n.activeElement;return t.shadowRoot?j(t.shadowRoot):t instanceof HTMLIFrameElement&&function(){try{return t.contentWindow.document}catch(n){return}}()?j(t.contentWindow.document):t}},E=function(n,t){return v(n)&&n.name?function(n,t){return t.filter(v).filter((function(t){return t.name===n.name})).filter((function(n){return n.checked}))[0]||n}(n,t):n},H=function(n,t){return n.length>1?n.indexOf(E(n[t],n)):t},S="NEW_FOCUS",F=function(n,t,r){var e,o=n.map((function(n){return n.node})),i=M(o.filter((e=r,function(n){var t,r=null===(t=l(n))||void 0===t?void 0:t.autofocus;return n.autofocus||void 0!==r&&"false"!==r||e.indexOf(n)>=0})));return function(n){return n[0]&&n.length>1?E(n[0],n):n[0]}(i&&i.length?i:M(t))},z=function(n,t){return void 0===t&&(t=[]),t.push(n),n.parentNode&&z(n.parentNode.host||n.parentNode,t),t},I=function(n,t){for(var r=z(n),e=z(t),o=0;o<r.length;o+=1){var i=r[o];if(e.indexOf(i)>=0)return i}return!1},X=function(n,t){var r=j(a(n).length>0?document:u(n).ownerDocument),e=T(n).filter(m),o=function(n,t,r){var e=a(n),o=a(t),i=e[0],u=!1;return o.filter(Boolean).forEach((function(n){u=I(u||n,n)||u,r.filter(Boolean).forEach((function(n){var t=I(i,n);t&&(u=!u||L(t,u)?t:I(t,u))}))})),u}(r||n,n,e),c=new Map,s=O(e,c),d=function(n,t){return k(C(B(n),t),!0)}(e,c).filter((function(n){return m(n.node)}));if(d[0]||(d=s)[0]){var f,l,h,v=O([o],c).map((function(n){return n.node})),p=(f=v,l=d,h=new Map,l.forEach((function(n){return h.set(n.node,n)})),f.map((function(n){return h.get(n)})).filter(w)),g=p.map((function(n){return n.node})),x=function(n,t,r,e){var o=n.length,i=n[0],a=n[o-1],u=b(r);if(!(r&&n.indexOf(r)>=0)){var c,s,d=void 0!==r?t.indexOf(r):-1,f=e?t.indexOf(e):d,l=e?n.indexOf(e):-1,h=d-f,v=t.indexOf(i),p=t.indexOf(a),m=(c=t,s=new Set,c.forEach((function(n){return s.add(E(n,c))})),c.filter((function(n){return s.has(n)}))),w=(void 0!==r?m.indexOf(r):-1)-(e?m.indexOf(e):d),g=H(n,0),k=H(n,o-1);return-1===d||-1===l?S:!h&&l>=0?l:d<=v&&u&&Math.abs(h)>1?k:d>=p&&u&&Math.abs(h)>1?g:h&&Math.abs(w)>1?l:d<=v?k:d>p?g:h?Math.abs(h)>1?l:(o+l+h)%o:void 0}}(g,v,r,t);if(x===S){var y=F(s,g,function(n,t){return n.reduce((function(n,r){return n.concat(function(n,t){return C((r=n.querySelectorAll("[".concat("data-autofocus-inside","]")),i(r).map((function(n){return B([n])})).reduce((function(n,t){return n.concat(t)}),[])),t);var r}(r,t))}),[])}(e,c));return y?{node:y}:void console.warn("focus-lock: cannot find any node to move focus into")}return void 0===x?x:p[x]}},Y=0,A=!1,W=0,D=null,U=function(){var n,t,r=!1;if(W){var e=W;document&&document.activeElement===document.body||function(n){void 0===n&&(n=document);var t=j(n);return!!t&&i(n.querySelectorAll("[".concat("data-no-focus-lock","]"))).some((function(n){return L(n,t)}))}()||(e&&(n=e,void 0===t&&(t=j(u(n).ownerDocument)),!(!(!t||t.dataset&&t.dataset.focusGuard)&&T(n).some((function(n){return L(n,t)||function(n,t){return Boolean(i(n.querySelectorAll("iframe")).some((function(n){return function(n,t){return n===t}(n,t)})))}(n,t)}))))&&(r=function(n,t,r){void 0===r&&(r={});var e,o=X(n,D);if(!A&&o){if(Y>2)return console.error("FocusLock: focus-fighting detected. Only one focus management system could be active. See https://github.com/theKashey/focus-lock/#focus-fighting"),A=!0,void setTimeout((function(){A=!1}),1);Y++,"focus"in(e=o.node)&&e.focus(r.focusOptions),"contentWindow"in e&&e.contentWindow&&e.contentWindow.focus(),Y--}}(e)),D=document.activeElement)}return r},P=[],_=function(n){return t=P.filter((function(n){return n})).slice(-1)[0],W=t,!!void(t&&U())&&(n&&n.preventDefault(),!0);var t};const K=class{constructor(r){n(this,r),this.backButtonClicked=t(this,"backButtonClicked"),this.exitButtonClicked=t(this,"exitButtonClicked")}get rootElement(){return r(this)}open=!1;heading="";showBackButton=!1;backButtonLabel="";showExitButton=!1;exitButtonLabel="";disableBackdrop=!1;disableContentPadding=!1;drawerState="closed";focusedNode=null;componentWillLoad(){this.focusedNode=document.activeElement}componentDidLoad(){this.open&&this.setDrawerOpenState(!0)}disconnectedCallback(){}backButtonClicked;exitButtonClicked;onBackButtonClick(){this.backButtonClicked.emit()}onExitButtonClick(){this.exitButtonClicked.emit()}setDrawerOpenState(n){const t=this.rootElement.shadowRoot.querySelector(".drawer--container");var r;t||(this.drawerState=n?"opening":"closing"),n?(this.drawerState="opening",r=t,0===P.length&&document.addEventListener("focusin",_),P.indexOf(r)<0&&(P.push(r),_())):(function(n){P=P.filter((function(t){return t!==n})),_(),0===P.length&&document.removeEventListener("focusin",_)}(t),this.drawerState="closing")}render(){const n=this.heading||this.showBackButton||this.showExitButton;return e("div",{class:"drawer"},!this.disableBackdrop&&e("div",{onClick:()=>{this.onExitButtonClick()},class:"backdrop "+("closed"!==this.drawerState?"backdrop-visible":"backdrop-hidden")}),e("div",{class:`drawer--container ${(()=>{switch(this.drawerState){case"opening":case"open":return"open";case"closing":return"close"}})()}`,onAnimationEnd:()=>{this.drawerState=this.open?"open":"closed"}},n&&e("div",{class:"header--wrapper"},this.showBackButton&&e("button",{type:"button",class:"back-button",onClick:()=>this.onBackButtonClick()},e("span",{class:"icon",innerHTML:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-arrow-left"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l14 0" /><path d="M5 12l6 6" /><path d="M5 12l6 -6" /></svg>'}),e("span",{class:"visually-hidden"},this.backButtonLabel)),this.showExitButton&&e("button",{type:"button",class:"exit-button",onClick:()=>this.onExitButtonClick()},e("span",{class:"icon",innerHTML:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-x"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 6l-12 12" /><path d="M6 6l12 12" /></svg>'}),e("span",{class:"visually-hidden"},this.exitButtonLabel)),this.heading&&e("h3",{class:"heading"},this.heading)),e("div",{class:!this.disableContentPadding&&"content--wrapper"},e("slot",null))))}static get delegatesFocus(){return!0}static get watchers(){return{open:[{setDrawerOpenState:0}]}}};K.style=".drawer{width:100%}.drawer--container{position:fixed;bottom:0;right:0;left:0;height:90%;width:100%;transform:translateY(100%);background-color:#fefefe;box-shadow:0 0 20px 3px var(--color-gray-200);border-top-left-radius:var(--spacing-5);border-top-right-radius:var(--spacing-5);overflow:hidden;margin:0;z-index:101}@keyframes drawerOpen{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes drawerClose{from{transform:translateY(0)}to{transform:translateY(100%)}}.open{animation:drawerOpen 0.3s ease-in-out forwards}.close{animation:drawerClose 0.3s ease-in-out forwards}@media screen and (min-width: 901px){@keyframes drawerOpen{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes drawerClose{from{transform:translateX(0)}to{transform:translateX(100%)}}.drawer--container{top:0;bottom:0;right:0;left:auto;left:initial;height:100%;max-height:100%;max-width:90%;min-height:600px;width:430px;transform:translateX(100%);border-top-left-radius:var(--spacing-5);border-bottom-left-radius:var(--spacing-5);border-top-right-radius:0}.open{animation:drawerOpen 0.3s ease-in-out forwards}.close{animation:drawerClose 0.3s ease-in-out forwards}}.backdrop{position:fixed;top:0;bottom:0;left:0;right:0;transition:opacity 0.2s;z-index:100}.backdrop-hidden{opacity:0}.backdrop-visible{opacity:0.6;pointer-events:all;background-color:var(--color-gray-200)}.header--wrapper{display:flex;position:relative;width:100%;height:var(--spacing-20);flex-direction:row;justify-content:center;align-items:center}.heading{font:var(--type-body-lg);font-weight:600;color:var(--color-text-base)}.content--wrapper{padding:0 var(--spacing-7)}button{z-index:2;pointer-events:all;cursor:pointer;background:none;box-shadow:none;position:absolute;border:none;width:24px;height:24px;padding:24px;display:flex;align-items:center;justify-content:center}.exit-button{right:var(--spacing-3)}.back-button{left:var(--spacing-3)}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}";export{K as scout_drawer}