@crowdstrike/glide-core 0.26.1 → 0.27.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 (98) hide show
  1. package/dist/accordion.d.ts +2 -2
  2. package/dist/accordion.js +1 -1
  3. package/dist/button-group.button.d.ts +2 -2
  4. package/dist/button-group.button.js +1 -1
  5. package/dist/button-group.d.ts +3 -3
  6. package/dist/button-group.js +1 -1
  7. package/dist/button.d.ts +2 -2
  8. package/dist/button.js +1 -1
  9. package/dist/checkbox-group.d.ts +3 -3
  10. package/dist/checkbox-group.js +9 -9
  11. package/dist/checkbox.d.ts +2 -3
  12. package/dist/checkbox.js +3 -3
  13. package/dist/checkbox.styles.js +8 -16
  14. package/dist/drawer.d.ts +2 -2
  15. package/dist/drawer.js +1 -1
  16. package/dist/dropdown.d.ts +6 -12
  17. package/dist/dropdown.js +47 -49
  18. package/dist/dropdown.option.d.ts +2 -3
  19. package/dist/dropdown.option.js +1 -1
  20. package/dist/dropdown.option.styles.js +16 -79
  21. package/dist/dropdown.styles.js +8 -26
  22. package/dist/form-controls-layout.d.ts +3 -3
  23. package/dist/form-controls-layout.js +1 -1
  24. package/dist/icon-button.d.ts +2 -2
  25. package/dist/icon-button.js +1 -1
  26. package/dist/inline-alert.d.ts +2 -2
  27. package/dist/inline-alert.js +1 -1
  28. package/dist/input.d.ts +2 -2
  29. package/dist/input.js +2 -2
  30. package/dist/label.d.ts +2 -2
  31. package/dist/label.js +1 -1
  32. package/dist/label.styles.js +5 -1
  33. package/dist/library/assert-slot.d.ts +1 -1
  34. package/dist/library/assert-slot.test.js +22 -22
  35. package/dist/library/expect-window-error.js +1 -1
  36. package/dist/library/final.test.js +9 -9
  37. package/dist/library/localize.test.js +6 -6
  38. package/dist/library/required.test.js +5 -5
  39. package/dist/library/unique-id.d.ts +2 -0
  40. package/dist/library/unique-id.js +1 -0
  41. package/dist/link.d.ts +2 -3
  42. package/dist/link.js +1 -1
  43. package/dist/link.styles.js +1 -1
  44. package/dist/menu.button.d.ts +2 -2
  45. package/dist/menu.button.js +1 -1
  46. package/dist/menu.d.ts +3 -9
  47. package/dist/menu.js +1 -1
  48. package/dist/menu.link.d.ts +2 -2
  49. package/dist/menu.link.js +1 -1
  50. package/dist/menu.options.d.ts +3 -4
  51. package/dist/menu.options.js +1 -1
  52. package/dist/menu.options.styles.js +6 -19
  53. package/dist/modal.d.ts +6 -6
  54. package/dist/modal.icon-button.d.ts +2 -2
  55. package/dist/modal.icon-button.js +1 -1
  56. package/dist/modal.js +1 -1
  57. package/dist/popover.d.ts +2 -2
  58. package/dist/popover.js +1 -1
  59. package/dist/radio-group.d.ts +3 -3
  60. package/dist/radio-group.js +6 -6
  61. package/dist/radio-group.radio.d.ts +2 -2
  62. package/dist/radio-group.radio.js +1 -1
  63. package/dist/spinner.d.ts +2 -2
  64. package/dist/spinner.js +1 -1
  65. package/dist/split-button.d.ts +4 -10
  66. package/dist/split-button.js +1 -1
  67. package/dist/split-button.primary-button.d.ts +2 -2
  68. package/dist/split-button.primary-button.js +1 -1
  69. package/dist/split-button.primary-button.styles.js +4 -14
  70. package/dist/split-button.primary-link.d.ts +2 -2
  71. package/dist/split-button.primary-link.js +1 -1
  72. package/dist/split-button.secondary-button.d.ts +3 -4
  73. package/dist/split-button.secondary-button.js +1 -1
  74. package/dist/split-button.secondary-button.styles.js +4 -15
  75. package/dist/tab.d.ts +12 -4
  76. package/dist/tab.group.d.ts +4 -5
  77. package/dist/tab.group.js +1 -1
  78. package/dist/tab.group.styles.js +14 -16
  79. package/dist/tab.js +1 -1
  80. package/dist/tab.panel.d.ts +12 -5
  81. package/dist/tab.panel.js +1 -1
  82. package/dist/tag.d.ts +2 -4
  83. package/dist/tag.js +1 -1
  84. package/dist/tag.styles.js +7 -52
  85. package/dist/textarea.d.ts +2 -2
  86. package/dist/textarea.js +7 -7
  87. package/dist/textarea.styles.js +2 -1
  88. package/dist/toast.d.ts +3 -3
  89. package/dist/toast.js +1 -1
  90. package/dist/toast.toasts.d.ts +9 -9
  91. package/dist/toast.toasts.js +17 -17
  92. package/dist/toggle.d.ts +2 -2
  93. package/dist/toggle.js +1 -1
  94. package/dist/tooltip.container.d.ts +2 -2
  95. package/dist/tooltip.container.js +1 -1
  96. package/dist/tooltip.d.ts +3 -3
  97. package/dist/tooltip.js +1 -1
  98. package/package.json +4 -4
@@ -140,6 +140,8 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
140
140
  }
141
141
 
