@crowdstrike/glide-core 0.29.2 → 0.30.0

package/dist/slider.styles.js

@@ -1,6 +1,10 @@
-import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export default[css`
-    ${focusOutline(".handle:focus-visible")}
-  `,css`
+import { css } from 'lit';
+import focusOutline from './styles/focus-outline.js';
+export default [
+    css `
+    ${focusOutline('.handle:focus-visible')}
+  `,
+    css `
     /* The designs call for a bit more spacing than the default when vertical. */
     glide-core-private-label[orientation='vertical']::part(private-tooltips) {
       margin-block-end: var(--glide-core-spacing-base-xxs);
@@ -165,4 +169,5 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export
     .validity-message {
       display: block;
     }
-  `];
+  `,
+];

package/dist/spinner.js

@@ -1 +1,60 @@
-var __decorate=this&&this.__decorate||function(e,t,r,o){var i,s=arguments.length,n=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,r):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,r,o);else for(var p=e.length-1;p>=0;p--)(i=e[p])&&(n=(s<3?i(n):s>3?i(t,r,n):i(t,r))||n);return s>3&&n&&Object.defineProperty(t,r,n),n};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 Spinner=class Spinner 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],Spinner.prototype,"label",void 0),__decorate([property({reflect:!0,useDefault:!0})],Spinner.prototype,"size",void 0),__decorate([property({reflect:!0})],Spinner.prototype,"version",void 0),Spinner=__decorate([customElement("glide-core-spinner"),final],Spinner);export default Spinner;
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+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';
+/**
+ * @attr {string} label - For screenreaders
+ * @attr {'large'|'medium'|'small'} [size='medium']
+ *
+ * @readonly
+ * @attr {string} [version]
+ */
+let Spinner = class Spinner extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.size = 'medium';
+        this.version = packageJson.version;
+    }
+    static { this.shadowRootOptions = {
+        ...LitElement.shadowRootOptions,
+        delegatesFocus: true,
+        mode: shadowRootMode,
+    }; }
+    static { this.styles = styles; }
+    render() {
+        return html `<div
+      aria-label=${ifDefined(this.label)}
+      class=${classMap({
+            component: true,
+            [this.size]: true,
+        })}
+      role="progressbar"
+    ></div>`;
+    }
+};
+__decorate([
+    property({ reflect: true }),
+    required
+], Spinner.prototype, "label", void 0);
+__decorate([
+    property({ reflect: true, useDefault: true })
+], Spinner.prototype, "size", void 0);
+__decorate([
+    property({ reflect: true })
+], Spinner.prototype, "version", void 0);
+Spinner = __decorate([
+    customElement('glide-core-spinner'),
+    final
+], Spinner);
+export default Spinner;

package/dist/spinner.styles.js

