@solid-design-system/components 1.33.0 → 1.34.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 (104) hide show
  1. package/dist/custom-elements.json +1 -1
  2. package/dist/styles/solid-styles.css +1 -1
  3. package/dist/versioned-components/es/accordion-group.js +1 -1
  4. package/dist/versioned-components/es/accordion.js +1 -1
  5. package/dist/versioned-components/es/badge.js +1 -1
  6. package/dist/versioned-components/es/brandshape.js +1 -1
  7. package/dist/versioned-components/es/button.js +1 -1
  8. package/dist/versioned-components/es/carousel-item.js +1 -1
  9. package/dist/versioned-components/es/carousel.js +3 -3
  10. package/dist/versioned-components/es/checkbox-group.js +1 -1
  11. package/dist/versioned-components/es/checkbox.js +1 -1
  12. package/dist/versioned-components/es/divider.js +1 -1
  13. package/dist/versioned-components/es/drawer.js +1 -1
  14. package/dist/versioned-components/es/dropdown.js +1 -1
  15. package/dist/versioned-components/es/form-control.styles.js +1 -1
  16. package/dist/versioned-components/es/form.js +1 -1
  17. package/dist/versioned-components/es/header.js +1 -1
  18. package/dist/versioned-components/es/icon.js +1 -1
  19. package/dist/versioned-components/es/include.js +1 -1
  20. package/dist/versioned-components/es/input.js +1 -1
  21. package/dist/versioned-components/es/link.js +1 -1
  22. package/dist/versioned-components/es/navigation-item.js +1 -1
  23. package/dist/versioned-components/es/notification.js +1 -1
  24. package/dist/versioned-components/es/option.js +1 -1
  25. package/dist/versioned-components/es/popup.js +1 -1
  26. package/dist/versioned-components/es/radio-group.js +1 -1
  27. package/dist/versioned-components/es/radio.js +1 -1
  28. package/dist/versioned-components/es/select.js +2 -2
  29. package/dist/versioned-components/es/spinner.js +1 -1
  30. package/dist/versioned-components/es/switch.js +1 -1
  31. package/dist/versioned-components/es/tag.js +1 -1
  32. package/dist/versioned-components/es/teaser.js +1 -1
  33. package/dist/versioned-components/es/textarea.js +1 -1
  34. package/dist/versioned-components/es/tooltip.js +2 -2
  35. package/dist/versioned-components/es/video.js +1 -1
  36. package/dist/versioned-package/_components/button-group/button-group.d.ts +1 -1
  37. package/dist/versioned-package/_components/button-group/button-group.js +11 -11
  38. package/dist/versioned-package/components/accordion/accordion.d.ts +1 -1
  39. package/dist/versioned-package/components/accordion/accordion.js +2 -2
  40. package/dist/versioned-package/components/accordion-group/accordion-group.d.ts +1 -1
  41. package/dist/versioned-package/components/accordion-group/accordion-group.js +3 -3
  42. package/dist/versioned-package/components/badge/badge.d.ts +1 -1
  43. package/dist/versioned-package/components/badge/badge.js +1 -1
  44. package/dist/versioned-package/components/brandshape/brandshape.d.ts +1 -1
  45. package/dist/versioned-package/components/brandshape/brandshape.js +1 -1
  46. package/dist/versioned-package/components/button/button.d.ts +1 -1
  47. package/dist/versioned-package/components/button/button.js +4 -4
  48. package/dist/versioned-package/components/carousel/carousel.d.ts +1 -1
  49. package/dist/versioned-package/components/carousel/carousel.js +6 -6
  50. package/dist/versioned-package/components/carousel-item/carousel-item.d.ts +1 -1
  51. package/dist/versioned-package/components/carousel-item/carousel-item.js +1 -1
  52. package/dist/versioned-package/components/checkbox/checkbox.d.ts +1 -1
  53. package/dist/versioned-package/components/checkbox/checkbox.js +4 -4
  54. package/dist/versioned-package/components/checkbox-group/checkbox-group.d.ts +1 -1
  55. package/dist/versioned-package/components/checkbox-group/checkbox-group.js +5 -5
  56. package/dist/versioned-package/components/divider/divider.d.ts +1 -1
  57. package/dist/versioned-package/components/divider/divider.js +2 -2
  58. package/dist/versioned-package/components/drawer/drawer.d.ts +1 -1
  59. package/dist/versioned-package/components/drawer/drawer.js +2 -2
  60. package/dist/versioned-package/components/dropdown/dropdown.d.ts +1 -1
  61. package/dist/versioned-package/components/dropdown/dropdown.js +8 -8
  62. package/dist/versioned-package/components/header/header.d.ts +1 -1
  63. package/dist/versioned-package/components/header/header.js +4 -4
  64. package/dist/versioned-package/components/icon/icon.d.ts +1 -1
  65. package/dist/versioned-package/components/icon/icon.js +1 -1
  66. package/dist/versioned-package/components/include/include.d.ts +1 -1
  67. package/dist/versioned-package/components/include/include.js +1 -1
  68. package/dist/versioned-package/components/input/input.d.ts +1 -1
  69. package/dist/versioned-package/components/input/input.js +4 -4
  70. package/dist/versioned-package/components/link/link.d.ts +1 -1
  71. package/dist/versioned-package/components/link/link.js +2 -2
  72. package/dist/versioned-package/components/navigation-item/navigation-item.d.ts +1 -1
  73. package/dist/versioned-package/components/navigation-item/navigation-item.js +3 -3
  74. package/dist/versioned-package/components/notification/notification.d.ts +1 -1
  75. package/dist/versioned-package/components/notification/notification.js +5 -5
  76. package/dist/versioned-package/components/option/option.d.ts +1 -1
  77. package/dist/versioned-package/components/option/option.js +2 -2
  78. package/dist/versioned-package/components/popup/popup.d.ts +1 -1
  79. package/dist/versioned-package/components/popup/popup.js +1 -1
  80. package/dist/versioned-package/components/radio/radio.d.ts +1 -1
  81. package/dist/versioned-package/components/radio/radio.js +2 -2
  82. package/dist/versioned-package/components/radio-group/radio-group.d.ts +2 -2
  83. package/dist/versioned-package/components/radio-group/radio-group.js +14 -14
  84. package/dist/versioned-package/components/select/select.d.ts +4 -4
  85. package/dist/versioned-package/components/select/select.js +28 -28
  86. package/dist/versioned-package/components/spinner/spinner.d.ts +1 -1
  87. package/dist/versioned-package/components/spinner/spinner.js +1 -1
  88. package/dist/versioned-package/components/switch/switch.d.ts +1 -1
  89. package/dist/versioned-package/components/switch/switch.js +2 -2
  90. package/dist/versioned-package/components/tag/tag.d.ts +1 -1
  91. package/dist/versioned-package/components/tag/tag.js +2 -2
  92. package/dist/versioned-package/components/teaser/teaser.js +1 -1
  93. package/dist/versioned-package/components/textarea/textarea.d.ts +1 -1
  94. package/dist/versioned-package/components/textarea/textarea.js +2 -2
  95. package/dist/versioned-package/components/tooltip/tooltip.d.ts +1 -1
  96. package/dist/versioned-package/components/tooltip/tooltip.js +5 -5
  97. package/dist/versioned-package/components/video/video.d.ts +1 -1
  98. package/dist/versioned-package/components/video/video.js +2 -2
  99. package/dist/versioned-package/internal/form.js +2 -2
  100. package/dist/versioned-package/styles/form-control.styles.js +1 -1
  101. package/dist/versioned-styles/solid-styles.css +1 -1
  102. package/dist/vscode.html-custom-data.json +31 -31
  103. package/dist/web-types.json +1 -1
  104. package/package.json +4 -4
