@crowdstrike/glide-core 0.24.5 → 0.26.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 (93) hide show
  1. package/dist/button-group.button.js +1 -1
  2. package/dist/button-group.js +1 -1
  3. package/dist/button.d.ts +8 -1
  4. package/dist/button.js +1 -1
  5. package/dist/checkbox-group.d.ts +1 -1
  6. package/dist/checkbox-group.js +1 -1
  7. package/dist/checkbox-group.styles.js +2 -2
  8. package/dist/checkbox.d.ts +7 -7
  9. package/dist/checkbox.js +2 -2
  10. package/dist/checkbox.styles.js +1 -1
  11. package/dist/dropdown.d.ts +3 -1
  12. package/dist/dropdown.js +23 -16
  13. package/dist/dropdown.option.d.ts +22 -8
  14. package/dist/dropdown.option.js +1 -1
  15. package/dist/dropdown.styles.js +20 -13
  16. package/dist/icon-button.d.ts +11 -4
  17. package/dist/icon-button.js +1 -1
  18. package/dist/inline-alert.d.ts +0 -6
  19. package/dist/inline-alert.js +1 -1
  20. package/dist/inline-alert.styles.js +18 -38
  21. package/dist/input.d.ts +14 -14
  22. package/dist/input.js +1 -1
  23. package/dist/input.styles.js +2 -2
  24. package/dist/label.js +1 -1
  25. package/dist/label.styles.js +3 -3
  26. package/dist/library/assert-slot.d.ts +4 -0
  27. package/dist/library/localize.d.ts +1 -1
  28. package/dist/link.d.ts +30 -0
  29. package/dist/link.js +1 -0
  30. package/dist/link.styles.js +27 -0
  31. package/dist/menu.button.d.ts +13 -2
  32. package/dist/menu.button.js +1 -1
  33. package/dist/menu.d.ts +6 -0
  34. package/dist/menu.js +1 -1
  35. package/dist/menu.link.d.ts +15 -4
  36. package/dist/menu.link.js +1 -1
  37. package/dist/menu.options.d.ts +13 -1
  38. package/dist/menu.options.js +1 -1
  39. package/dist/menu.options.styles.js +9 -1
  40. package/dist/modal.d.ts +1 -1
  41. package/dist/modal.icon-button.js +1 -1
  42. package/dist/modal.js +1 -1
  43. package/dist/modal.styles.js +3 -3
  44. package/dist/radio-group.d.ts +1 -1
  45. package/dist/radio-group.js +1 -1
  46. package/dist/radio-group.radio.d.ts +7 -7
  47. package/dist/radio-group.radio.js +1 -1
  48. package/dist/radio-group.styles.js +2 -2
  49. package/dist/spinner.js +1 -1
  50. package/dist/spinner.styles.js +1 -4
  51. package/dist/split-button.primary-button.d.ts +1 -1
  52. package/dist/split-button.primary-button.js +1 -1
  53. package/dist/split-button.primary-link.d.ts +3 -3
  54. package/dist/split-button.primary-link.js +1 -1
  55. package/dist/split-button.secondary-button.d.ts +1 -1
  56. package/dist/split-button.secondary-button.js +1 -1
  57. package/dist/styles/skeleton.d.ts +2 -0
  58. package/dist/styles/skeleton.js +45 -0
  59. package/dist/styles/variables.css +1 -1
  60. package/dist/tab.d.ts +1 -0
  61. package/dist/tab.group.d.ts +1 -2
  62. package/dist/tab.group.js +1 -1
  63. package/dist/tab.group.styles.js +4 -0
  64. package/dist/tab.js +1 -1
  65. package/dist/tag.d.ts +1 -1
  66. package/dist/tag.js +1 -1
  67. package/dist/tag.styles.js +30 -37
  68. package/dist/textarea.d.ts +9 -9
  69. package/dist/textarea.js +1 -1
  70. package/dist/textarea.styles.js +2 -2
  71. package/dist/toast.d.ts +40 -0
  72. package/dist/toast.js +1 -0
  73. package/dist/toast.toasts.d.ts +31 -0
  74. package/dist/toast.toasts.js +90 -0
  75. package/dist/toast.toasts.styles.js +127 -0
  76. package/dist/toggle.d.ts +1 -1
  77. package/dist/toggle.js +1 -1
  78. package/dist/tooltip.d.ts +5 -5
  79. package/dist/tooltip.js +1 -1
  80. package/dist/translations/en.js +1 -1
  81. package/dist/translations/fr.d.ts +1 -1
  82. package/dist/translations/fr.js +1 -1
  83. package/dist/translations/ja.d.ts +1 -1
  84. package/dist/translations/ja.js +1 -1
  85. package/package.json +8 -8
  86. package/dist/toasts.d.ts +0 -33
  87. package/dist/toasts.js +0 -1
  88. package/dist/toasts.styles.js +0 -22
  89. package/dist/toasts.toast.d.ts +0 -31
  90. package/dist/toasts.toast.js +0 -1
  91. package/dist/toasts.toast.styles.js +0 -88
  92. /package/dist/{toasts.styles.d.ts → link.styles.d.ts} +0 -0
  93. /package/dist/{toasts.toast.styles.d.ts → toast.toasts.styles.d.ts} +0 -0
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,o,i){var r,s=arguments.length,n=s<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,o,i);else for(var l=e.length-1;l>=0;l--)(r=e[l])&&(n=(s<3?r(n):s>3?r(t,o,n):r(t,o))||n);return s>3&&n&&Object.defineProperty(t,o,n),n};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{nanoid}from"nanoid";import packageJson from"../package.json"with{type:"json"};import styles from"./menu.button.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreMenuButton=class GlideCoreMenuButton extends LitElement{constructor(){super(...arguments),this.privateActive=!1,this.version=packageJson.version,this.#e=createRef(),this.#t=nanoid(),this.#o=!1}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get disabled(){return this.#o}set disabled(e){this.#o=e,e&&this.privateActive&&this.dispatchEvent(new Event("private-disabled",{bubbles:!0}))}click(){this.#e.value?.click()}connectedCallback(){super.connectedCallback(),this.id=this.#t,this.role="menuitem",this.tabIndex=-1}render(){return html`<button class="${classMap({component:!0,active:this.privateActive,disabled:this.disabled})}" ?disabled="${this.disabled}" data-test="component" type="button" ${ref(this.#e)}><slot name="icon"></slot>${this.label}</button>`}#e;#t;#o};__decorate([property({reflect:!0,type:Boolean})],GlideCoreMenuButton.prototype,"disabled",null),__decorate([property({reflect:!0}),required],GlideCoreMenuButton.prototype,"label",void 0),__decorate([property({type:Boolean})],GlideCoreMenuButton.prototype,"privateActive",void 0),__decorate([property({reflect:!0})],GlideCoreMenuButton.prototype,"version",void 0),GlideCoreMenuButton=__decorate([customElement("glide-core-menu-button"),final],GlideCoreMenuButton);export default GlideCoreMenuButton;
1
+ var __decorate=this&&this.__decorate||function(e,t,o,r){var i,n=arguments.length,s=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,o,r);else for(var l=e.length-1;l>=0;l--)(i=e[l])&&(s=(n<3?i(s):n>3?i(t,o,s):i(t,o))||s);return n>3&&s&&Object.defineProperty(t,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{nanoid}from"nanoid";import packageJson from"../package.json"with{type:"json"};import styles from"./menu.button.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreMenuButton=class GlideCoreMenuButton extends LitElement{constructor(){super(...arguments),this.id=nanoid(),this.privateActive=!1,this.role="menuitem",this.tabIndex=-1,this.version=packageJson.version,this.#e=createRef(),this.#t=!1}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get disabled(){return this.#t}set disabled(e){this.#t=e,e&&this.privateActive&&this.dispatchEvent(new Event("private-disabled",{bubbles:!0}))}click(){this.#e.value?.click()}render(){return html`<button class="${classMap({component:!0,active:this.privateActive,disabled:this.disabled})}" ?disabled="${this.disabled}" data-test="component" type="button" ${ref(this.#e)}><slot name="icon"></slot>${this.label}</button>`}#e;#t};__decorate([property({reflect:!0}),required],GlideCoreMenuButton.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreMenuButton.prototype,"disabled",null),__decorate([property({reflect:!0})],GlideCoreMenuButton.prototype,"id",void 0),__decorate([property({type:Boolean})],GlideCoreMenuButton.prototype,"privateActive",void 0),__decorate([property({reflect:!0})],GlideCoreMenuButton.prototype,"role",void 0),__decorate([property({attribute:"tabindex",reflect:!0,type:Number})],GlideCoreMenuButton.prototype,"tabIndex",void 0),__decorate([property({reflect:!0})],GlideCoreMenuButton.prototype,"version",void 0),GlideCoreMenuButton=__decorate([customElement("glide-core-menu-button"),final],GlideCoreMenuButton);export default GlideCoreMenuButton;
package/dist/menu.d.ts CHANGED
@@ -5,6 +5,7 @@ declare global {
5
5
  }
6
6
  }
7
7
  /**
8
+ * @attr {boolean} [loading=false]
8
9
  * @attr {number} [offset=4]
9
10
  * @attr {boolean} [open=false]
10
11
  * @attr {'bottom'|'left'|'right'|'top'|'bottom-start'|'bottom-end'|'left-start'|'left-end'|'right-start'|'right-end'|'top-start'|'top-end'} [placement='bottom-start']
@@ -22,6 +23,11 @@ export default class GlideCoreMenu extends LitElement {
22
23
  #private;
23
24
  static shadowRootOptions: ShadowRootInit;
24
25
  static styles: import("lit").CSSResult[];
26
+ /**
27
+ * @default false
28
+ */
29
+ get loading(): boolean;
30
+ set loading(isLoading: boolean);
25
31
  /**
26
32
  * @default 4
27
33
  */