@@ -1,4 +1,6 @@
-import{css}from"lit";export default[css`
+import { css } from 'lit';
+export default [
+    css `
     @keyframes spin {
       100% {
         align-items: center;
@@ -46,4 +48,5 @@ import{css}from"lit";export default[css`
         --private-gradient-size: 0.25rem;
       }
     }
-  `];
+  `,
+];

package/dist/split-button.js

@@ -1 +1,116 @@
-var __decorate=this&&this.__decorate||function(t,e,o,n){var r,i=arguments.length,a=i<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,o):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,o,n);else for(var s=t.length-1;s>=0;s--)(r=t[s])&&(a=(i<3?r(a):i>3?r(e,o,a):r(e,o))||a);return i>3&&a&&Object.defineProperty(e,o,a),a};import{html,LitElement}from"lit";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property}from"lit/decorators.js";import packageJson from"../package.json"with{type:"json"};import SplitButtonPrimaryButton from"./split-button.primary-button.js";import SplitButtonPrimaryLink from"./split-button.primary-link.js";import SplitButtonSecondaryButton from"./split-button.secondary-button.js";import styles from"./split-button.styles.js";import assertSlot from"./library/assert-slot.js";import shadowRootMode from"./library/shadow-root-mode.js";import final from"./library/final.js";let SplitButton=class SplitButton extends LitElement{constructor(){super(...arguments),this.version=packageJson.version,this.#t=createRef(),this.#e=createRef(),this.#o="primary"}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:shadowRootMode}}static{this.styles=styles}get variant(){return this.#o}set variant(t){this.#o=t,this.primaryButtonElement&&(this.primaryButtonElement.privateVariant=t),this.secondaryButtonElement&&(this.secondaryButtonElement.privateVariant=t)}get secondaryButtonElement(){const t=this.#e.value?.assignedElements().at(0);if(t instanceof SplitButtonSecondaryButton)return t}get primaryButtonElement(){const t=this.#t.value?.assignedElements().at(0);if(t instanceof SplitButtonPrimaryButton||t instanceof SplitButtonPrimaryLink)return t}render(){return html`<div class="component"><slot @slotchange="${this.#n}" ${assertSlot([SplitButtonPrimaryButton,SplitButtonPrimaryLink])} ${ref(this.#t)}></slot><slot name="secondary-button" @slotchange="${this.#r}" ${assertSlot([SplitButtonSecondaryButton])} ${ref(this.#e)}></slot></div>`}#t;#e;#o;#n(){this.primaryButtonElement&&(this.primaryButtonElement.privateVariant=this.variant)}#r(){this.secondaryButtonElement&&(this.secondaryButtonElement.privateVariant=this.variant)}};__decorate([property({reflect:!0})],SplitButton.prototype,"variant",null),__decorate([property({reflect:!0})],SplitButton.prototype,"version",void 0),SplitButton=__decorate([customElement("glide-core-split-button"),final],SplitButton);export default SplitButton;
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from 'lit';
+import { createRef, ref } from 'lit/directives/ref.js';
+import { customElement, property } from 'lit/decorators.js';
+import packageJson from '../package.json' with { type: 'json' };
+import SplitButtonPrimaryButton from './split-button.primary-button.js';
+import SplitButtonPrimaryLink from './split-button.primary-link.js';
+import SplitButtonSecondaryButton from './split-button.secondary-button.js';
+import styles from './split-button.styles.js';
+import assertSlot from './library/assert-slot.js';
+import shadowRootMode from './library/shadow-root-mode.js';
+import final from './library/final.js';
+/**
+ * @attr {'primary'|'secondary'} [variant='primary']
+ *
+ * @readonly
+ * @attr {string} [version]
+ *
+ * @slot {SplitButtonPrimaryButton | SplitButtonPrimaryLink}
+ * @slot {SplitButtonSecondaryButton} [secondary-button]
+ */
+let SplitButton = class SplitButton extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.version = packageJson.version;
+        this.#defaultSlotElementRef = createRef();
+        this.#secondaryButtonSlotElementRef = createRef();
+        this.#variant = 'primary';
+    }
+    static { this.shadowRootOptions = {
+        ...LitElement.shadowRootOptions,
+        mode: shadowRootMode,
+    }; }
+    static { this.styles = styles; }
+    /**
+     * @default 'primary'
+     */
+    get variant() {
+        return this.#variant;
+    }
+    set variant(variant) {
+        this.#variant = variant;
+        if (this.primaryButtonElement) {
+            this.primaryButtonElement.privateVariant = variant;
+        }
+        if (this.secondaryButtonElement) {
+            this.secondaryButtonElement.privateVariant = variant;
+        }
+    }
+    get secondaryButtonElement() {
+        const element = this.#secondaryButtonSlotElementRef.value
+            ?.assignedElements()
+            .at(0);
+        if (element instanceof SplitButtonSecondaryButton) {
+            return element;
+        }
+    }
+    get primaryButtonElement() {
+        const element = this.#defaultSlotElementRef.value?.assignedElements().at(0);
+        if (element instanceof SplitButtonPrimaryButton ||
+            element instanceof SplitButtonPrimaryLink) {
+            return element;
+        }
+    }
+    render() {
+        return html `
+      <div class="component">
+        <slot
+          @slotchange=${this.#onDefaultSlotChange}
+          ${assertSlot([SplitButtonPrimaryButton, SplitButtonPrimaryLink])}
+          ${ref(this.#defaultSlotElementRef)}
+        >
+          <!-- @type {SplitButtonPrimaryButton | SplitButtonPrimaryLink} -->
+        </slot>
+
+        <slot
+          name="secondary-button"
+          @slotchange=${this.#onSecondaryButtonSlotChange}
+          ${assertSlot([SplitButtonSecondaryButton])}
+          ${ref(this.#secondaryButtonSlotElementRef)}
+        >
+          <!-- @type {SplitButtonSecondaryButton} -->
+        </slot>
+      </div>
+    `;
+    }
+    #defaultSlotElementRef;
+    #secondaryButtonSlotElementRef;
+    #variant;
+    #onDefaultSlotChange() {
+        if (this.primaryButtonElement) {
+            this.primaryButtonElement.privateVariant = this.variant;
+        }
+    }
+    #onSecondaryButtonSlotChange() {
+        if (this.secondaryButtonElement) {
+            this.secondaryButtonElement.privateVariant = this.variant;
+        }
+    }
+};
+__decorate([
+    property({ reflect: true })
+], SplitButton.prototype, "variant", null);
+__decorate([
+    property({ reflect: true })
+], SplitButton.prototype, "version", void 0);
+SplitButton = __decorate([
+    customElement('glide-core-split-button'),
+    final
+], SplitButton);
+export default SplitButton;

package/dist/split-button.primary-button.js

@@ -1 +1,100 @@
-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 s=t.length-1;s>=0;s--)(i=t[s])&&(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 SplitButtonPrimaryButton=class SplitButtonPrimaryButton 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],SplitButtonPrimaryButton.prototype,"label",void 0),__decorate([property({attribute:"aria-controls",reflect:!0,useDefault:!0})],SplitButtonPrimaryButton.prototype,"ariaControls",void 0),__decorate([property({attribute:"aria-expanded",reflect:!0,useDefault:!0})],SplitButtonPrimaryButton.prototype,"ariaExpanded",void 0),__decorate([property({attribute:"aria-haspopup",reflect:!0,useDefault:!0})],SplitButtonPrimaryButton.prototype,"ariaHasPopup",void 0),__decorate([property({reflect:!0,type:Boolean})],SplitButtonPrimaryButton.prototype,"disabled",void 0),__decorate([property()],SplitButtonPrimaryButton.prototype,"privateSize",void 0),__decorate([property()],SplitButtonPrimaryButton.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],SplitButtonPrimaryButton.prototype,"version",void 0),SplitButtonPrimaryButton=__decorate([customElement("glide-core-split-button-primary-button"),final],SplitButtonPrimaryButton);export default SplitButtonPrimaryButton;
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+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';
+/**
+ * @attr {string} label
+ * @attr {string|null} [aria-controls=null]
+ * @attr {'true'|'false'|null} [aria-expanded=null]
+ * @attr {'true'|'false'|'menu'|'listbox'|'tree'|'grid'|'dialog'|null} [aria-haspopup=null]
+ * @attr {boolean} [disabled=false]
+ *
+ * @readonly
+ * @attr {string} [version]
+ *
+ * @slot {Element} [icon] - An icon before the label
+ */
+let SplitButtonPrimaryButton = class SplitButtonPrimaryButton extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.ariaControls = null;
+        this.ariaExpanded = null;
+        this.ariaHasPopup = null;
+        this.disabled = false;
+        this.privateSize = 'large';
+        this.privateVariant = 'primary';
+        this.version = packageJson.version;
+    }
+    static { this.shadowRootOptions = {
+        ...LitElement.shadowRootOptions,
+        delegatesFocus: true,
+        mode: shadowRootMode,
+    }; }
+    static { this.styles = styles; }
+    render() {
+        return html `<button
+      aria-controls=${ifDefined(this.ariaControls ?? undefined)}
+      aria-expanded=${ifDefined(this.ariaExpanded ?? undefined)}
+      aria-haspopup=${ifDefined(this.ariaHasPopup ?? undefined)}
+      class=${classMap({
+            component: true,
+            disabled: this.disabled,
+            [this.privateVariant]: true,
+            [this.privateSize]: true,
+        })}
+      data-test="component"
+      type="button"
+      ?disabled=${this.disabled}
+    >
+      <slot name="icon">
+        <!--
+          An icon before the label
+          @type {Element}
+        -->
+      </slot>
+
+      ${this.label}
+    </button>`;
+    }
+};
+__decorate([
+    property({ reflect: true }),
+    required
+], SplitButtonPrimaryButton.prototype, "label", void 0);
+__decorate([
+    property({ attribute: 'aria-controls', reflect: true, useDefault: true })
+], SplitButtonPrimaryButton.prototype, "ariaControls", void 0);
+__decorate([
+    property({ attribute: 'aria-expanded', reflect: true, useDefault: true })
+], SplitButtonPrimaryButton.prototype, "ariaExpanded", void 0);
+__decorate([
+    property({ attribute: 'aria-haspopup', reflect: true, useDefault: true })
+], SplitButtonPrimaryButton.prototype, "ariaHasPopup", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], SplitButtonPrimaryButton.prototype, "disabled", void 0);
+__decorate([
+    property()
+], SplitButtonPrimaryButton.prototype, "privateSize", void 0);
+__decorate([
+    property()
+], SplitButtonPrimaryButton.prototype, "privateVariant", void 0);
+__decorate([
+    property({ reflect: true })
+], SplitButtonPrimaryButton.prototype, "version", void 0);
+SplitButtonPrimaryButton = __decorate([
+    customElement('glide-core-split-button-primary-button'),
+    final
+], SplitButtonPrimaryButton);
+export default SplitButtonPrimaryButton;