@@ -1 +1 @@
1
- import{x as t,i as e}from"./lit-element.js";import{c as i}from"./register-custom-element.js";import{H as r}from"./slot.js";import{S as o,n as s}from"./solid-element.js";import{r as a}from"./state.js";import{e as n}from"./query.js";import{t as l}from"./classix.js";var h=Object.defineProperty,d=Object.getOwnPropertyDescriptor,p=(t,e,i,r)=>{for(var o,s=r>1?void 0:r?d(e,i):e,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(r?o(e,i,s):o(s))||s);return r&&s&&h(e,i,s),s};let c=class extends o{constructor(){super(...arguments),this.variant="white",this.breakpoint=448,this.inset=!1,this.hasSlotController=new r(this,"[default]","media","meta","headline")}connectedCallback(){super.connectedCallback(),0===this.breakpoint?this._orientation="horizontal":9999===this.breakpoint?this._orientation="vertical":window.ResizeObserver&&(this.resizeObserver=new ResizeObserver((()=>this.updateOrientation())),this.resizeObserver.observe(this))}disconnectedCallback(){super.disconnectedCallback(),this.resizeObserver&&this.resizeObserver.disconnect()}updated(t){super.updated(t),t.has("breakpoint")&&this.updateOrientation()}updateOrientation(){this._orientation=this.offsetWidth>=this.breakpoint?"horizontal":"vertical"}render(){const e="white border-neutral-400"===this.variant||this.inset,i=this.hasSlotController.test("[default]"),r=this.hasSlotController.test("media"),o=this.hasSlotController.test("meta");return this.hasSlotController.test("headline"),t`<div class="${l("flex",{white:"bg-white","white border-neutral-400":"bg-white border border-neutral-400","neutral-100":"bg-neutral-100",primary:"bg-primary text-white","primary-100":"bg-primary-100"}[this.variant],"vertical"===this._orientation&&"flex-col","horizontal"===this._orientation&&"flex-row gap-8","horizontal"===this._orientation&&e&&"py-8 px-10")}" part="base"><div style="${"horizontal"===this._orientation?"width: var(--distribution-media, 100%);":""}" class="${l(!e&&"vertical"===this._orientation&&"mb-4",!r&&"hidden")}" part="media"><slot name="media"></slot></div><div style="${"horizontal"===this._orientation?"width: var(--distribution-content, 100%); "+(e?"width: var(--distribution-content, calc(100% - 2rem));":""):""}" class="${l("flex flex-col text-left","horizontal"===this._orientation&&"flex flex-col","vertical"===this._orientation&&e&&"m-4")}" part="content"><div part="meta" class="${l("gap-2 mb-4",!o&&"hidden")}"><slot name="meta"></slot></div><div part="headline" class="${l("text-lg font-bold m-0","primary"===this.variant?"text-white":"text-black")}"><slot name="headline">Always insert one semantically correct heading element here (e. g. &lt;h2>)</slot></div><div part="main" class="${l(!i&&"hidden")}"><slot></slot></div></div></div>`}};c.styles=[o.styles,e`:host{display:block}::slotted(*){margin:0}::slotted([slot=headline]){font-size:var(--sd-font-size-lg,1.25rem)!important;font-weight:700;margin:0!important}`],p([s({reflect:!0})],c.prototype,"variant",2),p([s({reflect:!0,type:Number})],c.prototype,"breakpoint",2),p([s({type:Boolean,reflect:!0})],c.prototype,"inset",2),p([n('[part="base"]')],c.prototype,"teaser",2),p([a()],c.prototype,"_orientation",2),c=p([i("sd-1-33-0-teaser")],c);export{c as default};
1
+ import{x as t,i as e}from"./lit-element.js";import{c as i}from"./register-custom-element.js";import{H as r}from"./slot.js";import{S as o,n as s}from"./solid-element.js";import{r as a}from"./state.js";import{e as n}from"./query.js";import{t as l}from"./classix.js";var h=Object.defineProperty,d=Object.getOwnPropertyDescriptor,p=(t,e,i,r)=>{for(var o,s=r>1?void 0:r?d(e,i):e,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(r?o(e,i,s):o(s))||s);return r&&s&&h(e,i,s),s};let c=class extends o{constructor(){super(...arguments),this.variant="white",this.breakpoint=448,this.inset=!1,this.hasSlotController=new r(this,"[default]","media","meta","headline")}connectedCallback(){super.connectedCallback(),0===this.breakpoint?this._orientation="horizontal":9999===this.breakpoint?this._orientation="vertical":window.ResizeObserver&&(this.resizeObserver=new ResizeObserver((()=>this.updateOrientation())),this.resizeObserver.observe(this))}disconnectedCallback(){super.disconnectedCallback(),this.resizeObserver&&this.resizeObserver.disconnect()}updated(t){super.updated(t),t.has("breakpoint")&&this.updateOrientation()}updateOrientation(){this._orientation=this.offsetWidth>=this.breakpoint?"horizontal":"vertical"}render(){const e="white border-neutral-400"===this.variant||this.inset,i=this.hasSlotController.test("[default]"),r=this.hasSlotController.test("media"),o=this.hasSlotController.test("meta");return this.hasSlotController.test("headline"),t`<div class="${l("flex",{white:"bg-white","white border-neutral-400":"bg-white border border-neutral-400","neutral-100":"bg-neutral-100",primary:"bg-primary text-white","primary-100":"bg-primary-100"}[this.variant],"vertical"===this._orientation&&"flex-col","horizontal"===this._orientation&&"flex-row gap-8","horizontal"===this._orientation&&e&&"py-8 px-10")}" part="base"><div style="${"horizontal"===this._orientation?"width: var(--distribution-media, 100%);":""}" class="${l(!e&&"vertical"===this._orientation&&"mb-4",!r&&"hidden")}" part="media"><slot name="media"></slot></div><div style="${"horizontal"===this._orientation?"width: var(--distribution-content, 100%); "+(e?"width: var(--distribution-content, calc(100% - 2rem));":""):""}" class="${l("flex flex-col text-left","horizontal"===this._orientation&&"flex flex-col","vertical"===this._orientation&&e&&"m-4")}" part="content"><div part="meta" class="${l("gap-2 mb-4",!o&&"hidden")}"><slot name="meta"></slot></div><div part="headline" class="${l("text-lg font-bold m-0","primary"===this.variant?"text-white":"text-black")}"><slot name="headline">Always insert one semantically correct heading element here (e. g. &lt;h2>)</slot></div><div part="main" class="${l(!i&&"hidden")}"><slot></slot></div></div></div>`}};c.styles=[o.styles,e`:host{display:block}::slotted(*){margin:0}::slotted([slot=headline]){font-size:var(--sd-font-size-lg,1.25rem)!important;font-weight:700;margin:0!important}`],p([s({reflect:!0})],c.prototype,"variant",2),p([s({reflect:!0,type:Number})],c.prototype,"breakpoint",2),p([s({type:Boolean,reflect:!0})],c.prototype,"inset",2),p([n('[part="base"]')],c.prototype,"teaser",2),p([a()],c.prototype,"_orientation",2),c=p([i("sd-1-34-0-teaser")],c);export{c as default};
@@ -1 +1 @@
1
- import{x as t,i as e}from"./lit-element.js";import{c as a}from"./register-custom-element.js";import{d as r}from"./default-value.js";import{F as l}from"./form.js";import{H as o}from"./slot.js";import{o as i}from"./if-defined.js";import{l as s}from"./live.js";import{S as n,n as h}from"./solid-element.js";import{r as d}from"./state.js";import{e as p}from"./query.js";import{w as c}from"./watch.js";import{t as u}from"./classix.js";import{f as m}from"./form-control.styles.js";import"./directive.js";var f=Object.defineProperty,x=Object.getOwnPropertyDescriptor,y=(t,e,a,r)=>{for(var l,o=r>1?void 0:r?x(e,a):e,i=t.length-1;i>=0;i--)(l=t[i])&&(o=(r?l(e,a,o):l(o))||o);return r&&o&&f(e,a,o),o};let b=class extends n{constructor(){super(...arguments),this.formControlController=new l(this),this.hasSlotController=new o(this,"help-text","label"),this.hasFocus=!1,this.title="",this.name="",this.value="",this.size="lg",this.label="",this.helpText="",this.placeholder="",this.rows=4,this.disabled=!1,this.readonly=!1,this.form="",this.required=!1,this.spellcheck=!0,this.defaultValue=""}get validity(){return this.textarea.validity}get validationMessage(){return this.textarea.validationMessage}connectedCallback(){super.connectedCallback(),this.updateComplete.then((()=>{this.setTextareaHeight()}))}firstUpdated(){this.formControlController.updateValidity()}disconnectedCallback(){super.disconnectedCallback()}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleChange(){this.value=this.textarea.value,this.setTextareaHeight(),this.emit("sd-change")}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleInput(){this.value=this.textarea.value,this.formControlController.updateValidity(),this.emit("sd-1-33-0-input")}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}setTextareaHeight(){this.textarea.style.height=void 0}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}handleRowsChange(){this.setTextareaHeight()}async handleValueChange(){await this.updateComplete,this.formControlController.updateValidity(),this.setTextareaHeight()}focus(t){this.textarea.focus(t)}blur(){this.textarea.blur()}select(){this.textarea.select()}scrollPosition(t){return t?("number"==typeof t.top&&(this.textarea.scrollTop=t.top),void("number"==typeof t.left&&(this.textarea.scrollLeft=t.left))):{top:this.textarea.scrollTop,left:this.textarea.scrollTop}}setSelectionRange(t,e,a="none"){this.textarea.setSelectionRange(t,e,a)}setRangeText(t,e,a,r){this.textarea.setRangeText(t,e,a,r),this.value!==this.textarea.value&&(this.value=this.textarea.value),this.value!==this.textarea.value&&(this.value=this.textarea.value,this.setTextareaHeight())}checkValidity(){var t;return null==(t=this.textarea)?void 0:t.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.textarea.reportValidity()}setCustomValidity(t){this.textarea.setCustomValidity(t),this.formControlController.updateValidity()}render(){const e=this.hasSlotController.test("label"),a=this.hasSlotController.test("help-text"),r=!!this.label||!!e,l=!!this.helpText||!!a,o=this.required||!!this.minlength||!!this.maxlength,n=o&&!this.checkValidity(),h=o&&this.checkValidity(),d=this.disabled?"disabled":this.readonly?"readonly":this.hasFocus&&n?"activeInvalid":this.hasFocus&&h?"activeValid":this.hasFocus?"active":n?"invalid":h?"valid":"default",p="sm"===this.size?"text-sm":"text-base";return t`<div part="form-control" class="${u("form-control text-left",r&&"form-control--has-label",l&&"form-control--has-help-text",this.disabled&&"cursor-not-allowed")}"><label part="form-control-label" id="label" class="${u("form-control-label mb-2",r?"has-label inline-block":"hidden",p)}" for="input" aria-hidden="${r?"false":"true"}"><slot name="label">${this.label}</slot></label><div part="form-control-input" class="form-control-input relative w-full"><div part="border" class="${u("absolute w-full h-full pointer-events-none border rounded-default",{disabled:"border-neutral-500",readonly:"border-neutral-800",activeInvalid:"border-error border-2",activeValid:"border-success border-2",active:"border-primary border-2",invalid:"border-error",valid:"border-success",default:"border-neutral-800"}[d])}"></div><div part="base" class="${u("textarea px-4 flex flex-row items-center rounded-default textarea--resize-none",{sm:"textarea-sm py-1",md:"textarea-md py-1",lg:"textarea-lg py-2"}[this.size],{disabled:"text-neutral-500",readonly:"text-black",activeInvalid:"text-error",activeValid:"text-success",active:"text-black",invalid:"text-error",valid:"text-success",default:"text-black"}[d],this.disabled||this.readonly?"":"hover:bg-neutral-200",this.readonly&&"bg-neutral-100",n&&"form-control-input--invalid",!this.value&&"textarea--empty")}"><textarea part="textarea" id="input" class="${u('textarea__control flex-grow focus:outline-none bg-transparent placeholder-neutral-700"',p)}" title="${this.title}" name="${i(this.name)}" .value="${s(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" placeholder="${i(this.placeholder)}" minlength="${i(this.minlength)}" maxlength="${i(this.maxlength)}" rows="${i(this.rows)}" autocapitalize="${i(this.autocapitalize)}" autocorrect="${i(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${i(this.spellcheck)}" enterkeyhint="${i(this.enterkeyhint)}" inputmode="${i(this.inputmode)}" aria-describedby="help-text" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea></div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${u("text-sm text-neutral-700",l?"block":"hidden")}" aria-hidden="${l?"false":"true"}">${this.helpText}</slot></div>`}};b.styles=[m,n.styles,e`:host{display:block}:host([required]) #label.has-label::after{content:'*';margin-left:2px}:host([disabled]) .textarea__control{cursor:not-allowed}.no-scrollbar::-webkit-scrollbar{display:none}.textarea--resize-none .textarea__control{resize:none}`],y([p(".textarea__control")],b.prototype,"textarea",2),y([d()],b.prototype,"hasFocus",2),y([h()],b.prototype,"title",2),y([h()],b.prototype,"name",2),y([h()],b.prototype,"value",2),y([h({reflect:!0})],b.prototype,"size",2),y([h()],b.prototype,"label",2),y([h({attribute:"help-text"})],b.prototype,"helpText",2),y([h()],b.prototype,"placeholder",2),y([h({type:Number})],b.prototype,"rows",2),y([h({type:Boolean,reflect:!0})],b.prototype,"disabled",2),y([h({type:Boolean,reflect:!0})],b.prototype,"readonly",2),y([h({reflect:!0})],b.prototype,"form",2),y([h({type:Boolean,reflect:!0})],b.prototype,"required",2),y([h({type:Number})],b.prototype,"minlength",2),y([h({type:Number})],b.prototype,"maxlength",2),y([h()],b.prototype,"autocapitalize",2),y([h()],b.prototype,"autocorrect",2),y([h()],b.prototype,"autocomplete",2),y([h({type:Boolean})],b.prototype,"autofocus",2),y([h()],b.prototype,"enterkeyhint",2),y([h({type:Boolean,converter:{fromAttribute:t=>!(!t||"false"===t),toAttribute:t=>t?"true":"false"}})],b.prototype,"spellcheck",2),y([h()],b.prototype,"inputmode",2),y([r()],b.prototype,"defaultValue",2),y([c("disabled",{waitUntilFirstUpdate:!0})],b.prototype,"handleDisabledChange",1),y([c("rows",{waitUntilFirstUpdate:!0})],b.prototype,"handleRowsChange",1),y([c("value",{waitUntilFirstUpdate:!0})],b.prototype,"handleValueChange",1),b=y([a("sd-1-33-0-textarea")],b);export{b as default};
1
+ import{x as t,i as e}from"./lit-element.js";import{c as a}from"./register-custom-element.js";import{d as r}from"./default-value.js";import{F as l}from"./form.js";import{H as o}from"./slot.js";import{o as i}from"./if-defined.js";import{l as s}from"./live.js";import{S as n,n as h}from"./solid-element.js";import{r as d}from"./state.js";import{e as p}from"./query.js";import{w as c}from"./watch.js";import{t as u}from"./classix.js";import{f as m}from"./form-control.styles.js";import"./directive.js";var f=Object.defineProperty,x=Object.getOwnPropertyDescriptor,y=(t,e,a,r)=>{for(var l,o=r>1?void 0:r?x(e,a):e,i=t.length-1;i>=0;i--)(l=t[i])&&(o=(r?l(e,a,o):l(o))||o);return r&&o&&f(e,a,o),o};let b=class extends n{constructor(){super(...arguments),this.formControlController=new l(this),this.hasSlotController=new o(this,"help-text","label"),this.hasFocus=!1,this.title="",this.name="",this.value="",this.size="lg",this.label="",this.helpText="",this.placeholder="",this.rows=4,this.disabled=!1,this.readonly=!1,this.form="",this.required=!1,this.spellcheck=!0,this.defaultValue=""}get validity(){return this.textarea.validity}get validationMessage(){return this.textarea.validationMessage}connectedCallback(){super.connectedCallback(),this.updateComplete.then((()=>{this.setTextareaHeight()}))}firstUpdated(){this.formControlController.updateValidity()}disconnectedCallback(){super.disconnectedCallback()}handleBlur(){this.hasFocus=!1,this.emit("sd-blur")}handleChange(){this.value=this.textarea.value,this.setTextareaHeight(),this.emit("sd-change")}handleFocus(){this.hasFocus=!0,this.emit("sd-focus")}handleInput(){this.value=this.textarea.value,this.formControlController.updateValidity(),this.emit("sd-1-34-0-input")}handleInvalid(t){this.formControlController.setValidity(!1),this.formControlController.emitInvalidEvent(t)}setTextareaHeight(){this.textarea.style.height=void 0}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}handleRowsChange(){this.setTextareaHeight()}async handleValueChange(){await this.updateComplete,this.formControlController.updateValidity(),this.setTextareaHeight()}focus(t){this.textarea.focus(t)}blur(){this.textarea.blur()}select(){this.textarea.select()}scrollPosition(t){return t?("number"==typeof t.top&&(this.textarea.scrollTop=t.top),void("number"==typeof t.left&&(this.textarea.scrollLeft=t.left))):{top:this.textarea.scrollTop,left:this.textarea.scrollTop}}setSelectionRange(t,e,a="none"){this.textarea.setSelectionRange(t,e,a)}setRangeText(t,e,a,r){this.textarea.setRangeText(t,e,a,r),this.value!==this.textarea.value&&(this.value=this.textarea.value),this.value!==this.textarea.value&&(this.value=this.textarea.value,this.setTextareaHeight())}checkValidity(){var t;return null==(t=this.textarea)?void 0:t.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.textarea.reportValidity()}setCustomValidity(t){this.textarea.setCustomValidity(t),this.formControlController.updateValidity()}render(){const e=this.hasSlotController.test("label"),a=this.hasSlotController.test("help-text"),r=!!this.label||!!e,l=!!this.helpText||!!a,o=this.required||!!this.minlength||!!this.maxlength,n=o&&!this.checkValidity(),h=o&&this.checkValidity(),d=this.disabled?"disabled":this.readonly?"readonly":this.hasFocus&&n?"activeInvalid":this.hasFocus&&h?"activeValid":this.hasFocus?"active":n?"invalid":h?"valid":"default",p="sm"===this.size?"text-sm":"text-base";return t`<div part="form-control" class="${u("form-control text-left",r&&"form-control--has-label",l&&"form-control--has-help-text",this.disabled&&"cursor-not-allowed")}"><label part="form-control-label" id="label" class="${u("form-control-label mb-2",r?"has-label inline-block":"hidden",p)}" for="input" aria-hidden="${r?"false":"true"}"><slot name="label">${this.label}</slot></label><div part="form-control-input" class="form-control-input relative w-full"><div part="border" class="${u("absolute w-full h-full pointer-events-none border rounded-default",{disabled:"border-neutral-500",readonly:"border-neutral-800",activeInvalid:"border-error border-2",activeValid:"border-success border-2",active:"border-primary border-2",invalid:"border-error",valid:"border-success",default:"border-neutral-800"}[d])}"></div><div part="base" class="${u("textarea px-4 flex flex-row items-center rounded-default textarea--resize-none",{sm:"textarea-sm py-1",md:"textarea-md py-1",lg:"textarea-lg py-2"}[this.size],{disabled:"text-neutral-500",readonly:"text-black",activeInvalid:"text-error",activeValid:"text-success",active:"text-black",invalid:"text-error",valid:"text-success",default:"text-black"}[d],this.disabled||this.readonly?"":"hover:bg-neutral-200",this.readonly&&"bg-neutral-100",n&&"form-control-input--invalid",!this.value&&"textarea--empty")}"><textarea part="textarea" id="input" class="${u('textarea__control flex-grow focus:outline-none bg-transparent placeholder-neutral-700"',p)}" title="${this.title}" name="${i(this.name)}" .value="${s(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" placeholder="${i(this.placeholder)}" minlength="${i(this.minlength)}" maxlength="${i(this.maxlength)}" rows="${i(this.rows)}" autocapitalize="${i(this.autocapitalize)}" autocorrect="${i(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${i(this.spellcheck)}" enterkeyhint="${i(this.enterkeyhint)}" inputmode="${i(this.inputmode)}" aria-describedby="help-text" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea></div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${u("text-sm text-neutral-700",l?"block":"hidden")}" aria-hidden="${l?"false":"true"}">${this.helpText}</slot></div>`}};b.styles=[m,n.styles,e`:host{display:block}:host([required]) #label.has-label::after{content:'*';margin-left:2px}:host([disabled]) .textarea__control{cursor:not-allowed}.no-scrollbar::-webkit-scrollbar{display:none}.textarea--resize-none .textarea__control{resize:none}`],y([p(".textarea__control")],b.prototype,"textarea",2),y([d()],b.prototype,"hasFocus",2),y([h()],b.prototype,"title",2),y([h()],b.prototype,"name",2),y([h()],b.prototype,"value",2),y([h({reflect:!0})],b.prototype,"size",2),y([h()],b.prototype,"label",2),y([h({attribute:"help-text"})],b.prototype,"helpText",2),y([h()],b.prototype,"placeholder",2),y([h({type:Number})],b.prototype,"rows",2),y([h({type:Boolean,reflect:!0})],b.prototype,"disabled",2),y([h({type:Boolean,reflect:!0})],b.prototype,"readonly",2),y([h({reflect:!0})],b.prototype,"form",2),y([h({type:Boolean,reflect:!0})],b.prototype,"required",2),y([h({type:Number})],b.prototype,"minlength",2),y([h({type:Number})],b.prototype,"maxlength",2),y([h()],b.prototype,"autocapitalize",2),y([h()],b.prototype,"autocorrect",2),y([h()],b.prototype,"autocomplete",2),y([h({type:Boolean})],b.prototype,"autofocus",2),y([h()],b.prototype,"enterkeyhint",2),y([h({type:Boolean,converter:{fromAttribute:t=>!(!t||"false"===t),toAttribute:t=>t?"true":"false"}})],b.prototype,"spellcheck",2),y([h()],b.prototype,"inputmode",2),y([r()],b.prototype,"defaultValue",2),y([c("disabled",{waitUntilFirstUpdate:!0})],b.prototype,"handleDisabledChange",1),y([c("rows",{waitUntilFirstUpdate:!0})],b.prototype,"handleRowsChange",1),y([c("value",{waitUntilFirstUpdate:!0})],b.prototype,"handleValueChange",1),b=y([a("sd-1-34-0-textarea")],b);export{b as default};
@@ -1,4 +1,4 @@
1
- import"./popup.js";import{c as t,s as e,a as s,w as i}from"./event.js";import{x as o,r as a,i as h}from"./lit-element.js";import{c as r}from"./register-custom-element.js";import{g as n,s as p}from"./animation-registry.js";import{L as d}from"./solid-components2.js";import{S as l,n as c}from"./solid-element.js";import{e as u}from"./query.js";import{w as m}from"./watch.js";import{t as y}from"./classix.js";import{I as w}from"./interactive.js";import"./component.styles.js";var v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,b=(t,e,s,i)=>{for(var o,a=i>1?void 0:i?f(e,s):e,h=t.length-1;h>=0;h--)(o=t[h])&&(a=(i?o(e,s,a):o(a))||a);return i&&a&&v(e,s,a),a};let g=class extends l{constructor(){super(...arguments),this.localize=new d(this),this.content="",this.placement="top",this.size="lg",this.disabled=!1,this.open=!1,this.trigger="click focus",this.hoist=!1}connectedCallback(){super.connectedCallback(),this.handleBlur=this.handleBlur.bind(this),this.handleClick=this.handleClick.bind(this),this.handleFocus=this.handleFocus.bind(this),this.handleKeyDown=this.handleKeyDown.bind(this),this.handleMouseOver=this.handleMouseOver.bind(this),this.handleMouseOut=this.handleMouseOut.bind(this),this.updateComplete.then((()=>{this.addEventListener("blur",this.handleBlur,!0),this.addEventListener("focus",this.handleFocus,!0),this.addEventListener("click",this.handleClick),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("mouseover",this.handleMouseOver),this.addEventListener("mouseout",this.handleMouseOut)}))}firstUpdated(){this.body.hidden=!this.open,this.open&&(this.popup.active=!0,this.popup.reposition())}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("blur",this.handleBlur,!0),this.removeEventListener("focus",this.handleFocus,!0),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("mouseover",this.handleMouseOver),this.removeEventListener("mouseout",this.handleMouseOut)}handleBlur(){this.hasTrigger("focus")&&this.hide()}handleClick(){this.hasTrigger("click")&&(this.open?this.hide():this.show())}handleFocus(){this.hasTrigger("focus")&&this.show()}handleKeyDown(t){this.open&&"Escape"===t.key&&(t.stopPropagation(),this.hide())}handleMouseOver(){if(this.hasTrigger("hover")){const e=t(getComputedStyle(this).getPropertyValue("--show-delay"));clearTimeout(this.hoverTimeout),this.hoverTimeout=window.setTimeout((()=>this.show()),e)}}handleMouseOut(){if(this.hasTrigger("hover")){const e=t(getComputedStyle(this).getPropertyValue("--hide-delay"));clearTimeout(this.hoverTimeout),this.hoverTimeout=window.setTimeout((()=>this.hide()),e)}}hasTrigger(t){return this.trigger.split(" ").includes(t)}async handleOpenChange(){if(this.open){if(this.disabled)return;this.emit("sd-show"),await e(this.body),this.body.hidden=!1,this.popup.active=!0;const{keyframes:t,options:i}=n(this,"tooltip.show",{dir:this.localize.dir()});await s(this.popup.popup,t,i),this.emit("sd-after-show")}else{this.emit("sd-hide"),await e(this.body);const{keyframes:t,options:i}=n(this,"tooltip.hide",{dir:this.localize.dir()});await s(this.popup.popup,t,i),this.popup.active=!1,this.body.hidden=!0,this.emit("sd-after-hide")}}async handleOptionsChange(){this.hasUpdated&&(await this.updateComplete,this.popup.reposition())}handleDisabledChange(){this.disabled&&this.open&&this.hide()}async show(){if(!this.open)return this.open=!0,i(this,"sd-after-show")}async hide(){if(this.open)return this.open=!1,i(this,"sd-after-hide")}render(){const t=this.placement.endsWith("-start"),e=this.placement.endsWith("-end");return o`<sd-1-33-0-popup part="base" exportparts="
1
+ import"./popup.js";import{c as t,s as e,a as s,w as i}from"./event.js";import{x as o,r as a,i as h}from"./lit-element.js";import{c as r}from"./register-custom-element.js";import{g as n,s as p}from"./animation-registry.js";import{L as d}from"./solid-components2.js";import{S as l,n as c}from"./solid-element.js";import{e as u}from"./query.js";import{w as m}from"./watch.js";import{t as y}from"./classix.js";import{I as w}from"./interactive.js";import"./component.styles.js";var v=Object.defineProperty,f=Object.getOwnPropertyDescriptor,b=(t,e,s,i)=>{for(var o,a=i>1?void 0:i?f(e,s):e,h=t.length-1;h>=0;h--)(o=t[h])&&(a=(i?o(e,s,a):o(a))||a);return i&&a&&v(e,s,a),a};let g=class extends l{constructor(){super(...arguments),this.localize=new d(this),this.content="",this.placement="top",this.size="lg",this.disabled=!1,this.open=!1,this.trigger="click focus",this.hoist=!1}connectedCallback(){super.connectedCallback(),this.handleBlur=this.handleBlur.bind(this),this.handleClick=this.handleClick.bind(this),this.handleFocus=this.handleFocus.bind(this),this.handleKeyDown=this.handleKeyDown.bind(this),this.handleMouseOver=this.handleMouseOver.bind(this),this.handleMouseOut=this.handleMouseOut.bind(this),this.updateComplete.then((()=>{this.addEventListener("blur",this.handleBlur,!0),this.addEventListener("focus",this.handleFocus,!0),this.addEventListener("click",this.handleClick),this.addEventListener("keydown",this.handleKeyDown),this.addEventListener("mouseover",this.handleMouseOver),this.addEventListener("mouseout",this.handleMouseOut)}))}firstUpdated(){this.body.hidden=!this.open,this.open&&(this.popup.active=!0,this.popup.reposition())}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("blur",this.handleBlur,!0),this.removeEventListener("focus",this.handleFocus,!0),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.handleKeyDown),this.removeEventListener("mouseover",this.handleMouseOver),this.removeEventListener("mouseout",this.handleMouseOut)}handleBlur(){this.hasTrigger("focus")&&this.hide()}handleClick(){this.hasTrigger("click")&&(this.open?this.hide():this.show())}handleFocus(){this.hasTrigger("focus")&&this.show()}handleKeyDown(t){this.open&&"Escape"===t.key&&(t.stopPropagation(),this.hide())}handleMouseOver(){if(this.hasTrigger("hover")){const e=t(getComputedStyle(this).getPropertyValue("--show-delay"));clearTimeout(this.hoverTimeout),this.hoverTimeout=window.setTimeout((()=>this.show()),e)}}handleMouseOut(){if(this.hasTrigger("hover")){const e=t(getComputedStyle(this).getPropertyValue("--hide-delay"));clearTimeout(this.hoverTimeout),this.hoverTimeout=window.setTimeout((()=>this.hide()),e)}}hasTrigger(t){return this.trigger.split(" ").includes(t)}async handleOpenChange(){if(this.open){if(this.disabled)return;this.emit("sd-show"),await e(this.body),this.body.hidden=!1,this.popup.active=!0;const{keyframes:t,options:i}=n(this,"tooltip.show",{dir:this.localize.dir()});await s(this.popup.popup,t,i),this.emit("sd-after-show")}else{this.emit("sd-hide"),await e(this.body);const{keyframes:t,options:i}=n(this,"tooltip.hide",{dir:this.localize.dir()});await s(this.popup.popup,t,i),this.popup.active=!1,this.body.hidden=!0,this.emit("sd-after-hide")}}async handleOptionsChange(){this.hasUpdated&&(await this.updateComplete,this.popup.reposition())}handleDisabledChange(){this.disabled&&this.open&&this.hide()}async show(){if(!this.open)return this.open=!0,i(this,"sd-after-show")}async hide(){if(this.open)return this.open=!1,i(this,"sd-after-hide")}render(){const t=this.placement.endsWith("-start"),e=this.placement.endsWith("-end");return o`<sd-1-34-0-popup part="base" exportparts="
2
2
  popup:base__popup,
3
3
  arrow:base__arrow
4
- " class="${y(this.open&&"tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{start:2,end:-2,default:0}[t?"start":e?"end":"default"]*("sm"===this.size?-1:1)}" strategy="${this.hoist?"fixed":"absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0"><slot slot="anchor" aria-describedby="tooltip" class="${y("lg"===this.size?"text-xl":"text-base")}"><button class="flex sd-interactive rounded-full"><sd-1-33-0-icon library="system" name="info-circle" class="${y(this.disabled&&"sd-interactive--disabled")}"></sd-1-33-0-icon></button></slot><slot name="content" part="body" id="tooltip" class="bg-primary text-white py-3 px-4 block rounded-none text-sm text-left" role="tooltip" aria-label="Tooltip" aria-live="${this.open?"polite":"off"}">${this.content}</slot></sd-1-33-0-popup>`}};g.styles=[l.styles,a(w),h`:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-1-33-0-popup{--arrow-color:rgb(var(--sd-color-primary, 0 53 142) / 1);--arrow-size:10px}sd-1-33-0-popup::part(popup){pointer-events:none;z-index:10;box-shadow:0 1px 3px 0 rgb(81 81 81 / 75%)}sd-1-33-0-popup::part(arrow){--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-1-33-0-popup[placement^=top]::part(popup){transform-origin:bottom}sd-1-33-0-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){overflow:auto;max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}`],b([u("slot:not([name])")],g.prototype,"defaultSlot",2),b([u("#tooltip")],g.prototype,"body",2),b([u("sd-1-33-0-popup")],g.prototype,"popup",2),b([c()],g.prototype,"content",2),b([c({reflect:!0})],g.prototype,"placement",2),b([c()],g.prototype,"size",2),b([c({type:Boolean,reflect:!0})],g.prototype,"disabled",2),b([c({type:Boolean,reflect:!0})],g.prototype,"open",2),b([c()],g.prototype,"trigger",2),b([c({type:Boolean})],g.prototype,"hoist",2),b([m("open",{waitUntilFirstUpdate:!0})],g.prototype,"handleOpenChange",1),b([m(["content","hoist","placement"])],g.prototype,"handleOptionsChange",1),b([m("disabled")],g.prototype,"handleDisabledChange",1),g=b([r("sd-1-33-0-tooltip")],g),p("tooltip.show",{keyframes:[{opacity:0,scale:.8},{opacity:1,scale:1}],options:{duration:150,easing:"ease"}}),p("tooltip.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.8}],options:{duration:150,easing:"ease"}});export{g as default};
4
+ " class="${y(this.open&&"tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{start:2,end:-2,default:0}[t?"start":e?"end":"default"]*("sm"===this.size?-1:1)}" strategy="${this.hoist?"fixed":"absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0"><slot slot="anchor" aria-describedby="tooltip" class="${y("lg"===this.size?"text-xl":"text-base")}"><button class="flex sd-interactive rounded-full"><sd-1-34-0-icon library="system" name="info-circle" class="${y(this.disabled&&"sd-interactive--disabled")}"></sd-1-34-0-icon></button></slot><slot name="content" part="body" id="tooltip" class="bg-primary text-white py-3 px-4 block rounded-none text-sm text-left" role="tooltip" aria-label="Tooltip" aria-live="${this.open?"polite":"off"}">${this.content}</slot></sd-1-34-0-popup>`}};g.styles=[l.styles,a(w),h`:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-1-34-0-popup{--arrow-color:rgb(var(--sd-color-primary, 0 53 142) / 1);--arrow-size:10px}sd-1-34-0-popup::part(popup){pointer-events:none;z-index:10;box-shadow:0 1px 3px 0 rgb(81 81 81 / 75%)}sd-1-34-0-popup::part(arrow){--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-1-34-0-popup[placement^=top]::part(popup){transform-origin:bottom}sd-1-34-0-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){overflow:auto;max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}`],b([u("slot:not([name])")],g.prototype,"defaultSlot",2),b([u("#tooltip")],g.prototype,"body",2),b([u("sd-1-34-0-popup")],g.prototype,"popup",2),b([c()],g.prototype,"content",2),b([c({reflect:!0})],g.prototype,"placement",2),b([c()],g.prototype,"size",2),b([c({type:Boolean,reflect:!0})],g.prototype,"disabled",2),b([c({type:Boolean,reflect:!0})],g.prototype,"open",2),b([c()],g.prototype,"trigger",2),b([c({type:Boolean})],g.prototype,"hoist",2),b([m("open",{waitUntilFirstUpdate:!0})],g.prototype,"handleOpenChange",1),b([m(["content","hoist","placement"])],g.prototype,"handleOptionsChange",1),b([m("disabled")],g.prototype,"handleDisabledChange",1),g=b([r("sd-1-34-0-tooltip")],g),p("tooltip.show",{keyframes:[{opacity:0,scale:.8},{opacity:1,scale:1}],options:{duration:150,easing:"ease"}}),p("tooltip.hide",{keyframes:[{opacity:1,scale:1},{opacity:0,scale:.8}],options:{duration:150,easing:"ease"}});export{g as default};
@@ -1 +1 @@
1
- import{x as t,i as e}from"./lit-element.js";import{c as s}from"./register-custom-element.js";import{H as o}from"./slot.js";import{S as i,n as l}from"./solid-element.js";import{e as a}from"./query.js";import{t as r}from"./classix.js";var n=Object.defineProperty,p=Object.getOwnPropertyDescriptor,h=(t,e,s,o)=>{for(var i,l=o>1?void 0:o?p(e,s):e,a=t.length-1;a>=0;a--)(i=t[a])&&(l=(o?i(e,s,l):i(l))||l);return o&&l&&n(e,s,l),l};let d=class extends i{constructor(){super(...arguments),this.playing=!1,this.overlay=!1,this.isBelowBreakpoint=!1,this.hasSlotController=new o(this,"[default]","play-icon","poster")}get poster(){const t=this.shadowRoot.querySelector("slot[name=poster]");return(null==t?void 0:t.assignedElements().length)>0?t.assignedElements()[0]:null}fadeoutPoster(){this.poster instanceof HTMLImageElement&&(this.poster.style.opacity="0")}hidePoster(){this.poster instanceof HTMLImageElement&&(this.poster.style.display="none")}play(){this.emit("sd-play"),this.playing=!0,this.fadeoutPoster()}handleKeydown(t){t instanceof KeyboardEvent&&("Enter"===t.key||" "===t.key)&&(this.play(),setTimeout((()=>{var t;null==(t=this.querySelector("video"))||t.focus()})))}handleButtonResize(){this.hostEl.clientWidth<=414&&!this.isBelowBreakpoint&&(this.isBelowBreakpoint=!0),this.hostEl.clientWidth>414&&this.isBelowBreakpoint&&(this.isBelowBreakpoint=!1)}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver((()=>this.handleButtonResize())),this.updateComplete.then((()=>{this.resizeObserver.observe(this.hostEl)}))}disconnectedCallback(){super.disconnectedCallback(),this.resizeObserver.unobserve(this.hostEl)}render(){return t`<div part="base" aria-label="Video Player" class="cursor-pointer"><button part="play-button" aria-label="Play video" tabindex="0" @click="${this.play}" @keydown="${this.handleKeydown}" class="${r(this.playing&&"pointer-events-none","w-full h-full absolute top-0 left-0 z-30 text-primary hover:text-primary-500 sd-interactive sd-interactive--reset focus-visible:focus-outline")}"><div part="play-button-bg" class="${r(this.playing?"opacity-0":"opacity-100",this.isBelowBreakpoint?"w-[48px] h-[48px]":"w-[96px] h-[96px]","absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 p-4 bg-white bg-opacity-75 rounded-full play-pause-transition")}"><slot name="play-icon" part="play-icon" class="${r(this.isBelowBreakpoint?"text-[2rem]":"text-[4rem]")}"><sd-1-33-0-icon id="default-play-icon" library="system" name="start"></sd-1-33-0-icon></slot></div></button> ${this.hasSlotController.test("poster")?t`<slot name="poster" role="presentation" @transitionend="${this.hidePoster}"></slot>`:null}<div part="overlay" id="overlay" role="presentation" class="${r(this.overlay&&!this.playing?"opacity-100":"opacity-0","bg-[rgba(0,0,0,0.65)] w-full h-full absolute top-0 left-0 pointer-events-none z-20 play-pause-transition")}"></div><slot></slot></div>`}};d.styles=[i.styles,e`:host{position:relative;display:inline-block;overflow:hidden}.play-pause-transition,::slotted([slot=poster]){transition:opacity .3s}::slotted([slot=poster]){position:absolute;left:0;top:0;width:100%;z-index:10}#default-play-icon,::slotted([slot=play-icon]){position:absolute;left:50%;top:50%;translate:-50% -50%}`],h([a("[part=base]")],d.prototype,"hostEl",2),h([l({type:Boolean,reflect:!0})],d.prototype,"playing",2),h([l({type:Boolean,reflect:!0})],d.prototype,"overlay",2),h([l({type:Boolean})],d.prototype,"isBelowBreakpoint",2),d=h([s("sd-1-33-0-video")],d);export{d as default};
1
+ import{x as t,i as e}from"./lit-element.js";import{c as s}from"./register-custom-element.js";import{H as o}from"./slot.js";import{S as i,n as l}from"./solid-element.js";import{e as a}from"./query.js";import{t as r}from"./classix.js";var n=Object.defineProperty,p=Object.getOwnPropertyDescriptor,h=(t,e,s,o)=>{for(var i,l=o>1?void 0:o?p(e,s):e,a=t.length-1;a>=0;a--)(i=t[a])&&(l=(o?i(e,s,l):i(l))||l);return o&&l&&n(e,s,l),l};let d=class extends i{constructor(){super(...arguments),this.playing=!1,this.overlay=!1,this.isBelowBreakpoint=!1,this.hasSlotController=new o(this,"[default]","play-icon","poster")}get poster(){const t=this.shadowRoot.querySelector("slot[name=poster]");return(null==t?void 0:t.assignedElements().length)>0?t.assignedElements()[0]:null}fadeoutPoster(){this.poster instanceof HTMLImageElement&&(this.poster.style.opacity="0")}hidePoster(){this.poster instanceof HTMLImageElement&&(this.poster.style.display="none")}play(){this.emit("sd-play"),this.playing=!0,this.fadeoutPoster()}handleKeydown(t){t instanceof KeyboardEvent&&("Enter"===t.key||" "===t.key)&&(this.play(),setTimeout((()=>{var t;null==(t=this.querySelector("video"))||t.focus()})))}handleButtonResize(){this.hostEl.clientWidth<=414&&!this.isBelowBreakpoint&&(this.isBelowBreakpoint=!0),this.hostEl.clientWidth>414&&this.isBelowBreakpoint&&(this.isBelowBreakpoint=!1)}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver((()=>this.handleButtonResize())),this.updateComplete.then((()=>{this.resizeObserver.observe(this.hostEl)}))}disconnectedCallback(){super.disconnectedCallback(),this.resizeObserver.unobserve(this.hostEl)}render(){return t`<div part="base" aria-label="Video Player" class="cursor-pointer"><button part="play-button" aria-label="Play video" tabindex="0" @click="${this.play}" @keydown="${this.handleKeydown}" class="${r(this.playing&&"pointer-events-none","w-full h-full absolute top-0 left-0 z-30 text-primary hover:text-primary-500 sd-interactive sd-interactive--reset focus-visible:focus-outline")}"><div part="play-button-bg" class="${r(this.playing?"opacity-0":"opacity-100",this.isBelowBreakpoint?"w-[48px] h-[48px]":"w-[96px] h-[96px]","absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 p-4 bg-white bg-opacity-75 rounded-full play-pause-transition")}"><slot name="play-icon" part="play-icon" class="${r(this.isBelowBreakpoint?"text-[2rem]":"text-[4rem]")}"><sd-1-34-0-icon id="default-play-icon" library="system" name="start"></sd-1-34-0-icon></slot></div></button> ${this.hasSlotController.test("poster")?t`<slot name="poster" role="presentation" @transitionend="${this.hidePoster}"></slot>`:null}<div part="overlay" id="overlay" role="presentation" class="${r(this.overlay&&!this.playing?"opacity-100":"opacity-0","bg-[rgba(0,0,0,0.65)] w-full h-full absolute top-0 left-0 pointer-events-none z-20 play-pause-transition")}"></div><slot></slot></div>`}};d.styles=[i.styles,e`:host{position:relative;display:inline-block;overflow:hidden}.play-pause-transition,::slotted([slot=poster]){transition:opacity .3s}::slotted([slot=poster]){position:absolute;left:0;top:0;width:100%;z-index:10}#default-play-icon,::slotted([slot=play-icon]){position:absolute;left:50%;top:50%;translate:-50% -50%}`],h([a("[part=base]")],d.prototype,"hostEl",2),h([l({type:Boolean,reflect:!0})],d.prototype,"playing",2),h([l({type:Boolean,reflect:!0})],d.prototype,"overlay",2),h([l({type:Boolean})],d.prototype,"isBelowBreakpoint",2),d=h([s("sd-1-34-0-video")],d);export{d as default};
@@ -14,6 +14,6 @@ export default class SdButtonGroup extends SolidElement {
14
14
  }
15
15
  declare global {
16
16
  interface HTMLElementTagNameMap {
17
- 'sd-1-33-0-button-group': SdButtonGroup;
17
+ 'sd-1-34-0-button-group': SdButtonGroup;
18
18
  }
19
19
  }
@@ -22,19 +22,19 @@ let SdButtonGroup = class extends SolidElement {
22
22
  }
23
23
  handleFocus(event) {
24
24
  const button = findButton(event.target);
25
- button == null ? void 0 : button.classList.add("sd-1-33-0-button-group__button--focus");
25
+ button == null ? void 0 : button.classList.add("sd-1-34-0-button-group__button--focus");
26
26
  }
27
27
  handleBlur(event) {
28
28
  const button = findButton(event.target);
29
- button == null ? void 0 : button.classList.remove("sd-1-33-0-button-group__button--focus");
29
+ button == null ? void 0 : button.classList.remove("sd-1-34-0-button-group__button--focus");
30
30
  }
31
31
  handleMouseOver(event) {
32
32
  const button = findButton(event.target);
33
- button == null ? void 0 : button.classList.add("sd-1-33-0-button-group__button--hover");
33
+ button == null ? void 0 : button.classList.add("sd-1-34-0-button-group__button--hover");
34
34
  }
35
35
  handleMouseOut(event) {
36
36
  const button = findButton(event.target);
37
- button == null ? void 0 : button.classList.remove("sd-1-33-0-button-group__button--hover");
37
+ button == null ? void 0 : button.classList.remove("sd-1-34-0-button-group__button--hover");
38
38
  }
39
39
  handleSlotChange() {
40
40
  const slottedElements = [...this.defaultSlot.assignedElements({ flatten: true })];
@@ -42,11 +42,11 @@ let SdButtonGroup = class extends SolidElement {
42
42
  const index = slottedElements.indexOf(el);
43
43
  const button = findButton(el);
44
44
  if (button !== null) {
45
- button.classList.add("sd-1-33-0-button-group__button");
46
- button.classList.toggle("sd-1-33-0-button-group__button--first", index === 0);
47
- button.classList.toggle("sd-1-33-0-button-group__button--inner", index > 0 && index < slottedElements.length - 1);
48
- button.classList.toggle("sd-1-33-0-button-group__button--last", index === slottedElements.length - 1);
49
- button.classList.toggle("sd-1-33-0-button-group__button--radio", button.tagName.toLowerCase() === "sd-1-33-0-radio-button");
45
+ button.classList.add("sd-1-34-0-button-group__button");
46
+ button.classList.toggle("sd-1-34-0-button-group__button--first", index === 0);
47
+ button.classList.toggle("sd-1-34-0-button-group__button--inner", index > 0 && index < slottedElements.length - 1);
48
+ button.classList.toggle("sd-1-34-0-button-group__button--last", index === slottedElements.length - 1);
49
+ button.classList.toggle("sd-1-34-0-button-group__button--radio", button.tagName.toLowerCase() === "sd-1-34-0-radio-button");
50
50
  }
51
51
  });
52
52
  }
@@ -65,10 +65,10 @@ __decorateClass([
65
65
  property()
66
66
  ], SdButtonGroup.prototype, "label", 2);
67
67
  SdButtonGroup = __decorateClass([
68
- customElement("sd-1-33-0-button-group")
68
+ customElement("sd-1-34-0-button-group")
69
69
  ], SdButtonGroup);
70
70
  function findButton(el) {
71
- const selector = "sd-1-33-0-button, sd-1-33-0-radio-button";
71
+ const selector = "sd-1-34-0-button, sd-1-34-0-radio-button";
72
72
  return el.closest(selector) ?? el.querySelector(selector);
73
73
  }
74
74
  export {
@@ -18,6 +18,6 @@ export default class SdAccordion extends SolidElement {
18
18
  }
19
19
  declare global {
20
20
  interface HTMLElementTagNameMap {
21
- 'sd-1-33-0-accordion': SdAccordion;
21
+ 'sd-1-34-0-accordion': SdAccordion;
22
22
  }
23
23
  }
@@ -108,7 +108,7 @@ let SdAccordion = class extends SolidElement {
108
108
  )}"></div><slot name="summary" part="summary" class="flex flex-auto items-center text-left">${this.summary}</slot><span part="summary-icon" class="${cx(
109
109
  "flex flex-grow-0 flex-shrink-0 flex-auto items-center transition-all ease-in-out duration-300 text-xl",
110
110
  this.open && "rotate-180"
111
- )}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-1-33-0-icon library="system" name="chevron-down"></sd-1-33-0-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-1-33-0-icon library="system" name="chevron-down"></sd-1-33-0-icon></slot></span></header><div part="content" id="content" class="overflow-hidden"><slot part="content__slot" class="block px-4 py-6" role="region" aria-labelledby="header"></slot></div></div>`;
111
+ )}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-1-34-0-icon library="system" name="chevron-down"></sd-1-34-0-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-1-34-0-icon library="system" name="chevron-down"></sd-1-34-0-icon></slot></span></header><div part="content" id="content" class="overflow-hidden"><slot part="content__slot" class="block px-4 py-6" role="region" aria-labelledby="header"></slot></div></div>`;
112
112
  }
113
113
  };
