@mhmo91/schmancy 0.4.62 → 0.4.63

package/dist/progress-zqZlK6GF.js

@@ -0,0 +1,57 @@
+import "rxjs";
+import { classMap as d } from "lit/directives/class-map.js";
+import { styleMap as m } from "lit/directives/style-map.js";
+import { T as u } from "./tailwind.mixin-CWkKY5iI.js";
+import { property as a, customElement as g } from "lit/decorators.js";
+import { css as p, html as c } from "lit";
+var f = Object.defineProperty, y = Object.getOwnPropertyDescriptor, s = (l, r, o, i) => {
+  for (var n, e = i > 1 ? void 0 : i ? y(r, o) : r, h = l.length - 1; h >= 0; h--) (n = l[h]) && (e = (i ? n(r, o, e) : n(e)) || e);
+  return i && e && f(r, o, e), e;
+};
+let t = class extends u(p`
+  :host {
+    display: block;
+  }
+
+  @keyframes indeterminate {
+    0% {
+      left: -30%;
+    }
+    100% {
+      left: 100%;
+    }
+  }
+
+  .indeterminate-animation {
+    animation: indeterminate 1.5s infinite ease-in-out;
+  }
+`) {
+  constructor() {
+    super(...arguments), this.value = 0, this.max = 100, this.indeterminate = !1, this.size = "md", this.color = "primary", this.glass = !1;
+  }
+  get percentage() {
+    return this.indeterminate ? 0 : Math.min(100, Math.max(0, this.value / this.max * 100));
+  }
+  render() {
+    const l = { "w-full": !0, relative: !0, "overflow-hidden": !0, "rounded-full": !0, "h-0.5": this.size === "sm", "h-1": this.size === "md", "h-2": this.size === "lg", "backdrop-blur-xl": this.glass, "backdrop-saturate-150": this.glass, "bg-surface-container/20": this.glass && !this.indeterminate, "bg-surface-container": !this.glass, "shadow-[inset_0_1px_2px_0_rgba(0,0,0,0.1)]": this.glass, border: this.glass, "border-outline/20": this.glass }, r = { "h-full": !0, "rounded-full": !0, "transition-all": !0, "duration-300": !0, "ease-in-out": !0, relative: !0, "bg-primary-default": this.color === "primary" && !this.glass, "bg-secondary-default": this.color === "secondary" && !this.glass, "bg-tertiary-default": this.color === "tertiary" && !this.glass, "bg-error-default": this.color === "error" && !this.glass, "bg-success-default": this.color === "success" && !this.glass, "w-[30%]": this.indeterminate, absolute: this.indeterminate, "indeterminate-animation": this.indeterminate }, o = this.indeterminate ? {} : { width: `${this.percentage}%` }, i = { "backdrop-blur-sm": this.glass, "shadow-[0_0_20px_rgba(0,0,0,0.1)]": this.glass, "bg-primary-default/70": this.glass && this.color === "primary", "bg-secondary-default/70": this.glass && this.color === "secondary", "bg-tertiary-default/70": this.glass && this.color === "tertiary", "bg-error-default/70": this.glass && this.color === "error", "bg-success-default/70": this.glass && this.color === "success" };
+    return c`
+      <div class="${d(l)}">
+        <div 
+          class="${d({ ...r, ...i })}"
+          style="${m(o)}"
+          role="progressbar"
+          aria-valuenow="${this.value}"
+          aria-valuemin="0"
+          aria-valuemax="${this.max}"
+        >
+          ${this.glass ? c`
+            <!-- Glass shine effect -->
+            <div class="absolute inset-0 bg-gradient-to-b from-surface-on/20 to-transparent rounded-full"></div>
+          ` : ""}
+        </div>
+      </div>
+    `;
+  }
+};
+s([a({ type: Number, reflect: !0 })], t.prototype, "value", 2), s([a({ type: Number, reflect: !0 })], t.prototype, "max", 2), s([a({ type: Boolean, reflect: !0 })], t.prototype, "indeterminate", 2), s([a({ type: String, reflect: !0 })], t.prototype, "size", 2), s([a({ type: String, reflect: !0 })], t.prototype, "color", 2), s([a({ type: Boolean, reflect: !0 })], t.prototype, "glass", 2), t = s([g("schmancy-progress")], t);
+//# sourceMappingURL=progress-zqZlK6GF.js.map