package/dist/split-button.primary-button.styles.js

@@ -1,11 +1,17 @@
-import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export default[css`
-    ${focusOutline(".component:focus-visible")}
-  `,css`
+import { css } from 'lit';
+import focusOutline from './styles/focus-outline.js';
+// These styles are shared between Split Button Primary Button and Split Button
+// Primary Link.
+export default [
+    css `
+    ${focusOutline('.component:focus-visible')}
+  `,
+    css `
     .component {
       align-items: center;
       block-size: 2.125rem;
-      border-radius: var(--glide-core-rounding-base-radius-md) 0 0
-        var(--glide-core-rounding-base-radius-md);
+      border-radius: var(--glide-core-rounding-base-radius-sm) 0 0
+        var(--glide-core-rounding-base-radius-sm);
       border-style: solid;
       border-width: 1px 0 1px 1px;
       box-sizing: border-box;
@@ -97,4 +103,5 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export
         color: var(--glide-core-private-color-button-text-primary);
       }
     }
-  `];
+  `,
+];

package/dist/split-button.primary-link.js

@@ -1 +1,102 @@
-var __decorate=this&&this.__decorate||function(t,e,r,i){var o,a=arguments.length,s=a<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,r,i);else for(var p=t.length-1;p>=0;p--)(o=t[p])&&(s=(a<3?o(s):a>3?o(e,r,s):o(e,r))||s);return a>3&&s&&Object.defineProperty(e,r,s),s};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 SplitButtonPrimaryLink=class SplitButtonPrimaryLink 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],SplitButtonPrimaryLink.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],SplitButtonPrimaryLink.prototype,"disabled",void 0),__decorate([property({reflect:!0})],SplitButtonPrimaryLink.prototype,"href",void 0),__decorate([property()],SplitButtonPrimaryLink.prototype,"privateSize",void 0),__decorate([property()],SplitButtonPrimaryLink.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],SplitButtonPrimaryLink.prototype,"version",void 0),SplitButtonPrimaryLink=__decorate([customElement("glide-core-split-button-primary-link"),final],SplitButtonPrimaryLink);export default SplitButtonPrimaryLink;
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+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';
+/**
+ * @attr {string} label
+ * @attr {boolean} [disabled=false]
+ * @attr {string} [href]
+ *
+ * @readonly
+ * @attr {string} [version]
+ *
+ * @slot {Element} [icon] - An icon before the label
+ */
+let SplitButtonPrimaryLink = class SplitButtonPrimaryLink extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.disabled = false;
+        this.privateSize = 'large';
+        this.privateVariant = 'primary';
+        this.version = packageJson.version;
+    }
+    static { this.shadowRootOptions = {
+        ...LitElement.shadowRootOptions,
+        delegatesFocus: true,
+        mode: shadowRootMode,
+    }; }
+    static { this.styles = styles; }
+    render() {
+        if (this.disabled) {
+            return html `<span
+        aria-disabled="true"
+        class=${classMap({
+                component: true,
+                disabled: true,
+                [this.privateVariant]: true,
+                [this.privateSize]: true,
+            })}
+        role="link"
+      >
+        <slot name="icon">
+          <!--
+            An icon before the label
+            @type {Element}
+          -->
+        </slot>
+
+        ${this.label}
+      </span>`;
+        }
+        return html `<a
+      class=${classMap({
+            component: true,
+            [this.privateVariant]: true,
+            [this.privateSize]: true,
+        })}
+      data-test="component"
+      href=${ifDefined(this.href)}
+    >
+      <slot name="icon">
+        <!-- @type {Element} -->
+      </slot>
+
+      ${this.label}
+    </a>`;
+    }
+};
+__decorate([
+    property({ reflect: true }),
+    required
+], SplitButtonPrimaryLink.prototype, "label", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], SplitButtonPrimaryLink.prototype, "disabled", void 0);
+__decorate([
+    property({ reflect: true })
+], SplitButtonPrimaryLink.prototype, "href", void 0);
+__decorate([
+    property()
+], SplitButtonPrimaryLink.prototype, "privateSize", void 0);
+__decorate([
+    property()
+], SplitButtonPrimaryLink.prototype, "privateVariant", void 0);
+__decorate([
+    property({ reflect: true })
+], SplitButtonPrimaryLink.prototype, "version", void 0);
+SplitButtonPrimaryLink = __decorate([
+    customElement('glide-core-split-button-primary-link'),
+    final
+], SplitButtonPrimaryLink);
+export default SplitButtonPrimaryLink;