114
114
  SdAccordion.styles = [
@@ -134,7 +134,7 @@ __decorateClass([
134
134
  watch("open", { waitUntilFirstUpdate: true })
135
135
  ], SdAccordion.prototype, "handleOpenChange", 1);
136
136
  SdAccordion = __decorateClass([
137
- customElement("sd-1-33-0-accordion")
137
+ customElement("sd-1-34-0-accordion")
138
138
  ], SdAccordion);
139
139
  setDefaultAnimation("accordion.show", {
140
140
  keyframes: [
@@ -11,6 +11,6 @@ export default class SdAccordionGroup extends SolidElement {
11
11
  }
12
12
  declare global {
13
13
  interface HTMLElementTagNameMap {
14
- 'sd-1-33-0-accordion-group': SdAccordionGroup;
14
+ 'sd-1-34-0-accordion-group': SdAccordionGroup;
15
15
  }
16
16
  }
@@ -48,16 +48,16 @@ let SdAccordionGroup = class extends SolidElement {
48
48
  SdAccordionGroup.styles = [
49
49
  componentStyles,
50
50
  SolidElement.styles,
51
- css`:host{display:block}::slotted(sd-1-33-0-accordion:not(:first-of-type)){margin-top:-1px}`
51
+ css`:host{display:block}::slotted(sd-1-34-0-accordion:not(:first-of-type)){margin-top:-1px}`
52
52
  ];
53
53
  __decorateClass([
54
- queryAssignedElements({ selector: "sd-1-33-0-accordion" })
54
+ queryAssignedElements({ selector: "sd-1-34-0-accordion" })
55
55
  ], SdAccordionGroup.prototype, "_accordionsInDefaultSlot", 2);
56
56
  __decorateClass([
57
57
  property({ attribute: "close-others", type: Boolean })
58
58
  ], SdAccordionGroup.prototype, "closeOthers", 2);
59
59
  SdAccordionGroup = __decorateClass([
60
- customElement("sd-1-33-0-accordion-group")
60
+ customElement("sd-1-34-0-accordion-group")
61
61
  ], SdAccordionGroup);
62
62
  export {
63
63
  SdAccordionGroup as default
@@ -8,6 +8,6 @@ export default class SdBadge extends SolidElement {
8
8
  }
9
9
  declare global {
10
10
  interface HTMLElementTagNameMap {
11
- 'sd-1-33-0-badge': SdBadge;
11
+ 'sd-1-34-0-badge': SdBadge;
12
12
  }
13
13
  }
@@ -53,7 +53,7 @@ __decorateClass([
53
53
  property({ type: Boolean, reflect: true })
54
54
  ], SdBadge.prototype, "inverted", 2);
55
55
  SdBadge = __decorateClass([
56
- customElement("sd-1-33-0-badge")
56
+ customElement("sd-1-34-0-badge")
57
57
  ], SdBadge);
58
58
  export {
59
59
  SdBadge as default
@@ -22,6 +22,6 @@ export default class SdBrandshape extends SolidElement {
22
22
  }
23
23
  declare global {
24
24
  interface HTMLElementTagNameMap {
25
- 'sd-1-33-0-brandshape': SdBrandshape;
25
+ 'sd-1-34-0-brandshape': SdBrandshape;
26
26
  }
27
27
  }
@@ -123,7 +123,7 @@ __decorateClass([
123
123
  state()
124
124
  ], SdBrandshape.prototype, "componentBreakpoint", 2);
125
125
  SdBrandshape = __decorateClass([
126
- customElement("sd-1-33-0-brandshape")
126
+ customElement("sd-1-34-0-brandshape")
127
127
  ], SdBrandshape);
128
128
  export {
129
129
  SdBrandshape as default
@@ -47,6 +47,6 @@ export default class SdButton extends SolidElement implements SolidFormControl {
47
47
  }
48
48
  declare global {
49
49
  interface HTMLElementTagNameMap {
50
- 'sd-1-33-0-button': SdButton;
50
+ 'sd-1-34-0-button': SdButton;
51
51
  }
52
52
  }
@@ -213,19 +213,19 @@ let SdButton = class extends SolidElement {
213
213
  md: "ml-2",
214
214
  lg: "ml-2"
215
215
  }[this.size]
216
- )}"></slot>${this.loading ? html`<sd-1-33-0-spinner class="${cx("absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2")}"></sd-1-33-0-spinner>` : ""}</${tag}>`;
216
+ )}"></slot>${this.loading ? html`<sd-1-34-0-spinner class="${cx("absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2")}"></sd-1-34-0-spinner>` : ""}</${tag}>`;
217
217
  }
218
218
  };
219
219
  SdButton.styles = [
220
220
  componentStyles,
221
221
  SolidElement.styles,
222
- css`:host{display:inline-block;position:relative;width:auto;cursor:pointer}sd-1-33-0-spinner{--indicator-color:currentColor;--track-color:var(--tw-varcolor-200)}::slotted(sd-1-33-0-badge){position:absolute;top:0;right:0;translate:50% -50%;pointer-events:none}::slotted(sd-1-33-0-icon),sd-1-33-0-spinner{font-size:calc(var(--tw-varspacing)/ 2)}`
222
+ css`:host{display:inline-block;position:relative;width:auto;cursor:pointer}sd-1-34-0-spinner{--indicator-color:currentColor;--track-color:var(--tw-varcolor-200)}::slotted(sd-1-34-0-badge){position:absolute;top:0;right:0;translate:50% -50%;pointer-events:none}::slotted(sd-1-34-0-icon),sd-1-34-0-spinner{font-size:calc(var(--tw-varspacing)/ 2)}`
223
223
  ];
224
224
  __decorateClass([
225
225
  query("a, button")
226
226
  ], SdButton.prototype, "button", 2);
227
227
  __decorateClass([
228
- queryAssignedElements({ selector: "sd-1-33-0-icon" })
228
+ queryAssignedElements({ selector: "sd-1-34-0-icon" })
229
229
  ], SdButton.prototype, "_iconsInDefaultSlot", 2);
230
230
  __decorateClass([
231
231
  state()
@@ -288,7 +288,7 @@ __decorateClass([
288
288
  watch("disabled", { waitUntilFirstUpdate: true })
289
289
  ], SdButton.prototype, "handleDisabledChange", 1);
290
290
  SdButton = __decorateClass([
291
- customElement("sd-1-33-0-button")
291
+ customElement("sd-1-34-0-button")
292
292
  ], SdButton);
293
293
  export {
294
294
  SdButton as default
@@ -41,6 +41,6 @@ export default class SdCarousel extends SolidElement {
41
41
  }
42
42
  declare global {
43
43
  interface HTMLElementTagNameMap {
44
- 'sd-1-33-0-carousel': SdCarousel;
44
+ 'sd-1-34-0-carousel': SdCarousel;
45
45
  }
46
46
  }
@@ -39,7 +39,7 @@ let SdCarousel = class extends SolidElement {
39
39
  this.pausedAutoplay = false;
40
40
  this.autoplayController = new AutoplayController(this, () => this.next());
41
41
  this.scrollController = new ScrollController(this);
42
- this.slides = this.getElementsByTagName("sd-1-33-0-carousel-item");
42
+ this.slides = this.getElementsByTagName("sd-1-34-0-carousel-item");
43
43
  this.intersectionObserverEntries = /* @__PURE__ */ new Map();
44
44
  this.localize = new LocalizeController(this);
45
45
  this.handleSlotChange = (mutations) => {
@@ -276,7 +276,7 @@ let SdCarousel = class extends SolidElement {
276
276
  "!mr-6 !rounded-sm sd-interactive",
277
277
  !prevEnabled && "sd-interactive--disabled",
278
278
  this.inverted ? "sd-interactive--inverted" : "sd-interactive--reset"
279
- )}" aria-label="${this.localize.term("previousSlide")}" aria-controls="scroll-container" aria-disabled="${prevEnabled ? "false" : "true"}" @click="${prevEnabled ? () => this.previous() : null}"><slot name="previous-icon"><sd-1-33-0-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="system" name="${isLtr ? "chevron-down" : "chevron-up"}"></sd-1-33-0-icon></slot></button> ${this.variant === "dot" ? html`<div part="pagination-dot" role="tablist" class="${cx("carousel__pagination dot flex wrap items-center gap-2")}" aria-controls="scroll-container">${map(range(pagesCount), (index) => {
279
+ )}" aria-label="${this.localize.term("previousSlide")}" aria-controls="scroll-container" aria-disabled="${prevEnabled ? "false" : "true"}" @click="${prevEnabled ? () => this.previous() : null}"><slot name="previous-icon"><sd-1-34-0-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="system" name="${isLtr ? "chevron-down" : "chevron-up"}"></sd-1-34-0-icon></slot></button> ${this.variant === "dot" ? html`<div part="pagination-dot" role="tablist" class="${cx("carousel__pagination dot flex wrap items-center gap-2")}" aria-controls="scroll-container">${map(range(pagesCount), (index) => {
280
280
  const isActive = index === currentPage;
281
281
  return html`<button part="pagination-item ${isActive ? "pagination-item--active" : ""}" class="${cx(
282
282
  "carousel__pagination-item",
@@ -296,18 +296,18 @@ let SdCarousel = class extends SolidElement {
296
296
  )}" aria-label="${this.localize.term("nextSlide")}" aria-controls="scroll-container" aria-disabled="${nextEnabled ? "false" : "true"}" @click="${nextEnabled ? () => {
297
297
  console.log("click-next");
298
298
  this.next();
299
- } : null}"><slot name="next-icon"><sd-1-33-0-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="system" name="${isLtr ? "chevron-up" : "chevron-down"}"></sd-1-33-0-icon></slot></button></div><button class="${cx(
299
+ } : null}"><slot name="next-icon"><sd-1-34-0-icon class="${cx("h-6 w-6 rotate-90 grid place-items-center")}" library="system" name="${isLtr ? "chevron-up" : "chevron-down"}"></sd-1-34-0-icon></slot></button></div><button class="${cx(
300
300
  "ml-6 !rounded-sm",
301
301
  "!absolute !right-0 sd-interactive",
302
302
  this.inverted ? "sd-interactive--inverted" : "sd-interactive--reset",
303
303
  !this.autoplay && "!hidden"
304
- )}" part="autoplay-controls" @click="${() => this.pausedAutoplay = !this.pausedAutoplay}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-1-33-0-icon class="h-6 w-6 grid place-items-center" library="system" name="start"></sd-1-33-0-icon></slot><slot name="autoplay-pause" class="${cx(this.pausedAutoplay ? "hidden" : "")}"><sd-1-33-0-icon class="h-6 w-6 grid place-items-center" library="system" name="pause"></sd-1-33-0-icon></slot></button></div></div>`;
304
+ )}" part="autoplay-controls" @click="${() => this.pausedAutoplay = !this.pausedAutoplay}"><slot name="autoplay-start" class="${cx(!this.pausedAutoplay ? "hidden" : "")}"><sd-1-34-0-icon class="h-6 w-6 grid place-items-center" library="system" name="start"></sd-1-34-0-icon></slot><slot name="autoplay-pause" class="${cx(this.pausedAutoplay ? "hidden" : "")}"><sd-1-34-0-icon class="h-6 w-6 grid place-items-center" library="system" name="pause"></sd-1-34-0-icon></slot></button></div></div>`;
305
305
  }
306
306
  };