142
142
  .options {
143
+ --private-option-height: 1.75rem;
144
+
143
145
  box-sizing: border-box;
144
146
  max-block-size: calc(
145
147
  var(--private-option-height) * 9 + var(--glide-core-spacing-base-xxxs) *
@@ -148,14 +150,6 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
148
150
  overflow: auto;
149
151
  scroll-behavior: smooth;
150
152
 
151
- &.large {
152
- --private-option-height: 1.75rem;
153
- }
154
-
155
- &.small {
156
- --private-option-height: 1.25rem;
157
- }
158
-
159
153
  &.hidden {
160
154
  display: none;
161
155
  }
@@ -185,35 +179,23 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
185
179
  }
186
180
 
187
181
  .add-button {
182
+ --private-size: 1rem;
183
+
188
184
  align-items: center;
189
185
  background-color: transparent;
190
186
  border: none;
191
187
  border-radius: var(--glide-core-rounding-base-radius-md);
188
+ column-gap: 0.625rem;
192
189
  display: flex;
193
190
  font-family: var(--glide-core-typography-family-primary);
191
+ font-size: var(--glide-core-typography-size-body-default);
194
192
  font-weight: var(--glide-core-typography-weight-regular);
195
193
  inline-size: 100%;
196
194
  line-height: 100%;
195
+ padding-block: 0.375rem;
196
+ padding-inline: var(--glide-core-spacing-base-sm);
197
197
  text-align: start;
198
198
 
199
- &.large {
200
- --private-size: 1rem;
201
-
202
- column-gap: 0.625rem;
203
- font-size: var(--glide-core-typography-size-body-default);
204
- padding-block: 0.375rem;
205
- padding-inline: var(--glide-core-spacing-base-sm);
206
- }
207
-
208
- &.small {
209
- --private-size: 0.875rem;
210
-
211
- column-gap: var(--glide-core-spacing-base-xs);
212
- font-size: var(--glide-core-typography-size-body-small);
213
- padding-block: var(--glide-core-spacing-base-xxxs);
214
- padding-inline: var(--glide-core-spacing-base-xs);
215
- }
216
-
217
199
  &:focus {
218
200
  outline: none;
219
201
  }
@@ -1,7 +1,7 @@
1
1
  import { LitElement } from 'lit';
2
2
  declare global {
3
3
  interface HTMLElementTagNameMap {
4
- 'glide-core-form-controls-layout': GlideCoreFormControlsLayout;
4
+ 'glide-core-form-controls-layout': FormControlsLayout;
5
5
  }
6
6
  }
7
7
  /**
@@ -10,9 +10,9 @@ declare global {
10
10
  * @readonly
11
11
  * @attr {string} [version]
12
12
  *
13
- * @slot {GlideCoreCheckbox | GlideCoreCheckboxGroup | GlideCoreDropdown | GlideCoreRadioGroup | GlideCoreInput | GlideCoreTextArea}
13
+ * @slot {Checkbox | CheckboxGroup | Dropdown | RadioGroup | Input | TextArea}
14
14
  */
15
- export default class GlideCoreFormControlsLayout extends LitElement {
15
+ export default class FormControlsLayout extends LitElement {
16
16
  #private;
17
17
  static shadowRootOptions: ShadowRootInit;
18
18
  static styles: import("lit").CSSResult[];
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(o,e,t,r){var i,l=arguments.length,s=l<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,t):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(o,e,t,r);else for(var n=o.length-1;n>=0;n--)(i=o[n])&&(s=(l<3?i(s):l>3?i(e,t,s):i(e,t))||s);return l>3&&s&&Object.defineProperty(e,t,s),s};import{html,LitElement}from"lit";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import packageJson from"../package.json"with{type:"json"};import GlideCoreCheckbox from"./checkbox.js";import GlideCoreCheckboxGroup from"./checkbox-group.js";import GlideCoreDropdown from"./dropdown.js";import GlideCoreRadioGroup from"./radio-group.js";import GlideCoreInput from"./input.js";import GlideCoreTextArea from"./textarea.js";import styles from"./form-controls-layout.styles.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let GlideCoreFormControlsLayout=class GlideCoreFormControlsLayout extends LitElement{constructor(){super(...arguments),this.version=packageJson.version,this.#o=createRef(),this.#e="left"}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get split(){return this.#e}set split(o){if(this.#e=o,this.#o.value)for(const o of this.#o.value.assignedElements())"privateSplit"in o&&(o.privateSplit=this.split)}render(){return html`<div class="component"><slot @slotchange="${this.#t}" ${assertSlot([GlideCoreCheckbox,GlideCoreCheckboxGroup,GlideCoreDropdown,GlideCoreRadioGroup,GlideCoreInput,GlideCoreTextArea])} ${ref(this.#o)}></slot></div>`}#o;#e;#t(){if(this.#o.value)for(const o of this.#o.value.assignedElements())if("privateSplit"in o&&(o.privateSplit=this.split),"orientation"in o&&"horizontal"!==o.orientation)throw new TypeError("Only horizontal controls are supported.")}};__decorate([property({reflect:!0})],GlideCoreFormControlsLayout.prototype,"split",null),__decorate([property({reflect:!0})],GlideCoreFormControlsLayout.prototype,"version",void 0),GlideCoreFormControlsLayout=__decorate([customElement("glide-core-form-controls-layout"),final],GlideCoreFormControlsLayout);export default GlideCoreFormControlsLayout;
1
+ var __decorate=this&&this.__decorate||function(t,o,e,r){var s,i=arguments.length,l=i<3?o:null===r?r=Object.getOwnPropertyDescriptor(o,e):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(t,o,e,r);else for(var n=t.length-1;n>=0;n--)(s=t[n])&&(l=(i<3?s(l):i>3?s(o,e,l):s(o,e))||l);return i>3&&l&&Object.defineProperty(o,e,l),l};import{html,LitElement}from"lit";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import packageJson from"../package.json"with{type:"json"};import Checkbox from"./checkbox.js";import CheckboxGroup from"./checkbox-group.js";import Dropdown from"./dropdown.js";import RadioGroup from"./radio-group.js";import Input from"./input.js";import TextArea from"./textarea.js";import styles from"./form-controls-layout.styles.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let FormControlsLayout=class FormControlsLayout extends LitElement{constructor(){super(...arguments),this.version=packageJson.version,this.#t=createRef(),this.#o="left"}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get split(){return this.#o}set split(t){if(this.#o=t,this.#t.value)for(const t of this.#t.value.assignedElements())"privateSplit"in t&&(t.privateSplit=this.split)}render(){return html`<div class="component"><slot @slotchange="${this.#e}" ${assertSlot([Checkbox,CheckboxGroup,Dropdown,RadioGroup,Input,TextArea])} ${ref(this.#t)}></slot></div>`}#t;#o;#e(){if(this.#t.value)for(const t of this.#t.value.assignedElements())if("privateSplit"in t&&(t.privateSplit=this.split),"orientation"in t&&"horizontal"!==t.orientation)throw new TypeError("Only horizontal controls are supported.")}};__decorate([property({reflect:!0})],FormControlsLayout.prototype,"split",null),__decorate([property({reflect:!0})],FormControlsLayout.prototype,"version",void 0),FormControlsLayout=__decorate([customElement("glide-core-form-controls-layout"),final],FormControlsLayout);export default FormControlsLayout;
@@ -1,7 +1,7 @@
1
1
  import { LitElement } from 'lit';
2
2
  declare global {
3
3
  interface HTMLElementTagNameMap {
4
- 'glide-core-icon-button': GlideCoreIconButton;
4
+ 'glide-core-icon-button': IconButton;
5
5
  }
6
6
  }
7
7
  /**
@@ -18,7 +18,7 @@ declare global {
18
18
  *
19
19
  * @slot {Element} - An icon
20
20
  */
21
- export default class GlideCoreIconButton extends LitElement {
21
+ export default class IconButton extends LitElement {
22
22
  #private;
23
23
  static shadowRootOptions: ShadowRootInit;
24
24
  static styles: import("lit").CSSResult[];
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(t,e,o,r){var i,a=arguments.length,s=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,o,r);else for(var n=t.length-1;n>=0;n--)(i=t[n])&&(s=(a<3?i(s):a>3?i(e,o,s):i(e,o))||s);return a>3&&s&&Object.defineProperty(e,o,s),s};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import packageJson from"../package.json"with{type:"json"};import styles from"./icon-button.styles.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreIconButton=class GlideCoreIconButton extends LitElement{constructor(){super(...arguments),this.ariaControls=null,this.ariaExpanded=null,this.ariaHasPopup=null,this.disabled=!1,this.variant="primary",this.version=packageJson.version,this.#t=null,this.#e=createRef(),this.#o=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}get ariaDescription(){return this.#t}set ariaDescription(t){this.#t=t,this.#e.value&&(this.#e.value.ariaDescription=t)}click(){this.#e.value?.click()}firstUpdated(){this.#e.value&&this.ariaDescription&&(this.#e.value.ariaDescription=this.ariaDescription)}render(){return html`<button aria-controls="${ifDefined(this.ariaControls??void 0)}" aria-expanded="${ifDefined(this.ariaExpanded??void 0)}" aria-haspopup="${ifDefined(this.ariaHasPopup??void 0)}" aria-label="${ifDefined(this.label)}" class="${classMap({component:!0,primary:"primary"===this.variant,secondary:"secondary"===this.variant,tertiary:"tertiary"===this.variant})}" data-test="button" type="button" ?disabled="${this.disabled}" ${ref(this.#e)}><slot class="default-slot" ${assertSlot()} ${ref(this.#o)}></slot></button>`}#t;#e;#o};__decorate([property({reflect:!0}),required],GlideCoreIconButton.prototype,"label",void 0),__decorate([property({attribute:"aria-controls",reflect:!0,useDefault:!0})],GlideCoreIconButton.prototype,"ariaControls",void 0),__decorate([property({attribute:"aria-description",reflect:!0})],GlideCoreIconButton.prototype,"ariaDescription",null),__decorate([property({attribute:"aria-expanded",reflect:!0,useDefault:!0})],GlideCoreIconButton.prototype,"ariaExpanded",void 0),__decorate([property({attribute:"aria-haspopup",reflect:!0,useDefault:!0})],GlideCoreIconButton.prototype,"ariaHasPopup",void 0),__decorate([property({type:Boolean,reflect:!0})],GlideCoreIconButton.prototype,"disabled",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreIconButton.prototype,"variant",void 0),__decorate([property({reflect:!0})],GlideCoreIconButton.prototype,"version",void 0),GlideCoreIconButton=__decorate([customElement("glide-core-icon-button"),final],GlideCoreIconButton);export default GlideCoreIconButton;
1
+ var __decorate=this&&this.__decorate||function(t,e,o,r){var i,a=arguments.length,s=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,o,r);else for(var n=t.length-1;n>=0;n--)(i=t[n])&&(s=(a<3?i(s):a>3?i(e,o,s):i(e,o))||s);return a>3&&s&&Object.defineProperty(e,o,s),s};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import packageJson from"../package.json"with{type:"json"};import styles from"./icon-button.styles.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let IconButton=class IconButton extends LitElement{constructor(){super(...arguments),this.ariaControls=null,this.ariaExpanded=null,this.ariaHasPopup=null,this.disabled=!1,this.variant="primary",this.version=packageJson.version,this.#t=null,this.#e=createRef(),this.#o=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}get ariaDescription(){return this.#t}set ariaDescription(t){this.#t=t,this.#e.value&&(this.#e.value.ariaDescription=t)}click(){this.#e.value?.click()}firstUpdated(){this.#e.value&&this.ariaDescription&&(this.#e.value.ariaDescription=this.ariaDescription)}render(){return html`<button aria-controls="${ifDefined(this.ariaControls??void 0)}" aria-expanded="${ifDefined(this.ariaExpanded??void 0)}" aria-haspopup="${ifDefined(this.ariaHasPopup??void 0)}" aria-label="${ifDefined(this.label)}" class="${classMap({component:!0,primary:"primary"===this.variant,secondary:"secondary"===this.variant,tertiary:"tertiary"===this.variant})}" data-test="button" type="button" ?disabled="${this.disabled}" ${ref(this.#e)}><slot class="default-slot" ${assertSlot()} ${ref(this.#o)}></slot></button>`}#t;#e;#o};__decorate([property({reflect:!0}),required],IconButton.prototype,"label",void 0),__decorate([property({attribute:"aria-controls",reflect:!0,useDefault:!0})],IconButton.prototype,"ariaControls",void 0),__decorate([property({attribute:"aria-description",reflect:!0})],IconButton.prototype,"ariaDescription",null),__decorate([property({attribute:"aria-expanded",reflect:!0,useDefault:!0})],IconButton.prototype,"ariaExpanded",void 0),__decorate([property({attribute:"aria-haspopup",reflect:!0,useDefault:!0})],IconButton.prototype,"ariaHasPopup",void 0),__decorate([property({type:Boolean,reflect:!0})],IconButton.prototype,"disabled",void 0),__decorate([property({reflect:!0,useDefault:!0})],IconButton.prototype,"variant",void 0),__decorate([property({reflect:!0})],IconButton.prototype,"version",void 0),IconButton=__decorate([customElement("glide-core-icon-button"),final],IconButton);export default IconButton;
@@ -1,7 +1,7 @@
1
1
  import { LitElement } from 'lit';
2
2
  declare global {
3
3
  interface HTMLElementTagNameMap {
4
- 'glide-core-inline-alert': GlideCoreInlineAlert;
4
+ 'glide-core-inline-alert': InlineAlert;
5
5
  }
6
6
  }
7
7
  /**
@@ -12,7 +12,7 @@ declare global {
12
12
  *
13
13
  * @slot {Element | string} - The content of the alert
14
14
  */
15
- export default class GlideCoreInlineAlert extends LitElement {
15
+ export default class InlineAlert extends LitElement {
16
16
  #private;
17
17
  static shadowRootOptions: ShadowRootInit;
18
18
  static styles: import("lit").CSSResult[];
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import packageJson from"../package.json"with{type:"json"};import styles from"./inline-alert.styles.js";import severityInformationalIcon from"./icons/severity-informational.js";import severityMediumIcon from"./icons/severity-medium.js";import severityCriticalIcon from"./icons/severity-critical.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let GlideCoreInlineAlert=class GlideCoreInlineAlert extends LitElement{constructor(){super(...arguments),this.variant="informational",this.version=packageJson.version,this.#e=100,this.#t=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}firstUpdated(){this.#t.value?.addEventListener("animationend",(()=>{this.#t.value?.classList.remove("added")}),{once:!0})}render(){return html`<div class="${classMap({component:!0,added:!0,[this.variant]:!0})}" role="alert" aria-labelledby="label" data-test="component" style="--private-animation-duration: ${this.#e}ms" ${ref(this.#t)}><div aria-hidden="true" class="${classMap({"icon-container":!0,[this.variant]:!0})}">${icons[this.variant]}</div><div id="label" class="content"><slot ${assertSlot()}></slot></div></div>`}#e;#t};__decorate([property({reflect:!0,useDefault:!0})],GlideCoreInlineAlert.prototype,"variant",void 0),__decorate([property({reflect:!0})],GlideCoreInlineAlert.prototype,"version",void 0),GlideCoreInlineAlert=__decorate([customElement("glide-core-inline-alert"),final],GlideCoreInlineAlert);export default GlideCoreInlineAlert;const icons={informational:severityInformationalIcon,medium:severityMediumIcon,high:html`<svg aria-hidden="true" viewBox="0 0 16 16" fill="none" style="${styleMap({height:"var(--private-size, 1rem)",width:"var(--private-size, 1rem)"})}"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.8924 1.33334H4.10768C3.75626 1.33333 3.45307 1.33332 3.20336 1.35372C2.93979 1.37525 2.67765 1.4228 2.42539 1.55132C2.04907 1.74307 1.74311 2.04903 1.55136 2.42536C1.42283 2.67761 1.37529 2.93976 1.35376 3.20332C1.33335 3.45303 1.33336 3.75619 1.33337 4.10762V11.8924C1.33336 12.2438 1.33335 12.547 1.35376 12.7967C1.37529 13.0603 1.42283 13.3224 1.55136 13.5747C1.74311 13.951 2.04907 14.2569 2.42539 14.4487C2.67765 14.5772 2.93979 14.6248 3.20336 14.6463C3.45307 14.6667 3.75624 14.6667 4.10766 14.6667H11.8924C12.2438 14.6667 12.547 14.6667 12.7967 14.6463C13.0603 14.6248 13.3224 14.5772 13.5747 14.4487C13.951 14.2569 14.257 13.951 14.4487 13.5747C14.5773 13.3224 14.6248 13.0603 14.6463 12.7967C14.6667 12.547 14.6667 12.2438 14.6667 11.8924V4.10763C14.6667 3.7562 14.6667 3.45303 14.6463 3.20332C14.6248 2.93976 14.5773 2.67761 14.4487 2.42536C14.257 2.04903 13.951 1.74307 13.5747 1.55132C13.3224 1.4228 13.0603 1.37525 12.7967 1.35372C12.547 1.33332 12.2438 1.33333 11.8924 1.33334ZM8.66671 5.33334C8.66671 4.96515 8.36823 4.66667 8.00004 4.66667C7.63185 4.66667 7.33337 4.96515 7.33337 5.33334V8C7.33337 8.36819 7.63185 8.66667 8.00004 8.66667C8.36823 8.66667 8.66671 8.36819 8.66671 8V5.33334ZM8.00004 10C7.63185 10 7.33337 10.2985 7.33337 10.6667C7.33337 11.0349 7.63185 11.3333 8.00004 11.3333H8.00671C8.3749 11.3333 8.67338 11.0349 8.67338 10.6667C8.67338 10.2985 8.3749 10 8.00671 10H8.00004Z" fill="currentColor"/></svg>`,critical:severityCriticalIcon};
1
+ var __decorate=this&&this.__decorate||function(e,t,i,o){var r,n=arguments.length,a=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(n<3?r(a):n>3?r(t,i,a):r(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import packageJson from"../package.json"with{type:"json"};import styles from"./inline-alert.styles.js";import severityInformationalIcon from"./icons/severity-informational.js";import severityMediumIcon from"./icons/severity-medium.js";import severityCriticalIcon from"./icons/severity-critical.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let InlineAlert=class InlineAlert extends LitElement{constructor(){super(...arguments),this.variant="informational",this.version=packageJson.version,this.#e=100,this.#t=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}firstUpdated(){this.#t.value?.addEventListener("animationend",(()=>{this.#t.value?.classList.remove("added")}),{once:!0})}render(){return html`<div class="${classMap({component:!0,added:!0,[this.variant]:!0})}" role="alert" aria-labelledby="label" data-test="component" style="--private-animation-duration: ${this.#e}ms" ${ref(this.#t)}><div aria-hidden="true" class="${classMap({"icon-container":!0,[this.variant]:!0})}">${icons[this.variant]}</div><div id="label" class="content"><slot ${assertSlot()}></slot></div></div>`}#e;#t};__decorate([property({reflect:!0,useDefault:!0})],InlineAlert.prototype,"variant",void 0),__decorate([property({reflect:!0})],InlineAlert.prototype,"version",void 0),InlineAlert=__decorate([customElement("glide-core-inline-alert"),final],InlineAlert);export default InlineAlert;const icons={informational:severityInformationalIcon,medium:severityMediumIcon,high:html`<svg aria-hidden="true" viewBox="0 0 16 16" fill="none" style="${styleMap({height:"var(--private-size, 1rem)",width:"var(--private-size, 1rem)"})}"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.8924 1.33334H4.10768C3.75626 1.33333 3.45307 1.33332 3.20336 1.35372C2.93979 1.37525 2.67765 1.4228 2.42539 1.55132C2.04907 1.74307 1.74311 2.04903 1.55136 2.42536C1.42283 2.67761 1.37529 2.93976 1.35376 3.20332C1.33335 3.45303 1.33336 3.75619 1.33337 4.10762V11.8924C1.33336 12.2438 1.33335 12.547 1.35376 12.7967C1.37529 13.0603 1.42283 13.3224 1.55136 13.5747C1.74311 13.951 2.04907 14.2569 2.42539 14.4487C2.67765 14.5772 2.93979 14.6248 3.20336 14.6463C3.45307 14.6667 3.75624 14.6667 4.10766 14.6667H11.8924C12.2438 14.6667 12.547 14.6667 12.7967 14.6463C13.0603 14.6248 13.3224 14.5772 13.5747 14.4487C13.951 14.2569 14.257 13.951 14.4487 13.5747C14.5773 13.3224 14.6248 13.0603 14.6463 12.7967C14.6667 12.547 14.6667 12.2438 14.6667 11.8924V4.10763C14.6667 3.7562 14.6667 3.45303 14.6463 3.20332C14.6248 2.93976 14.5773 2.67761 14.4487 2.42536C14.257 2.04903 13.951 1.74307 13.5747 1.55132C13.3224 1.4228 13.0603 1.37525 12.7967 1.35372C12.547 1.33332 12.2438 1.33333 11.8924 1.33334ZM8.66671 5.33334C8.66671 4.96515 8.36823 4.66667 8.00004 4.66667C7.63185 4.66667 7.33337 4.96515 7.33337 5.33334V8C7.33337 8.36819 7.63185 8.66667 8.00004 8.66667C8.36823 8.66667 8.66671 8.36819 8.66671 8V5.33334ZM8.00004 10C7.63185 10 7.33337 10.2985 7.33337 10.6667C7.33337 11.0349 7.63185 11.3333 8.00004 11.3333H8.00671C8.3749 11.3333 8.67338 11.0349 8.67338 10.6667C8.67338 10.2985 8.3749 10 8.00671 10H8.00004Z" fill="currentColor"/></svg>`,critical:severityCriticalIcon};
package/dist/input.d.ts CHANGED
@@ -4,7 +4,7 @@ import { LitElement } from 'lit';
4
4
  import type FormControl from './library/form-control.js';
5
5
  declare global {
6
6
  interface HTMLElementTagNameMap {
7
- 'glide-core-input': GlideCoreInput;
7
+ 'glide-core-input': Input;
8
8
  }
9
9
  }
10
10
  /**
@@ -62,7 +62,7 @@ declare global {
62
62
  * @param {ValidityStateFlags} [flags]
63
63
  * @param {string} [message]
64
64
  */
65
- export default class GlideCoreInput extends LitElement implements FormControl {
65
+ export default class Input extends LitElement implements FormControl {
66
66
  #private;
67
67
  static formAssociated: boolean;
68
68
  static shadowRootOptions: ShadowRootInit;
package/dist/input.js CHANGED
@@ -1,4 +1,4 @@
1
- var __decorate=this&&this.__decorate||function(t,e,i,s){var a,o=arguments.length,r=o<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,s);else for(var l=t.length-1;l>=0;l--)(a=t[l])&&(r=(o<3?a(r):o>3?a(e,i,r):a(e,i))||r);return o>3&&r&&Object.defineProperty(e,i,r),r};import"./icon-button.js";import"./label.js";import{html,LitElement,nothing}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property,state}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import{styleMap}from"lit/directives/style-map.js";import{unsafeHTML}from"lit/directives/unsafe-html.js";import{when}from"lit/directives/when.js";import packageJson from"../package.json"with{type:"json"};import{LocalizeController}from"./library/localize.js";import magnifyingGlassIcon from"./icons/magnifying-glass.js";import styles from"./input.styles.js";import xIcon from"./icons/x.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreInput=class GlideCoreInput extends LitElement{static{this.formAssociated=!0}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode,delegatesFocus:!0}}static{this.styles=styles}get form(){return this.#t.form}get validity(){return this.pattern&&this.pattern.length>0?(this.#t.setValidity({customError:Boolean(this.validityMessage),patternMismatch:Boolean(this.value&&!new RegExp(`^(?:${this.pattern})$`,"v").test(this.value)),valueMissing:Boolean(this.required&&!this.value)}," ",this.#e.value),this.#t.validity):!this.pattern&&this.#t.validity.patternMismatch?(this.#t.setValidity({}),this.#t.validity):!this.required||this.value||this.disabled?this.required&&this.#t.validity.valueMissing&&this.value?(this.#t.setValidity({}),this.#t.validity):(this.required||!this.#t.validity.valueMissing||this.value||this.#t.setValidity({}),this.#t.validity):(this.#t.setValidity({customError:Boolean(this.validityMessage),valueMissing:!0}," ",this.#e.value),this.#t.validity)}checkValidity(){this.isCheckingValidity=!0;const t=this.#t.checkValidity();return this.isCheckingValidity=!1,t}disconnectedCallback(){super.disconnectedCallback(),this.form?.removeEventListener("formdata",this.#i)}formAssociatedCallback(){this.form?.addEventListener("formdata",this.#i)}formResetCallback(){this.value=this.getAttribute("value")??""}render(){return html`
1
+ var __decorate=this&&this.__decorate||function(t,e,i,s){var a,o=arguments.length,r=o<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,i,s);else for(var l=t.length-1;l>=0;l--)(a=t[l])&&(r=(o<3?a(r):o>3?a(e,i,r):a(e,i))||r);return o>3&&r&&Object.defineProperty(e,i,r),r};import"./icon-button.js";import"./label.js";import{html,LitElement,nothing}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property,state}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import{styleMap}from"lit/directives/style-map.js";import{unsafeHTML}from"lit/directives/unsafe-html.js";import{when}from"lit/directives/when.js";import packageJson from"../package.json"with{type:"json"};import{LocalizeController}from"./library/localize.js";import magnifyingGlassIcon from"./icons/magnifying-glass.js";import styles from"./input.styles.js";import xIcon from"./icons/x.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let Input=class Input extends LitElement{static{this.formAssociated=!0}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode,delegatesFocus:!0}}static{this.styles=styles}get form(){return this.#t.form}get validity(){return this.pattern&&this.pattern.length>0?(this.#t.setValidity({customError:Boolean(this.validityMessage),patternMismatch:Boolean(this.value&&!new RegExp(`^(?:${this.pattern})$`,"v").test(this.value)),valueMissing:Boolean(this.required&&!this.value)}," ",this.#e.value),this.#t.validity):!this.pattern&&this.#t.validity.patternMismatch?(this.#t.setValidity({}),this.#t.validity):!this.required||this.value||this.disabled?this.required&&this.#t.validity.valueMissing&&this.value?(this.#t.setValidity({}),this.#t.validity):(this.required||!this.#t.validity.valueMissing||this.value||this.#t.setValidity({}),this.#t.validity):(this.#t.setValidity({customError:Boolean(this.validityMessage),valueMissing:!0}," ",this.#e.value),this.#t.validity)}checkValidity(){this.isCheckingValidity=!0;const t=this.#t.checkValidity();return this.isCheckingValidity=!1,t}disconnectedCallback(){super.disconnectedCallback(),this.form?.removeEventListener("formdata",this.#i)}formAssociatedCallback(){this.form?.addEventListener("formdata",this.#i)}formResetCallback(){this.value=this.getAttribute("value")??""}render(){return html`
2
2
  <glide-core-private-label
3
3
  class=${classMap({left:"left"===this.privateSplit,middle:"middle"===this.privateSplit})}
4
4
  label=${ifDefined(this.label)}
@@ -118,7 +118,7 @@ var __decorate=this&&this.__decorate||function(t,e,i,s){var a,o=arguments.length
118
118
  `:nothing}
119
119
  </div>
120
120
  </glide-core-private-label>
121
- `}reportValidity(){this.isReportValidityOrSubmit=!0;const t=this.#t.reportValidity();return this.requestUpdate(),t}resetValidityFeedback(){this.isReportValidityOrSubmit=!1}setCustomValidity(t){this.validityMessage=t,""===t?this.#t.setValidity({customError:!1},"",this.#e.value):this.#t.setValidity({customError:!0,patternMismatch:this.#t.validity.patternMismatch,valueMissing:this.#t.validity.valueMissing}," ",this.#e.value)}setValidity(t,e){this.validityMessage=e,this.#t.setValidity(t," ",this.#e.value)}constructor(){super(),this.autocapitalize="on",this.autocomplete="on",this.clearable=!1,this.disabled=!1,this.hideLabel=!1,this.name="",this.orientation="horizontal",this.passwordToggle=!1,this.pattern="",this.readonly=!1,this.required=!1,this.spellcheck=!1,this.type="text",this.value="",this.version=packageJson.version,this.hasFocus=!1,this.isBlurring=!1,this.isCheckingValidity=!1,this.isReportValidityOrSubmit=!1,this.passwordVisible=!1,this.#e=createRef(),this.#c=new LocalizeController(this),this.#i=({formData:t})=>{this.name&&this.value&&!this.disabled&&t.append(this.name,this.value)},this.#t=this.attachInternals(),this.addEventListener("invalid",(t=>{if(t?.preventDefault(),this.isCheckingValidity||this.isBlurring)return;this.isReportValidityOrSubmit=!0;this.form?.querySelector(":invalid")===this&&this.focus()}))}#e;#t;#c;get#p(){return this.clearable&&!this.disabled&&!this.readonly}get#h(){return this.#p&&this.value.length>0}get#m(){return this.value.length}#i;get#a(){return Boolean(!this.disabled&&!this.readonly&&this.maxlength&&this.#m>this.maxlength)}get#s(){return!this.disabled&&!this.validity?.valid&&this.isReportValidityOrSubmit}#u(t){this.value="",this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.#e.value?.focus(),t.stopPropagation()}#r(){this.isBlurring=!0,this.reportValidity(),this.isBlurring=!1,this.hasFocus=!1}#l(){this.#e.value?.value&&(this.value=this.#e.value?.value),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}#o(){this.hasFocus=!0}#n(){this.#e.value&&(this.value=this.#e.value.value)}#d(t){"Enter"===t.key&&this.form?.requestSubmit()}#y(){this.passwordVisible=!this.passwordVisible}};__decorate([property({reflect:!0}),required],GlideCoreInput.prototype,"label",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreInput.prototype,"autocapitalize",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreInput.prototype,"autocomplete",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreInput.prototype,"clearable",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreInput.prototype,"disabled",void 0),__decorate([property({attribute:"hide-label",reflect:!0,type:Boolean})],GlideCoreInput.prototype,"hideLabel",void 0),__decorate([property({type:Number,converter:t=>t&&Number.parseInt(t,10),reflect:!0})],GlideCoreInput.prototype,"maxlength",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreInput.prototype,"name",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreInput.prototype,"orientation",void 0),__decorate([property({attribute:"password-toggle",reflect:!0,type:Boolean})],GlideCoreInput.prototype,"passwordToggle",void 0),__decorate([property({reflect:!0})],GlideCoreInput.prototype,"placeholder",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreInput.prototype,"pattern",void 0),__decorate([property()],GlideCoreInput.prototype,"privateSplit",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreInput.prototype,"readonly",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreInput.prototype,"required",void 0),__decorate([property({reflect:!0,type:Boolean,useDefault:!0})],GlideCoreInput.prototype,"spellcheck",void 0),__decorate([property({reflect:!0})],GlideCoreInput.prototype,"tooltip",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreInput.prototype,"type",void 0),__decorate([property()],GlideCoreInput.prototype,"value",void 0),__decorate([property({reflect:!0})],GlideCoreInput.prototype,"version",void 0),__decorate([state()],GlideCoreInput.prototype,"hasFocus",void 0),__decorate([state()],GlideCoreInput.prototype,"isBlurring",void 0),__decorate([state()],GlideCoreInput.prototype,"isCheckingValidity",void 0),__decorate([state()],GlideCoreInput.prototype,"isReportValidityOrSubmit",void 0),__decorate([state()],GlideCoreInput.prototype,"passwordVisible",void 0),__decorate([state()],GlideCoreInput.prototype,"validityMessage",void 0),GlideCoreInput=__decorate([customElement("glide-core-input"),final],GlideCoreInput);export default GlideCoreInput;const icons={eye:html`<svg
121
+ `}reportValidity(){this.isReportValidityOrSubmit=!0;const t=this.#t.reportValidity();return this.requestUpdate(),t}resetValidityFeedback(){this.isReportValidityOrSubmit=!1}setCustomValidity(t){this.validityMessage=t,""===t?this.#t.setValidity({customError:!1},"",this.#e.value):this.#t.setValidity({customError:!0,patternMismatch:this.#t.validity.patternMismatch,valueMissing:this.#t.validity.valueMissing}," ",this.#e.value)}setValidity(t,e){this.validityMessage=e,this.#t.setValidity(t," ",this.#e.value)}constructor(){super(),this.autocapitalize="on",this.autocomplete="on",this.clearable=!1,this.disabled=!1,this.hideLabel=!1,this.name="",this.orientation="horizontal",this.passwordToggle=!1,this.pattern="",this.readonly=!1,this.required=!1,this.spellcheck=!1,this.type="text",this.value="",this.version=packageJson.version,this.hasFocus=!1,this.isBlurring=!1,this.isCheckingValidity=!1,this.isReportValidityOrSubmit=!1,this.passwordVisible=!1,this.#e=createRef(),this.#c=new LocalizeController(this),this.#i=({formData:t})=>{this.name&&this.value&&!this.disabled&&t.append(this.name,this.value)},this.#t=this.attachInternals(),this.addEventListener("invalid",(t=>{if(t?.preventDefault(),this.isCheckingValidity||this.isBlurring)return;this.isReportValidityOrSubmit=!0;this.form?.querySelector(":invalid")===this&&this.focus()}))}#e;#t;#c;get#p(){return this.clearable&&!this.disabled&&!this.readonly}get#h(){return this.#p&&this.value.length>0}get#m(){return this.value.length}#i;get#a(){return Boolean(!this.disabled&&!this.readonly&&this.maxlength&&this.#m>this.maxlength)}get#s(){return!this.disabled&&!this.validity?.valid&&this.isReportValidityOrSubmit}#u(t){this.value="",this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.#e.value?.focus(),t.stopPropagation()}#r(){this.isBlurring=!0,this.reportValidity(),this.isBlurring=!1,this.hasFocus=!1}#l(){this.#e.value?.value&&(this.value=this.#e.value?.value),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}#o(){this.hasFocus=!0}#n(){this.#e.value&&(this.value=this.#e.value.value)}#d(t){"Enter"===t.key&&this.form?.requestSubmit()}#y(){this.passwordVisible=!this.passwordVisible}};__decorate([property({reflect:!0}),required],Input.prototype,"label",void 0),__decorate([property({reflect:!0,useDefault:!0})],Input.prototype,"autocapitalize",void 0),__decorate([property({reflect:!0,useDefault:!0})],Input.prototype,"autocomplete",void 0),__decorate([property({reflect:!0,type:Boolean})],Input.prototype,"clearable",void 0),__decorate([property({reflect:!0,type:Boolean})],Input.prototype,"disabled",void 0),__decorate([property({attribute:"hide-label",reflect:!0,type:Boolean})],Input.prototype,"hideLabel",void 0),__decorate([property({type:Number,converter:t=>t&&Number.parseInt(t,10),reflect:!0})],Input.prototype,"maxlength",void 0),__decorate([property({reflect:!0,useDefault:!0})],Input.prototype,"name",void 0),__decorate([property({reflect:!0,useDefault:!0})],Input.prototype,"orientation",void 0),__decorate([property({attribute:"password-toggle",reflect:!0,type:Boolean})],Input.prototype,"passwordToggle",void 0),__decorate([property({reflect:!0})],Input.prototype,"placeholder",void 0),__decorate([property({reflect:!0,useDefault:!0})],Input.prototype,"pattern",void 0),__decorate([property()],Input.prototype,"privateSplit",void 0),__decorate([property({reflect:!0,type:Boolean})],Input.prototype,"readonly",void 0),__decorate([property({reflect:!0,type:Boolean})],Input.prototype,"required",void 0),__decorate([property({reflect:!0,type:Boolean,useDefault:!0})],Input.prototype,"spellcheck",void 0),__decorate([property({reflect:!0})],Input.prototype,"tooltip",void 0),__decorate([property({reflect:!0,useDefault:!0})],Input.prototype,"type",void 0),__decorate([property()],Input.prototype,"value",void 0),__decorate([property({reflect:!0})],Input.prototype,"version",void 0),__decorate([state()],Input.prototype,"hasFocus",void 0),__decorate([state()],Input.prototype,"isBlurring",void 0),__decorate([state()],Input.prototype,"isCheckingValidity",void 0),__decorate([state()],Input.prototype,"isReportValidityOrSubmit",void 0),__decorate([state()],Input.prototype,"passwordVisible",void 0),__decorate([state()],Input.prototype,"validityMessage",void 0),Input=__decorate([customElement("glide-core-input"),final],Input);export default Input;const icons={eye:html`<svg
122
122
  aria-hidden="true"
123
123
  style=${styleMap({height:"1rem",width:"1rem"})}
124
124
  fill="none"
package/dist/label.d.ts CHANGED
@@ -2,7 +2,7 @@ import './tooltip.js';
2
2
  import { LitElement } from 'lit';
3
3
  declare global {
4
4
  interface HTMLElementTagNameMap {
5
- 'glide-core-private-label': GlideCoreLabel;
5
+ 'glide-core-private-label': Label;
6
6
  }
7
7
  }
8
8
  /**
@@ -20,7 +20,7 @@ declare global {
20
20
  * @slot {Element | string} [description] - Additional information or context
21
21
  * @slot {Element | string} [summary] - Additional information or context
22
22
  */
23
- export default class GlideCoreLabel extends LitElement {
23
+ export default class Label extends LitElement {
24
24
  #private;
25
25
  static shadowRootOptions: ShadowRootInit;
26
26
  static styles: import("lit").CSSResult[];
package/dist/label.js CHANGED
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,o,i){var l,r=arguments.length,s=r<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,o,i);else for(var a=e.length-1;a>=0;a--)(l=e[a])&&(s=(r<3?l(s):r>3?l(t,o,s):l(t,o))||s);return r>3&&s&&Object.defineProperty(t,o,s),s};import"./tooltip.js";import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{ifDefined}from"lit/directives/if-defined.js";import{when}from"lit/directives/when.js";import styles from"./label.styles.js";import{LocalizeController}from"./library/localize.js";import assertSlot from"./library/assert-slot.js";import onResize from"./library/on-resize.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let GlideCoreLabel=class GlideCoreLabel extends LitElement{constructor(){super(...arguments),this.disabled=!1,this.error=!1,this.hide=!1,this.orientation="horizontal",this.required=!1,this.hasDescription=!1,this.hasSummarySlot=!1,this.isLabelTooltip=!1,this.#e=createRef(),this.#t=createRef(),this.#o=createRef(),this.#i=new LocalizeController(this),this.#l=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}render(){return html`<div class="${classMap({component:!0,horizontal:"horizontal"===this.orientation,vertical:"vertical"===this.orientation,left:"left"===this.split,middle:"middle"===this.split,right:"right"===this.split,"hidden-label":this.hide})}"><div class="${classMap({tooltips:!0,hidden:this.hide,left:"left"===this.split,middle:"middle"===this.split,right:"right"===this.split})}" part="private-tooltips">${when(this.tooltip,(()=>html`<glide-core-tooltip class="${classMap({"optional-tooltip":!0,vertical:"vertical"===this.orientation,visible:!!this.tooltip})}" label="${ifDefined(this.tooltip)}" placement="${"vertical"===this.orientation?"right":"bottom"}"><button aria-label="${this.#i.term("tooltip")}" class="optional-tooltip-target" slot="target" type="button">${icons.information}</button></glide-core-tooltip>`))}<glide-core-tooltip class="label-tooltip" label="${this.label??""}" placement="right" ?disabled="${!this.isLabelTooltip}" screenreader-hidden><div class="${classMap({label:!0,disabled:this.disabled})}" data-test="label" slot="target" ${ref(this.#o)}><slot @slotchange="${this.#r}" ${assertSlot()} ${ref(this.#e)}></slot>${this.required?html`<span aria-hidden="true" class="required-symbol">*</span>`:""}</div></glide-core-tooltip></div><div class="control-and-summary" part="private-control-and-summary"><slot class="${classMap({control:!0,error:this.error,disabled:this.disabled,vertical:"vertical"===this.orientation,summaryless:!this.hasSummarySlot,"hidden-label":this.hide})}" name="control" ${assertSlot()}></slot><slot class="${classMap({summary:!0,error:this.error})}" name="summary" @slotchange="${this.#s}" ${ref(this.#l)}></slot></div><slot class="${classMap({description:!0,content:this.hasDescription,error:this.error,tooltip:!!this.tooltip})}" id="description" name="description" ${onResize(this.#a.bind(this))} ${ref(this.#t)}></slot></div>`}#e;#t;#o;#i;#l;#r(){const e=this.#e.value?.assignedElements().at(0),t=new ResizeObserver((()=>{e&&this.#o.value&&(this.isLabelTooltip=e.getBoundingClientRect().width>this.#o.value.getBoundingClientRect().width)}));this.#o.value&&t.observe(this.#o.value)}#a(){this.hasDescription=Boolean(this.#t.value&&this.#t.value.offsetHeight>0)}#s(){const e=this.#l.value?.assignedNodes({flatten:!0});this.hasSummarySlot=Boolean(e&&e.length>0)}};__decorate([property({reflect:!0,type:Boolean})],GlideCoreLabel.prototype,"disabled",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreLabel.prototype,"error",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreLabel.prototype,"hide",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreLabel.prototype,"orientation",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreLabel.prototype,"required",void 0),__decorate([property()],GlideCoreLabel.prototype,"split",void 0),__decorate([property()],GlideCoreLabel.prototype,"tooltip",void 0),__decorate([property()],GlideCoreLabel.prototype,"label",void 0),__decorate([state()],GlideCoreLabel.prototype,"hasDescription",void 0),__decorate([state()],GlideCoreLabel.prototype,"hasSummarySlot",void 0),__decorate([state()],GlideCoreLabel.prototype,"isLabelTooltip",void 0),GlideCoreLabel=__decorate([customElement("glide-core-private-label"),final],GlideCoreLabel);export default GlideCoreLabel;const icons={information:html`<svg aria-hidden="true" style="${styleMap({height:"1rem",width:"1rem"})}" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2"/><path d="M12 16L12 12" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><circle cx="12" cy="8" r="1" fill="currentColor"/></svg>`};
1
+ var __decorate=this&&this.__decorate||function(t,e,o,i){var l,r=arguments.length,s=r<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,o,i);else for(var a=t.length-1;a>=0;a--)(l=t[a])&&(s=(r<3?l(s):r>3?l(e,o,s):l(e,o))||s);return r>3&&s&&Object.defineProperty(e,o,s),s};import"./tooltip.js";import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{ifDefined}from"lit/directives/if-defined.js";import{when}from"lit/directives/when.js";import styles from"./label.styles.js";import{LocalizeController}from"./library/localize.js";import assertSlot from"./library/assert-slot.js";import onResize from"./library/on-resize.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let Label=class Label extends LitElement{constructor(){super(...arguments),this.disabled=!1,this.error=!1,this.hide=!1,this.orientation="horizontal",this.required=!1,this.hasDescription=!1,this.hasSummarySlot=!1,this.isLabelTooltip=!1,this.#t=createRef(),this.#e=createRef(),this.#o=createRef(),this.#i=new LocalizeController(this),this.#l=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}render(){return html`<div class="${classMap({component:!0,horizontal:"horizontal"===this.orientation,vertical:"vertical"===this.orientation,left:"left"===this.split,middle:"middle"===this.split,right:"right"===this.split,"hidden-label":this.hide})}"><div class="${classMap({tooltips:!0,hidden:this.hide,left:"left"===this.split,middle:"middle"===this.split,right:"right"===this.split})}" part="private-tooltips">${when(this.tooltip,(()=>html`<glide-core-tooltip class="${classMap({"optional-tooltip":!0,vertical:"vertical"===this.orientation,visible:!!this.tooltip})}" label="${ifDefined(this.tooltip)}" placement="${"vertical"===this.orientation?"right":"bottom"}"><button aria-label="${this.#i.term("tooltip")}" class="optional-tooltip-target" slot="target" type="button">${icons.information}</button></glide-core-tooltip>`))}<glide-core-tooltip class="label-tooltip" data-test="label-tooltip" label="${this.label??""}" placement="right" ?disabled="${!this.isLabelTooltip}" screenreader-hidden><div class="${classMap({label:!0,disabled:this.disabled})}" data-test="label" slot="target" @mouseover="${this.#r}" ${ref(this.#o)}><slot ${assertSlot()} ${ref(this.#t)}></slot></div></glide-core-tooltip>${this.required?html`<span aria-hidden="true" class="required-symbol" data-test="required-symbol">*</span>`:""}</div><div class="control-and-summary" part="private-control-and-summary"><slot class="${classMap({control:!0,error:this.error,disabled:this.disabled,vertical:"vertical"===this.orientation,summaryless:!this.hasSummarySlot,"hidden-label":this.hide})}" name="control" ${assertSlot()}></slot><slot class="${classMap({summary:!0,error:this.error})}" name="summary" @slotchange="${this.#s}" ${ref(this.#l)}></slot></div><slot class="${classMap({description:!0,content:this.hasDescription,error:this.error,tooltip:!!this.tooltip})}" id="description" name="description" ${onResize(this.#a.bind(this))} ${ref(this.#e)}></slot></div>`}#t;#e;#o;#i;#l;#a(){this.hasDescription=Boolean(this.#e.value&&this.#e.value.offsetHeight>0)}#r(){const t=this.#t.value?.assignedElements().at(0);t&&this.#o.value&&(this.isLabelTooltip=t.getBoundingClientRect().width>this.#o.value.getBoundingClientRect().width)}#s(){const t=this.#l.value?.assignedNodes({flatten:!0});this.hasSummarySlot=Boolean(t&&t.length>0)}};__decorate([property({reflect:!0,type:Boolean})],Label.prototype,"disabled",void 0),__decorate([property({reflect:!0,type:Boolean})],Label.prototype,"error",void 0),__decorate([property({reflect:!0,type:Boolean})],Label.prototype,"hide",void 0),__decorate([property({reflect:!0,useDefault:!0})],Label.prototype,"orientation",void 0),__decorate([property({reflect:!0,type:Boolean})],Label.prototype,"required",void 0),__decorate([property()],Label.prototype,"split",void 0),__decorate([property()],Label.prototype,"tooltip",void 0),__decorate([property()],Label.prototype,"label",void 0),__decorate([state()],Label.prototype,"hasDescription",void 0),__decorate([state()],Label.prototype,"hasSummarySlot",void 0),__decorate([state()],Label.prototype,"isLabelTooltip",void 0),Label=__decorate([customElement("glide-core-private-label"),final],Label);export default Label;const icons={information:html`<svg aria-hidden="true" style="${styleMap({height:"1rem",width:"1rem"})}" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="2"/><path d="M12 16L12 12" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><circle cx="12" cy="8" r="1" fill="currentColor"/></svg>`};
@@ -38,7 +38,7 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
38
38
 
39
39
  .tooltips {
40
40
  align-items: center;
41
- column-gap: var(--glide-core-spacing-base-xs);
41
+ column-gap: var(--glide-core-spacing-base-xxs);
42
42
  display: flex;
43
43
 
44
44
  /*
@@ -129,6 +129,10 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
129
129
 
130
130
  .required-symbol {
131
131
  color: var(--glide-core-color-advisory-stroke-error-primary);
132
+ font-family: var(--glide-core-typography-family-primary);
133
+ font-size: var(--glide-core-typography-size-body-default);
134
+ font-weight: var(--glide-core-typography-weight-bold);
135
+ line-height: 100%;
132
136
  }
133
137
 
134
138
  .control-and-summary {
@@ -10,7 +10,7 @@ declare class AssertSlot extends Directive {
10
10
  }
11
11
  /**
12
12
  * @param {(Element | Text)[] | null } nodes - An array of node constructors allowed in the slot or `null` is any constructor is allowed
13
- * @param {boolean} [isOptional] - `false` by default. Set o `true` if the slot is optional
13
+ * @param {boolean} [isOptional] - `false` by default. Set to `true` if the slot is optional
14
14
  */
15
15
  declare const _default: (slotted?: ({
16
16
  new (): Element;
@@ -10,7 +10,7 @@ import { aTimeout, expect, fixture, html, waitUntil } from '@open-wc/testing';
10
10
  import sinon from 'sinon';
11
11
  import { ifDefined } from 'lit/directives/if-defined.js';
12
12
  import assertSlot from './assert-slot.js';
13
- let GlideCoreWithSlot = class GlideCoreWithSlot extends LitElement {
13
+ let WithSlot = class WithSlot extends LitElement {
14
14
  constructor() {
15
15
  super(...arguments);
16
16
  this.optional = false;
@@ -25,32 +25,32 @@ let GlideCoreWithSlot = class GlideCoreWithSlot extends LitElement {
25
25
  };
26
26
  __decorate([
27
27
  property()
28
- ], GlideCoreWithSlot.prototype, "name", void 0);
28
+ ], WithSlot.prototype, "name", void 0);
29
29
  __decorate([
30
30
  property({ type: Boolean })
31
- ], GlideCoreWithSlot.prototype, "optional", void 0);
31
+ ], WithSlot.prototype, "optional", void 0);
32
32
  __decorate([
33
33
  property({ type: Array })
34
- ], GlideCoreWithSlot.prototype, "slotted", void 0);
35
- GlideCoreWithSlot = __decorate([
34
+ ], WithSlot.prototype, "slotted", void 0);
35
+ WithSlot = __decorate([
36
36
  customElement('glide-core-with-slot')
37
- ], GlideCoreWithSlot);
38
- let GlideCoreWhenNotUsedOnSlot = class GlideCoreWhenNotUsedOnSlot extends LitElement {
37
+ ], WithSlot);
38
+ let WhenNotUsedOnSlot = class WhenNotUsedOnSlot extends LitElement {
39
39
  render() {
40
40
  return html `<div ${assertSlot()}></div>`;
41
41
  }
42
42
  };
43
- GlideCoreWhenNotUsedOnSlot = __decorate([
43
+ WhenNotUsedOnSlot = __decorate([
44
44
  customElement('glide-core-when-not-used-on-slot')
45
- ], GlideCoreWhenNotUsedOnSlot);
46
- let GlideCorewhenNotUsedInsideTag = class GlideCorewhenNotUsedInsideTag extends LitElement {
45
+ ], WhenNotUsedOnSlot);
46
+ let WhenNotUsedInsideATag = class WhenNotUsedInsideATag extends LitElement {
47
47
  render() {
48
48
  return html `<slot>${assertSlot()}</slot>`;
49
49
  }
50
50
  };
51
- GlideCorewhenNotUsedInsideTag = __decorate([
51
+ WhenNotUsedInsideATag = __decorate([
52
52
  customElement('glide-core-when-not-used-inside-tag')
53
- ], GlideCorewhenNotUsedInsideTag);
53
+ ], WhenNotUsedInsideATag);
54
54
  it('throws when a required default slot is empty', async () => {
55
55
  const stub = sinon.stub(console, 'error');
56
56
  const spy = sinon.spy();
@@ -59,7 +59,7 @@ it('throws when a required default slot is empty', async () => {
59
59
  await waitUntil(() => spy.callCount);
60
60
  expect(spy.callCount).to.equal(1);
61
61
  expect(spy.args.at(0)?.at(0) instanceof PromiseRejectionEvent).to.be.true;
62
- expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected GlideCoreWithSlot to have a default slot.');
62
+ expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected WithSlot to have a default slot.');
63
63
  stub.restore();
64
64
  });
65
65
  it('throws when a required default slot is emptied', async () => {
@@ -87,7 +87,7 @@ it('throws when a required named slot is empty', async () => {
87
87
  await waitUntil(() => spy.callCount);
88
88
  expect(spy.callCount).to.equal(1);
89
89
  expect(spy.args.at(0)?.at(0) instanceof PromiseRejectionEvent).to.be.true;
90
- expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected GlideCoreWithSlot to have a "test" slot.');
90
+ expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected WithSlot to have a "test" slot.');
91
91
  stub.restore();
92
92
  });
93
93
  it('throws when a required named slot is emptied', async () => {
@@ -117,7 +117,7 @@ it('throws when a typed and required default slot is empty', async () => {
117
117
  await waitUntil(() => spy.callCount);
118
118
  expect(spy.callCount).to.equal(1);
119
119
  expect(spy.args.at(0)?.at(0) instanceof PromiseRejectionEvent).to.be.true;
120
- expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement.');
120
+ expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected WithSlot to have a slotted element that extends HTMLButtonElement.');
121
121
  stub.restore();
122
122
  });
123
123
  it('throws when a typed and required default slot is emptied', async () => {
@@ -132,7 +132,7 @@ it('throws when a typed and required default slot is emptied', async () => {
132
132
  host.innerHTML = '';
133
133
  await waitUntil(() => spy.callCount);
134
134
  expect(spy.callCount).to.equal(1);
135
- expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement.');
135
+ expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected WithSlot to have a slotted element that extends HTMLButtonElement.');
136
136
  // eslint-disable-next-line unicorn/prefer-add-event-listener
137
137
  window.onerror = onerror;
138
138
  stub.restore();
@@ -149,7 +149,7 @@ it('throws when a typed and required default slot has the wrong element', async
149
149
  <a href="/">Link</a>
150
150
  </glide-core-with-slot>`);
151
151
  expect(spy.callCount).to.equal(1);
152
- expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement or HTMLDivElement or Text. Extends HTMLAnchorElement instead.');
152
+ expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected WithSlot to have a slotted element that extends HTMLButtonElement or HTMLDivElement or Text. Extends HTMLAnchorElement instead.');
153
153
  // eslint-disable-next-line unicorn/prefer-add-event-listener
154
154
  window.onerror = onerror;
155
155
  stub.restore();
@@ -164,7 +164,7 @@ it('throws when a typed and required default slot only contains text', async ()
164
164
  Text
165
165
  </glide-core-with-slot>`);
166
166
  expect(spy.callCount).to.equal(1);
167
- expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement.');
167
+ expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected WithSlot to have a slotted element that extends HTMLButtonElement.');
168
168
  // eslint-disable-next-line unicorn/prefer-add-event-listener
169
169
  window.onerror = onerror;
170
170
  stub.restore();
@@ -180,7 +180,7 @@ it('throws when a typed and required named slot is empty', async () => {
180
180
  await waitUntil(() => spy.callCount);
181
181
  expect(spy.callCount).to.equal(1);
182
182
  expect(spy.args.at(0)?.at(0) instanceof PromiseRejectionEvent).to.be.true;
183
- expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected the "test" slot of GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement.');
183
+ expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected the "test" slot of WithSlot to have a slotted element that extends HTMLButtonElement.');
184
184
  stub.restore();
185
185
  });
186
186
  it('throws when a typed and required named slot is emptied', async () => {
@@ -195,7 +195,7 @@ it('throws when a typed and required named slot is emptied', async () => {
195
195
  host.innerHTML = '';
196
196
  await waitUntil(() => spy.callCount);
197
197
  expect(spy.callCount).to.equal(1);
198
- expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected the "test" slot of GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement.');
198
+ expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected the "test" slot of WithSlot to have a slotted element that extends HTMLButtonElement.');
199
199
  // eslint-disable-next-line unicorn/prefer-add-event-listener
200
200
  window.onerror = onerror;
201
201
  stub.restore();
@@ -213,7 +213,7 @@ it('throws when a typed and required named slot has the wrong element', async ()
213
213
  <a slot="test" href="/">Link</a>
214
214
  </glide-core-with-slot>`);
215
215
  expect(spy.callCount).to.equal(1);
216
- expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected the "test" slot of GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement or HTMLDivElement or Text. Extends HTMLAnchorElement instead.');
216
+ expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected the "test" slot of WithSlot to have a slotted element that extends HTMLButtonElement or HTMLDivElement or Text. Extends HTMLAnchorElement instead.');
217
217
  // eslint-disable-next-line unicorn/prefer-add-event-listener
218
218
  window.onerror = onerror;
219
219
  stub.restore();
@@ -254,7 +254,7 @@ it('throws when a typed optional slot has the wrong element', async () => {
254
254
  <a href="/">Link</a>
255
255
  </glide-core-with-slot>`);
256
256
  expect(spy.callCount).to.equal(1);
257
- expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected GlideCoreWithSlot to have a slotted element that extends HTMLButtonElement or HTMLDivElement or Text. Extends HTMLAnchorElement instead.');
257
+ expect(spy.args.at(0)?.at(0)).to.equal('Uncaught TypeError: Expected WithSlot to have a slotted element that extends HTMLButtonElement or HTMLDivElement or Text. Extends HTMLAnchorElement instead.');
258
258
  // eslint-disable-next-line unicorn/prefer-add-event-listener
259
259
  window.onerror = onerror;
260
260
  stub.restore();
@@ -1 +1 @@
1
- import{expect,waitUntil}from"@open-wc/testing";import sinon from"sinon";export default async function(o){const t=sinon.stub(console,"error"),n=sinon.spy(),r=window.onerror;window.onerror=n,await o.call(context),await waitUntil((()=>n.callCount)),expect(n.callCount).to.be.greaterThan(0),expect(n.args.at(0)?.at(4)instanceof TypeError).to.be.true,window.onerror=r,t.restore()}
1
+ import{expect,waitUntil}from"@open-wc/testing";import sinon from"sinon";export default async function(o){const t=sinon.stub(console,"error"),n=sinon.spy(),r=window.onerror;window.onerror=n,await o.call(context),await waitUntil((()=>n.callCount)),expect(n.callCount).to.be.greaterThan(0),expect(n.args.at(0)?.at(4)instanceof Error).to.be.true,window.onerror=r,t.restore()}
@@ -9,33 +9,33 @@ import { customElement } from 'lit/decorators.js';
9
9
  import { expect } from '@open-wc/testing';
10
10
  import sinon from 'sinon';
11
11
  import final from './final.js';
12
- let GlideCoreFinal = class GlideCoreFinal extends LitElement {
12
+ let Final = class Final extends LitElement {
13
13
  };
14
- GlideCoreFinal = __decorate([
14
+ Final = __decorate([
15
15
  customElement('glide-core-final'),
16
16
  final
17
- ], GlideCoreFinal);
18
- let GlideCoreSubclassed = class GlideCoreSubclassed extends GlideCoreFinal {
17
+ ], Final);
18
+ let Subclassed = class Subclassed extends Final {
19
19
  };
20
- GlideCoreSubclassed = __decorate([
20
+ Subclassed = __decorate([
21
21
  customElement('glide-core-subclassed')
22
- ], GlideCoreSubclassed);
22
+ ], Subclassed);
23
23
  it('throws when a class is extended', async () => {
24
24
  const spy = sinon.spy();
25
25
  try {
26
- new GlideCoreSubclassed();
26
+ new Subclassed();
27
27
  }
28
28
  catch (error) {
29
29
  spy(error);
30
30
  }
31
31
  expect(spy.callCount).to.equal(1);
32
32
  expect(spy.args.at(0)?.at(0) instanceof TypeError).to.be.true;
33
- expect(spy.args.at(0)?.at(0).message).to.equal(`GlideCoreFinal doesn't allow extension. Please talk to us if a component doesn't meet your needs.`);
33
+ expect(spy.args.at(0)?.at(0).message).to.equal(`Final doesn't allow extension. Please talk to us if a component doesn't meet your needs.`);
34
34
  });
35
35
  it('does not throw when a class is not extended', () => {
36
36
  const spy = sinon.spy();
37
37
  try {
38
- new GlideCoreFinal();
38
+ new Final();
39
39
  }
40
40
  catch (error) {
41
41
  spy(error);
@@ -9,17 +9,17 @@ import { customElement } from 'lit/decorators.js';
9
9
  import { expect, fixture, html } from '@open-wc/testing';
10
10
  import en from '../translations/en.js';
11
11
  import { LocalizeController } from './localize.js';
12
- let GlideCoreMockComponent = class GlideCoreMockComponent extends LitElement {
12
+ let Component = class Component extends LitElement {
13
13
  constructor() {
14
14
  super(...arguments);
15
15
  this.localize = new LocalizeController(this);
16
16
  }
17
17
  };
18
- GlideCoreMockComponent = __decorate([
19
- customElement('mock-host')
20
- ], GlideCoreMockComponent);
18
+ Component = __decorate([
19
+ customElement('glide-core-component')
20
+ ], Component);
21
21
  it('can call any term from en translation if locale is Japanese', async () => {
22
- const host = await fixture(html `<mock-host></mock-host>`);
22
+ const host = await fixture(html `<glide-core-component></glide-core-component>`);
23
23
  host.lang = 'ja';
24
24
  expect(host.localize.lang()).to.equal('ja');
25
25
  const keys = Object.keys(en);
@@ -28,7 +28,7 @@ it('can call any term from en translation if locale is Japanese', async () => {
28
28
  }
29
29
  });
30
30
  it('can call any term from en translation if locale is French', async () => {
31
- const host = await fixture(html `<mock-host></mock-host>`);
31
+ const host = await fixture(html `<glide-core-component></glide-core-component>`);
32
32
  host.lang = 'fr';
33
33
  expect(host.localize.lang()).to.equal('fr');
34
34
  const keys = Object.keys(en);
@@ -14,16 +14,16 @@ import final from './final.js';
14
14
  // used together. Using both decorators in tests allow us
15
15
  // to verifying the component name is included in the
16
16
  // message.
17
- let GlideCoreWithRequiredProperty = class GlideCoreWithRequiredProperty extends LitElement {
17
+ let WithRequiredProperty = class WithRequiredProperty extends LitElement {
18
18
  };
19
19
  __decorate([
20
20
  property(),
21
21
  required
22
- ], GlideCoreWithRequiredProperty.prototype, "label", void 0);
23
- GlideCoreWithRequiredProperty = __decorate([
22
+ ], WithRequiredProperty.prototype, "label", void 0);
23
+ WithRequiredProperty = __decorate([
24
24
  customElement('glide-core-with-required-property'),
25
25
  final
26
- ], GlideCoreWithRequiredProperty);
26
+ ], WithRequiredProperty);
27
27
  it('throws when a required attribute is missing', async () => {
28
28
  const stub = sinon.stub(console, 'error');
29
29
  const spy = sinon.spy();
@@ -32,7 +32,7 @@ it('throws when a required attribute is missing', async () => {
32
32
  await waitUntil(() => spy.callCount);
33
33
  expect(spy.callCount).to.equal(1);
34
34
  expect(spy.args.at(0)?.at(0) instanceof PromiseRejectionEvent).to.be.true;
35
- expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected GlideCoreWithRequiredProperty to have a `label` property.');
35
+ expect(spy.args.at(0)?.at(0).reason.message).to.equal('Expected WithRequiredProperty to have a `label` property.');
36
36
  stub.restore();
37
37
  });
38
38
  it('does not throw when a required attribute is not missing', async () => {
@@ -0,0 +1,2 @@
1
+ declare const _default: () => string;
2
+ export default _default;
@@ -0,0 +1 @@
1
+ export default()=>`${Math.random().toString(36).slice(2)}${Math.random().toString(36).slice(2)}`;
package/dist/link.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { LitElement } from 'lit';
2
2
  declare global {
3
3
  interface HTMLElementTagNameMap {
4
- 'glide-core-link': GlideCoreLink;
4
+ 'glide-core-link': Link;
5
5
  }
6
6
  }
7
7
  /**
@@ -14,9 +14,8 @@ declare global {
14
14
  * @readonly
15
15
  * @attr {string} [version]
16
16
  */
17
- export default class GlideCoreLink extends LitElement {
17
+ export default class Link extends LitElement {
18
18
  #private;
19
- static formAssociated: boolean;
20
19
  static shadowRootOptions: ShadowRootInit;
21
20
  static styles: import("lit").CSSResult[];
22
21
  label?: string;