package/dist/split-button.secondary-button.d.ts

@@ -1,4 +1,4 @@
-import './menu.options.js';
+import './options.js';
 import { LitElement } from 'lit';
 declare global {
     interface HTMLElementTagNameMap {
@@ -14,7 +14,7 @@ declare global {
  * @readonly
  * @attr {string} [version]
  *
- * @slot {MenuButton | MenuLink}
+ * @slot {Option}
  */
 export default class SplitButtonSecondaryButton extends LitElement {
     #private;
@@ -28,6 +28,5 @@ export default class SplitButtonSecondaryButton extends LitElement {
     privateVariant: 'primary' | 'secondary';
     readonly version: string;
     click(): void;
-    firstUpdated(): void;
     render(): import("lit").TemplateResult<1>;
 }

package/dist/split-button.secondary-button.js

@@ -1 +1,121 @@
-var __decorate=this&&this.__decorate||function(t,e,o,n){var r,i=arguments.length,s=i<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,o):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,o,n);else for(var a=t.length-1;a>=0;a--)(r=t[a])&&(s=(i<3?r(s):i>3?r(e,o,s):r(e,o))||s);return i>3&&s&&Object.defineProperty(e,o,s),s};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 Menu from"./menu.js";import MenuButton from"./menu.button.js";import MenuLink 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 SplitButtonSecondaryButton=class SplitButtonSecondaryButton extends LitElement{constructor(){super(...arguments),this.disabled=!1,this.menuOpen=!1,this.menuPlacement="bottom-end",this.privateActive=!1,this.privateVariant="primary",this.version=packageJson.version,this.#t=createRef(),this.#e=createRef()}static{this.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0,mode:shadowRootMode}}static{this.styles=styles}click(){this.#t.value?.click()}firstUpdated(){const t=new MutationObserver((()=>{this.#e.value&&(this.menuOpen=this.#e.value.open)}));this.#e.value&&t.observe(this.#e.value,{attributes:!0,attributeFilter:["open"]})}render(){return html`<glide-core-menu placement="${this.menuPlacement}" ?open="${this.menuOpen}" ${ref(this.#e)}><button aria-label="${ifDefined(this.label)}" class="${classMap({component:!0,active:this.menuOpen,disabled:this.disabled,[this.privateVariant]:!0})}" data-test="button" slot="target" type="button" ?disabled="${this.disabled}" ${ref(this.#t)}>${chevronIcon}</button><glide-core-menu-options><slot ${assertSlot([MenuButton,MenuLink])}></slot></glide-core-menu-options></glide-core-menu>`}#t;#e};__decorate([property({reflect:!0}),required],SplitButtonSecondaryButton.prototype,"label",void 0),__decorate([property({reflect:!0,type:Boolean})],SplitButtonSecondaryButton.prototype,"disabled",void 0),__decorate([property({attribute:"menu-open",reflect:!0,type:Boolean})],SplitButtonSecondaryButton.prototype,"menuOpen",void 0),__decorate([property({attribute:"menu-placement",reflect:!0,useDefault:!0})],SplitButtonSecondaryButton.prototype,"menuPlacement",void 0),__decorate([property({type:Boolean})],SplitButtonSecondaryButton.prototype,"privateActive",void 0),__decorate([property()],SplitButtonSecondaryButton.prototype,"privateVariant",void 0),__decorate([property({reflect:!0})],SplitButtonSecondaryButton.prototype,"version",void 0),SplitButtonSecondaryButton=__decorate([customElement("glide-core-split-button-secondary-button"),final],SplitButtonSecondaryButton);export default SplitButtonSecondaryButton;
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import './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 Menu from './menu.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';
+import Option from './option.js';
+/**
+ * @attr {string} label
+ * @attr {boolean} [disabled=false]
+ * @attr {boolean} [menu-open=false]
+ * @attr {'bottom-end'|'top-end'} [menu-placement='bottom-end']
+ *
+ * @readonly
+ * @attr {string} [version]
+ *
+ * @slot {Option}
+ */
+let SplitButtonSecondaryButton = class SplitButtonSecondaryButton extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.disabled = false;
+        this.menuOpen = false;
+        this.menuPlacement = 'bottom-end';
+        this.privateActive = false;
+        this.privateVariant = 'primary';
+        this.version = packageJson.version;
+        this.#buttonElementRef = createRef();
+        this.#menuElementRef = createRef();
+    }
+    static { this.shadowRootOptions = {
+        ...LitElement.shadowRootOptions,
+        delegatesFocus: true,
+        mode: shadowRootMode,
+    }; }
+    static { this.styles = styles; }
+    click() {
+        this.#buttonElementRef.value?.click();
+    }
+    render() {
+        return html `
+      <glide-core-menu
+        placement=${this.menuPlacement}
+        ?open=${this.menuOpen}
+        @toggle=${this.#onMenuToggle}
+        ${ref(this.#menuElementRef)}
+      >
+        <button
+          aria-label=${ifDefined(this.label)}
+          class=${classMap({
+            button: true,
+            active: this.menuOpen,
+            disabled: this.disabled,
+            [this.privateVariant]: true,
+        })}
+          data-test="button"
+          slot="target"
+          type="button"
+          ?disabled=${this.disabled}
+          ${ref(this.#buttonElementRef)}
+        >
+          ${chevronIcon}
+        </button>
+
+        <glide-core-options>
+          <slot ${assertSlot([Option])}>
+            <!-- @type {Option} -->
+          </slot>
+        </glide-core-options>
+      </glide-core-menu>
+    `;
+    }
+    #buttonElementRef;
+    #menuElementRef;
+    #onMenuToggle(event) {
+        if (event.target instanceof Menu) {
+            this.menuOpen = event.target.open;
+        }
+    }
+};
+__decorate([
+    property({ reflect: true }),
+    required
+], SplitButtonSecondaryButton.prototype, "label", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], SplitButtonSecondaryButton.prototype, "disabled", void 0);
+__decorate([
+    property({ attribute: 'menu-open', reflect: true, type: Boolean })
+], SplitButtonSecondaryButton.prototype, "menuOpen", void 0);
+__decorate([
+    property({ attribute: 'menu-placement', reflect: true, useDefault: true })
+], SplitButtonSecondaryButton.prototype, "menuPlacement", void 0);
+__decorate([
+    property({ type: Boolean })
+], SplitButtonSecondaryButton.prototype, "privateActive", void 0);
+__decorate([
+    property()
+], SplitButtonSecondaryButton.prototype, "privateVariant", void 0);
+__decorate([
+    property({ reflect: true })
+], SplitButtonSecondaryButton.prototype, "version", void 0);
+SplitButtonSecondaryButton = __decorate([
+    customElement('glide-core-split-button-secondary-button'),
+    final
+], SplitButtonSecondaryButton);
+export default SplitButtonSecondaryButton;

package/dist/split-button.secondary-button.styles.js

@@ -1,7 +1,11 @@
-import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export default[css`
-    ${focusOutline(".component:focus-visible")}
-  `,css`
-    .component {
+import { css } from 'lit';
+import focusOutline from './styles/focus-outline.js';
+export default [
+    css `
+    ${focusOutline('.button:focus-visible')}
+  `,
+    css `
+    .button {
       align-items: center;
       background-color: var(
         --glide-core-color-interactive-surface-container-active
@@ -13,8 +17,8 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export
       border-inline-start-color: var(
         --glide-core-private-color-button-stroke-default
       );
-      border-radius: 0 var(--glide-core-rounding-base-radius-md)
-        var(--glide-core-rounding-base-radius-md) 0;
+      border-radius: 0 var(--glide-core-rounding-base-radius-sm)
+        var(--glide-core-rounding-base-radius-sm) 0;
       border-style: solid;
       border-width: 1px;
       box-sizing: border-box;
@@ -126,4 +130,5 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";export
         color: var(--glide-core-private-color-button-icon-primary);
       }
     }
-  `];
+  `,
+];