307
307
  SdCarousel.styles = [
308
308
  SolidElement.styles,
309
309
  unsafeCSS(InteractiveStyles),
310
- css`${componentStyles}:host{--slide-gap:var(--sl-spacing-medium, 1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:'. slides .' '. pagination .'}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));grid-auto-columns:var(--slide-size);column-gap:var(--slide-gap);scroll-padding-inline:var(--scroll-hint);padding-inline:var(--scroll-hint)}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__slides--dragging,.carousel__slides--dropping{scroll-snap-type:unset}.carousel__slides::-webkit-scrollbar{display:none}.carousel__navigation{grid-area:navigation}sd-1-33-0-button::part(label){display:flex;flex:1 1 auto;align-items:center;pointer-events:none}`
310
+ css`${componentStyles}:host{--slide-gap:var(--sl-spacing-medium, 1rem);--scroll-hint:0px;display:flex}.carousel{grid-template-areas:'. slides .' '. pagination .'}.carousel__pagination{grid-area:pagination}.carousel__slides{grid-area:slides;scrollbar-width:none;--slide-size:calc((100% - (var(--slides-per-page) - 1) * var(--slide-gap)) / var(--slides-per-page));grid-auto-columns:var(--slide-size);column-gap:var(--slide-gap);scroll-padding-inline:var(--scroll-hint);padding-inline:var(--scroll-hint)}@media (prefers-reduced-motion){:where(.carousel__slides){scroll-behavior:auto}}.carousel__slides--dragging,.carousel__slides--dropping{scroll-snap-type:unset}.carousel__slides::-webkit-scrollbar{display:none}.carousel__navigation{grid-area:navigation}sd-1-34-0-button::part(label){display:flex;flex:1 1 auto;align-items:center;pointer-events:none}`
311
311
  ];