package/dist/menu.js CHANGED
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,i,o){var n,s=arguments.length,l=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,i,o);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(l=(s<3?n(l):s>3?n(t,i,l):n(t,i))||l);return s>3&&l&&Object.defineProperty(t,i,l),l};import{html,LitElement}from"lit";import{autoUpdate,computePosition,flip,offset}from"@floating-ui/dom";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import{nanoid}from"nanoid";import packageJson from"../package.json"with{type:"json"};import GlideCoreMenuButton from"./menu.button.js";import GlideCoreMenuLink from"./menu.link.js";import GlideCoreMenuOptions from"./menu.options.js";import assertSlot from"./library/assert-slot.js";import styles from"./menu.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let GlideCoreMenu=class GlideCoreMenu extends LitElement{constructor(){super(...arguments),this.placement="bottom-start",this.version=packageJson.version,this.#e=createRef(),this.#t=createRef(),this.#i=!1,this.#o=!1,this.#n=!1,this.#s="large",this.#l=createRef(),this.#a=e=>{e.target===this.#t.value&&e.preventDefault()},this.#r=()=>{this.#i=!0},this.#d=()=>{this.#i?this.#i=!1:this.#n?this.#n=!1:(this.open=!1,this.#p&&(this.#p.ariaActivedescendant=""))},this.#h=()=>{this.#n=!0}}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get offset(){return this.#c??Number.parseFloat(window.getComputedStyle(document.body).getPropertyValue("--glide-core-spacing-base-xxs"))*Number.parseFloat(window.getComputedStyle(document.documentElement).fontSize)}set offset(e){this.#c=e}get open(){return this.#o}set open(e){const t=e!==this.#o;this.#o=e,e&&t&&!this.isTargetDisabled?(this.#u(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0}))):t&&(this.#m(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0})))}get size(){return this.#s}set size(e){this.#s=e,this.#p&&(this.#p.privateSize=e)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.#d,{capture:!0})}createRenderRoot(){return this.#f=super.createRenderRoot(),this.#f}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.#d,{capture:!0})}firstUpdated(){this.#t.value&&(this.#t.value.popover="manual",this.open&&!this.isTargetDisabled&&this.#u()),this.#l.value?.addEventListener("mouseup",this.#h),this.#t.value?.addEventListener("mousedown",this.#a),this.#t.value?.addEventListener("mouseup",this.#r)}get isTargetDisabled(){const e=this.#v&&"disabled"in this.#v&&this.#v.disabled,t=this.#v&&"true"===this.#v.ariaDisabled;return Boolean(e)||Boolean(t)}render(){return html`<div class="component" @focusout="${this.#E}" ${ref(this.#e)}><slot class="target-slot" name="target" @click="${this.#g}" @keydown="${this.#S}" @slotchange="${this.#y}" ${assertSlot([Element])} ${ref(this.#l)}></slot><slot class="default-slot" @click="${this.#b}" @focusin="${this.#C}" @keydown="${this.#S}" @mouseover="${this.#M}" @private-disabled="${this.#D}" @private-slot-change="${this.#k}" @slotchange="${this.#w}" ${assertSlot([GlideCoreMenuOptions])} ${ref(this.#t)}></slot></div>`}#R;#e;#t;#i;#o;#n;#c;#f;#s;#l;get#O(){return this.#A?.find((({privateActive:e})=>e))}#a;#r;#d;#h;#T(e){this.#v&&"focus"in this.#v&&this.#v?.focus(e)}#m(){this.#R?.(),this.#p&&(this.#p.ariaActivedescendant=""),this.#v&&(this.#v.ariaExpanded="false"),this.#t.value?.hidePopover()}#E(e){const t=e.relatedTarget instanceof HTMLElement&&this.#f?.contains(e.relatedTarget),i=e.relatedTarget instanceof GlideCoreMenuOptions,o=e.relatedTarget instanceof GlideCoreMenuButton||e.relatedTarget instanceof GlideCoreMenuLink;t||i||o||(this.open=!1)}#w(){this.#p&&(this.#p.privateSize=this.size)}#b(e){e.defaultPrevented||e.target===this.#t.value||(this.open=!1)}#C(e){(e.target instanceof GlideCoreMenuButton||e.target instanceof GlideCoreMenuLink)&&this.#O&&this.#p&&!e.target.disabled&&(this.#O.privateActive=!1,e.target.privateActive=!0,this.#p.ariaActivedescendant=e.target.id)}#M(e){if((e.target instanceof GlideCoreMenuLink||e.target instanceof GlideCoreMenuButton)&&!e.target.disabled){if(this.#A)for(const t of this.#A)t.privateActive=t===e.target;this.#p&&(this.#p.ariaActivedescendant=e.target.id)}}#D(){if(this.#A&&this.#O){const e=this.#A.indexOf(this.#O);this.#O.privateActive=!1;const t=this.#A?.find(((t,i)=>!t.disabled&&i>e));if(t)return void(t.privateActive=!0);const i=this.#A.findLast(((t,i)=>!t.disabled&&i<e));i&&(i.privateActive=!0)}}#k(){const e=this.#A?.find((e=>!e.disabled));!this.#O&&e&&(e.privateActive=!0)}#S(e){const t=this.#v instanceof HTMLSpanElement||this.#v instanceof HTMLDivElement;if([" ","Enter"].includes(e.key)&&this.open)return this.#i=!0,e.preventDefault()," "===e.key&&t&&e.preventDefault(),this.#T(),void this.#O?.click();if([" ","Enter"].includes(e.key)&&!this.open&&t)return e.preventDefault(),void(this.open=!0);if(["Escape"].includes(e.key)&&this.open)return e.preventDefault(),this.open=!1,void this.#T();if(["ArrowUp","ArrowDown"].includes(e.key)&&!this.open&&this.#O&&this.#p)return e.preventDefault(),this.open=!0,void(this.#p.ariaActivedescendant=this.#O.id);if(this.open&&this.#O&&this.#A){const t=this.#A.indexOf(this.#O);if("ArrowUp"===e.key&&!e.metaKey){e.preventDefault();const i=this.#A.findLast(((e,i)=>!e.disabled&&i<t));return void(i&&this.#p&&(this.#O.privateActive=!1,this.#p.ariaActivedescendant=i.id,i.privateActive=!0))}if("ArrowDown"===e.key&&!e.metaKey){e.preventDefault();const i=this.#A.find(((e,i)=>!e.disabled&&i>t));return void(i&&this.#p&&(this.#O.privateActive=!1,this.#p.ariaActivedescendant=i.id,i.privateActive=!0))}if("ArrowUp"===e.key&&e.metaKey||"Home"===e.key||"PageUp"===e.key){e.preventDefault();const t=[...this.#A].reverse().findLast((e=>!e.disabled));return void(t&&this.#p&&(this.#O.privateActive=!1,this.#p.ariaActivedescendant=t.id,t.privateActive=!0))}if("ArrowDown"===e.key&&e.metaKey||"End"===e.key||"PageDown"===e.key){e.preventDefault();const t=[...this.#A].findLast((e=>!e.disabled));return void(t&&this.#p&&(this.#O.privateActive=!1,this.#p.ariaActivedescendant=t.id,t.privateActive=!0))}}}#y(){const e=new MutationObserver((()=>{this.open&&!this.isTargetDisabled?this.#u():this.#m()}));this.#v&&this.#p&&(e.observe(this.#v,{attributes:!0,attributeFilter:["aria-disabled","disabled"]}),this.#v.ariaHasPopup="true",this.#v.id=nanoid(),this.#v.setAttribute("aria-controls",this.#p.id),this.#p.ariaLabelledby=this.#v.id);(this.#v instanceof HTMLSpanElement||this.#v instanceof HTMLDivElement)&&this.#v instanceof HTMLElement&&(this.#v.tabIndex=0),this.open&&!this.isTargetDisabled?this.#u():this.#m()}#g(e){e.defaultPrevented||(this.isTargetDisabled?this.#m():this.#A&&this.#A.length>0&&(this.open=!this.open))}get#p(){const e=this.#t.value?.assignedElements().at(0);return e instanceof GlideCoreMenuOptions?e:null}get#A(){let e=this.#t.value?.assignedElements()?.at(0)?.children;const t=e?.[0];if(t instanceof HTMLSlotElement&&(e=t.assignedElements()),e)return[...e].filter((e=>e instanceof GlideCoreMenuLink||e instanceof GlideCoreMenuButton))}#u(){this.#R?.(),this.#v&&this.#t.value&&(this.#R=autoUpdate(this.#v,this.#t.value,(()=>{(async()=>{if(this.#v&&this.#t.value){const{x:e,y:t,placement:i}=await computePosition(this.#v,this.#t.value,{placement:this.placement,middleware:[offset(this.offset),flip()]});this.#t.value.dataset.placement=i,Object.assign(this.#t.value.style,{left:`${e}px`,top:`${t}px`})}this.#t.value?.showPopover(),this.#p&&this.#O?.id&&(this.#p.ariaActivedescendant=this.#O.id),this.#v&&(this.#v.ariaExpanded="true")})()})))}get#v(){return this.#l.value?.assignedElements().at(0)}};__decorate([property({reflect:!0,type:Number})],GlideCoreMenu.prototype,"offset",null),__decorate([property({reflect:!0,type:Boolean})],GlideCoreMenu.prototype,"open",null),__decorate([property({reflect:!0})],GlideCoreMenu.prototype,"placement",void 0),__decorate([property({reflect:!0})],GlideCoreMenu.prototype,"size",null),__decorate([property({reflect:!0})],GlideCoreMenu.prototype,"version",void 0),GlideCoreMenu=__decorate([customElement("glide-core-menu"),final],GlideCoreMenu);export default GlideCoreMenu;
1
+ var __decorate=this&&this.__decorate||function(e,t,i,o){var n,s=arguments.length,l=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,i,o);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(l=(s<3?n(l):s>3?n(t,i,l):n(t,i))||l);return s>3&&l&&Object.defineProperty(t,i,l),l};import{html,LitElement}from"lit";import{autoUpdate,computePosition,flip,offset}from"@floating-ui/dom";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import{nanoid}from"nanoid";import packageJson from"../package.json"with{type:"json"};import GlideCoreMenuButton from"./menu.button.js";import{LocalizeController}from"./library/localize.js";import GlideCoreMenuLink from"./menu.link.js";import GlideCoreMenuOptions from"./menu.options.js";import assertSlot from"./library/assert-slot.js";import styles from"./menu.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let GlideCoreMenu=class GlideCoreMenu extends LitElement{constructor(){super(...arguments),this.placement="bottom-start",this.version=packageJson.version,this.#e=createRef(),this.#t=createRef(),this.#i=!1,this.#o=!1,this.#n=!1,this.#s=!1,this.#l=new LocalizeController(this),this.#a="large",this.#r=createRef(),this.#d=e=>{e.target===this.#t.value&&e.preventDefault()},this.#p=()=>{this.#i=!0},this.#h=()=>{this.#i?this.#i=!1:this.#s?this.#s=!1:(this.open=!1,this.#c&&(this.#c.ariaActivedescendant=""))},this.#u=()=>{this.#s=!0}}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get loading(){return this.#o}set loading(e){this.#o=e;const t=this.querySelector("glide-core-menu-options");t&&this.#m&&(t.privateLoading=e,this.#m.ariaDescription=e?this.#l.term("loading"):null)}get offset(){return this.#f??Number.parseFloat(window.getComputedStyle(document.body).getPropertyValue("--glide-core-spacing-base-xxs"))*Number.parseFloat(window.getComputedStyle(document.documentElement).fontSize)}set offset(e){this.#f=e}get open(){return this.#n}set open(e){const t=e!==this.#n;this.#n=e,e&&t&&!this.isTargetDisabled?(this.#E(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0}))):t&&(this.#g(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0})))}get size(){return this.#a}set size(e){this.#a=e,this.#c&&(this.#c.privateSize=e)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.#h,{capture:!0})}createRenderRoot(){return this.#v=super.createRenderRoot(),this.#v}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.#h,{capture:!0})}firstUpdated(){const e=this.querySelector("glide-core-menu-options");e&&this.#m&&(e.privateLoading=this.loading,this.#m.ariaDescription=this.loading?this.#l.term("loading"):null),this.#t.value&&(this.#t.value.popover="manual",this.open&&!this.isTargetDisabled&&this.#E()),this.#r.value?.addEventListener("mouseup",this.#u),this.#t.value?.addEventListener("mousedown",this.#d),this.#t.value?.addEventListener("mouseup",this.#p)}get isTargetDisabled(){const e=this.#m&&"disabled"in this.#m&&this.#m.disabled,t=this.#m&&"true"===this.#m.ariaDisabled;return Boolean(e)||Boolean(t)}render(){return html`<div class="component" @focusout="${this.#S}" ${ref(this.#e)}><slot class="target-slot" name="target" @click="${this.#y}" @keydown="${this.#b}" @slotchange="${this.#C}" ${assertSlot([Element])} ${ref(this.#r)}></slot><slot class="default-slot" @click="${this.#D}" @focusin="${this.#M}" @keydown="${this.#b}" @mouseover="${this.#w}" @private-disabled="${this.#k}" @private-slot-change="${this.#R}" @slotchange="${this.#O}" ${assertSlot([GlideCoreMenuOptions])} ${ref(this.#t)}></slot></div>`}#A;#e;#t;#i;#o;#n;#s;#l;#f;#v;#a;#r;get#L(){return this.#T?.find((({privateActive:e})=>e))}#d;#p;#h;#u;#G(e){this.#m&&"focus"in this.#m&&this.#m?.focus(e)}#g(){this.#A?.(),this.#c&&(this.#c.ariaActivedescendant=""),this.#m&&(this.#m.ariaExpanded="false"),this.#t.value?.hidePopover()}#S(e){const t=e.relatedTarget instanceof HTMLElement&&this.#v?.contains(e.relatedTarget),i=e.relatedTarget instanceof GlideCoreMenuOptions,o=e.relatedTarget instanceof GlideCoreMenuButton||e.relatedTarget instanceof GlideCoreMenuLink;t||i||o||(this.open=!1)}#O(){this.#c&&(this.#c.privateSize=this.size)}#D(e){e.defaultPrevented||e.target===this.#t.value||(this.open=!1)}#M(e){(e.target instanceof GlideCoreMenuButton||e.target instanceof GlideCoreMenuLink)&&this.#L&&this.#c&&!e.target.disabled&&(this.#L.privateActive=!1,e.target.privateActive=!0,this.#c.ariaActivedescendant=e.target.id)}#w(e){if((e.target instanceof GlideCoreMenuLink||e.target instanceof GlideCoreMenuButton)&&!e.target.disabled){if(this.#T)for(const t of this.#T)t.privateActive=t===e.target;this.#c&&(this.#c.ariaActivedescendant=e.target.id)}}#k(){if(this.#T&&this.#L){const e=this.#T.indexOf(this.#L);this.#L.privateActive=!1;const t=this.#T?.find(((t,i)=>!t.disabled&&i>e));if(t)return void(t.privateActive=!0);const i=this.#T.findLast(((t,i)=>!t.disabled&&i<e));i&&(i.privateActive=!0)}}#R(){const e=this.#T?.find((e=>!e.disabled));!this.#L&&e&&(e.privateActive=!0)}#b(e){const t=this.#m instanceof HTMLSpanElement||this.#m instanceof HTMLDivElement;if([" ","Enter"].includes(e.key)&&this.open)return this.#i=!0,e.preventDefault()," "===e.key&&t&&e.preventDefault(),this.#G(),void this.#L?.click();if([" ","Enter"].includes(e.key)&&!this.open&&t)return e.preventDefault(),void(this.open=!0);if(["Escape"].includes(e.key)&&this.open)return e.preventDefault(),this.open=!1,void this.#G();if(["ArrowUp","ArrowDown"].includes(e.key)&&!this.open&&this.#L&&this.#c)return e.preventDefault(),this.open=!0,void(this.#c.ariaActivedescendant=this.#L.id);if(this.open&&this.#L&&this.#T){const t=this.#T.indexOf(this.#L);if("ArrowUp"===e.key&&!e.metaKey){e.preventDefault();const i=this.#T.findLast(((e,i)=>!e.disabled&&i<t));return void(i&&this.#c&&(this.#L.privateActive=!1,this.#c.ariaActivedescendant=i.id,i.privateActive=!0))}if("ArrowDown"===e.key&&!e.metaKey){e.preventDefault();const i=this.#T.find(((e,i)=>!e.disabled&&i>t));return void(i&&this.#c&&(this.#L.privateActive=!1,this.#c.ariaActivedescendant=i.id,i.privateActive=!0))}if("ArrowUp"===e.key&&e.metaKey||"Home"===e.key||"PageUp"===e.key){e.preventDefault();const t=[...this.#T].reverse().findLast((e=>!e.disabled));return void(t&&this.#c&&(this.#L.privateActive=!1,this.#c.ariaActivedescendant=t.id,t.privateActive=!0))}if("ArrowDown"===e.key&&e.metaKey||"End"===e.key||"PageDown"===e.key){e.preventDefault();const t=[...this.#T].findLast((e=>!e.disabled));return void(t&&this.#c&&(this.#L.privateActive=!1,this.#c.ariaActivedescendant=t.id,t.privateActive=!0))}}}#C(){const e=new MutationObserver((()=>{this.open&&!this.isTargetDisabled?this.#E():this.#g()}));this.#m&&this.#c&&(e.observe(this.#m,{attributes:!0,attributeFilter:["aria-disabled","disabled"]}),this.#m.ariaHasPopup="true",this.#m.id=nanoid(),this.#m.setAttribute("aria-controls",this.#c.id),this.#c.ariaLabelledby=this.#m.id);(this.#m instanceof HTMLSpanElement||this.#m instanceof HTMLDivElement)&&this.#m instanceof HTMLElement&&(this.#m.tabIndex=0),this.open&&!this.isTargetDisabled?this.#E():this.#g()}#y(e){e.defaultPrevented||(this.isTargetDisabled?this.#g():this.#T&&this.#T.length>0&&(this.open=!this.open))}get#c(){const e=this.#t.value?.assignedElements().at(0);return e instanceof GlideCoreMenuOptions?e:null}get#T(){let e=this.#t.value?.assignedElements()?.at(0)?.children;const t=e?.[0];if(t instanceof HTMLSlotElement&&(e=t.assignedElements()),e)return[...e].filter((e=>e instanceof GlideCoreMenuLink||e instanceof GlideCoreMenuButton))}#E(){this.#A?.(),this.#m&&this.#t.value&&(this.#A=autoUpdate(this.#m,this.#t.value,(()=>{(async()=>{if(this.#m&&this.#t.value){const{x:e,y:t,placement:i}=await computePosition(this.#m,this.#t.value,{placement:this.placement,middleware:[offset(this.offset),flip()]});this.#t.value.dataset.placement=i,Object.assign(this.#t.value.style,{left:`${e}px`,top:`${t}px`})}this.#t.value?.showPopover(),this.#c&&this.#L?.id&&(this.#c.ariaActivedescendant=this.#L.id),this.#m&&(this.#m.ariaExpanded="true")})()})))}get#m(){return this.#r.value?.assignedElements().at(0)}};__decorate([property({reflect:!0,type:Boolean})],GlideCoreMenu.prototype,"loading",null),__decorate([property({reflect:!0,type:Number})],GlideCoreMenu.prototype,"offset",null),__decorate([property({reflect:!0,type:Boolean})],GlideCoreMenu.prototype,"open",null),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreMenu.prototype,"placement",void 0),__decorate([property({reflect:!0})],GlideCoreMenu.prototype,"size",null),__decorate([property({reflect:!0})],GlideCoreMenu.prototype,"version",void 0),GlideCoreMenu=__decorate([customElement("glide-core-menu"),final],GlideCoreMenu);export default GlideCoreMenu;
@@ -7,7 +7,16 @@ declare global {
7
7
  /**
8
8
  * @attr {string} label
9
9
  * @attr {boolean} [disabled=false]
10
- * @attr {string} [url]
10
+ * @attr {string} [href]
11
+ *
12
+ * @readonly
13
+ * @attr {string} [id]
14
+ *
15
+ * @readonly
16
+ * @attr {string} [role='menuitem']
17
+ *
18
+ * @readonly
19
+ * @attr {number} [tabindex=-1]
11
20
  *
12
21
  * @readonly
13
22
  * @attr {string} [version]
@@ -18,16 +27,18 @@ export default class GlideCoreMenuLink extends LitElement {
18
27
  #private;
19
28
  static shadowRootOptions: ShadowRootInit;
20
29
  static styles: import("lit").CSSResult[];
30
+ label?: string;
21
31
  /**
22
32
  * @default false
23
33
  */
24
34
  get disabled(): boolean;
25
35
  set disabled(isDisabled: boolean);
26
- label?: string;
27
- url?: string;
36
+ href?: string;
37
+ readonly id: string;
28
38
  privateActive: boolean;
39
+ readonly role = "menuitem";
40
+ readonly tabIndex = -1;
29
41
  readonly version: string;
30
42
  click(): void;
31
- connectedCallback(): void;
32
43
  render(): import("lit").TemplateResult<1>;
33
44
  }
package/dist/menu.link.js CHANGED
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,i,o){var r,s=arguments.length,n=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,i,o);else for(var l=e.length-1;l>=0;l--)(r=e[l])&&(n=(s<3?r(n):s>3?r(t,i,n):r(t,i))||n);return s>3&&n&&Object.defineProperty(t,i,n),n};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{nanoid}from"nanoid";import packageJson from"../package.json"with{type:"json"};import styles from"./menu.link.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreMenuLink=class GlideCoreMenuLink extends LitElement{constructor(){super(...arguments),this.privateActive=!1,this.version=packageJson.version,this.#e=createRef(),this.#t=nanoid(),this.#i=!1}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get disabled(){return this.#i}set disabled(e){this.#i=e,e&&this.privateActive&&this.dispatchEvent(new Event("private-disabled",{bubbles:!0}))}click(){this.disabled||this.#e.value?.click()}connectedCallback(){super.connectedCallback(),this.id=this.#t,this.role="menuitem",this.tabIndex=-1}render(){return html`<a aria-disabled="${this.disabled}" class="${classMap({component:!0,active:this.privateActive,disabled:this.disabled})}" data-test="component" href="${ifDefined(this.url)}" @click="${this.#o}" ${ref(this.#e)}><slot name="icon"></slot>${this.label}</a>`}#e;#t;#i;#o(e){this.disabled&&(e.preventDefault(),e.stopPropagation())}};__decorate([property({reflect:!0,type:Boolean})],GlideCoreMenuLink.prototype,"disabled",null),__decorate([property({reflect:!0}),required],GlideCoreMenuLink.prototype,"label",void 0),__decorate([property({reflect:!0})],GlideCoreMenuLink.prototype,"url",void 0),__decorate([property({type:Boolean})],GlideCoreMenuLink.prototype,"privateActive",void 0),__decorate([property({reflect:!0})],GlideCoreMenuLink.prototype,"version",void 0),GlideCoreMenuLink=__decorate([customElement("glide-core-menu-link"),final],GlideCoreMenuLink);export default GlideCoreMenuLink;
1
+ var __decorate=this&&this.__decorate||function(e,t,i,o){var r,n=arguments.length,s=n<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(e,t,i,o);else for(var l=e.length-1;l>=0;l--)(r=e[l])&&(s=(n<3?r(s):n>3?r(t,i,s):r(t,i))||s);return n>3&&s&&Object.defineProperty(t,i,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{nanoid}from"nanoid";import packageJson from"../package.json"with{type:"json"};import styles from"./menu.link.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreMenuLink=class GlideCoreMenuLink extends LitElement{constructor(){super(...arguments),this.id=nanoid(),this.privateActive=!1,this.role="menuitem",this.tabIndex=-1,this.version=packageJson.version,this.#e=createRef(),this.#t=!1}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get disabled(){return this.#t}set disabled(e){this.#t=e,e&&this.privateActive&&this.dispatchEvent(new Event("private-disabled",{bubbles:!0}))}click(){this.disabled||this.#e.value?.click()}render(){return html`<a aria-disabled="${this.disabled}" class="${classMap({component:!0,active:this.privateActive,disabled:this.disabled})}" data-test="component" href="${ifDefined(this.href)}" @click="${this.#i}" ${ref(this.#e)}><slot name="icon"></slot>${this.label}</a>`}#e;#t;#i(e){this.disabled&&(e.preventDefault(),e.stopPropagation())}};__decorate([property({reflect:!0}),required],GlideCoreMenuLink.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreMenuLink.prototype,"disabled",null),__decorate([property({reflect:!0})],GlideCoreMenuLink.prototype,"href",void 0),__decorate([property({reflect:!0})],GlideCoreMenuLink.prototype,"id",void 0),__decorate([property({type:Boolean})],GlideCoreMenuLink.prototype,"privateActive",void 0),__decorate([property({reflect:!0})],GlideCoreMenuLink.prototype,"role",void 0),__decorate([property({attribute:"tabindex",reflect:!0,type:Number})],GlideCoreMenuLink.prototype,"tabIndex",void 0),__decorate([property({reflect:!0})],GlideCoreMenuLink.prototype,"version",void 0),GlideCoreMenuLink=__decorate([customElement("glide-core-menu-link"),final],GlideCoreMenuLink);export default GlideCoreMenuLink;
@@ -9,6 +9,15 @@ declare global {
9
9
  * @attr {string} [aria-labelledby='']
10
10
  *
11
11
  * @readonly
12
+ * @attr {string} [id]
13
+ *
14
+ * @readonly
15
+ * @attr {string} [role='menu']
16
+ *
17
+ * @readonly
18
+ * @attr {number} [tabindex=-1]
19
+ *
20
+ * @readonly
12
21
  * @attr {string} [version]
13
22
  *
14
23
  * @slot {GlideCoreMenuButton | GlideCoreMenuLink}
@@ -19,8 +28,11 @@ export default class GlideCoreMenuOptions extends LitElement {
19
28
  static styles: import("lit").CSSResult[];
20
29
  ariaActivedescendant: string;
21
30
  ariaLabelledby: string;
31
+ readonly id: string;
32
+ privateLoading: boolean;
22
33
  privateSize: 'large' | 'small';
34
+ readonly role = "menu";
35
+ readonly tabIndex = -1;
23
36
  readonly version: string;
24
- connectedCallback(): void;
25
37
  render(): import("lit").TemplateResult<1>;
26
38
  }
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,o,i){var r,n=arguments.length,s=n<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--)(r=e[a])&&(s=(n<3?r(s):n>3?r(t,o,s):r(t,o))||s);return n>3&&s&&Object.defineProperty(t,o,s),s};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{customElement,property}from"lit/decorators.js";import{nanoid}from"nanoid";import packageJson from"../package.json"with{type:"json"};import GlideCoreMenuButton from"./menu.button.js";import GlideCoreMenuLink from"./menu.link.js";import styles from"./menu.options.styles.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let GlideCoreMenuOptions=class GlideCoreMenuOptions extends LitElement{constructor(){super(...arguments),this.ariaActivedescendant="",this.ariaLabelledby="",this.privateSize="large",this.version=packageJson.version,this.#e=nanoid()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}connectedCallback(){super.connectedCallback(),this.id=this.#e,this.role="menu",this.tabIndex=-1}render(){return html`<div class="${classMap({component:!0,large:"large"===this.privateSize,small:"small"===this.privateSize})}" role="none"><slot ${assertSlot([GlideCoreMenuButton,GlideCoreMenuLink,Text])} @slotchange="${this.#t}"></slot></div>`}#e;#t(){this.dispatchEvent(new Event("private-slot-change",{bubbles:!0}))}};__decorate([property({attribute:"aria-activedescendant",reflect:!0})],GlideCoreMenuOptions.prototype,"ariaActivedescendant",void 0),__decorate([property({attribute:"aria-labelledby",reflect:!0})],GlideCoreMenuOptions.prototype,"ariaLabelledby",void 0),__decorate([property()],GlideCoreMenuOptions.prototype,"privateSize",void 0),__decorate([property({reflect:!0})],GlideCoreMenuOptions.prototype,"version",void 0),GlideCoreMenuOptions=__decorate([customElement("glide-core-menu-options"),final],GlideCoreMenuOptions);export default GlideCoreMenuOptions;
1
+ var __decorate=this&&this.__decorate||function(e,t,o,i){var r,a=arguments.length,n=a<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,o,i);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(n=(a<3?r(n):a>3?r(t,o,n):r(t,o))||n);return a>3&&n&&Object.defineProperty(t,o,n),n};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{customElement,property}from"lit/decorators.js";import{nanoid}from"nanoid";import{map}from"lit/directives/map.js";import{when}from"lit/directives/when.js";import{range}from"lit/directives/range.js";import packageJson from"../package.json"with{type:"json"};import GlideCoreMenuButton from"./menu.button.js";import GlideCoreMenuLink from"./menu.link.js";import styles from"./menu.options.styles.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let GlideCoreMenuOptions=class GlideCoreMenuOptions extends LitElement{constructor(){super(...arguments),this.ariaActivedescendant="",this.ariaLabelledby="",this.id=nanoid(),this.privateLoading=!1,this.privateSize="large",this.role="menu",this.tabIndex=-1,this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}render(){return html`<div class="${classMap({component:!0,large:"large"===this.privateSize,small:"small"===this.privateSize})}" role="none"><slot class="${classMap({"default-slot":!0,loading:this.privateLoading})}" ${assertSlot([GlideCoreMenuButton,GlideCoreMenuLink,Text])} @slotchange="${this.#e}"></slot>${when(this.privateLoading,(()=>html`<div class="loading-feedback" data-test="loading-feedback">${map(range(7),(()=>html`<div></div>`))}</div>`))}</div>`}#e(){this.dispatchEvent(new Event("private-slot-change",{bubbles:!0}))}};__decorate([property({attribute:"aria-activedescendant",reflect:!0,useDefault:!0})],GlideCoreMenuOptions.prototype,"ariaActivedescendant",void 0),__decorate([property({attribute:"aria-labelledby",reflect:!0,useDefault:!0})],GlideCoreMenuOptions.prototype,"ariaLabelledby",void 0),__decorate([property({reflect:!0})],GlideCoreMenuOptions.prototype,"id",void 0),__decorate([property({type:Boolean})],GlideCoreMenuOptions.prototype,"privateLoading",void 0),__decorate([property()],GlideCoreMenuOptions.prototype,"privateSize",void 0),__decorate([property({reflect:!0})],GlideCoreMenuOptions.prototype,"role",void 0),__decorate([property({attribute:"tabindex",reflect:!0,type:Number})],GlideCoreMenuOptions.prototype,"tabIndex",void 0),__decorate([property({reflect:!0})],GlideCoreMenuOptions.prototype,"version",void 0),GlideCoreMenuOptions=__decorate([customElement("glide-core-menu-options"),final],GlideCoreMenuOptions);export default GlideCoreMenuOptions;
@@ -1,4 +1,6 @@
1
- import{css}from"lit";export default[css`
1
+ import{css}from"lit";import skeleton from"./styles/skeleton.js";export default[css`
2
+ ${skeleton(".loading-feedback")}
3
+ `,css`
2
4
  :host {
3
5
  display: inline-block;
4
6
  inline-size: 100%;
@@ -26,4 +28,10 @@ import{css}from"lit";export default[css`
26
28
  font-weight: var(--glide-core-typography-weight-regular);
27
29
  }
28
30
  }
31
+
32
+ .default-slot {
33
+ &.loading {
34
+ display: none;
35
+ }
36
+ }
29
37
  `];
package/dist/modal.d.ts CHANGED
@@ -26,8 +26,8 @@ export default class GlideCoreModal extends LitElement {
26
26
  #private;
27
27
  static shadowRootOptions: ShadowRootInit;
28
28
  static styles: import("lit").CSSResult[];
29
- backButton: boolean;
30
29
  label?: string;
30
+ backButton: boolean;
31
31
  /**
32
32
  * @default false
33
33
  */
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(o,t,e,r){var i,l=arguments.length,n=l<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,e):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(o,t,e,r);else for(var s=o.length-1;s>=0;s--)(i=o[s])&&(n=(l<3?i(n):l>3?i(t,e,n):i(t,e))||n);return l>3&&n&&Object.defineProperty(t,e,n),n};import"./icon-button.js";import{html,LitElement}from"lit";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"./modal.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 GlideCoreModalIconButton=class GlideCoreModalIconButton extends LitElement{constructor(){super(...arguments),this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}render(){return html`<glide-core-icon-button label="${ifDefined(this.label)}" variant="tertiary"><slot ${assertSlot()}></slot></glide-core-icon-button>`}};__decorate([property(),required],GlideCoreModalIconButton.prototype,"label",void 0),__decorate([property({reflect:!0})],GlideCoreModalIconButton.prototype,"version",void 0),GlideCoreModalIconButton=__decorate([customElement("glide-core-modal-icon-button"),final],GlideCoreModalIconButton);export default GlideCoreModalIconButton;
1
+ var __decorate=this&&this.__decorate||function(o,t,e,r){var i,l=arguments.length,n=l<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,e):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(o,t,e,r);else for(var s=o.length-1;s>=0;s--)(i=o[s])&&(n=(l<3?i(n):l>3?i(t,e,n):i(t,e))||n);return l>3&&n&&Object.defineProperty(t,e,n),n};import"./icon-button.js";import{html,LitElement}from"lit";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"./modal.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 GlideCoreModalIconButton=class GlideCoreModalIconButton extends LitElement{constructor(){super(...arguments),this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}render(){return html`<glide-core-icon-button label="${ifDefined(this.label)}" variant="tertiary"><slot ${assertSlot()}></slot></glide-core-icon-button>`}};__decorate([property({reflect:!0}),required],GlideCoreModalIconButton.prototype,"label",void 0),__decorate([property({reflect:!0})],GlideCoreModalIconButton.prototype,"version",void 0),GlideCoreModalIconButton=__decorate([customElement("glide-core-modal-icon-button"),final],GlideCoreModalIconButton);export default GlideCoreModalIconButton;
package/dist/modal.js CHANGED
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,o,i){var l,n=arguments.length,s=n<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 r=e.length-1;r>=0;r--)(l=e[r])&&(s=(n<3?l(s):n>3?l(t,o,s):l(t,o))||s);return n>3&&s&&Object.defineProperty(t,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,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{when}from"lit/directives/when.js";import packageJson from"../package.json"with{type:"json"};import{LocalizeController}from"./library/localize.js";import GlideCoreModalIconButton from"./modal.icon-button.js";import GlideCoreButton from"./button.js";import GlideCoreTooltip from"./tooltip.js";import styles from"./modal.styles.js";import xIcon from"./icons/x.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import severityInformationalIcon from"./icons/severity-informational.js";import severityMediumIcon from"./icons/severity-medium.js";import severityCriticalIcon from"./icons/severity-critical.js";import final from"./library/final.js";import required from"./library/required.js";const globalStylesheet=new CSSStyleSheet;globalStylesheet.insertRule("\n .private-glide-core-modal-lock-scroll {\n scrollbar-gutter: stable !important;\n overflow: hidden !important;\n }\n");let GlideCoreModal=class GlideCoreModal extends LitElement{constructor(){super(...arguments),this.backButton=!1,this.size="medium",this.version=packageJson.version,this.hasPrimarySlotContent=!1,this.hasSecondarySlotContent=!1,this.hasTertiarySlotContent=!1,this.#e=createRef(),this.#t=createRef(),this.#o=createRef(),this.#i=createRef(),this.#l=createRef(),this.#n=!1,this.#s=!1,this.#r=new LocalizeController(this),this.#a=createRef(),this.#c=createRef(),this.#d=createRef(),this.#m=()=>{this.#n=!0},this.#h=()=>{this.#n=!0},this.#p=()=>{const e=this.open;setTimeout((()=>{this.#n?setTimeout((()=>{this.#n=!1})):e===this.open&&(this.open=!1)}))}}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get open(){return this.#s}set open(e){const t=e!==this.#s;this.#s=e,e&&t?(this.#y(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0}))):t&&(this.#u(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0})))}connectedCallback(){super.connectedCallback();document.adoptedStyleSheets.includes(globalStylesheet)||document.adoptedStyleSheets.push(globalStylesheet),document.addEventListener("click",this.#p,{capture:!0})}disconnectedCallback(){super.disconnectedCallback(),document.documentElement.classList.remove("private-glide-core-modal-lock-scroll"),document.adoptedStyleSheets=document.adoptedStyleSheets.filter((e=>e!==globalStylesheet)),document.removeEventListener("click",this.#p,{capture:!0})}firstUpdated(){this.open&&this.#y(),this.#i.value?.addEventListener("click",this.#m,{capture:!0}),this.#i.value?.addEventListener("mouseup",this.#h)}render(){return html`<dialog class="component" data-test="component" @keydown="${this.#f}" ${ref(this.#o)}><div class="${classMap({container:!0,small:"small"===this.size,medium:"medium"===this.size,large:"large"===this.size,xlarge:"xlarge"===this.size})}" ${ref(this.#i)}><header class="header"><h2 class="label" data-test="heading" id="heading">${when(this.severity,(()=>html`<span aria-label="${this.#r.term("informational"===this.severity?"severityInformational":"critical"===this.severity?"severityCritical":"severityMedium")} - " class="${classMap({severity:!0,critical:"critical"===this.severity,informational:"informational"===this.severity,medium:"medium"===this.severity})}" data-test="severity">${this.severity&&icons[this.severity]}</span>`))} ${when(this.backButton&&!this.severity,(()=>html`<glide-core-modal-icon-button class="back-button" data-test="back-button" label="${this.#r.term("dismiss")}" @click="${this.#C}" ${ref(this.#e)}>${icons.back}</glide-core-modal-icon-button>`))} ${this.label}</h2><div class="header-actions" role="toolbar"><slot name="header-actions" ${assertSlot([GlideCoreModalIconButton],!0)} ${ref(this.#l)}></slot><glide-core-modal-icon-button class="close-button" data-test="close-button" label="${this.#r.term("close")}" @click="${this.#C}" ${ref(this.#t)}>${xIcon}</glide-core-modal-icon-button></div></header><article aria-labelledby="heading" class="body" role="region"><slot ${assertSlot()}></slot></article><footer><menu aria-hidden="${!this.hasTertiarySlotContent&&!this.hasSecondarySlotContent&&!this.hasPrimarySlotContent}" class="actions"><li aria-hidden="${!this.hasTertiarySlotContent}" class="action"><slot class="tertiary-slot" name="tertiary" @slotchange="${this.#v}" ${assertSlot([GlideCoreButton,GlideCoreTooltip],!0)} ${ref(this.#d)}></slot></li><li aria-hidden="${!this.hasSecondarySlotContent}" class="action"><slot name="secondary" @slotchange="${this.#S}" ${assertSlot([GlideCoreButton],!0)} ${ref(this.#c)}></slot></li><li aria-hidden="${!this.hasPrimarySlotContent}" class="action"><slot name="primary" @slotchange="${this.#b}" ${assertSlot([GlideCoreButton],!0)} ${ref(this.#a)}></slot></li></menu></footer></div></dialog>`}#e;#t;#o;#i;#l;#n;#s;#r;#a;#c;#d;#m;#h;#p;#u(){document.documentElement.classList.remove("private-glide-core-modal-lock-scroll"),this.#o.value?.close()}#C(){this.open=!1}#f(e){"Escape"===e.key&&(this.open=!1,e.preventDefault())}#b(){this.hasPrimarySlotContent=Boolean(this.#a.value?.assignedElements().length)}#S(){this.hasSecondarySlotContent=Boolean(this.#c.value?.assignedElements().length)}#v(){this.hasTertiarySlotContent=Boolean(this.#d.value?.assignedElements().length)}#y(){document.documentElement.classList.add("private-glide-core-modal-lock-scroll"),this.#o.value?.showModal()}};__decorate([property({attribute:"back-button",type:Boolean,reflect:!0})],GlideCoreModal.prototype,"backButton",void 0),__decorate([property({reflect:!0}),required],GlideCoreModal.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreModal.prototype,"open",null),__decorate([property({reflect:!0})],GlideCoreModal.prototype,"severity",void 0),__decorate([property({reflect:!0})],GlideCoreModal.prototype,"size",void 0),__decorate([property({reflect:!0})],GlideCoreModal.prototype,"version",void 0),__decorate([state()],GlideCoreModal.prototype,"hasPrimarySlotContent",void 0),__decorate([state()],GlideCoreModal.prototype,"hasSecondarySlotContent",void 0),__decorate([state()],GlideCoreModal.prototype,"hasTertiarySlotContent",void 0),GlideCoreModal=__decorate([customElement("glide-core-modal"),final],GlideCoreModal);export default GlideCoreModal;const icons={back:html`<svg style="${styleMap({height:"1.25rem",width:"1.25rem"})}" viewBox="0 0 24 24" fill="none"><path d="M12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20V18ZM20 14.5C20 16.433 18.433 18 16.5 18V20C19.5376 20 22 17.5376 22 14.5H20ZM16.5 11C18.433 11 20 12.567 20 14.5H22C22 11.4624 19.5376 9 16.5 9V11ZM16.5 18H12V20H16.5V18ZM16.5 9H3V11H16.5V9Z" fill="currentColor"/><path d="M7 6L3 10L7 14" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>`,critical:severityCriticalIcon,informational:severityInformationalIcon,medium:severityMediumIcon};
1
+ var __decorate=this&&this.__decorate||function(e,t,o,i){var l,n=arguments.length,s=n<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 r=e.length-1;r>=0;r--)(l=e[r])&&(s=(n<3?l(s):n>3?l(t,o,s):l(t,o))||s);return n>3&&s&&Object.defineProperty(t,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,state}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{when}from"lit/directives/when.js";import packageJson from"../package.json"with{type:"json"};import{LocalizeController}from"./library/localize.js";import GlideCoreModalIconButton from"./modal.icon-button.js";import GlideCoreButton from"./button.js";import GlideCoreTooltip from"./tooltip.js";import styles from"./modal.styles.js";import xIcon from"./icons/x.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import severityInformationalIcon from"./icons/severity-informational.js";import severityMediumIcon from"./icons/severity-medium.js";import severityCriticalIcon from"./icons/severity-critical.js";import final from"./library/final.js";import required from"./library/required.js";const globalStylesheet=new CSSStyleSheet;globalStylesheet.insertRule("\n .private-glide-core-modal-lock-scroll {\n scrollbar-gutter: stable !important;\n overflow: hidden !important;\n }\n");let GlideCoreModal=class GlideCoreModal extends LitElement{constructor(){super(...arguments),this.backButton=!1,this.size="medium",this.version=packageJson.version,this.hasPrimarySlotContent=!1,this.hasSecondarySlotContent=!1,this.hasTertiarySlotContent=!1,this.#e=createRef(),this.#t=createRef(),this.#o=createRef(),this.#i=createRef(),this.#l=createRef(),this.#n=!1,this.#s=!1,this.#r=new LocalizeController(this),this.#a=createRef(),this.#c=createRef(),this.#d=createRef(),this.#m=()=>{this.#n=!0},this.#h=()=>{this.#n=!0},this.#p=()=>{const e=this.open;setTimeout((()=>{this.#n?setTimeout((()=>{this.#n=!1})):e===this.open&&(this.open=!1)}))}}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get open(){return this.#s}set open(e){const t=e!==this.#s;this.#s=e,e&&t?(this.#y(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0}))):t&&(this.#u(),this.dispatchEvent(new Event("toggle",{bubbles:!0,composed:!0})))}connectedCallback(){super.connectedCallback();document.adoptedStyleSheets.includes(globalStylesheet)||document.adoptedStyleSheets.push(globalStylesheet),document.addEventListener("click",this.#p,{capture:!0})}disconnectedCallback(){super.disconnectedCallback(),document.documentElement.classList.remove("private-glide-core-modal-lock-scroll"),document.adoptedStyleSheets=document.adoptedStyleSheets.filter((e=>e!==globalStylesheet)),document.removeEventListener("click",this.#p,{capture:!0})}firstUpdated(){this.open&&this.#y(),this.#i.value?.addEventListener("click",this.#m,{capture:!0}),this.#i.value?.addEventListener("mouseup",this.#h)}render(){return html`<dialog class="component" data-test="component" @keydown="${this.#f}" ${ref(this.#o)}><div class="${classMap({container:!0,small:"small"===this.size,medium:"medium"===this.size,large:"large"===this.size,xlarge:"xlarge"===this.size})}" ${ref(this.#i)}><header class="header"><h2 class="label" data-test="heading" id="heading">${when(this.severity,(()=>html`<span aria-label="${this.#r.term("informational"===this.severity?"severityInformational":"critical"===this.severity?"severityCritical":"severityMedium")} - " class="${classMap({severity:!0,critical:"critical"===this.severity,informational:"informational"===this.severity,medium:"medium"===this.severity})}" data-test="severity">${this.severity&&icons[this.severity]}</span>`))} ${when(this.backButton&&!this.severity,(()=>html`<glide-core-modal-icon-button class="back-button" data-test="back-button" label="${this.#r.term("close")}" @click="${this.#C}" ${ref(this.#e)}>${icons.back}</glide-core-modal-icon-button>`))} ${this.label}</h2><div class="header-actions" role="toolbar"><slot name="header-actions" ${assertSlot([GlideCoreModalIconButton],!0)} ${ref(this.#l)}></slot><glide-core-modal-icon-button class="close-button" data-test="close-button" label="${this.#r.term("close")}" @click="${this.#C}" ${ref(this.#t)}>${xIcon}</glide-core-modal-icon-button></div></header><article aria-labelledby="heading" class="body" role="region"><slot ${assertSlot()}></slot></article><footer><menu aria-hidden="${!this.hasTertiarySlotContent&&!this.hasSecondarySlotContent&&!this.hasPrimarySlotContent}" class="actions"><li aria-hidden="${!this.hasTertiarySlotContent}" class="action"><slot class="tertiary-slot" name="tertiary" @slotchange="${this.#v}" ${assertSlot([GlideCoreButton,GlideCoreTooltip],!0)} ${ref(this.#d)}></slot></li><li aria-hidden="${!this.hasSecondarySlotContent}" class="action"><slot name="secondary" @slotchange="${this.#S}" ${assertSlot([GlideCoreButton],!0)} ${ref(this.#c)}></slot></li><li aria-hidden="${!this.hasPrimarySlotContent}" class="action"><slot name="primary" @slotchange="${this.#b}" ${assertSlot([GlideCoreButton],!0)} ${ref(this.#a)}></slot></li></menu></footer></div></dialog>`}#e;#t;#o;#i;#l;#n;#s;#r;#a;#c;#d;#m;#h;#p;#u(){document.documentElement.classList.remove("private-glide-core-modal-lock-scroll"),this.#o.value?.close()}#C(){this.open=!1}#f(e){"Escape"===e.key&&(this.open=!1,e.preventDefault())}#b(){this.hasPrimarySlotContent=Boolean(this.#a.value?.assignedElements().length)}#S(){this.hasSecondarySlotContent=Boolean(this.#c.value?.assignedElements().length)}#v(){this.hasTertiarySlotContent=Boolean(this.#d.value?.assignedElements().length)}#y(){document.documentElement.classList.add("private-glide-core-modal-lock-scroll"),this.#o.value?.showModal()}};__decorate([property({reflect:!0}),required],GlideCoreModal.prototype,"label",void 0),__decorate([property({attribute:"back-button",type:Boolean,reflect:!0})],GlideCoreModal.prototype,"backButton",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreModal.prototype,"open",null),__decorate([property({reflect:!0})],GlideCoreModal.prototype,"severity",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreModal.prototype,"size",void 0),__decorate([property({reflect:!0})],GlideCoreModal.prototype,"version",void 0),__decorate([state()],GlideCoreModal.prototype,"hasPrimarySlotContent",void 0),__decorate([state()],GlideCoreModal.prototype,"hasSecondarySlotContent",void 0),__decorate([state()],GlideCoreModal.prototype,"hasTertiarySlotContent",void 0),GlideCoreModal=__decorate([customElement("glide-core-modal"),final],GlideCoreModal);export default GlideCoreModal;const icons={back:html`<svg style="${styleMap({height:"1.25rem",width:"1.25rem"})}" viewBox="0 0 24 24" fill="none"><path d="M12 18C11.4477 18 11 18.4477 11 19C11 19.5523 11.4477 20 12 20V18ZM20 14.5C20 16.433 18.433 18 16.5 18V20C19.5376 20 22 17.5376 22 14.5H20ZM16.5 11C18.433 11 20 12.567 20 14.5H22C22 11.4624 19.5376 9 16.5 9V11ZM16.5 18H12V20H16.5V18ZM16.5 9H3V11H16.5V9Z" fill="currentColor"/><path d="M7 6L3 10L7 14" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>`,critical:severityCriticalIcon,informational:severityInformationalIcon,medium:severityMediumIcon};
@@ -129,15 +129,15 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export
129
129
  display: flex;
130
130
 
131
131
  &.informational {
132
- color: var(--glide-core-color-info-icon-default);
132
+ color: var(--glide-core-color-advisory-icon-info);
133
133
  }
134
134
 
135
135
  &.medium {
136
- color: var(--glide-core-color-attention-icon-default);
136
+ color: var(--glide-core-color-advisory-icon-attention);
137
137
  }
138
138
 
139
139
  &.critical {
140
- color: var(--glide-core-color-error-icon-default);
140
+ color: var(--glide-core-color-advisory-icon-error);
141
141
  }
142
142
  }
143
143
 
@@ -54,13 +54,13 @@ export default class GlideCoreRadioGroup extends LitElement implements FormContr
54
54
  static formAssociated: boolean;
55
55
  static shadowRootOptions: ShadowRootInit;
56
56
  static styles: import("lit").CSSResult[];
57
+ label?: string;
57
58
  /**
58
59
  * @default false
59
60
  */
60
61
  get disabled(): boolean;
61
62
  set disabled(isDisabled: boolean);
62
63
  hideLabel: boolean;
63
- label?: string;
64
64
  name: string;
65
65
  orientation: "horizontal";
66
66
  privateSplit?: 'left' | 'middle' | 'right';
@@ -53,4 +53,4 @@ var __decorate=this&&this.__decorate||function(e,t,i,a){var s,o=arguments.length
53
53
  </div>
54
54
  </glide-core-private-label>
55
55
  </div>
56
- `}reportValidity(){this.isReportValidityOrSubmit=!0;const e=this.#r.reportValidity();return this.requestUpdate(),e}resetValidityFeedback(){this.isReportValidityOrSubmit=!1}setCustomValidity(e){this.validityMessage=e,""===e?this.#r.setValidity({customError:!1},"",this.#l.value):this.#r.setValidity({customError:!0,valueMissing:this.#r.validity.valueMissing}," ",this.#l.value)}setValidity(e,t){this.validityMessage=t,this.#r.setValidity(e," ",this.#l.value)}constructor(){super(),this.hideLabel=!1,this.name="",this.orientation="horizontal",this.version=packageJson.version,this.isBlurring=!1,this.isCheckingValidity=!1,this.isReportValidityOrSubmit=!1,this.#l=createRef(),this.#g=createRef(),this.#e=!1,this.#i=!1,this.#s=!1,this.#o=!1,this.#a="",this.#d=({formData:e})=>{this.name&&this.value.length>0&&!this.disabled&&e.append(this.name,this.value)},this.#r=this.attachInternals(),this.addEventListener("invalid",(e=>{if(e.preventDefault(),!this.isCheckingValidity){if(e?.preventDefault(),this.isCheckingValidity||this.isBlurring)return;this.isReportValidityOrSubmit=!0;this.form?.querySelector(":invalid")===this&&this.focus()}}))}#l;#g;#r;#e;#i;#s;#o;#a;#d;get#c(){const e=!this.disabled&&!this.validity.valid&&this.isReportValidityOrSubmit;for(const t of this.#t)t.privateInvalid=e;return e}#v(e){this.#t.find((({tabIndex:e})=>0===e))?.setAttribute("tabindex","-1"),this.#a=e.value,e.checked=!0,e.tabIndex=0,e.focus()}#n(e){if(!this.disabled)if(e.target instanceof GlideCoreRadioGroupRadio&&e.target.disabled){const e=this.#t.find((({checked:e})=>e));e?.focus()}else if(e.target instanceof GlideCoreRadioGroupRadio&&!e.target.disabled){const t=this.#t.filter((t=>t!==e.target));for(const e of t)e.checked=!1,e.tabIndex=-1;this.#v(e.target)}}#h(e){if(!(this.disabled||e.target instanceof GlideCoreRadioGroupRadio&&e.target?.disabled)&&e.target instanceof GlideCoreRadioGroupRadio)switch(e.key){case"Enter":this.form?.requestSubmit();break;case"ArrowUp":case"ArrowLeft":{e.preventDefault();const t=this.#t.slice(0,this.#t.indexOf(e.target)).findLast((e=>!e.disabled)),i=this.#t.findLast((e=>!e.disabled));t&&t!==e.target?(this.#R(e.target),this.#v(t)):i&&i!==e.target&&(this.#R(e.target),this.#v(i));break}case"ArrowDown":case"ArrowRight":{e.preventDefault();const t=this.#t.find(((t,i)=>!t.disabled&&e.target instanceof GlideCoreRadioGroupRadio&&i>this.#t.indexOf(e.target))),i=this.#t.find((e=>!e.disabled));t&&t!==e.target?(this.#R(e.target),this.#v(t)):i&&i!==e.target&&(this.#R(e.target),this.#v(i));break}case" ":if(e.preventDefault(),!e.target.disabled&&!e.target.checked){this.#v(e.target);for(const t of this.#t)t!==e.target&&this.#R(t)}}}#b(){const e=this.#t.findLast((({checked:e,disabled:t})=>e&&!t));e&&(this.#a=e.value)}#u(e){(null===e.relatedTarget||e.relatedTarget instanceof Node&&!this.contains(e.relatedTarget))&&(this.isBlurring=!0,this.reportValidity(),this.isBlurring=!1)}get#t(){return this.#g.value?this.#g.value.assignedElements().filter((e=>e instanceof GlideCoreRadioGroupRadio)):[]}#p(e){if(e.target instanceof GlideCoreRadioGroupRadio&&e.target.checked&&!e.detail.old&&e.detail.new){const t=this.#t.find((({tabIndex:e})=>0===e));t&&t!==e.target&&this.#R(t),this.#a=e.target.value,e.target.tabIndex=e.target.disabled?-1:0}}#f(e){if(!this.#i){if(e.target instanceof GlideCoreRadioGroupRadio&&e.target.disabled){const t=this.#t.findLast((e=>e.checked&&!e.disabled));e.target.checked&&!t?this.#a="":t&&(this.#a=t.value);const i=this.#t.find(((t,i)=>!t.disabled&&e.target instanceof GlideCoreRadioGroupRadio&&i>this.#t.indexOf(e.target)));if(i&&0===e.target.tabIndex)return i.tabIndex=0,void(e.target.tabIndex=-1);const a=this.#t.find((e=>!e.disabled));if(a&&0===e.target.tabIndex)return a.tabIndex=0,void(e.target.tabIndex=-1)}if(e.target instanceof GlideCoreRadioGroupRadio&&!this.disabled){this.#t.some((({tabIndex:e})=>0===e))||(e.target.tabIndex=0);const t=this.#t.findLast((e=>e.checked&&!e.disabled));e.target===t&&(this.#a=e.target.value)}else;}}#m(e){const t=this.#t.findLast((e=>e.checked&&!this.disabled));e.target instanceof GlideCoreRadioGroupRadio&&e.target.checked&&e.detail.new&&e.target===t?this.#a=e.target.value:e.target instanceof GlideCoreRadioGroupRadio&&e.target.checked&&e.target===t&&(this.#a="")}#R(e){e.checked=!1,e.tabIndex=-1}};__decorate([property({reflect:!0,type:Boolean})],GlideCoreRadioGroup.prototype,"disabled",null),__decorate([property({attribute:"hide-label",type:Boolean})],GlideCoreRadioGroup.prototype,"hideLabel",void 0),__decorate([property({reflect:!0}),required],GlideCoreRadioGroup.prototype,"label",void 0),__decorate([property({reflect:!0})],GlideCoreRadioGroup.prototype,"name",void 0),__decorate([property({reflect:!0})],GlideCoreRadioGroup.prototype,"orientation",void 0),__decorate([property()],GlideCoreRadioGroup.prototype,"privateSplit",void 0),__decorate([property({reflect:!0})],GlideCoreRadioGroup.prototype,"tooltip",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreRadioGroup.prototype,"required",null),__decorate([property()],GlideCoreRadioGroup.prototype,"value",null),__decorate([property({reflect:!0})],GlideCoreRadioGroup.prototype,"version",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"isBlurring",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"isCheckingValidity",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"isReportValidityOrSubmit",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"validityMessage",void 0),GlideCoreRadioGroup=__decorate([customElement("glide-core-radio-group"),final],GlideCoreRadioGroup);export default GlideCoreRadioGroup;
56
+ `}reportValidity(){this.isReportValidityOrSubmit=!0;const e=this.#r.reportValidity();return this.requestUpdate(),e}resetValidityFeedback(){this.isReportValidityOrSubmit=!1}setCustomValidity(e){this.validityMessage=e,""===e?this.#r.setValidity({customError:!1},"",this.#l.value):this.#r.setValidity({customError:!0,valueMissing:this.#r.validity.valueMissing}," ",this.#l.value)}setValidity(e,t){this.validityMessage=t,this.#r.setValidity(e," ",this.#l.value)}constructor(){super(),this.hideLabel=!1,this.name="",this.orientation="horizontal",this.version=packageJson.version,this.isBlurring=!1,this.isCheckingValidity=!1,this.isReportValidityOrSubmit=!1,this.#l=createRef(),this.#g=createRef(),this.#e=!1,this.#i=!1,this.#s=!1,this.#o=!1,this.#a="",this.#d=({formData:e})=>{this.name&&this.value.length>0&&!this.disabled&&e.append(this.name,this.value)},this.#r=this.attachInternals(),this.addEventListener("invalid",(e=>{if(e.preventDefault(),!this.isCheckingValidity){if(e?.preventDefault(),this.isCheckingValidity||this.isBlurring)return;this.isReportValidityOrSubmit=!0;this.form?.querySelector(":invalid")===this&&this.focus()}}))}#l;#g;#r;#e;#i;#s;#o;#a;#d;get#c(){const e=!this.disabled&&!this.validity.valid&&this.isReportValidityOrSubmit;for(const t of this.#t)t.privateInvalid=e;return e}#v(e){this.#t.find((({tabIndex:e})=>0===e))?.setAttribute("tabindex","-1"),this.#a=e.value,e.checked=!0,e.tabIndex=0,e.focus()}#n(e){if(!this.disabled)if(e.target instanceof GlideCoreRadioGroupRadio&&e.target.disabled){const e=this.#t.find((({checked:e})=>e));e?.focus()}else if(e.target instanceof GlideCoreRadioGroupRadio&&!e.target.disabled){const t=this.#t.filter((t=>t!==e.target));for(const e of t)e.checked=!1,e.tabIndex=-1;this.#v(e.target)}}#h(e){if(!(this.disabled||e.target instanceof GlideCoreRadioGroupRadio&&e.target?.disabled)&&e.target instanceof GlideCoreRadioGroupRadio)switch(e.key){case"Enter":this.form?.requestSubmit();break;case"ArrowUp":case"ArrowLeft":{e.preventDefault();const t=this.#t.slice(0,this.#t.indexOf(e.target)).findLast((e=>!e.disabled)),i=this.#t.findLast((e=>!e.disabled));t&&t!==e.target?(this.#R(e.target),this.#v(t)):i&&i!==e.target&&(this.#R(e.target),this.#v(i));break}case"ArrowDown":case"ArrowRight":{e.preventDefault();const t=this.#t.find(((t,i)=>!t.disabled&&e.target instanceof GlideCoreRadioGroupRadio&&i>this.#t.indexOf(e.target))),i=this.#t.find((e=>!e.disabled));t&&t!==e.target?(this.#R(e.target),this.#v(t)):i&&i!==e.target&&(this.#R(e.target),this.#v(i));break}case" ":if(e.preventDefault(),!e.target.disabled&&!e.target.checked){this.#v(e.target);for(const t of this.#t)t!==e.target&&this.#R(t)}}}#b(){const e=this.#t.findLast((({checked:e,disabled:t})=>e&&!t));e&&(this.#a=e.value)}#u(e){(null===e.relatedTarget||e.relatedTarget instanceof Node&&!this.contains(e.relatedTarget))&&(this.isBlurring=!0,this.reportValidity(),this.isBlurring=!1)}get#t(){return this.#g.value?this.#g.value.assignedElements().filter((e=>e instanceof GlideCoreRadioGroupRadio)):[]}#p(e){if(e.target instanceof GlideCoreRadioGroupRadio&&e.target.checked&&!e.detail.old&&e.detail.new){const t=this.#t.find((({tabIndex:e})=>0===e));t&&t!==e.target&&this.#R(t),this.#a=e.target.value,e.target.tabIndex=e.target.disabled?-1:0}}#f(e){if(!this.#i){if(e.target instanceof GlideCoreRadioGroupRadio&&e.target.disabled){const t=this.#t.findLast((e=>e.checked&&!e.disabled));e.target.checked&&!t?this.#a="":t&&(this.#a=t.value);const i=this.#t.find(((t,i)=>!t.disabled&&e.target instanceof GlideCoreRadioGroupRadio&&i>this.#t.indexOf(e.target)));if(i&&0===e.target.tabIndex)return i.tabIndex=0,void(e.target.tabIndex=-1);const a=this.#t.find((e=>!e.disabled));if(a&&0===e.target.tabIndex)return a.tabIndex=0,void(e.target.tabIndex=-1)}if(e.target instanceof GlideCoreRadioGroupRadio&&!this.disabled){this.#t.some((({tabIndex:e})=>0===e))||(e.target.tabIndex=0);const t=this.#t.findLast((e=>e.checked&&!e.disabled));e.target===t&&(this.#a=e.target.value)}else;}}#m(e){const t=this.#t.findLast((e=>e.checked&&!this.disabled));e.target instanceof GlideCoreRadioGroupRadio&&e.target.checked&&e.detail.new&&e.target===t?this.#a=e.target.value:e.target instanceof GlideCoreRadioGroupRadio&&e.target.checked&&e.target===t&&(this.#a="")}#R(e){e.checked=!1,e.tabIndex=-1}};__decorate([property({reflect:!0}),required],GlideCoreRadioGroup.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreRadioGroup.prototype,"disabled",null),__decorate([property({attribute:"hide-label",type:Boolean})],GlideCoreRadioGroup.prototype,"hideLabel",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreRadioGroup.prototype,"name",void 0),__decorate([property({reflect:!0})],GlideCoreRadioGroup.prototype,"orientation",void 0),__decorate([property()],GlideCoreRadioGroup.prototype,"privateSplit",void 0),__decorate([property({reflect:!0})],GlideCoreRadioGroup.prototype,"tooltip",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreRadioGroup.prototype,"required",null),__decorate([property()],GlideCoreRadioGroup.prototype,"value",null),__decorate([property({reflect:!0})],GlideCoreRadioGroup.prototype,"version",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"isBlurring",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"isCheckingValidity",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"isReportValidityOrSubmit",void 0),__decorate([state()],GlideCoreRadioGroup.prototype,"validityMessage",void 0),GlideCoreRadioGroup=__decorate([customElement("glide-core-radio-group"),final],GlideCoreRadioGroup);export default GlideCoreRadioGroup;
@@ -8,7 +8,7 @@ declare global {
8
8
  * @attr {string} label
9
9
  * @attr {boolean} [checked=false]
10
10
  * @attr {boolean} [disabled=false]
11
- * @attr {string} [value]
11
+ * @attr {string} [value='']
12
12
  *
13
13
  * @readonly
14
14
  * @attr {string} [version]
@@ -20,6 +20,11 @@ export default class GlideCoreRadioGroupRadio extends LitElement {
20
20
  #private;
21
21
  static shadowRootOptions: ShadowRootInit;
22
22
  static styles: import("lit").CSSResult[];
23
+ /**
24
+ * @default undefined
25
+ */
26
+ get label(): string | undefined;
27
+ set label(label: string);
23
28
  /**
24
29
  * @default false
25
30
  */
@@ -32,15 +37,10 @@ export default class GlideCoreRadioGroupRadio extends LitElement {
32
37
  set disabled(isDisabled: boolean);
33
38
  get privateInvalid(): boolean;
34
39
  set privateInvalid(invalid: boolean);
35
- /**
36
- * @default undefined
37
- */
38
- get label(): string | undefined;
39
- set label(label: string);
40
40
  get privateRequired(): boolean;
41
41
  set privateRequired(required: boolean);
42
42
  /**
43
- * @default undefined
43
+ * @default ''
44
44
  */
45
45
  get value(): string;
46
46
  set value(value: string);
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,i,a){var r,o=arguments.length,d=o<3?t:null===a?a=Object.getOwnPropertyDescriptor(t,i):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)d=Reflect.decorate(e,t,i,a);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(d=(o<3?r(d):o>3?r(t,i,d):r(t,i))||d);return o>3&&d&&Object.defineProperty(t,i,d),d};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{customElement,property,state}from"lit/decorators.js";import packageJson from"../package.json"with{type:"json"};import styles from"./radio-group.radio.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreRadioGroupRadio=class GlideCoreRadioGroupRadio extends LitElement{constructor(){super(...arguments),this.version=packageJson.version,this.#e=!1,this.#t=!1,this.#i=!1,this.#a=!1,this.#r=""}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get checked(){return this.#e}set checked(e){const t=this.#e;this.#e=e,this.ariaChecked=e&&!this.disabled?"true":"false",e&&t!==e&&(this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))),this.dispatchEvent(new CustomEvent("private-checked-change",{bubbles:!0,detail:{old:t,new:e}}))}get disabled(){return this.#t}set disabled(e){this.#t=e,this.ariaDisabled=e.toString(),this.ariaChecked=this.checked&&!e?"true":"false",this.dispatchEvent(new CustomEvent("private-disabled-change",{bubbles:!0}))}get privateInvalid(){return this.#i}set privateInvalid(e){this.#i=e,this.ariaInvalid=e.toString()}get label(){return this.#o}set label(e){this.#o=e,this.ariaLabel=e.toString()}get privateRequired(){return this.#a}set privateRequired(e){this.#a=e,this.ariaRequired=e.toString()}get value(){return this.#r}set value(e){const t=this.#r;this.#r=e,this.dispatchEvent(new CustomEvent("private-value-change",{bubbles:!0,detail:{old:t,new:e}}))}firstUpdated(){this.ariaChecked=this.checked&&!this.disabled&&this===this.lastCheckedRadio?"true":"false",this.ariaDisabled=this.disabled.toString(),this.ariaInvalid=this.privateInvalid.toString(),this.ariaRequired=this.privateRequired.toString(),this.role="radio",this.label&&(this.ariaLabel=this.label)}get lastCheckedRadio(){const e=this.parentElement?.querySelectorAll("glide-core-radio-group-radio");if(e&&e.length>0)return[...e].findLast((e=>e.checked))}render(){return html`<div class="component" data-test="component"><div class="${classMap({circle:!0,checked:this.checked&&this===this.lastCheckedRadio&&!this.disabled,disabled:this.disabled,animate:this.hasUpdated})}" data-test="radio"></div>${this.#o}</div>`}#e;#t;#o;#i;#a;#r};__decorate([property({type:Boolean,reflect:!0})],GlideCoreRadioGroupRadio.prototype,"checked",null),__decorate([property({type:Boolean,reflect:!0})],GlideCoreRadioGroupRadio.prototype,"disabled",null),__decorate([property({type:Boolean})],GlideCoreRadioGroupRadio.prototype,"privateInvalid",null),__decorate([property({reflect:!0}),required],GlideCoreRadioGroupRadio.prototype,"label",null),__decorate([property({type:Boolean,reflect:!0})],GlideCoreRadioGroupRadio.prototype,"privateRequired",null),__decorate([property()],GlideCoreRadioGroupRadio.prototype,"value",null),__decorate([property({reflect:!0})],GlideCoreRadioGroupRadio.prototype,"version",void 0),__decorate([state()],GlideCoreRadioGroupRadio.prototype,"lastCheckedRadio",null),GlideCoreRadioGroupRadio=__decorate([customElement("glide-core-radio-group-radio"),final],GlideCoreRadioGroupRadio);export default GlideCoreRadioGroupRadio;
1
+ var __decorate=this&&this.__decorate||function(e,t,i,a){var r,o=arguments.length,d=o<3?t:null===a?a=Object.getOwnPropertyDescriptor(t,i):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)d=Reflect.decorate(e,t,i,a);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(d=(o<3?r(d):o>3?r(t,i,d):r(t,i))||d);return o>3&&d&&Object.defineProperty(t,i,d),d};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.js";import{customElement,property,state}from"lit/decorators.js";import packageJson from"../package.json"with{type:"json"};import styles from"./radio-group.radio.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreRadioGroupRadio=class GlideCoreRadioGroupRadio extends LitElement{constructor(){super(...arguments),this.version=packageJson.version,this.#e=!1,this.#t=!1,this.#i=!1,this.#a=!1,this.#r=""}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get label(){return this.#o}set label(e){this.#o=e,this.ariaLabel=e.toString()}get checked(){return this.#e}set checked(e){const t=this.#e;this.#e=e,this.ariaChecked=e&&!this.disabled?"true":"false",e&&t!==e&&(this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))),this.dispatchEvent(new CustomEvent("private-checked-change",{bubbles:!0,detail:{old:t,new:e}}))}get disabled(){return this.#t}set disabled(e){this.#t=e,this.ariaDisabled=e.toString(),this.ariaChecked=this.checked&&!e?"true":"false",this.dispatchEvent(new CustomEvent("private-disabled-change",{bubbles:!0}))}get privateInvalid(){return this.#i}set privateInvalid(e){this.#i=e,this.ariaInvalid=e.toString()}get privateRequired(){return this.#a}set privateRequired(e){this.#a=e,this.ariaRequired=e.toString()}get value(){return this.#r}set value(e){const t=this.#r;this.#r=e,this.dispatchEvent(new CustomEvent("private-value-change",{bubbles:!0,detail:{old:t,new:e}}))}firstUpdated(){this.ariaChecked=this.checked&&!this.disabled&&this===this.lastCheckedRadio?"true":"false",this.ariaDisabled=this.disabled.toString(),this.ariaInvalid=this.privateInvalid.toString(),this.ariaRequired=this.privateRequired.toString(),this.role="radio",this.label&&(this.ariaLabel=this.label)}get lastCheckedRadio(){const e=this.parentElement?.querySelectorAll("glide-core-radio-group-radio");if(e&&e.length>0)return[...e].findLast((e=>e.checked))}render(){return html`<div class="component" data-test="component"><div class="${classMap({circle:!0,checked:this.checked&&this===this.lastCheckedRadio&&!this.disabled,disabled:this.disabled,animate:this.hasUpdated})}" data-test="radio"></div>${this.#o}</div>`}#e;#t;#o;#i;#a;#r};__decorate([property({reflect:!0}),required],GlideCoreRadioGroupRadio.prototype,"label",null),__decorate([property({type:Boolean,reflect:!0})],GlideCoreRadioGroupRadio.prototype,"checked",null),__decorate([property({type:Boolean,reflect:!0})],GlideCoreRadioGroupRadio.prototype,"disabled",null),__decorate([property({type:Boolean})],GlideCoreRadioGroupRadio.prototype,"privateInvalid",null),__decorate([property({type:Boolean,reflect:!0})],GlideCoreRadioGroupRadio.prototype,"privateRequired",null),__decorate([property()],GlideCoreRadioGroupRadio.prototype,"value",null),__decorate([property({reflect:!0})],GlideCoreRadioGroupRadio.prototype,"version",void 0),__decorate([state()],GlideCoreRadioGroupRadio.prototype,"lastCheckedRadio",null),GlideCoreRadioGroupRadio=__decorate([customElement("glide-core-radio-group-radio"),final],GlideCoreRadioGroupRadio);export default GlideCoreRadioGroupRadio;
@@ -12,9 +12,9 @@ import{css}from"lit";export default[css`
12
12
  gap: 0.375rem;
13
13
 
14
14
  &.invalid {
15
- border: 1px solid var(--glide-core-color-error-stroke-primary);
15
+ border: 1px solid var(--glide-core-color-advisory-stroke-error-primary);
16
16
  border-radius: var(--glide-core-rounding-base-radius-sm);
17
- color: var(--glide-core-color-error-stroke-primary);
17
+ color: var(--glide-core-color-advisory-stroke-error-primary);
18
18
  margin-block-end: -0.0625rem;
19
19
  margin-inline-start: -0.0625rem;
20
20
  padding: var(--glide-core-spacing-base-xxs) 0.375rem;
package/dist/spinner.js CHANGED
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,r,t,o){var i,s=arguments.length,l=s<3?r:null===o?o=Object.getOwnPropertyDescriptor(r,t):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,r,t,o);else for(var n=e.length-1;n>=0;n--)(i=e[n])&&(l=(s<3?i(l):s>3?i(r,t,l):i(r,t))||l);return s>3&&l&&Object.defineProperty(r,t,l),l};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.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"./spinner.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreSpinner=class GlideCoreSpinner extends LitElement{constructor(){super(...arguments),this.size="medium",this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}render(){return html`<div aria-label="${ifDefined(this.label)}" class="${classMap({component:!0,[this.size]:!0})}" role="progressbar"></div>`}};__decorate([property({reflect:!0}),required],GlideCoreSpinner.prototype,"label",void 0),__decorate([property({reflect:!0})],GlideCoreSpinner.prototype,"size",void 0),__decorate([property({reflect:!0})],GlideCoreSpinner.prototype,"version",void 0),GlideCoreSpinner=__decorate([customElement("glide-core-spinner"),final],GlideCoreSpinner);export default GlideCoreSpinner;
1
+ var __decorate=this&&this.__decorate||function(e,r,t,o){var i,s=arguments.length,l=s<3?r:null===o?o=Object.getOwnPropertyDescriptor(r,t):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,r,t,o);else for(var n=e.length-1;n>=0;n--)(i=e[n])&&(l=(s<3?i(l):s>3?i(r,t,l):i(r,t))||l);return s>3&&l&&Object.defineProperty(r,t,l),l};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.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"./spinner.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreSpinner=class GlideCoreSpinner extends LitElement{constructor(){super(...arguments),this.size="medium",this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}render(){return html`<div aria-label="${ifDefined(this.label)}" class="${classMap({component:!0,[this.size]:!0})}" role="progressbar"></div>`}};__decorate([property({reflect:!0}),required],GlideCoreSpinner.prototype,"label",void 0),__decorate([property({reflect:!0,useDefault:!0})],GlideCoreSpinner.prototype,"size",void 0),__decorate([property({reflect:!0})],GlideCoreSpinner.prototype,"version",void 0),GlideCoreSpinner=__decorate([customElement("glide-core-spinner"),final],GlideCoreSpinner);export default GlideCoreSpinner;
@@ -7,6 +7,7 @@ import{css}from"lit";export default[css`
7
7
  }
8
8
 
9
9
  .component {
10
+ animation: spin 1s infinite linear;
10
11
  background:
11
12
  radial-gradient(
12
13
  farthest-side,
@@ -30,10 +31,6 @@ import{css}from"lit";export default[css`
30
31
  #000 0
31
32
  );
32
33
 
33
- @media (prefers-reduced-motion: no-preference) {
34
- animation: spin 1s infinite linear;
35
- }
36
-
37
34
  &.large {
38
35
  --private-spinner-size: 3rem;
39
36
  --private-gradient-size: 0.5rem;
@@ -19,11 +19,11 @@ declare global {
19
19
  export default class GlideCoreSplitButtonPrimaryButton extends LitElement {
20
20
  static shadowRootOptions: ShadowRootInit;
21
21
  static styles: import("lit").CSSResult[];
22
+ label?: string;
22
23
  ariaControls: string | null;
23
24
  ariaExpanded: 'true' | 'false' | null;
24
25
  ariaHasPopup: 'true' | 'false' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog' | null;
25
26
  disabled: boolean;
26
- label?: string;
27
27
  privateSize: 'large' | 'small';
28
28
  privateVariant: 'primary' | 'secondary';
29
29
  readonly version: string;
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(t,e,o,r){var i,a=arguments.length,p=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)p=Reflect.decorate(t,e,o,r);else for(var l=t.length-1;l>=0;l--)(i=t[l])&&(p=(a<3?i(p):a>3?i(e,o,p):i(e,o))||p);return a>3&&p&&Object.defineProperty(e,o,p),p};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.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"./split-button.primary-button.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreSplitButtonPrimaryButton=class GlideCoreSplitButtonPrimaryButton extends LitElement{constructor(){super(...arguments),this.ariaControls=null,this.ariaExpanded=null,this.ariaHasPopup=null,this.disabled=!1,this.privateSize="large",this.privateVariant="primary",this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}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)}" class="${classMap({component:!0,disabled:this.disabled,[this.privateVariant]:!0,[this.privateSize]:!0})}" data-test="component" type="button" ?disabled="${this.disabled}"><slot name="icon"></slot>${this.label}</button>`}};__decorate([property({attribute:"aria-controls",reflect:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"ariaControls",void 0),__decorate([property({attribute:"aria-expanded",reflect:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"ariaExpanded",void 0),__decorate([property({attribute:"aria-haspopup",reflect:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"ariaHasPopup",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreSplitButtonPrimaryButton.prototype,"disabled",void 0),__decorate([property({reflect:!0}),required],GlideCoreSplitButtonPrimaryButton.prototype,"label",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryButton.prototype,"privateSize",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryButton.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"version",void 0),GlideCoreSplitButtonPrimaryButton=__decorate([customElement("glide-core-split-button-primary-button"),final],GlideCoreSplitButtonPrimaryButton);export default GlideCoreSplitButtonPrimaryButton;
1
+ var __decorate=this&&this.__decorate||function(t,e,o,r){var i,a=arguments.length,p=a<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)p=Reflect.decorate(t,e,o,r);else for(var l=t.length-1;l>=0;l--)(i=t[l])&&(p=(a<3?i(p):a>3?i(e,o,p):i(e,o))||p);return a>3&&p&&Object.defineProperty(e,o,p),p};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.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"./split-button.primary-button.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreSplitButtonPrimaryButton=class GlideCoreSplitButtonPrimaryButton extends LitElement{constructor(){super(...arguments),this.ariaControls=null,this.ariaExpanded=null,this.ariaHasPopup=null,this.disabled=!1,this.privateSize="large",this.privateVariant="primary",this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}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)}" class="${classMap({component:!0,disabled:this.disabled,[this.privateVariant]:!0,[this.privateSize]:!0})}" data-test="component" type="button" ?disabled="${this.disabled}"><slot name="icon"></slot>${this.label}</button>`}};__decorate([property({reflect:!0}),required],GlideCoreSplitButtonPrimaryButton.prototype,"label",void 0),__decorate([property({attribute:"aria-controls",reflect:!0,useDefault:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"ariaControls",void 0),__decorate([property({attribute:"aria-expanded",reflect:!0,useDefault:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"ariaExpanded",void 0),__decorate([property({attribute:"aria-haspopup",reflect:!0,useDefault:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"ariaHasPopup",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreSplitButtonPrimaryButton.prototype,"disabled",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryButton.prototype,"privateSize",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryButton.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],GlideCoreSplitButtonPrimaryButton.prototype,"version",void 0),GlideCoreSplitButtonPrimaryButton=__decorate([customElement("glide-core-split-button-primary-button"),final],GlideCoreSplitButtonPrimaryButton);export default GlideCoreSplitButtonPrimaryButton;
@@ -6,8 +6,8 @@ declare global {
6
6
  }
7
7
  /**
8
8
  * @attr {string} label
9
- * @attr {string} url
10
9
  * @attr {boolean} [disabled=false]
10
+ * @attr {string} [href]
11
11
  *
12
12
  * @readonly
13
13
  * @attr {string} [version]
@@ -17,9 +17,9 @@ declare global {
17
17
  export default class GlideCoreSplitButtonPrimaryLink extends LitElement {
18
18
  static shadowRootOptions: ShadowRootInit;
19
19
  static styles: import("lit").CSSResult[];
20
- disabled: boolean;
21
20
  label?: string;
22
- url?: string;
21
+ disabled: boolean;
22
+ href?: string;
23
23
  privateSize: 'large' | 'small';
24
24
  privateVariant: 'primary' | 'secondary';
25
25
  readonly version: string;
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(t,e,r,i){var o,a=arguments.length,l=a<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(t,e,r,i);else for(var s=t.length-1;s>=0;s--)(o=t[s])&&(l=(a<3?o(l):a>3?o(e,r,l):o(e,r))||l);return a>3&&l&&Object.defineProperty(e,r,l),l};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.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"./split-button.primary-button.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreSplitButtonPrimaryLink=class GlideCoreSplitButtonPrimaryLink extends LitElement{constructor(){super(...arguments),this.disabled=!1,this.privateSize="large",this.privateVariant="primary",this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}render(){return this.disabled?html`<span aria-disabled="true" class="${classMap({component:!0,disabled:!0,[this.privateVariant]:!0,[this.privateSize]:!0})}" role="link"><slot name="icon"></slot>${this.label}</span>`:html`<a class="${classMap({component:!0,[this.privateVariant]:!0,[this.privateSize]:!0})}" data-test="component" href="${ifDefined(this.url)}"><slot name="icon"></slot>${this.label}</a>`}};__decorate([property({reflect:!0,type:Boolean})],GlideCoreSplitButtonPrimaryLink.prototype,"disabled",void 0),__decorate([property({reflect:!0}),required],GlideCoreSplitButtonPrimaryLink.prototype,"label",void 0),__decorate([property({reflect:!0}),required],GlideCoreSplitButtonPrimaryLink.prototype,"url",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryLink.prototype,"privateSize",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryLink.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],GlideCoreSplitButtonPrimaryLink.prototype,"version",void 0),GlideCoreSplitButtonPrimaryLink=__decorate([customElement("glide-core-split-button-primary-link"),final],GlideCoreSplitButtonPrimaryLink);export default GlideCoreSplitButtonPrimaryLink;
1
+ var __decorate=this&&this.__decorate||function(t,e,r,i){var o,a=arguments.length,l=a<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(t,e,r,i);else for(var s=t.length-1;s>=0;s--)(o=t[s])&&(l=(a<3?o(l):a>3?o(e,r,l):o(e,r))||l);return a>3&&l&&Object.defineProperty(e,r,l),l};import{html,LitElement}from"lit";import{classMap}from"lit/directives/class-map.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"./split-button.primary-button.styles.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";import required from"./library/required.js";let GlideCoreSplitButtonPrimaryLink=class GlideCoreSplitButtonPrimaryLink extends LitElement{constructor(){super(...arguments),this.disabled=!1,this.privateSize="large",this.privateVariant="primary",this.version=packageJson.version}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}render(){return this.disabled?html`<span aria-disabled="true" class="${classMap({component:!0,disabled:!0,[this.privateVariant]:!0,[this.privateSize]:!0})}" role="link"><slot name="icon"></slot>${this.label}</span>`:html`<a class="${classMap({component:!0,[this.privateVariant]:!0,[this.privateSize]:!0})}" data-test="component" href="${ifDefined(this.href)}"><slot name="icon"></slot>${this.label}</a>`}};__decorate([property({reflect:!0}),required],GlideCoreSplitButtonPrimaryLink.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreSplitButtonPrimaryLink.prototype,"disabled",void 0),__decorate([property({reflect:!0})],GlideCoreSplitButtonPrimaryLink.prototype,"href",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryLink.prototype,"privateSize",void 0),__decorate([property()],GlideCoreSplitButtonPrimaryLink.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],GlideCoreSplitButtonPrimaryLink.prototype,"version",void 0),GlideCoreSplitButtonPrimaryLink=__decorate([customElement("glide-core-split-button-primary-link"),final],GlideCoreSplitButtonPrimaryLink);export default GlideCoreSplitButtonPrimaryLink;
@@ -20,8 +20,8 @@ export default class GlideCoreSplitButtonSecondaryButton extends LitElement {
20
20
  #private;
21
21
  static shadowRootOptions: ShadowRootInit;
22
22
  static styles: import("lit").CSSResult[];
23
- disabled: boolean;
24
23
  label?: string;
24
+ disabled: boolean;
25
25
  menuOpen: boolean;
26
26
  menuPlacement: 'bottom-end' | 'top-end';
27
27
  privateActive: boolean;
@@ -1 +1 @@
1
- var __decorate=this&&this.__decorate||function(e,t,o,r){var i,n=arguments.length,l=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,o,r);else for(var s=e.length-1;s>=0;s--)(i=e[s])&&(l=(n<3?i(l):n>3?i(t,o,l):i(t,o))||l);return n>3&&l&&Object.defineProperty(t,o,l),l};import"./menu.options.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}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import packageJson from"../package.json"with{type:"json"};import GlideCoreMenu from"./menu.js";import GlideCoreMenuButton from"./menu.button.js";import GlideCoreMenuLink from"./menu.link.js";import chevronIcon from"./icons/chevron.js";import styles from"./split-button.secondary-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 GlideCoreSplitButtonSecondaryButton=class GlideCoreSplitButtonSecondaryButton extends LitElement{constructor(){super(...arguments),this.disabled=!1,this.menuOpen=!1,this.menuPlacement="bottom-end",this.privateActive=!1,this.privateSize="large",this.privateVariant="primary",this.version=packageJson.version,this.#e=createRef(),this.#t=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}click(){this.#e.value?.click()}firstUpdated(){const e=new MutationObserver((()=>{this.#t.value&&(this.menuOpen=this.#t.value.open)}));this.#t.value&&e.observe(this.#t.value,{attributes:!0,attributeFilter:["open"]})}render(){return html`<glide-core-menu placement="${this.menuPlacement}" size="${this.privateSize}" ?open="${this.menuOpen}" ${ref(this.#t)}><button aria-label="${ifDefined(this.label)}" class="${classMap({component:!0,active:this.menuOpen,disabled:this.disabled,[this.privateVariant]:!0,[this.privateSize]:!0})}" data-test="button" slot="target" type="button" ?disabled="${this.disabled}" ${ref(this.#e)}>${chevronIcon}</button><glide-core-menu-options><slot ${assertSlot([GlideCoreMenuButton,GlideCoreMenuLink])}></slot></glide-core-menu-options></glide-core-menu>`}#e;#t};__decorate([property({reflect:!0,type:Boolean})],GlideCoreSplitButtonSecondaryButton.prototype,"disabled",void 0),__decorate([property({reflect:!0}),required],GlideCoreSplitButtonSecondaryButton.prototype,"label",void 0),__decorate([property({attribute:"menu-open",reflect:!0,type:Boolean})],GlideCoreSplitButtonSecondaryButton.prototype,"menuOpen",void 0),__decorate([property({attribute:"menu-placement",reflect:!0})],GlideCoreSplitButtonSecondaryButton.prototype,"menuPlacement",void 0),__decorate([property({type:Boolean})],GlideCoreSplitButtonSecondaryButton.prototype,"privateActive",void 0),__decorate([property()],GlideCoreSplitButtonSecondaryButton.prototype,"privateSize",void 0),__decorate([property()],GlideCoreSplitButtonSecondaryButton.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],GlideCoreSplitButtonSecondaryButton.prototype,"version",void 0),GlideCoreSplitButtonSecondaryButton=__decorate([customElement("glide-core-split-button-secondary-button"),final],GlideCoreSplitButtonSecondaryButton);export default GlideCoreSplitButtonSecondaryButton;
1
+ var __decorate=this&&this.__decorate||function(e,t,o,r){var i,n=arguments.length,l=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,o,r);else for(var s=e.length-1;s>=0;s--)(i=e[s])&&(l=(n<3?i(l):n>3?i(t,o,l):i(t,o))||l);return n>3&&l&&Object.defineProperty(t,o,l),l};import"./menu.options.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}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import packageJson from"../package.json"with{type:"json"};import GlideCoreMenu from"./menu.js";import GlideCoreMenuButton from"./menu.button.js";import GlideCoreMenuLink from"./menu.link.js";import chevronIcon from"./icons/chevron.js";import styles from"./split-button.secondary-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 GlideCoreSplitButtonSecondaryButton=class GlideCoreSplitButtonSecondaryButton extends LitElement{constructor(){super(...arguments),this.disabled=!1,this.menuOpen=!1,this.menuPlacement="bottom-end",this.privateActive=!1,this.privateSize="large",this.privateVariant="primary",this.version=packageJson.version,this.#e=createRef(),this.#t=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}click(){this.#e.value?.click()}firstUpdated(){const e=new MutationObserver((()=>{this.#t.value&&(this.menuOpen=this.#t.value.open)}));this.#t.value&&e.observe(this.#t.value,{attributes:!0,attributeFilter:["open"]})}render(){return html`<glide-core-menu placement="${this.menuPlacement}" size="${this.privateSize}" ?open="${this.menuOpen}" ${ref(this.#t)}><button aria-label="${ifDefined(this.label)}" class="${classMap({component:!0,active:this.menuOpen,disabled:this.disabled,[this.privateVariant]:!0,[this.privateSize]:!0})}" data-test="button" slot="target" type="button" ?disabled="${this.disabled}" ${ref(this.#e)}>${chevronIcon}</button><glide-core-menu-options><slot ${assertSlot([GlideCoreMenuButton,GlideCoreMenuLink])}></slot></glide-core-menu-options></glide-core-menu>`}#e;#t};__decorate([property({reflect:!0}),required],GlideCoreSplitButtonSecondaryButton.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreSplitButtonSecondaryButton.prototype,"disabled",void 0),__decorate([property({attribute:"menu-open",reflect:!0,type:Boolean})],GlideCoreSplitButtonSecondaryButton.prototype,"menuOpen",void 0),__decorate([property({attribute:"menu-placement",reflect:!0,useDefault:!0})],GlideCoreSplitButtonSecondaryButton.prototype,"menuPlacement",void 0),__decorate([property({type:Boolean})],GlideCoreSplitButtonSecondaryButton.prototype,"privateActive",void 0),__decorate([property()],GlideCoreSplitButtonSecondaryButton.prototype,"privateSize",void 0),__decorate([property()],GlideCoreSplitButtonSecondaryButton.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],GlideCoreSplitButtonSecondaryButton.prototype,"version",void 0),GlideCoreSplitButtonSecondaryButton=__decorate([customElement("glide-core-split-button-secondary-button"),final],GlideCoreSplitButtonSecondaryButton);export default GlideCoreSplitButtonSecondaryButton;
@@ -0,0 +1,2 @@
1
+ declare const _default: (selector: string) => import("lit").CSSResult;
2
+ export default _default;
@@ -0,0 +1,45 @@
1
+ import{css,unsafeCSS}from"lit";export default e=>css`
2
+ @keyframes shimmer {
3
+ 0% {
4
+ background-position: 100% 50%;
5
+ }
6
+
7
+ 100% {
8
+ background-position: 0 50%;
9
+ }
10
+ }
11
+
12
+ /* stylelint-disable selector-type-case, selector-type-no-unknown */
13
+ ${unsafeCSS(e)} {
14
+ display: flex;
15
+ flex-direction: column;
16
+ padding: 0.375rem var(--glide-core-spacing-base-sm);
17
+ row-gap: var(--glide-core-spacing-base-xs);
18
+
19
+ & > * {
20
+ animation-duration: 1.4s;
21
+ animation-fill-mode: forwards;
22
+ animation-iteration-count: infinite;
23
+ animation-name: shimmer;
24
+ animation-timing-function: ease;
25
+ background-image: linear-gradient(
26
+ 90deg,
27
+ var(
28
+ --glide-core-private-color-skeleton-loader-surface-linear-gradient-sides
29
+ )
30
+ 25%,
31
+ var(
32
+ --glide-core-private-color-skeleton-loader-surface-linear-gradient-middle
33
+ )
34
+ 37%,
35
+ var(
36
+ --glide-core-private-color-skeleton-loader-surface-linear-gradient-sides
37
+ )
38
+ 63%
39
+ );
40
+ background-size: 400% 100%;
41
+ block-size: 1rem;
42
+ border-radius: var(--glide-core-rounding-base-radius-xs);
43
+ }
44
+ }
45
+ `;