package/dist/progress-zqZlK6GF.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress-zqZlK6GF.js","sources":["../src/progress/progress.ts"],"sourcesContent":["import { TailwindElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\n\n@customElement('schmancy-progress')\nexport default class SchmancyProgress extends TailwindElement(css`\n  :host {\n    display: block;\n  }\n\n  @keyframes indeterminate {\n    0% {\n      left: -30%;\n    }\n    100% {\n      left: 100%;\n    }\n  }\n\n  .indeterminate-animation {\n    animation: indeterminate 1.5s infinite ease-in-out;\n  }\n`) {\n  @property({ type: Number, reflect: true })\n  value = 0\n\n  @property({ type: Number, reflect: true })\n  max = 100\n\n  @property({ type: Boolean, reflect: true })\n  indeterminate = false\n\n  @property({ type: String, reflect: true })\n  size: 'sm' | 'md' | 'lg' = 'md'\n\n  @property({ type: String, reflect: true })\n  color: 'primary' | 'secondary' | 'tertiary' | 'error' | 'success' = 'primary'\n\n  @property({ type: Boolean, reflect: true })\n  glass = false\n\n  private get percentage(): number {\n    if (this.indeterminate) return 0\n    return Math.min(100, Math.max(0, (this.value / this.max) * 100))\n  }\n\n  protected render() {\n    const containerClasses = {\n      'w-full': true,\n      'relative': true,\n      'overflow-hidden': true,\n      'rounded-full': true,\n      'h-0.5': this.size === 'sm',\n      'h-1': this.size === 'md',\n      'h-2': this.size === 'lg',\n      // Glass effect background\n      'backdrop-blur-xl': this.glass,\n      'backdrop-saturate-150': this.glass,\n      'bg-surface-container/20': this.glass && !this.indeterminate,\n      'bg-surface-container': !this.glass,\n      'shadow-[inset_0_1px_2px_0_rgba(0,0,0,0.1)]': this.glass,\n      'border': this.glass,\n      'border-outline/20': this.glass\n    }\n\n    const barClasses = {\n      'h-full': true,\n      'rounded-full': true,\n      'transition-all': true,\n      'duration-300': true,\n      'ease-in-out': true,\n      'relative': true,\n      'bg-primary-default': this.color === 'primary' && !this.glass,\n      'bg-secondary-default': this.color === 'secondary' && !this.glass,\n      'bg-tertiary-default': this.color === 'tertiary' && !this.glass,\n      'bg-error-default': this.color === 'error' && !this.glass,\n      'bg-success-default': this.color === 'success' && !this.glass,\n      'w-[30%]': this.indeterminate,\n      'absolute': this.indeterminate,\n      'indeterminate-animation': this.indeterminate\n    }\n\n    const barStyles = this.indeterminate \n      ? {} \n      : { width: `${this.percentage}%` }\n\n    // Glass effect bar classes\n    const glassBarClasses = {\n      'backdrop-blur-sm': this.glass,\n      'shadow-[0_0_20px_rgba(0,0,0,0.1)]': this.glass,\n      // Use semi-transparent background colors for glass effect\n      'bg-primary-default/70': this.glass && this.color === 'primary',\n      'bg-secondary-default/70': this.glass && this.color === 'secondary',\n      'bg-tertiary-default/70': this.glass && this.color === 'tertiary',\n      'bg-error-default/70': this.glass && this.color === 'error',\n      'bg-success-default/70': this.glass && this.color === 'success',\n    }\n\n    return html`\n      <div class=\"${classMap(containerClasses)}\">\n        <div \n          class=\"${classMap({...barClasses, ...glassBarClasses})}\"\n          style=\"${styleMap(barStyles)}\"\n          role=\"progressbar\"\n          aria-valuenow=\"${this.value}\"\n          aria-valuemin=\"0\"\n          aria-valuemax=\"${this.max}\"\n        >\n          ${this.glass ? html`\n            <!-- Glass shine effect -->\n            <div class=\"absolute inset-0 bg-gradient-to-b from-surface-on/20 to-transparent rounded-full\"></div>\n          ` : ''}\n        </div>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'schmancy-progress': SchmancyProgress\n  }\n}"],"names":["SchmancyProgress","TailwindElement","css","constructor","super","arguments","this","value","max","indeterminate","size","color","glass","percentage","Math","min","render","containerClasses","relative","border","barClasses","absolute","barStyles","width","glassBarClasses","html","classMap","styleMap","__decorateClass","property","type","Number","reflect","prototype","Boolean","String","customElement"],"mappings":"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"}

package/dist/progress.cjs

@@ -1,2 +1,2 @@
-"use strict";require("./progress-D2Ir6B3O.cjs");
+"use strict";require("./progress-BtoDdZfn.cjs");
 //# sourceMappingURL=progress.cjs.map

package/dist/progress.js

@@ -1,2 +1,2 @@
-import "./progress-DszTrZkL.js";
+import "./progress-zqZlK6GF.js";
 //# sourceMappingURL=progress.js.map

package/dist/{radio-button--qELnlmY.cjs → radio-button-CXEtqxuH.cjs}

@@ -1,31 +1,31 @@
-"use strict";const c=require("lit"),r=require("lit/decorators.js"),h=require("rxjs");require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const u=require("./tailwind.mixin-NrMHmraa.cjs"),p=require("./formField.mixin-CcwoZBkf.cjs"),b=require("lit/directives/when.js");var m=Object.defineProperty,v=Object.getOwnPropertyDescriptor,n=(e,t,l,o)=>{for(var s,i=o>1?void 0:o?v(t,l):t,a=e.length-1;a>=0;a--)(s=e[a])&&(i=(o?s(t,l,i):s(i))||i);return o&&i&&m(t,l,i),i};exports.RadioGroup=class extends p.FormFieldMixin(u.TailwindElement(":host{display:inherit;position:inherit}")){constructor(){super(...arguments),this.label="",this.name="",this.value="",this.options=[],this.required=!1,this.selection$=new h.Subject}connectedCallback(){super.connectedCallback(),this.selection$.subscribe(e=>{this.value=e,this.emitChange({value:e}),this.updateChildRadioButtons()}),this.addEventListener("radio-button-click",e=>{this.selection$.next(e.detail.value)})}disconnectedCallback(){super.disconnectedCallback(),this.selection$?.unsubscribe()}handleSelection(e){this.selection$.next(e)}updateChildRadioButtons(){this.querySelectorAll("schmancy-radio-button").forEach(e=>{e.getAttribute("value")===this.value?e.setAttribute("checked",""):e.removeAttribute("checked")})}updated(e){super.updated(e),e.has("value")&&this.updateChildRadioButtons()}render(){const e=this.childElementCount>0;return c.html`
+"use strict";const c=require("lit"),r=require("lit/decorators.js"),h=require("rxjs");require("lit/directives/class-map.js"),require("lit/directives/style-map.js");const u=require("./tailwind.mixin-Bg1s1U3X.cjs"),p=require("./formField.mixin-Bp89q1xA.cjs"),b=require("lit/directives/when.js");var m=Object.defineProperty,v=Object.getOwnPropertyDescriptor,n=(e,t,l,o)=>{for(var a,i=o>1?void 0:o?v(t,l):t,s=e.length-1;s>=0;s--)(a=e[s])&&(i=(o?a(t,l,i):a(i))||i);return o&&i&&m(t,l,i),i};exports.RadioGroup=class extends p.FormFieldMixin(u.TailwindElement(":host{display:inherit;position:inherit}")){constructor(){super(...arguments),this.label="",this.name="",this.value="",this.options=[],this.required=!1,this.selection$=new h.Subject}connectedCallback(){super.connectedCallback(),this.selection$.subscribe(e=>{this.value=e,this.emitChange({value:e}),this.updateChildRadioButtons()}),this.addEventListener("radio-button-click",e=>{this.selection$.next(e.detail.value)})}disconnectedCallback(){super.disconnectedCallback(),this.selection$?.unsubscribe()}handleSelection(e){this.selection$.next(e)}updateChildRadioButtons(){this.querySelectorAll("schmancy-radio-button").forEach(e=>{e.getAttribute("value")===this.value?e.setAttribute("checked",""):e.removeAttribute("checked")})}updated(e){super.updated(e),e.has("value")&&this.updateChildRadioButtons()}render(){const e=this.childElementCount>0;return c.html`
 			<div class="grid gap-4">
-				${b.when(this.label,()=>c.html` <label class="text-base font-semibold text-gray-900">${this.label}</label> `)}
+				${b.when(this.label,()=>c.html` <label class="text-base font-semibold text-surface-on">${this.label}</label> `)}
 				
 				${e?c.html`<slot></slot>`:this.options?.map(t=>c.html`
 						<div class="flex items-center">
 							<input
 								.required=${this.required}
 								id=${t.value}
-								class="h-4 w-4 border-gray-300 text-indigo-600 focus:ring-indigo-600"
+								class="h-4 w-4 border-outline text-primary-default focus:ring-primary-default"
 								type="radio"
 								name=${this.name}
 								.value=${t.value}
 								.checked=${t.value===this.value}
 								@change=${()=>this.handleSelection(t.value)}
 							/>
-							<label for=${t.value} class="ml-3 block text-sm font-medium leading-6 text-gray-900">
+							<label for=${t.value} class="ml-3 block text-sm font-medium leading-6 text-surface-on">
 								${t.label||t.value}
 							</label>
 						</div>
 					`)}
 			</div>
-		`}},n([r.property({type:String})],exports.RadioGroup.prototype,"label",2),n([r.property({type:String})],exports.RadioGroup.prototype,"name",2),n([r.property({type:String})],exports.RadioGroup.prototype,"value",2),n([r.property({type:Array})],exports.RadioGroup.prototype,"options",2),n([r.property({type:Boolean})],exports.RadioGroup.prototype,"required",2),exports.RadioGroup=n([r.customElement("schmancy-radio-group")],exports.RadioGroup);var y=Object.defineProperty,g=Object.getOwnPropertyDescriptor,d=(e,t,l,o)=>{for(var s,i=o>1?void 0:o?g(t,l):t,a=e.length-1;a>=0;a--)(s=e[a])&&(i=(o?s(t,l,i):s(i))||i);return o&&i&&y(t,l,i),i};exports.RadioButton=class extends p.FormFieldMixin(u.TailwindElement()){constructor(){super(...arguments),this.value="",this.checked=!1,this.disabled=!1,this.name=""}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick)}handleClick(){if(!this.disabled)if(this.closest("schmancy-radio-group")){const e=new CustomEvent("radio-button-click",{detail:{value:this.value},bubbles:!0,composed:!0});this.dispatchEvent(e)}else this.checked=!0,this.emitChange({value:this.value})}render(){return c.html`
+		`}},n([r.property({type:String})],exports.RadioGroup.prototype,"label",2),n([r.property({type:String})],exports.RadioGroup.prototype,"name",2),n([r.property({type:String})],exports.RadioGroup.prototype,"value",2),n([r.property({type:Array})],exports.RadioGroup.prototype,"options",2),n([r.property({type:Boolean})],exports.RadioGroup.prototype,"required",2),exports.RadioGroup=n([r.customElement("schmancy-radio-group")],exports.RadioGroup);var y=Object.defineProperty,k=Object.getOwnPropertyDescriptor,d=(e,t,l,o)=>{for(var a,i=o>1?void 0:o?k(t,l):t,s=e.length-1;s>=0;s--)(a=e[s])&&(i=(o?a(t,l,i):a(i))||i);return o&&i&&y(t,l,i),i};exports.RadioButton=class extends p.FormFieldMixin(u.TailwindElement()){constructor(){super(...arguments),this.value="",this.checked=!1,this.disabled=!1,this.name=""}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this.handleClick)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick)}handleClick(){if(!this.disabled)if(this.closest("schmancy-radio-group")){const e=new CustomEvent("radio-button-click",{detail:{value:this.value},bubbles:!0,composed:!0});this.dispatchEvent(e)}else this.checked=!0,this.emitChange({value:this.value})}render(){return c.html`
 			<label class="relative flex items-start cursor-pointer">
 				<div class="flex items-center h-6">
 					<input
 						type="radio"
-						class="h-4 w-4 text-primary focus:ring-primary-light border-gray-300"
+						class="h-4 w-4 text-primary-default focus:ring-primary-container border-outline"
 						.value=${this.value}
 						.checked=${this.checked}
 						.disabled=${this.disabled}
@@ -38,4 +38,4 @@
 				</div>
 			</label>
 		`}},d([r.property({type:String})],exports.RadioButton.prototype,"value",2),d([r.property({type:Boolean,reflect:!0})],exports.RadioButton.prototype,"checked",2),d([r.property({type:Boolean})],exports.RadioButton.prototype,"disabled",2),d([r.property({type:String})],exports.RadioButton.prototype,"name",2),exports.RadioButton=d([r.customElement("schmancy-radio-button")],exports.RadioButton);
-//# sourceMappingURL=radio-button--qELnlmY.cjs.map
+//# sourceMappingURL=radio-button-CXEtqxuH.cjs.map

package/dist/radio-button-CXEtqxuH.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-button-CXEtqxuH.cjs","sources":["../src/radio-group/radio-group.ts","../src/radio-group/radio-button.ts"],"sourcesContent":["import { html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { Subject } from 'rxjs'\nimport style from './radio-group.scss?inline'\nimport { TailwindElement } from '@mixins/index'\nimport { when } from 'lit/directives/when.js'\nimport { FormFieldMixin } from '../../mixins/formField.mixin'\n\nexport type SchmancyRadioGroupOption = {\n\tlabel: string\n\tvalue: string\n}\nexport type SchmancyRadioGroupChangeEvent = CustomEvent<{\n\tvalue: string\n}>\n@customElement('schmancy-radio-group')\nexport class RadioGroup extends FormFieldMixin(TailwindElement(style)) {\n\t@property({ type: String }) override label = ''\n\t@property({ type: String }) override name = ''\n\t@property({ type: String }) override value = ''\n\t@property({ type: Array }) options: SchmancyRadioGroupOption[] = []\n\t@property({ type: Boolean }) override required: boolean = false\n\tprivate selection$ = new Subject<string>()\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.selection$.subscribe(value => {\n\t\t\tthis.value = value\n\t\t\tthis.emitChange({ value })\n\t\t\t// Update all child radio buttons\n\t\t\tthis.updateChildRadioButtons()\n\t\t})\n\t\t\n\t\t// Listen for radio button clicks from children\n\t\tthis.addEventListener('radio-button-click', ((e: CustomEvent) => {\n\t\t\tthis.selection$.next(e.detail.value)\n\t\t}) as EventListener)\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.selection$?.unsubscribe()\n\t}\n\t\n\tprivate handleSelection(value: string) {\n\t\tthis.selection$.next(value)\n\t}\n\t\n\tprivate updateChildRadioButtons() {\n\t\t// Update child radio buttons checked state\n\t\tconst radioButtons = this.querySelectorAll('schmancy-radio-button')\n\t\tradioButtons.forEach(button => {\n\t\t\tconst buttonValue = button.getAttribute('value')\n\t\t\tif (buttonValue === this.value) {\n\t\t\t\tbutton.setAttribute('checked', '')\n\t\t\t} else {\n\t\t\t\tbutton.removeAttribute('checked')\n\t\t\t}\n\t\t})\n\t}\n\t\n\t// For backwards compatibility with direct option setting\n\tupdated(changedProperties: Map<string, any>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('value')) {\n\t\t\tthis.updateChildRadioButtons()\n\t\t}\n\t}\n\n\trender() {\n\t\t// Check if we have any slotted radio buttons\n\t\tconst hasSlottedContent = this.childElementCount > 0\n\t\t\n\t\treturn html`\n\t\t\t<div class=\"grid gap-4\">\n\t\t\t\t${when(this.label, () => html` <label class=\"text-base font-semibold text-surface-on\">${this.label}</label> `)}\n\t\t\t\t\n\t\t\t\t${hasSlottedContent ? \n\t\t\t\t\thtml`<slot></slot>` :\n\t\t\t\t\tthis.options?.map(option => html`\n\t\t\t\t\t\t<div class=\"flex items-center\">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t.required=${this.required}\n\t\t\t\t\t\t\t\tid=${option.value}\n\t\t\t\t\t\t\t\tclass=\"h-4 w-4 border-outline text-primary-default focus:ring-primary-default\"\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tname=${this.name}\n\t\t\t\t\t\t\t\t.value=${option.value}\n\t\t\t\t\t\t\t\t.checked=${option.value === this.value}\n\t\t\t\t\t\t\t\t@change=${() => this.handleSelection(option.value)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<label for=${option.value} class=\"ml-3 block text-sm font-medium leading-6 text-surface-on\">\n\t\t\t\t\t\t\t\t${option.label || option.value}\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t`)\n\t\t\t\t}\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-radio-group': RadioGroup\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { FormFieldMixin } from '../../mixins/formField.mixin'\n\n@customElement('schmancy-radio-button')\nexport class RadioButton extends FormFieldMixin(TailwindElement()) {\n\t@property({ type: String }) override value = ''\n\t@property({ type: Boolean, reflect: true }) checked = false\n\t@property({ type: Boolean }) override disabled = false\n\t@property({ type: String }) override name = ''\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\t// Find parent radio-group if exists\n\t\tthis.addEventListener('click', this.handleClick)\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.removeEventListener('click', this.handleClick)\n\t}\n\n\tprivate handleClick() {\n\t\tif (this.disabled) return\n\n\t\t// Find parent radio-group if exists\n\t\tconst radioGroup = this.closest('schmancy-radio-group')\n\t\tif (radioGroup) {\n\t\t\t// Let the radio-group handle the change\n\t\t\tconst event = new CustomEvent('radio-button-click', {\n\t\t\t\tdetail: { value: this.value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t\tthis.dispatchEvent(event)\n\t\t} else {\n\t\t\t// Standalone usage\n\t\t\tthis.checked = true\n\t\t\tthis.emitChange({ value: this.value })\n\t\t}\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<label class=\"relative flex items-start cursor-pointer\">\n\t\t\t\t<div class=\"flex items-center h-6\">\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\tclass=\"h-4 w-4 text-primary-default focus:ring-primary-container border-outline\"\n\t\t\t\t\t\t.value=${this.value}\n\t\t\t\t\t\t.checked=${this.checked}\n\t\t\t\t\t\t.disabled=${this.disabled}\n\t\t\t\t\t\t.name=${this.name}\n\t\t\t\t\t\t@change=${() => {}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t<slot name=\"label\"></slot>\n\t\t\t\t</div>\n\t\t\t</label>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-radio-button': RadioButton\n\t}\n}\n"],"names":["RadioGroup","FormFieldMixin","TailwindElement","constructor","super","arguments","this","label","name","value","options","required","selection$","Subject","connectedCallback","subscribe","emitChange","updateChildRadioButtons","addEventListener","e","next","detail","disconnectedCallback","unsubscribe","querySelectorAll","forEach","button","getAttribute","setAttribute","removeAttribute","changedProperties","updated","has","hasSlottedContent","childElementCount","html","when","map","option","handleSelection","__decorateClass","property","type","String","prototype","Array","Boolean","customElement","RadioButton","checked","disabled","handleClick","removeEventListener","closest","event","CustomEvent","bubbles","composed","dispatchEvent","render","reflect"],"mappings":"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"}

package/dist/{radio-button-CK1igpVg.js → radio-button-DdA-gEBz.js}

@@ -1,14 +1,14 @@
-import { html as u } from "lit";
+import { html as h } from "lit";
 import { property as a, customElement as p } from "lit/decorators.js";
 import { Subject as v } from "rxjs";
 import "lit/directives/class-map.js";
 import "lit/directives/style-map.js";
-import { T as m } from "./tailwind.mixin-CbvBtwqu.js";
-import { F as b } from "./formField.mixin-D_JwScTz.js";
+import { T as m } from "./tailwind.mixin-CWkKY5iI.js";
+import { F as b } from "./formField.mixin-n6vWX_52.js";
 import { when as y } from "lit/directives/when.js";
-var g = Object.defineProperty, k = Object.getOwnPropertyDescriptor, c = (e, t, l, s) => {
+var f = Object.defineProperty, k = Object.getOwnPropertyDescriptor, c = (e, t, l, s) => {
   for (var r, i = s > 1 ? void 0 : s ? k(t, l) : t, o = e.length - 1; o >= 0; o--) (r = e[o]) && (i = (s ? r(t, l, i) : r(i)) || i);
-  return s && i && g(t, l, i), i;
+  return s && i && f(t, l, i), i;
 };
 let n = class extends b(m(":host{display:inherit;position:inherit}")) {
   constructor() {
@@ -37,23 +37,23 @@ let n = class extends b(m(":host{display:inherit;position:inherit}")) {
   }
   render() {
     const e = this.childElementCount > 0;
-    return u`
+    return h`
 			<div class="grid gap-4">
-				${y(this.label, () => u` <label class="text-base font-semibold text-gray-900">${this.label}</label> `)}
+				${y(this.label, () => h` <label class="text-base font-semibold text-surface-on">${this.label}</label> `)}
 				
-				${e ? u`<slot></slot>` : this.options?.map((t) => u`
+				${e ? h`<slot></slot>` : this.options?.map((t) => h`
 						<div class="flex items-center">
 							<input
 								.required=${this.required}
 								id=${t.value}
-								class="h-4 w-4 border-gray-300 text-indigo-600 focus:ring-indigo-600"
+								class="h-4 w-4 border-outline text-primary-default focus:ring-primary-default"
 								type="radio"
 								name=${this.name}
 								.value=${t.value}
 								.checked=${t.value === this.value}
 								@change=${() => this.handleSelection(t.value)}
 							/>
-							<label for=${t.value} class="ml-3 block text-sm font-medium leading-6 text-gray-900">
+							<label for=${t.value} class="ml-3 block text-sm font-medium leading-6 text-surface-on">
 								${t.label || t.value}
 							</label>
 						</div>
@@ -63,9 +63,9 @@ let n = class extends b(m(":host{display:inherit;position:inherit}")) {
   }
 };
 c([a({ type: String })], n.prototype, "label", 2), c([a({ type: String })], n.prototype, "name", 2), c([a({ type: String })], n.prototype, "value", 2), c([a({ type: Array })], n.prototype, "options", 2), c([a({ type: Boolean })], n.prototype, "required", 2), n = c([p("schmancy-radio-group")], n);
-var f = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, h = (e, t, l, s) => {
+var g = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, u = (e, t, l, s) => {
   for (var r, i = s > 1 ? void 0 : s ? $(t, l) : t, o = e.length - 1; o >= 0; o--) (r = e[o]) && (i = (s ? r(t, l, i) : r(i)) || i);
-  return s && i && f(t, l, i), i;
+  return s && i && g(t, l, i), i;
 };
 let d = class extends b(m()) {
   constructor() {
@@ -85,12 +85,12 @@ let d = class extends b(m()) {
       } else this.checked = !0, this.emitChange({ value: this.value });
   }
   render() {
-    return u`
+    return h`
 			<label class="relative flex items-start cursor-pointer">
 				<div class="flex items-center h-6">
 					<input
 						type="radio"
-						class="h-4 w-4 text-primary focus:ring-primary-light border-gray-300"
+						class="h-4 w-4 text-primary-default focus:ring-primary-container border-outline"
 						.value=${this.value}
 						.checked=${this.checked}
 						.disabled=${this.disabled}
@@ -106,9 +106,9 @@ let d = class extends b(m()) {
 		`;
   }
 };
-h([a({ type: String })], d.prototype, "value", 2), h([a({ type: Boolean, reflect: !0 })], d.prototype, "checked", 2), h([a({ type: Boolean })], d.prototype, "disabled", 2), h([a({ type: String })], d.prototype, "name", 2), d = h([p("schmancy-radio-button")], d);
+u([a({ type: String })], d.prototype, "value", 2), u([a({ type: Boolean, reflect: !0 })], d.prototype, "checked", 2), u([a({ type: Boolean })], d.prototype, "disabled", 2), u([a({ type: String })], d.prototype, "name", 2), d = u([p("schmancy-radio-button")], d);
 export {
   n as R,
   d as a
 };
-//# sourceMappingURL=radio-button-CK1igpVg.js.map
+//# sourceMappingURL=radio-button-DdA-gEBz.js.map

package/dist/radio-button-DdA-gEBz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-button-DdA-gEBz.js","sources":["../src/radio-group/radio-group.ts","../src/radio-group/radio-button.ts"],"sourcesContent":["import { html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { Subject } from 'rxjs'\nimport style from './radio-group.scss?inline'\nimport { TailwindElement } from '@mixins/index'\nimport { when } from 'lit/directives/when.js'\nimport { FormFieldMixin } from '../../mixins/formField.mixin'\n\nexport type SchmancyRadioGroupOption = {\n\tlabel: string\n\tvalue: string\n}\nexport type SchmancyRadioGroupChangeEvent = CustomEvent<{\n\tvalue: string\n}>\n@customElement('schmancy-radio-group')\nexport class RadioGroup extends FormFieldMixin(TailwindElement(style)) {\n\t@property({ type: String }) override label = ''\n\t@property({ type: String }) override name = ''\n\t@property({ type: String }) override value = ''\n\t@property({ type: Array }) options: SchmancyRadioGroupOption[] = []\n\t@property({ type: Boolean }) override required: boolean = false\n\tprivate selection$ = new Subject<string>()\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.selection$.subscribe(value => {\n\t\t\tthis.value = value\n\t\t\tthis.emitChange({ value })\n\t\t\t// Update all child radio buttons\n\t\t\tthis.updateChildRadioButtons()\n\t\t})\n\t\t\n\t\t// Listen for radio button clicks from children\n\t\tthis.addEventListener('radio-button-click', ((e: CustomEvent) => {\n\t\t\tthis.selection$.next(e.detail.value)\n\t\t}) as EventListener)\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.selection$?.unsubscribe()\n\t}\n\t\n\tprivate handleSelection(value: string) {\n\t\tthis.selection$.next(value)\n\t}\n\t\n\tprivate updateChildRadioButtons() {\n\t\t// Update child radio buttons checked state\n\t\tconst radioButtons = this.querySelectorAll('schmancy-radio-button')\n\t\tradioButtons.forEach(button => {\n\t\t\tconst buttonValue = button.getAttribute('value')\n\t\t\tif (buttonValue === this.value) {\n\t\t\t\tbutton.setAttribute('checked', '')\n\t\t\t} else {\n\t\t\t\tbutton.removeAttribute('checked')\n\t\t\t}\n\t\t})\n\t}\n\t\n\t// For backwards compatibility with direct option setting\n\tupdated(changedProperties: Map<string, any>) {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('value')) {\n\t\t\tthis.updateChildRadioButtons()\n\t\t}\n\t}\n\n\trender() {\n\t\t// Check if we have any slotted radio buttons\n\t\tconst hasSlottedContent = this.childElementCount > 0\n\t\t\n\t\treturn html`\n\t\t\t<div class=\"grid gap-4\">\n\t\t\t\t${when(this.label, () => html` <label class=\"text-base font-semibold text-surface-on\">${this.label}</label> `)}\n\t\t\t\t\n\t\t\t\t${hasSlottedContent ? \n\t\t\t\t\thtml`<slot></slot>` :\n\t\t\t\t\tthis.options?.map(option => html`\n\t\t\t\t\t\t<div class=\"flex items-center\">\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t.required=${this.required}\n\t\t\t\t\t\t\t\tid=${option.value}\n\t\t\t\t\t\t\t\tclass=\"h-4 w-4 border-outline text-primary-default focus:ring-primary-default\"\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tname=${this.name}\n\t\t\t\t\t\t\t\t.value=${option.value}\n\t\t\t\t\t\t\t\t.checked=${option.value === this.value}\n\t\t\t\t\t\t\t\t@change=${() => this.handleSelection(option.value)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<label for=${option.value} class=\"ml-3 block text-sm font-medium leading-6 text-surface-on\">\n\t\t\t\t\t\t\t\t${option.label || option.value}\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t`)\n\t\t\t\t}\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-radio-group': RadioGroup\n\t}\n}\n","import { TailwindElement } from '@mixins/index'\nimport { html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { FormFieldMixin } from '../../mixins/formField.mixin'\n\n@customElement('schmancy-radio-button')\nexport class RadioButton extends FormFieldMixin(TailwindElement()) {\n\t@property({ type: String }) override value = ''\n\t@property({ type: Boolean, reflect: true }) checked = false\n\t@property({ type: Boolean }) override disabled = false\n\t@property({ type: String }) override name = ''\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\t// Find parent radio-group if exists\n\t\tthis.addEventListener('click', this.handleClick)\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.removeEventListener('click', this.handleClick)\n\t}\n\n\tprivate handleClick() {\n\t\tif (this.disabled) return\n\n\t\t// Find parent radio-group if exists\n\t\tconst radioGroup = this.closest('schmancy-radio-group')\n\t\tif (radioGroup) {\n\t\t\t// Let the radio-group handle the change\n\t\t\tconst event = new CustomEvent('radio-button-click', {\n\t\t\t\tdetail: { value: this.value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t\tthis.dispatchEvent(event)\n\t\t} else {\n\t\t\t// Standalone usage\n\t\t\tthis.checked = true\n\t\t\tthis.emitChange({ value: this.value })\n\t\t}\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<label class=\"relative flex items-start cursor-pointer\">\n\t\t\t\t<div class=\"flex items-center h-6\">\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\tclass=\"h-4 w-4 text-primary-default focus:ring-primary-container border-outline\"\n\t\t\t\t\t\t.value=${this.value}\n\t\t\t\t\t\t.checked=${this.checked}\n\t\t\t\t\t\t.disabled=${this.disabled}\n\t\t\t\t\t\t.name=${this.name}\n\t\t\t\t\t\t@change=${() => {}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"ml-3\">\n\t\t\t\t\t<slot name=\"label\"></slot>\n\t\t\t\t</div>\n\t\t\t</label>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-radio-button': RadioButton\n\t}\n}\n"],"names":["RadioGroup","FormFieldMixin","TailwindElement","constructor","super","arguments","this","label","name","value","options","required","selection$","Subject","connectedCallback","subscribe","emitChange","updateChildRadioButtons","addEventListener","e","next","detail","disconnectedCallback","unsubscribe","querySelectorAll","forEach","button","getAttribute","setAttribute","removeAttribute","changedProperties","updated","has","hasSlottedContent","childElementCount","html","when","map","option","handleSelection","__decorateClass","property","type","String","prototype","Array","Boolean","customElement","RadioButton","checked","disabled","handleClick","removeEventListener","closest","event","CustomEvent","bubbles","composed","dispatchEvent","render","reflect"],"mappings":"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"}

package/dist/radio-group.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./radio-button--qELnlmY.cjs");Object.defineProperty(exports,"RadioButton",{enumerable:!0,get:()=>e.RadioButton}),Object.defineProperty(exports,"RadioGroup",{enumerable:!0,get:()=>e.RadioGroup});
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./radio-button-CXEtqxuH.cjs");Object.defineProperty(exports,"RadioButton",{enumerable:!0,get:()=>e.RadioButton}),Object.defineProperty(exports,"RadioGroup",{enumerable:!0,get:()=>e.RadioGroup});
 //# sourceMappingURL=radio-group.cjs.map

package/dist/radio-group.js

@@ -1,4 +1,4 @@
-import { a as r, R as t } from "./radio-button-CK1igpVg.js";
+import { a as r, R as t } from "./radio-button-DdA-gEBz.js";
 export {
   r as RadioButton,
   t as RadioGroup

package/dist/{schmancy-steps-container-1RPGYqA4.cjs → schmancy-steps-container-l_epOLwa.cjs}

@@ -1,9 +1,9 @@
-"use strict";const m=require("./consume-edta5ng5.cjs"),i=require("lit"),c=require("lit/decorators.js"),u=require("lit/directives/when.js"),S=require("./litElement.mixin-BEbYQVKW.cjs"),d=require("./provide-BxZ2kn_p.cjs"),b=require("rxjs");class y{constructor(){this._currentStep=new b.BehaviorSubject(1)}get currentStep$(){return this._currentStep.asObservable()}get currentStep(){return this._currentStep.value}setStep(e){this._currentStep.next(e)}}const h=d.n(Symbol("SchmancyStepsContext"));var g=Object.defineProperty,f=Object.getOwnPropertyDescriptor,o=(t,e,n,s)=>{for(var p,r=s>1?void 0:s?f(e,n):e,a=t.length-1;a>=0;a--)(p=t[a])&&(r=(s?p(e,n,r):p(r))||r);return s&&r&&g(e,n,r),r};exports.SchmancyStep=class extends S.$LitElement(i.css`
+"use strict";const m=require("./consume-edta5ng5.cjs"),o=require("lit"),p=require("lit/decorators.js"),h=require("lit/directives/when.js"),S=require("./litElement.mixin-Co3Tb6le.cjs"),d=require("./provide-BxZ2kn_p.cjs"),b=require("rxjs");class y{constructor(){this._currentStep=new b.BehaviorSubject(1)}get currentStep$(){return this._currentStep.asObservable()}get currentStep(){return this._currentStep.value}setStep(e){this._currentStep.next(e)}}const u=d.n(Symbol("SchmancyStepsContext"));var f=Object.defineProperty,g=Object.getOwnPropertyDescriptor,i=(t,e,n,s)=>{for(var c,r=s>1?void 0:s?g(e,n):e,a=t.length-1;a>=0;a--)(c=t[a])&&(r=(s?c(e,n,r):c(r))||r);return s&&r&&f(e,n,r),r};exports.SchmancyStep=class extends S.$LitElement(o.css`
 	:host {
 		display: grid;
 		/* Base display is just grid, flex properties will be applied dynamically */
 	}
-`){constructor(){super(...arguments),this.position=1,this.title="",this.description="",this.completed=!1,this.lockBack=!1,this.currentStep=1}connectedCallback(){super.connectedCallback(),this.subscription=this.steps.currentStep$.subscribe(t=>{this.currentStep=t,this.updateFlexProperties()}),this.updateFlexProperties()}disconnectedCallback(){this.subscription?.unsubscribe(),super.disconnectedCallback()}updateFlexProperties(){const t=this.position===this.currentStep;this.style.flex=t?"1 1 auto":"0 0 auto"}get status(){return this.completed||this.position<this.steps.currentStep?"complete":this.position===this.steps.currentStep?"current":"upcoming"}_onStepClick(t){this.lockBack&&this.position<this.steps.currentStep||this.status!=="upcoming"&&this.steps.setStep(this.position)}render(){const t=this.position===this.currentStep,e=this.status==="complete",n={"bg-tertiary-default":e,"bg-gray-300":!e},s={"relative border-solid z-10 flex size-5 items-center justify-center rounded-full":!0,"bg-tertiary-default group-hover:bg-tertiary-onContainer":e,"border-2 border-tertiary-default bg-white":!e&&t,"border-2 border-gray-300 bg-white group-hover:border-gray-400":this.status==="upcoming"},p={"text-tertiary-default":t,"text-gray-500":!t},r=t||e?"cursor-pointer":"";return i.html`
+`){constructor(){super(...arguments),this.position=1,this.title="",this.description="",this.completed=!1,this.lockBack=!1,this.currentStep=1}connectedCallback(){super.connectedCallback(),this.subscription=this.steps.currentStep$.subscribe(t=>{this.currentStep=t,this.updateFlexProperties()}),this.updateFlexProperties()}disconnectedCallback(){this.subscription?.unsubscribe(),super.disconnectedCallback()}updateFlexProperties(){const t=this.position===this.currentStep;this.style.flex=t?"1 1 auto":"0 0 auto"}get status(){return this.completed||this.position<this.steps.currentStep?"complete":this.position===this.steps.currentStep?"current":"upcoming"}_onStepClick(t){this.lockBack&&this.position<this.steps.currentStep||this.status!=="upcoming"&&this.steps.setStep(this.position)}render(){const t=this.position===this.currentStep,e=this.status==="complete",n={"bg-tertiary-default":e,"bg-surface-container":!e},s={"relative border-solid z-10 flex size-5 items-center justify-center rounded-full":!0,"bg-tertiary-default group-hover:bg-tertiary-onContainer":e,"border-2 border-tertiary-default bg-surface":!e&&t,"border-2 border-outline bg-surface group-hover:border-outlineVariant":this.status==="upcoming"},c={"text-tertiary-default":t,"text-surface-onVariant":!t},r=t||e?"cursor-pointer":"";return o.html`
 			<li class="relative">
 				<!-- Connector line -->
 				<div
@@ -15,7 +15,7 @@
 				<button type="button" @click=${this._onStepClick} class="relative flex items-center group ${r}">
 					<span class="flex items-center h-10">
 						<span class=${this.classMap(s)}>
-							${e?i.html`
+							${e?o.html`
 										<svg class="text-white size-3" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
 											<path
 												fill-rule="evenodd"
@@ -23,9 +23,9 @@
 												clip-rule="evenodd"
 											/>
 										</svg>
-									`:i.html`
+									`:o.html`
 										<span
-											class="size-2.5 rounded-full ${t?"bg-tertiary-default":"bg-transparent group-hover:bg-gray-300"}"
+											class="size-2.5 rounded-full ${t?"bg-tertiary-default":"bg-transparent group-hover:bg-surface-container"}"
 										></span>
 									`}
 						</span>
@@ -33,32 +33,32 @@
 
 					<span class="flex flex-col items-start min-w-0 ml-4">
 						<schmancy-typography type="title">
-							<span class=${this.classMap(p)}>${this.title}</span>
+							<span class=${this.classMap(c)}>${this.title}</span>
 						</schmancy-typography>
-						${u.when(this.description,()=>i.html`
+						${h.when(this.description,()=>o.html`
 								<schmancy-typography type="label">
-									<span class="text-gray-500">${this.description}</span>
+									<span class="text-surface-onVariant">${this.description}</span>
 								</schmancy-typography>
 							`)}
 					</span>
 				</button>
 
 				<!-- Render step content if the step is active, regardless of completion -->
-				${u.when(t,()=>i.html`
+				${h.when(t,()=>o.html`
 						<div class="pl-2 ml-2 block h-full pb-12">
 							<slot></slot>
 						</div>
 					`)}
 			</li>
-		`}},o([c.property({type:Number})],exports.SchmancyStep.prototype,"position",2),o([c.property({type:String})],exports.SchmancyStep.prototype,"title",2),o([c.property({type:String})],exports.SchmancyStep.prototype,"description",2),o([c.property({type:Boolean,reflect:!0})],exports.SchmancyStep.prototype,"completed",2),o([c.property({type:Boolean})],exports.SchmancyStep.prototype,"lockBack",2),o([m.c({context:h})],exports.SchmancyStep.prototype,"steps",2),o([c.state()],exports.SchmancyStep.prototype,"currentStep",2),exports.SchmancyStep=o([c.customElement("schmancy-step")],exports.SchmancyStep);var v=Object.defineProperty,x=Object.getOwnPropertyDescriptor,l=(t,e,n,s)=>{for(var p,r=s>1?void 0:s?x(e,n):e,a=t.length-1;a>=0;a--)(p=t[a])&&(r=(s?p(e,n,r):p(r))||r);return s&&r&&v(e,n,r),r};exports.SchmancyStepsContainer=class extends S.$LitElement(i.css`
+		`}},i([p.property({type:Number})],exports.SchmancyStep.prototype,"position",2),i([p.property({type:String})],exports.SchmancyStep.prototype,"title",2),i([p.property({type:String})],exports.SchmancyStep.prototype,"description",2),i([p.property({type:Boolean,reflect:!0})],exports.SchmancyStep.prototype,"completed",2),i([p.property({type:Boolean})],exports.SchmancyStep.prototype,"lockBack",2),i([m.c({context:u})],exports.SchmancyStep.prototype,"steps",2),i([p.state()],exports.SchmancyStep.prototype,"currentStep",2),exports.SchmancyStep=i([p.customElement("schmancy-step")],exports.SchmancyStep);var x=Object.defineProperty,v=Object.getOwnPropertyDescriptor,l=(t,e,n,s)=>{for(var c,r=s>1?void 0:s?v(e,n):e,a=t.length-1;a>=0;a--)(c=t[a])&&(r=(s?c(e,n,r):c(r))||r);return s&&r&&x(e,n,r),r};exports.SchmancyStepsContainer=class extends S.$LitElement(o.css`
 	:host {
 		display: block;
 	}
-`){constructor(){super(...arguments),this.controller=new y,this.stepsController=this.controller,this._currentStep=1}set currentStep(t){const e=this._currentStep;this._currentStep=t,this.controller.setStep(t),this.requestUpdate("currentStep",e)}get currentStep(){return this._currentStep}connectedCallback(){super.connectedCallback(),this.controller.setStep(this.currentStep)}render(){return i.html`
+`){constructor(){super(...arguments),this.controller=new y,this.stepsController=this.controller,this._currentStep=1}set currentStep(t){const e=this._currentStep;this._currentStep=t,this.controller.setStep(t),this.requestUpdate("currentStep",e)}get currentStep(){return this._currentStep}connectedCallback(){super.connectedCallback(),this.controller.setStep(this.currentStep)}render(){return o.html`
 			<nav class="flex h-full w-full" aria-label="Progress">
 				<ol class="flex flex-col flex-1" role="list">
 					<slot></slot>
 				</ol>
 			</nav>
-		`}},l([d.e({context:h})],exports.SchmancyStepsContainer.prototype,"stepsController",2),l([c.property({type:Number,reflect:!0})],exports.SchmancyStepsContainer.prototype,"currentStep",1),exports.SchmancyStepsContainer=l([c.customElement("schmancy-steps-container")],exports.SchmancyStepsContainer),exports.StepsController=y,exports.stepsContext=h;
-//# sourceMappingURL=schmancy-steps-container-1RPGYqA4.cjs.map
+		`}},l([d.e({context:u})],exports.SchmancyStepsContainer.prototype,"stepsController",2),l([p.property({type:Number,reflect:!0})],exports.SchmancyStepsContainer.prototype,"currentStep",1),exports.SchmancyStepsContainer=l([p.customElement("schmancy-steps-container")],exports.SchmancyStepsContainer),exports.StepsController=y,exports.stepsContext=u;
+//# sourceMappingURL=schmancy-steps-container-l_epOLwa.cjs.map

package/dist/schmancy-steps-container-l_epOLwa.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"schmancy-steps-container-l_epOLwa.cjs","sources":["../src/steps/steps.context.ts","../src/steps/schmancy-step.ts","../src/steps/schmancy-steps-container.ts"],"sourcesContent":["import { createContext } from '@lit/context'\nimport { BehaviorSubject } from 'rxjs'\n\nexport class StepsController {\n\tprivate _currentStep = new BehaviorSubject(1)\n\n\tget currentStep$() {\n\t\treturn this._currentStep.asObservable()\n\t}\n\n\tget currentStep() {\n\t\treturn this._currentStep.value\n\t}\n\n\tsetStep(step: number) {\n\t\tthis._currentStep.next(step)\n\t}\n}\n\n/**\n * The actual context object. We provide/consume this in the container and steps.\n */\nexport const stepsContext = createContext<StepsController>(Symbol('SchmancyStepsContext'))\n","import { consume } from '@lit/context'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { when } from 'lit/directives/when.js'\nimport { Subscription } from 'rxjs'\nimport { stepsContext, StepsController } from './steps.context'\nimport { $LitElement } from '@mixins/litElement.mixin'\n\n@customElement('schmancy-step')\nexport class SchmancyStep extends $LitElement(css`\n\t:host {\n\t\tdisplay: grid;\n\t\t/* Base display is just grid, flex properties will be applied dynamically */\n\t}\n`) {\n\t/**\n\t * The step's position (1-based). This is used to compare against\n\t * the container's current step to decide if it's \"complete\",\n\t * \"current\", or \"upcoming\".\n\t */\n\t@property({ type: Number }) position = 1\n\n\t@property({ type: String }) title = ''\n\t@property({ type: String }) description = ''\n\n\t// NEW: Allow a step to be explicitly marked as complete.\n\t@property({ type: Boolean, reflect: true }) completed = false\n\n\t/**\n\t * NEW: Lock API to disable users from going back.\n\t * When set to true, clicking on a previous (completed) step is ignored.\n\t */\n\t@property({ type: Boolean }) lockBack = false\n\n\t/**\n\t * Consume the shared StepsController from context.\n\t */\n\t@consume({ context: stepsContext })\n\tprivate steps!: StepsController\n\n\t/**\n\t * Local reactive copy of the container's current step number.\n\t */\n\t@state()\n\tprivate currentStep = 1\n\n\t/**\n\t * Keep a reference to our subscription so we can unsubscribe cleanly.\n\t */\n\tprivate subscription?: Subscription\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\t// Subscribe to updates from the container's StepsController.\n\t\tthis.subscription = this.steps.currentStep$.subscribe(step => {\n\t\t\tthis.currentStep = step\n\t\t\t// When the current step changes, update the flex properties\n\t\t\tthis.updateFlexProperties()\n\t\t})\n\t\t// Initial update of flex properties\n\t\tthis.updateFlexProperties()\n\t}\n\n\tdisconnectedCallback(): void {\n\t\tthis.subscription?.unsubscribe()\n\t\tsuper.disconnectedCallback()\n\t}\n\n\t/**\n\t * Update the host element's flex properties based on active state\n\t */\n\tprivate updateFlexProperties() {\n\t\tconst isActive = this.position === this.currentStep\n\n\t\tif (isActive) {\n\t\t\t// Apply flex-grow when active\n\t\t\tthis.style.flex = '1 1 auto'\n\t\t} else {\n\t\t\t// Make it shrink when not active\n\t\t\tthis.style.flex = '0 0 auto'\n\t\t}\n\t}\n\n\t/**\n\t * Compute visual status for styling purposes. Note that if a step is explicitly\n\t * marked as completed, it always appears as complete even if it's active.\n\t */\n\tget status(): 'complete' | 'current' | 'upcoming' {\n\t\tif (this.completed || this.position < this.steps.currentStep) return 'complete'\n\t\tif (this.position === this.steps.currentStep) return 'current'\n\t\treturn 'upcoming'\n\t}\n\n\t/**\n\t * Click handler to allow navigation between completed (or active) steps.\n\t * With lockBack enabled, clicking on a previous step is ignored.\n\t */\n\tprivate _onStepClick(_e: Event) {\n\t\t// If lockBack is enabled and the user attempts to go back, do nothing.\n\t\tif (this.lockBack && this.position < this.steps.currentStep) {\n\t\t\treturn\n\t\t}\n\t\tif (this.status !== 'upcoming') {\n\t\t\tthis.steps.setStep(this.position)\n\t\t}\n\t}\n\n\trender() {\n\t\t// Determine if the step is currently active.\n\t\tconst isActive = this.position === this.currentStep\n\n\t\t// Use computed status for visual styling.\n\t\tconst isComplete = this.status === 'complete'\n\t\tconst isUpcoming = this.status === 'upcoming'\n\n\t\t// Tailwind (or similar) classes for styling.\n\t\tconst connectorClasses = {\n\t\t\t'bg-tertiary-default': isComplete,\n\t\t\t'bg-surface-container': !isComplete,\n\t\t}\n\n\t\tconst iconContainerClasses = {\n\t\t\t'relative border-solid z-10 flex size-5 items-center justify-center rounded-full': true,\n\t\t\t'bg-tertiary-default group-hover:bg-tertiary-onContainer': isComplete,\n\t\t\t'border-2 border-tertiary-default bg-surface': !isComplete && isActive,\n\t\t\t'border-2 border-outline bg-surface group-hover:border-outlineVariant': isUpcoming,\n\t\t}\n\n\t\tconst textClasses = {\n\t\t\t'text-tertiary-default': isActive,\n\t\t\t'text-surface-onVariant': !isActive,\n\t\t}\n\n\t\t// If the step is clickable (active or complete), add a pointer cursor.\n\t\tconst clickableClass = isActive || isComplete ? 'cursor-pointer' : ''\n\n\t\treturn html`\n\t\t\t<li class=\"relative\">\n\t\t\t\t<!-- Connector line -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute top-6 left-2.5 mt-0.5 -ml-px h-full w-0.5 ${this.classMap(connectorClasses)}\"\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Step Button/Label -->\n\t\t\t\t<button type=\"button\" @click=${this._onStepClick} class=\"relative flex items-center group ${clickableClass}\">\n\t\t\t\t\t<span class=\"flex items-center h-10\">\n\t\t\t\t\t\t<span class=${this.classMap(iconContainerClasses)}>\n\t\t\t\t\t\t\t${isComplete\n\t\t\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t\t\t<svg class=\"text-white size-3\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\tfill-rule=\"evenodd\"\n\t\t\t\t\t\t\t\t\t\t\t\td=\"M16.704 4.153a.75.75 0 0 1 .143 1.052l-8 10.5a.75.75 0 0 1-1.127.075l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 0 1 1.05-.143Z\"\n\t\t\t\t\t\t\t\t\t\t\t\tclip-rule=\"evenodd\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t\t`\n\t\t\t\t\t\t\t\t: html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"size-2.5 rounded-full ${isActive\n\t\t\t\t\t\t\t\t\t\t\t\t? 'bg-tertiary-default'\n\t\t\t\t\t\t\t\t\t\t\t\t: 'bg-transparent group-hover:bg-surface-container'}\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</span>\n\n\t\t\t\t\t<span class=\"flex flex-col items-start min-w-0 ml-4\">\n\t\t\t\t\t\t<schmancy-typography type=\"title\">\n\t\t\t\t\t\t\t<span class=${this.classMap(textClasses)}>${this.title}</span>\n\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t${when(\n\t\t\t\t\t\t\tthis.description,\n\t\t\t\t\t\t\t() => html`\n\t\t\t\t\t\t\t\t<schmancy-typography type=\"label\">\n\t\t\t\t\t\t\t\t\t<span class=\"text-surface-onVariant\">${this.description}</span>\n\t\t\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t)}\n\t\t\t\t\t</span>\n\t\t\t\t</button>\n\n\t\t\t\t<!-- Render step content if the step is active, regardless of completion -->\n\t\t\t\t${when(\n\t\t\t\t\tisActive,\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t<div class=\"pl-2 ml-2 block h-full pb-12\">\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</li>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-step': SchmancyStep\n\t}\n}\n","import { provide } from '@lit/context'\nimport { $LitElement } from '@mixins/litElement.mixin'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { StepsController, stepsContext } from './steps.context'\n\n@customElement('schmancy-steps-container')\nexport class SchmancyStepsContainer extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\tprivate controller = new StepsController()\n\n\t@provide({ context: stepsContext })\n\tstepsController = this.controller\n\n\t@property({ type: Number, reflect: true })\n\tset currentStep(value: number) {\n\t\tconst oldValue = this._currentStep\n\t\tthis._currentStep = value\n\t\tthis.controller.setStep(value)\n\t\tthis.requestUpdate('currentStep', oldValue)\n\t}\n\n\tget currentStep(): number {\n\t\treturn this._currentStep\n\t}\n\n\tprivate _currentStep = 1\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.controller.setStep(this.currentStep)\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<nav class=\"flex h-full w-full\" aria-label=\"Progress\">\n\t\t\t\t<ol class=\"flex flex-col flex-1\" role=\"list\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</ol>\n\t\t\t</nav>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-steps-container': SchmancyStepsContainer\n\t}\n}\n"],"names":["StepsController","constructor","this","_currentStep","BehaviorSubject","currentStep$","asObservable","currentStep","value","step","next","stepsContext","createContext","Symbol","SchmancyStep","$LitElement","css","super","arguments","position","title","description","completed","lockBack","connectedCallback","subscription","steps","subscribe","updateFlexProperties","disconnectedCallback","unsubscribe","isActive","style","flex","_e","status","setStep","render","isComplete","connectorClasses","iconContainerClasses","textClasses","clickableClass","html","classMap","_onStepClick","when","__decorateClass","property","type","Number","prototype","String","Boolean","reflect","consume","context","state","customElement","SchmancyStepsContainer","controller","stepsController","oldValue","requestUpdate","provide"],"mappings":"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"}

package/dist/{schmancy-steps-container-SZVHYv_6.js → schmancy-steps-container-uW2xtZGe.js}

@@ -1,8 +1,8 @@
-import { c as f } from "./consume-5D1qfVWM.js";
+import { c as g } from "./consume-5D1qfVWM.js";
 import { css as y, html as c } from "lit";
 import { property as l, state as S, customElement as b } from "lit/decorators.js";
 import { when as d } from "lit/directives/when.js";
-import { $ as m } from "./litElement.mixin-YJTCObjn.js";
+import { $ as m } from "./litElement.mixin-DeddWR3w.js";
 import { n as v, e as x } from "./provide-tcktw8xB.js";
 import { BehaviorSubject as k } from "rxjs";
 class C {
@@ -19,12 +19,12 @@ class C {
     this._currentStep.next(e);
   }
 }
-const g = v(Symbol("SchmancyStepsContext"));
-var $ = Object.defineProperty, w = Object.getOwnPropertyDescriptor, n = (t, e, o, r) => {
+const f = v(Symbol("SchmancyStepsContext"));
+var $ = Object.defineProperty, w = Object.getOwnPropertyDescriptor, p = (t, e, o, r) => {
   for (var i, s = r > 1 ? void 0 : r ? w(e, o) : e, a = t.length - 1; a >= 0; a--) (i = t[a]) && (s = (r ? i(e, o, s) : i(s)) || s);
   return r && s && $(e, o, s), s;
 };
-let p = class extends m(y`
+let n = class extends m(y`
 	:host {
 		display: grid;
 		/* Base display is just grid, flex properties will be applied dynamically */
@@ -52,7 +52,7 @@ let p = class extends m(y`
     this.lockBack && this.position < this.steps.currentStep || this.status !== "upcoming" && this.steps.setStep(this.position);
   }
   render() {
-    const t = this.position === this.currentStep, e = this.status === "complete", o = { "bg-tertiary-default": e, "bg-gray-300": !e }, r = { "relative border-solid z-10 flex size-5 items-center justify-center rounded-full": !0, "bg-tertiary-default group-hover:bg-tertiary-onContainer": e, "border-2 border-tertiary-default bg-white": !e && t, "border-2 border-gray-300 bg-white group-hover:border-gray-400": this.status === "upcoming" }, i = { "text-tertiary-default": t, "text-gray-500": !t }, s = t || e ? "cursor-pointer" : "";
+    const t = this.position === this.currentStep, e = this.status === "complete", o = { "bg-tertiary-default": e, "bg-surface-container": !e }, r = { "relative border-solid z-10 flex size-5 items-center justify-center rounded-full": !0, "bg-tertiary-default group-hover:bg-tertiary-onContainer": e, "border-2 border-tertiary-default bg-surface": !e && t, "border-2 border-outline bg-surface group-hover:border-outlineVariant": this.status === "upcoming" }, i = { "text-tertiary-default": t, "text-surface-onVariant": !t }, s = t || e ? "cursor-pointer" : "";
     return c`
 			<li class="relative">
 				<!-- Connector line -->
@@ -75,7 +75,7 @@ let p = class extends m(y`
 										</svg>
 									` : c`
 										<span
-											class="size-2.5 rounded-full ${t ? "bg-tertiary-default" : "bg-transparent group-hover:bg-gray-300"}"
+											class="size-2.5 rounded-full ${t ? "bg-tertiary-default" : "bg-transparent group-hover:bg-surface-container"}"
 										></span>
 									`}
 						</span>
@@ -87,7 +87,7 @@ let p = class extends m(y`
 						</schmancy-typography>
 						${d(this.description, () => c`
 								<schmancy-typography type="label">
-									<span class="text-gray-500">${this.description}</span>
+									<span class="text-surface-onVariant">${this.description}</span>
 								</schmancy-typography>
 							`)}
 					</span>
@@ -103,7 +103,7 @@ let p = class extends m(y`
 		`;
   }
 };
-n([l({ type: Number })], p.prototype, "position", 2), n([l({ type: String })], p.prototype, "title", 2), n([l({ type: String })], p.prototype, "description", 2), n([l({ type: Boolean, reflect: !0 })], p.prototype, "completed", 2), n([l({ type: Boolean })], p.prototype, "lockBack", 2), n([f({ context: g })], p.prototype, "steps", 2), n([S()], p.prototype, "currentStep", 2), p = n([b("schmancy-step")], p);
+p([l({ type: Number })], n.prototype, "position", 2), p([l({ type: String })], n.prototype, "title", 2), p([l({ type: String })], n.prototype, "description", 2), p([l({ type: Boolean, reflect: !0 })], n.prototype, "completed", 2), p([l({ type: Boolean })], n.prototype, "lockBack", 2), p([g({ context: f })], n.prototype, "steps", 2), p([S()], n.prototype, "currentStep", 2), n = p([b("schmancy-step")], n);
 var _ = Object.defineProperty, B = Object.getOwnPropertyDescriptor, h = (t, e, o, r) => {
   for (var i, s = r > 1 ? void 0 : r ? B(e, o) : e, a = t.length - 1; a >= 0; a--) (i = t[a]) && (s = (r ? i(e, o, s) : i(s)) || s);
   return r && s && _(e, o, s), s;
@@ -136,11 +136,11 @@ let u = class extends m(y`
 		`;
   }
 };
-h([x({ context: g })], u.prototype, "stepsController", 2), h([l({ type: Number, reflect: !0 })], u.prototype, "currentStep", 1), u = h([b("schmancy-steps-container")], u);
+h([x({ context: f })], u.prototype, "stepsController", 2), h([l({ type: Number, reflect: !0 })], u.prototype, "currentStep", 1), u = h([b("schmancy-steps-container")], u);
 export {
-  p as S,
+  n as S,
   u as a,
   C as b,
-  g as s
+  f as s
 };
-//# sourceMappingURL=schmancy-steps-container-SZVHYv_6.js.map
+//# sourceMappingURL=schmancy-steps-container-uW2xtZGe.js.map

package/dist/schmancy-steps-container-uW2xtZGe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schmancy-steps-container-uW2xtZGe.js","sources":["../src/steps/steps.context.ts","../src/steps/schmancy-step.ts","../src/steps/schmancy-steps-container.ts"],"sourcesContent":["import { createContext } from '@lit/context'\nimport { BehaviorSubject } from 'rxjs'\n\nexport class StepsController {\n\tprivate _currentStep = new BehaviorSubject(1)\n\n\tget currentStep$() {\n\t\treturn this._currentStep.asObservable()\n\t}\n\n\tget currentStep() {\n\t\treturn this._currentStep.value\n\t}\n\n\tsetStep(step: number) {\n\t\tthis._currentStep.next(step)\n\t}\n}\n\n/**\n * The actual context object. We provide/consume this in the container and steps.\n */\nexport const stepsContext = createContext<StepsController>(Symbol('SchmancyStepsContext'))\n","import { consume } from '@lit/context'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { when } from 'lit/directives/when.js'\nimport { Subscription } from 'rxjs'\nimport { stepsContext, StepsController } from './steps.context'\nimport { $LitElement } from '@mixins/litElement.mixin'\n\n@customElement('schmancy-step')\nexport class SchmancyStep extends $LitElement(css`\n\t:host {\n\t\tdisplay: grid;\n\t\t/* Base display is just grid, flex properties will be applied dynamically */\n\t}\n`) {\n\t/**\n\t * The step's position (1-based). This is used to compare against\n\t * the container's current step to decide if it's \"complete\",\n\t * \"current\", or \"upcoming\".\n\t */\n\t@property({ type: Number }) position = 1\n\n\t@property({ type: String }) title = ''\n\t@property({ type: String }) description = ''\n\n\t// NEW: Allow a step to be explicitly marked as complete.\n\t@property({ type: Boolean, reflect: true }) completed = false\n\n\t/**\n\t * NEW: Lock API to disable users from going back.\n\t * When set to true, clicking on a previous (completed) step is ignored.\n\t */\n\t@property({ type: Boolean }) lockBack = false\n\n\t/**\n\t * Consume the shared StepsController from context.\n\t */\n\t@consume({ context: stepsContext })\n\tprivate steps!: StepsController\n\n\t/**\n\t * Local reactive copy of the container's current step number.\n\t */\n\t@state()\n\tprivate currentStep = 1\n\n\t/**\n\t * Keep a reference to our subscription so we can unsubscribe cleanly.\n\t */\n\tprivate subscription?: Subscription\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\t// Subscribe to updates from the container's StepsController.\n\t\tthis.subscription = this.steps.currentStep$.subscribe(step => {\n\t\t\tthis.currentStep = step\n\t\t\t// When the current step changes, update the flex properties\n\t\t\tthis.updateFlexProperties()\n\t\t})\n\t\t// Initial update of flex properties\n\t\tthis.updateFlexProperties()\n\t}\n\n\tdisconnectedCallback(): void {\n\t\tthis.subscription?.unsubscribe()\n\t\tsuper.disconnectedCallback()\n\t}\n\n\t/**\n\t * Update the host element's flex properties based on active state\n\t */\n\tprivate updateFlexProperties() {\n\t\tconst isActive = this.position === this.currentStep\n\n\t\tif (isActive) {\n\t\t\t// Apply flex-grow when active\n\t\t\tthis.style.flex = '1 1 auto'\n\t\t} else {\n\t\t\t// Make it shrink when not active\n\t\t\tthis.style.flex = '0 0 auto'\n\t\t}\n\t}\n\n\t/**\n\t * Compute visual status for styling purposes. Note that if a step is explicitly\n\t * marked as completed, it always appears as complete even if it's active.\n\t */\n\tget status(): 'complete' | 'current' | 'upcoming' {\n\t\tif (this.completed || this.position < this.steps.currentStep) return 'complete'\n\t\tif (this.position === this.steps.currentStep) return 'current'\n\t\treturn 'upcoming'\n\t}\n\n\t/**\n\t * Click handler to allow navigation between completed (or active) steps.\n\t * With lockBack enabled, clicking on a previous step is ignored.\n\t */\n\tprivate _onStepClick(_e: Event) {\n\t\t// If lockBack is enabled and the user attempts to go back, do nothing.\n\t\tif (this.lockBack && this.position < this.steps.currentStep) {\n\t\t\treturn\n\t\t}\n\t\tif (this.status !== 'upcoming') {\n\t\t\tthis.steps.setStep(this.position)\n\t\t}\n\t}\n\n\trender() {\n\t\t// Determine if the step is currently active.\n\t\tconst isActive = this.position === this.currentStep\n\n\t\t// Use computed status for visual styling.\n\t\tconst isComplete = this.status === 'complete'\n\t\tconst isUpcoming = this.status === 'upcoming'\n\n\t\t// Tailwind (or similar) classes for styling.\n\t\tconst connectorClasses = {\n\t\t\t'bg-tertiary-default': isComplete,\n\t\t\t'bg-surface-container': !isComplete,\n\t\t}\n\n\t\tconst iconContainerClasses = {\n\t\t\t'relative border-solid z-10 flex size-5 items-center justify-center rounded-full': true,\n\t\t\t'bg-tertiary-default group-hover:bg-tertiary-onContainer': isComplete,\n\t\t\t'border-2 border-tertiary-default bg-surface': !isComplete && isActive,\n\t\t\t'border-2 border-outline bg-surface group-hover:border-outlineVariant': isUpcoming,\n\t\t}\n\n\t\tconst textClasses = {\n\t\t\t'text-tertiary-default': isActive,\n\t\t\t'text-surface-onVariant': !isActive,\n\t\t}\n\n\t\t// If the step is clickable (active or complete), add a pointer cursor.\n\t\tconst clickableClass = isActive || isComplete ? 'cursor-pointer' : ''\n\n\t\treturn html`\n\t\t\t<li class=\"relative\">\n\t\t\t\t<!-- Connector line -->\n\t\t\t\t<div\n\t\t\t\t\tclass=\"absolute top-6 left-2.5 mt-0.5 -ml-px h-full w-0.5 ${this.classMap(connectorClasses)}\"\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t></div>\n\n\t\t\t\t<!-- Step Button/Label -->\n\t\t\t\t<button type=\"button\" @click=${this._onStepClick} class=\"relative flex items-center group ${clickableClass}\">\n\t\t\t\t\t<span class=\"flex items-center h-10\">\n\t\t\t\t\t\t<span class=${this.classMap(iconContainerClasses)}>\n\t\t\t\t\t\t\t${isComplete\n\t\t\t\t\t\t\t\t? html`\n\t\t\t\t\t\t\t\t\t\t<svg class=\"text-white size-3\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\t\t\t\tfill-rule=\"evenodd\"\n\t\t\t\t\t\t\t\t\t\t\t\td=\"M16.704 4.153a.75.75 0 0 1 .143 1.052l-8 10.5a.75.75 0 0 1-1.127.075l-4.5-4.5a.75.75 0 0 1 1.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 0 1 1.05-.143Z\"\n\t\t\t\t\t\t\t\t\t\t\t\tclip-rule=\"evenodd\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t\t\t`\n\t\t\t\t\t\t\t\t: html`\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclass=\"size-2.5 rounded-full ${isActive\n\t\t\t\t\t\t\t\t\t\t\t\t? 'bg-tertiary-default'\n\t\t\t\t\t\t\t\t\t\t\t\t: 'bg-transparent group-hover:bg-surface-container'}\"\n\t\t\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t\t`}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</span>\n\n\t\t\t\t\t<span class=\"flex flex-col items-start min-w-0 ml-4\">\n\t\t\t\t\t\t<schmancy-typography type=\"title\">\n\t\t\t\t\t\t\t<span class=${this.classMap(textClasses)}>${this.title}</span>\n\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t${when(\n\t\t\t\t\t\t\tthis.description,\n\t\t\t\t\t\t\t() => html`\n\t\t\t\t\t\t\t\t<schmancy-typography type=\"label\">\n\t\t\t\t\t\t\t\t\t<span class=\"text-surface-onVariant\">${this.description}</span>\n\t\t\t\t\t\t\t\t</schmancy-typography>\n\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t)}\n\t\t\t\t\t</span>\n\t\t\t\t</button>\n\n\t\t\t\t<!-- Render step content if the step is active, regardless of completion -->\n\t\t\t\t${when(\n\t\t\t\t\tisActive,\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t<div class=\"pl-2 ml-2 block h-full pb-12\">\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</li>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-step': SchmancyStep\n\t}\n}\n","import { provide } from '@lit/context'\nimport { $LitElement } from '@mixins/litElement.mixin'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { StepsController, stepsContext } from './steps.context'\n\n@customElement('schmancy-steps-container')\nexport class SchmancyStepsContainer extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t}\n`) {\n\tprivate controller = new StepsController()\n\n\t@provide({ context: stepsContext })\n\tstepsController = this.controller\n\n\t@property({ type: Number, reflect: true })\n\tset currentStep(value: number) {\n\t\tconst oldValue = this._currentStep\n\t\tthis._currentStep = value\n\t\tthis.controller.setStep(value)\n\t\tthis.requestUpdate('currentStep', oldValue)\n\t}\n\n\tget currentStep(): number {\n\t\treturn this._currentStep\n\t}\n\n\tprivate _currentStep = 1\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.controller.setStep(this.currentStep)\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<nav class=\"flex h-full w-full\" aria-label=\"Progress\">\n\t\t\t\t<ol class=\"flex flex-col flex-1\" role=\"list\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</ol>\n\t\t\t</nav>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-steps-container': SchmancyStepsContainer\n\t}\n}\n"],"names":["StepsController","constructor","this","_currentStep","BehaviorSubject","currentStep$","asObservable","currentStep","value","step","next","stepsContext","createContext","Symbol","SchmancyStep","$LitElement","css","super","arguments","position","title","description","completed","lockBack","connectedCallback","subscription","steps","subscribe","updateFlexProperties","disconnectedCallback","unsubscribe","isActive","style","flex","status","_e","setStep","render","isComplete","connectorClasses","iconContainerClasses","textClasses","clickableClass","html","classMap","_onStepClick","when","__decorateClass","property","type","Number","prototype","String","Boolean","reflect","consume","context","state","customElement","SchmancyStepsContainer","controller","stepsController","oldValue","requestUpdate","provide"],"mappings":"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"}

package/dist/{select-cK7FzCV1.cjs → select-D0LtEjd0.cjs}

@@ -1,4 +1,4 @@
-"use strict";const h=require("@floating-ui/dom"),p=require("rxjs"),f=require("lit/directives/class-map.js");require("lit/directives/style-map.js");const m=require("./litElement.mixin-BEbYQVKW.cjs");require("./tailwind.mixin-NrMHmraa.cjs");const a=require("lit/decorators.js"),v=require("./ripple-C2BHbhcS.cjs"),u=require("./theme.interface-Xg5Zi46a.cjs"),c=require("lit");var S=Object.defineProperty,b=Object.getOwnPropertyDescriptor,o=(t,e,i,s)=>{for(var n,l=s>1?void 0:s?b(e,i):e,r=t.length-1;r>=0;r--)(n=t[r])&&(l=(s?n(e,i,l):n(l))||l);return s&&l&&S(e,i,l),l};exports.SchmancySelect=class extends m.$LitElement(c.css`
+"use strict";const h=require("@floating-ui/dom"),p=require("rxjs"),f=require("lit/directives/class-map.js");require("lit/directives/style-map.js");const m=require("./litElement.mixin-Co3Tb6le.cjs");require("./tailwind.mixin-Bg1s1U3X.cjs");const a=require("lit/decorators.js"),v=require("./ripple-C2BHbhcS.cjs"),u=require("./theme.interface-Xg5Zi46a.cjs"),c=require("lit");var S=Object.defineProperty,b=Object.getOwnPropertyDescriptor,o=(t,e,i,s)=>{for(var n,l=s>1?void 0:s?b(e,i):e,r=t.length-1;r>=0;r--)(n=t[r])&&(l=(s?n(e,i,l):n(l))||l);return s&&l&&S(e,i,l),l};exports.SchmancySelect=class extends m.$LitElement(c.css`
 	:host {
 		display: block;
 		position: relative;
@@ -54,4 +54,4 @@
 				</ul>
 			</div>
 		`}},exports.SchmancySelect.formAssociated=!0,o([a.property({type:String})],exports.SchmancySelect.prototype,"name",2),o([a.property({type:Boolean,reflect:!0})],exports.SchmancySelect.prototype,"required",2),o([a.property({type:Boolean,reflect:!0})],exports.SchmancySelect.prototype,"disabled",2),o([a.property({type:String})],exports.SchmancySelect.prototype,"placeholder",2),o([a.property({type:String,reflect:!0})],exports.SchmancySelect.prototype,"value",2),o([a.property({type:Boolean})],exports.SchmancySelect.prototype,"multi",2),o([a.property({type:String})],exports.SchmancySelect.prototype,"label",2),o([a.property({type:String})],exports.SchmancySelect.prototype,"hint",2),o([a.property({type:String})],exports.SchmancySelect.prototype,"validateOn",2),o([a.property({type:String})],exports.SchmancySelect.prototype,"size",2),o([a.state()],exports.SchmancySelect.prototype,"isOpen",2),o([a.state()],exports.SchmancySelect.prototype,"valueLabel",2),o([a.state()],exports.SchmancySelect.prototype,"isValid",2),o([a.property({type:String})],exports.SchmancySelect.prototype,"validationMessage",2),o([a.state()],exports.SchmancySelect.prototype,"defaultValue",2),o([a.query("ul")],exports.SchmancySelect.prototype,"ul",2),o([a.query("sch-input")],exports.SchmancySelect.prototype,"inputRef",2),o([a.queryAssignedElements({flatten:!0})],exports.SchmancySelect.prototype,"options",2),o([a.state()],exports.SchmancySelect.prototype,"_userInteracted",2),o([a.state()],exports.SchmancySelect.prototype,"_touched",2),o([a.state()],exports.SchmancySelect.prototype,"_dirty",2),o([a.state()],exports.SchmancySelect.prototype,"_submitted",2),o([a.state()],exports.SchmancySelect.prototype,"_focusedOptionId",2),exports.SchmancySelect=o([a.customElement("schmancy-select")],exports.SchmancySelect);
-//# sourceMappingURL=select-cK7FzCV1.cjs.map
+//# sourceMappingURL=select-D0LtEjd0.cjs.map