312
312
  __decorateClass([
313
313
  property({ type: String, reflect: true })
@@ -359,7 +359,7 @@ __decorateClass([
359
359
  watch("autoplay")
360
360
  ], SdCarousel.prototype, "handleAutoplayChange", 1);
361
361
  SdCarousel = __decorateClass([
362
- customElement("sd-1-33-0-carousel")
362
+ customElement("sd-1-34-0-carousel")
363
363
  ], SdCarousel);
364
364
  export {
365
365
  SdCarousel as default
@@ -7,6 +7,6 @@ export default class SdCarouselItem extends SolidElement {
7
7
  }
8
8
  declare global {
9
9
  interface HTMLElementTagNameMap {
10
- 'sd-1-33-0-carousel-item': SdCarouselItem;
10
+ 'sd-1-34-0-carousel-item': SdCarouselItem;
11
11
  }
12
12
  }
@@ -30,7 +30,7 @@ SdCarouselItem.styles = [
30
30
  css`${componentStyles}:host{display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%;height:100%;aspect-ratio:var(--aspect-ratio);scroll-snap-align:start;scroll-snap-stop:always}::slotted(img){width:100%;height:100%;object-fit:cover}`
31
31
  ];
32
32
  SdCarouselItem = __decorateClass([
33
- customElement("sd-1-33-0-carousel-item")
33
+ customElement("sd-1-34-0-carousel-item")
34
34
  ], SdCarouselItem);
35
35
  export {
36
36
  SdCarouselItem as default
@@ -35,6 +35,6 @@ export default class SdCheckbox extends SolidElement implements SolidFormControl
35
35
  }
36
36
  declare global {
37
37
  interface HTMLElementTagNameMap {
38
- 'sd-1-33-0-checkbox': SdCheckbox;
38
+ 'sd-1-34-0-checkbox': SdCheckbox;
39
39
  }
40
40
  }
@@ -54,7 +54,7 @@ let SdCheckbox = class extends SolidElement {
54
54
  this.emit("sd-blur");
55
55
  }
56
56
  handleInput() {
57
- this.emit("sd-1-33-0-input");
57
+ this.emit("sd-1-34-0-input");
58
58
  }
59
59
  handleInvalid(event) {
60
60
  this.formControlController.setValidity(false);
@@ -106,7 +106,7 @@ let SdCheckbox = class extends SolidElement {
106
106
  }
107
107
  render() {
108
108
  return html`<label part="base" class="${cx(
109
- "sd-1-33-0-checkbox group flex items-start text-base leading-normal text-black cursor-pointer",
109
+ "sd-1-34-0-checkbox group flex items-start text-base leading-normal text-black cursor-pointer",
110
110
  this.disabled && "hover:cursor-not-allowed",
111
111
  {
112
112
  /* sizes, fonts */
@@ -122,7 +122,7 @@ let SdCheckbox = class extends SolidElement {
122
122
  lg: "mt-[3px]"
123
123
  }[this.size],
124
124
  this.disabled && this.indeterminate && "border-neutral-500 bg-neutral-500" || this.disabled && this.checked && "border-neutral-500 bg-neutral-500" || this.disabled && "border-neutral-500" || (this.checked || this.indeterminate) && "border-accent hover:border-accent-550 group-hover:border-accent-550 bg-accent group-hover:bg-accent-550" || "border-neutral-800 hover:bg-neutral-200 group-hover:bg-neutral-200 bg-white"
125
- )}">${this.checked ? html`<sd-1-33-0-icon part="checked-icon" class="text-white w-3 h-3" library="system" name="status-hook"></sd-1-33-0-icon>` : ""} ${!this.checked && this.indeterminate ? html`<sd-1-33-0-icon part="indeterminate-icon" class="text-white w-3 h-3" library="system" name="status-minus"></sd-1-33-0-icon>` : ""} </span><span part="label" id="label" class="${cx(
125
+ )}">${this.checked ? html`<sd-1-34-0-icon part="checked-icon" class="text-white w-3 h-3" library="system" name="status-hook"></sd-1-34-0-icon>` : ""} ${!this.checked && this.indeterminate ? html`<sd-1-34-0-icon part="indeterminate-icon" class="text-white w-3 h-3" library="system" name="status-minus"></sd-1-34-0-icon>` : ""} </span><span part="label" id="label" class="${cx(
126
126
  "select-none inline-block ml-2 text-black",
127
127
  this.disabled && "text-neutral-500" || "text-neutral-800"
128
128
  )}"><slot></slot></span></label>`;
@@ -172,7 +172,7 @@ __decorateClass([
172
172
  watch(["checked", "indeterminate"], { waitUntilFirstUpdate: true })
173
173
  ], SdCheckbox.prototype, "handleStateChange", 1);
174
174
  SdCheckbox = __decorateClass([
175
- customElement("sd-1-33-0-checkbox")
175
+ customElement("sd-1-34-0-checkbox")
176
176
  ], SdCheckbox);
177
177
  export {
178
178
  SdCheckbox as default
@@ -15,6 +15,6 @@ export default class SdCheckboxGroup extends SolidElement {
15
15
  }
16
16
  declare global {
17
17
  interface HTMLElementTagNameMap {
18
- 'sd-1-33-0-checkbox-group': SdCheckboxGroup;
18
+ 'sd-1-34-0-checkbox-group': SdCheckboxGroup;
19
19
  }
20
20
  }
@@ -27,7 +27,7 @@ let SdCheckboxGroup = class extends SolidElement {
27
27
  this.orientation = "vertical";
28
28
  }
29
29
  getAllCheckboxes() {
30
- return [...this.querySelectorAll("sd-1-33-0-checkbox")];
30
+ return [...this.querySelectorAll("sd-1-34-0-checkbox")];
31
31
  }
32
32
  async syncCheckboxElements() {
33
33
  const checkboxes = this.getAllCheckboxes();
@@ -43,10 +43,10 @@ let SdCheckboxGroup = class extends SolidElement {
43
43
  }
44
44
  }
45
45
  syncCheckboxes() {
46
- if (customElements.get("sd-1-33-0-checkbox")) {
46
+ if (customElements.get("sd-1-34-0-checkbox")) {
47
47
  this.syncCheckboxElements();
48
48
  } else {
49
- customElements.whenDefined("sd-1-33-0-checkbox").then(() => this.syncCheckboxes());
49
+ customElements.whenDefined("sd-1-34-0-checkbox").then(() => this.syncCheckboxes());
50
50
  }
51
51
  }
52
52
  handleSizeChange() {
@@ -77,7 +77,7 @@ let SdCheckboxGroup = class extends SolidElement {
77
77
  SdCheckboxGroup.styles = [
78
78
  componentStyles,
79
79
  SolidElement.styles,
80
- css`:host{display:block}:host([orientation=vertical]) ::slotted(sd-1-33-0-checkbox){margin-bottom:8px;display:flex}:host([orientation=vertical]) ::slotted(sd-1-33-0-checkbox:last-of-type){margin-bottom:0}:host([orientation=horizontal]) ::slotted(sd-1-33-0-checkbox){margin-right:24px}:host([size=sm]):host([orientation=horizontal]) ::slotted(sd-1-33-0-checkbox){margin-right:16px}:host([orientation=horizontal]) ::slotted(sd-1-33-0-checkbox:last-of-type){margin-right:0}`
80
+ css`:host{display:block}:host([orientation=vertical]) ::slotted(sd-1-34-0-checkbox){margin-bottom:8px;display:flex}:host([orientation=vertical]) ::slotted(sd-1-34-0-checkbox:last-of-type){margin-bottom:0}:host([orientation=horizontal]) ::slotted(sd-1-34-0-checkbox){margin-right:24px}:host([size=sm]):host([orientation=horizontal]) ::slotted(sd-1-34-0-checkbox){margin-right:16px}:host([orientation=horizontal]) ::slotted(sd-1-34-0-checkbox:last-of-type){margin-right:0}`
81
81
  ];
82
82
  __decorateClass([
83
83
  property()
@@ -95,7 +95,7 @@ __decorateClass([
95
95
  watch("invalid", { waitUntilFirstUpdate: true })
96
96
  ], SdCheckboxGroup.prototype, "handleInvalid", 1);
97
97
  SdCheckboxGroup = __decorateClass([
98
- customElement("sd-1-33-0-checkbox-group")
98
+ customElement("sd-1-34-0-checkbox-group")
99
99
  ], SdCheckboxGroup);
100
100
  export {
101
101
  SdCheckboxGroup as default
@@ -8,6 +8,6 @@ export default class SdDivider extends SolidElement {
8
8
  }
9
9
  declare global {
10
10
  interface HTMLElementTagNameMap {
11
- 'sd-1-33-0-divider': SdDivider;
11
+ 'sd-1-34-0-divider': SdDivider;
12
12
  }
13
13
  }
@@ -35,7 +35,7 @@ let SdDivider = class extends SolidElement {
35
35
  SdDivider.styles = [
36
36
  componentStyles,
37
37
  SolidElement.styles,
38
- css`:host{margin:0}:host(sd-1-33-0-divider[orientation=horizontal]){display:block}:host(sd-1-33-0-divider[orientation=vertical]){display:inline-block}`
38
+ css`:host{margin:0}:host(sd-1-34-0-divider[orientation=horizontal]){display:block}:host(sd-1-34-0-divider[orientation=vertical]){display:inline-block}`
39
39
  ];
40
40
  __decorateClass([
41
41
  property({ reflect: true })
@@ -44,7 +44,7 @@ __decorateClass([
44
44
  property({ type: Boolean, reflect: true })
45
45
  ], SdDivider.prototype, "inverted", 2);
46
46
  SdDivider = __decorateClass([
47
- customElement("sd-1-33-0-divider")
47
+ customElement("sd-1-34-0-divider")
48
48
  ], SdDivider);
49
49
  export {
50
50
  SdDivider as default
@@ -29,6 +29,6 @@ export default class SdDrawer extends SolidElement {
29
29
  }
30
30
  declare global {
31
31
  interface HTMLElementTagNameMap {
32
- 'sd-1-33-0-drawer': SdDrawer;
32
+ 'sd-1-34-0-drawer': SdDrawer;
33
33
  }
34
34
  }
@@ -183,7 +183,7 @@ let SdDrawer = class extends SolidElement {
183
183
  end: "top-0 end-0 bottom-auto start-auto w-[--width] h-full",
184
184
  start: "top-0 end-auto bottom-auto start-0 w-[--width] h-full"
185
185
  }[this.placement]
186
- )}" role="dialog" aria-modal="true" aria-hidden="${this.open ? "false" : "true"}" aria-label="${this.label}" aria-labelledby="${ifDefined(!this.noHeader ? "title" : void 0)}" tabindex="0">${!this.noHeader ? html`<header part="header" class="flex justify-between py-2 px-4 items-center flex-shrink-0" style="min-height:56px"><div part="title"><slot name="header" part="title" class="flex-auto text-xl m-0" id="title"></slot></div><div class="shrink-0 flex flex-wrap justify-end gap-1 ml-4 absolute top-2 right-2"><sd-1-33-0-button variant="tertiary" size="lg" part="close-button" @click="${() => this.requestClose("close-button")}"><sd-1-33-0-icon name="close" library="system"></sd-1-33-0-icon></sd-1-33-0-button></div></header>` : ""}<div part="body" class="flex-auto block px-4"><slot></slot></div><footer part="footer" class="${cx(this.hasSlotController.test("footer") ? "text-left p-4" : "hidden")}"><slot name="footer"></slot></footer></div></div>`;
186
+ )}" role="dialog" aria-modal="true" aria-hidden="${this.open ? "false" : "true"}" aria-label="${this.label}" aria-labelledby="${ifDefined(!this.noHeader ? "title" : void 0)}" tabindex="0">${!this.noHeader ? html`<header part="header" class="flex justify-between py-2 px-4 items-center flex-shrink-0" style="min-height:56px"><div part="title"><slot name="header" part="title" class="flex-auto text-xl m-0" id="title"></slot></div><div class="shrink-0 flex flex-wrap justify-end gap-1 ml-4 absolute top-2 right-2"><sd-1-34-0-button variant="tertiary" size="lg" part="close-button" @click="${() => this.requestClose("close-button")}"><sd-1-34-0-icon name="close" library="system"></sd-1-34-0-icon></sd-1-34-0-button></div></header>` : ""}<div part="body" class="flex-auto block px-4"><slot></slot></div><footer part="footer" class="${cx(this.hasSlotController.test("footer") ? "text-left p-4" : "hidden")}"><slot name="footer"></slot></footer></div></div>`;
187
187
  }
188
188
  };
189
189
  SdDrawer.styles = [
@@ -221,7 +221,7 @@ __decorateClass([
221
221
  watch("contained", { waitUntilFirstUpdate: true })
222
222
  ], SdDrawer.prototype, "handleNoModalChange", 1);
223
223
  SdDrawer = __decorateClass([
224
- customElement("sd-1-33-0-drawer")
224
+ customElement("sd-1-34-0-drawer")
225
225
  ], SdDrawer);
226
226
  setDefaultAnimation("drawer.showStart", {
227
227
  keyframes: [
@@ -44,6 +44,6 @@ export default class SdDropdown extends SolidElement {
44
44
  }
45
45
  declare global {
46
46
  interface HTMLElementTagNameMap {
47
- 'sd-1-33-0-dropdown': SdDropdown;
47
+ 'sd-1-34-0-dropdown': SdDropdown;
48
48
  }
49
49
  }