@mhmo91/schmancy 0.10.36 → 0.10.38

package/dist/{typography-BEGLfHwz.js.map → typography-SZhjb_4R.js.map}

@@ -1 +1 @@
-{"version":3,"file":"typography-BEGLfHwz.js","names":[],"sources":["../src/typography/typography.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { createRef, ref } from 'lit/directives/ref.js'\nimport { fromEvent } from 'rxjs'\nimport { filter, tap, takeUntil } from 'rxjs/operators'\n\n// Material Design 3 typography - https://m3.material.io/styles/typography/type-scale-tokens\n\n/**\n * @element schmancy-typography\n * @slot - The text for the typography.\n */\n@customElement('schmancy-typography')\nexport class SchmancyTypography extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tfont-family: inherit;\n\t\thyphens: none;\n\t}\n\n\t/* Text alignment */\n\t:host([align='center']) {\n\t\ttext-align: center;\n\t}\n\n\t:host([align='left']) {\n\t\ttext-align: start;\n\t}\n\n\t:host([align='right']) {\n\t\ttext-align: right;\n\t}\n\n\t:host([align='justify']) {\n\t\ttext-align: justify;\n\t}\n\n\t/* Font weight */\n\t:host([weight='bold']) {\n\t\tfont-weight: 700;\n\t}\n\n\t:host([weight='medium']) {\n\t\tfont-weight: 500;\n\t}\n\n\t:host([weight='normal']) {\n\t\tfont-weight: 400;\n\t}\n\n\t/* Text transform */\n\t:host([transform='uppercase']) {\n\t\ttext-transform: uppercase;\n\t}\n\n\t:host([transform='lowercase']) {\n\t\ttext-transform: lowercase;\n\t}\n\n\t:host([transform='capitalize']) {\n\t\ttext-transform: capitalize;\n\t}\n\n\t:host([transform='normal']) {\n\t\ttext-transform: none;\n\t}\n\n\t/* Type-based weight defaults (when using Tailwind classes without token) */\n\t:host([type='display']),\n\t:host([type='headline']),\n\t:host([type='body']) {\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='label']),\n\t:host([type='subtitle']),\n\t:host([type='title']) {\n\t\tfont-weight: 500;\n\t}\n\n\t/* Display typography variants - Material Design 3 + Extended */\n\t:host([type='display'][token='xl']) {\n\t\tfont-size: 72px;\n\t\tline-height: 80px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='lg']) {\n\t\tfont-size: 57px;\n\t\tline-height: 64px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='md']) {\n\t\tfont-size: 45px;\n\t\tline-height: 52px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='sm']) {\n\t\tfont-size: 36px;\n\t\tline-height: 44px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='xs']) {\n\t\tfont-size: 28px;\n\t\tline-height: 36px;\n\t\tfont-weight: 400;\n\t}\n\n\t/* Headline typography variants - Material Design 3 + Extended */\n\t:host([type='headline'][token='xl']) {\n\t\tfont-size: 36px;\n\t\tline-height: 44px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='lg']) {\n\t\tfont-size: 32px;\n\t\tline-height: 40px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='md']) {\n\t\tfont-size: 28px;\n\t\tline-height: 36px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='sm']) {\n\t\tfont-size: 24px;\n\t\tline-height: 32px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='xs']) {\n\t\tfont-size: 20px;\n\t\tline-height: 28px;\n\t\tfont-weight: 400;\n\t}\n\n\t/* Title typography variants - Material Design 3 + Extended */\n\t:host([type='title'][token='xl']) {\n\t\tfont-size: 24px;\n\t\tline-height: 32px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='title'][token='lg']) {\n\t\tfont-size: 22px;\n\t\tline-height: 28px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='title'][token='md']) {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='title'][token='sm']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='title'][token='xs']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t/* Subtitle typography variants - Extended from Material Design 3 */\n\t:host([type='subtitle'][token='xl']) {\n\t\tfont-size: 20px;\n\t\tline-height: 28px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='lg']) {\n\t\tfont-size: 18px;\n\t\tline-height: 24px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='md']) {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='sm']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='xs']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t/* Body typography variants - Material Design 3 + Extended */\n\t:host([type='body'][token='xl']) {\n\t\tfont-size: 18px;\n\t\tline-height: 28px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='lg']) {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='md']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='sm']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='xs']) {\n\t\tfont-size: 10px;\n\t\tline-height: 14px;\n\t\tfont-weight: 400;\n\t}\n\n\t/* Label typography variants - Material Design 3 + Extended */\n\t:host([type='label'][token='xl']) {\n\t\tfont-size: 16px;\n\t\tline-height: 22px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='lg']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='md']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='sm']) {\n\t\tfont-size: 11px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='xs']) {\n\t\tfont-size: 10px;\n\t\tline-height: 14px;\n\t\tfont-weight: 500;\n\t}\n\n\t/* Note: Custom letter-spacing, font-size, and line-height should be applied via inline styles or Tailwind classes */\n\n\t:host([editable]) {\n\t\tcursor: text;\n\t\tborder-radius: 4px;\n\t\ttransition: background 150ms;\n\t\tmin-height: 1em;\n\t}\n\t/* Editable div lives in shadow DOM so light DOM (Lit markers) is untouched */\n\t.edit {\n\t\toutline: none;\n\t\tmin-height: 1em;\n\t\tfont: inherit;\n\t\tcolor: inherit;\n\t\tletter-spacing: inherit;\n\t\tline-height: inherit;\n\t}\n\t.edit:empty::before {\n\t\tcontent: attr(data-placeholder);\n\t\tpointer-events: none;\n\t\tdisplay: block;\n\t\topacity: 0.35;\n\t}\n`];\n\tstatic shadowRootOptions: ShadowRootInit = {\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * @attr type - The type of the typography.\n\t * @default 'body'\n\t * @type {'display' | 'headline' | 'title' | 'subtitle' | 'body' | 'label'}\n\t */\n\t@property({ type: String, reflect: true })\n\ttype: 'display' | 'headline' | 'title' | 'subtitle' | 'body' | 'label' = 'body'\n\n\t/**\n\t * @attr token - The size token.\n\t * @deprecated Prefer using Tailwind responsive text classes for better responsive design.\n\t * Set token=\"\" and use class=\"text-sm md:text-base lg:text-lg\" instead.\n\t * Example: <schmancy-typography type=\"display\" token=\"\" class=\"text-2xl sm:text-3xl md:text-4xl\">\n\t * @default 'md'\n\t * @type {'xs' | 'sm' | 'md' | 'lg' | 'xl' | ''}\n\t */\n\t@property({ type: String, reflect: true })\n\ttoken: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '' = 'md'\n\n\t/**\n\t * @attr\n\t * @default inherit\n\t * @type {'left' |'center' |'right'}\n\t */\n\t@property({ type: String, reflect: true })\n\talign: 'left' | 'center' | 'justify' | 'right' | undefined\n\n\t/**\n\t * @attr\n\t * @default inherit\n\t * @type {'normal' | 'medium' |'bold'}\n\t * @public\n\t */\n\t@property({ type: String, reflect: true })\n\tweight: 'normal' | 'medium' | 'bold' | undefined\n\t\n\t/**\n\t *\n\t * @attr\n\t * @default inherit\n\t * @type {'uppercase' |'lowercase' |'capitalize' |'normal'}\n\t * @public\n\t */\n\t@property({ type: String, reflect: true }) \n\ttransform: 'uppercase' | 'lowercase' | 'capitalize' | 'normal' | undefined\n\n\t@property({ type: Number })\n\tmaxLines: 1 | 2 | 3 | 4 | 5 | 6 | undefined\n\n\t/** When true, the element becomes contenteditable and dispatches 'change' events on blur/Enter */\n\t@property({ type: Boolean, reflect: true }) editable = false\n\t/** The text value when in editable mode. Set via property binding: .value=${...} */\n\t@property({ type: String }) value = ''\n\t/** Placeholder shown when editable and empty */\n\t@property({ type: String }) placeholder = ''\n\n\tprivate _editRef = createRef<HTMLDivElement>()\n\n\t/** Focus and select all text in editable mode */\n\tselectAll() {\n\t\tconst el = this._editRef.value\n\t\tif (!el) return\n\t\tel.focus()\n\t\tconst sel = window.getSelection()\n\t\tif (sel && el.textContent) {\n\t\t\tconst range = document.createRange()\n\t\t\trange.selectNodeContents(el)\n\t\t\tsel.removeAllRanges()\n\t\t\tsel.addRange(range)\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tfromEvent<FocusEvent>(this, 'focusout').pipe(\n\t\t\tfilter(() => this.editable),\n\t\t\ttap(() => {\n\t\t\t\tconst el = this._editRef.value\n\t\t\t\tif (!el) return\n\t\t\t\tconst newValue = el.innerText.trim()\n\t\t\t\tif (newValue !== this.value) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('change', {\n\t\t\t\t\t\tdetail: { value: newValue },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}))\n\t\t\t\t}\n\t\t\t\t// Ensure truly empty so :empty CSS placeholder works\n\t\t\t\tif (!newValue) el.textContent = ''\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\n\t\t// Clean stray <br> / whitespace nodes so :empty CSS matches\n\t\tfromEvent(this, 'input').pipe(\n\t\t\tfilter(() => this.editable),\n\t\t\ttap(() => {\n\t\t\t\tconst el = this._editRef.value\n\t\t\t\tif (el && !el.innerText.trim()) el.textContent = ''\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\n\t\tfromEvent<KeyboardEvent>(this, 'keydown').pipe(\n\t\t\tfilter(() => this.editable),\n\t\t\tfilter(e => e.key === 'Enter'),\n\t\t\ttap(e => { e.preventDefault(); (this._editRef.value ?? this).blur() }),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\t}\n\n\tprotected updated(changedProperties: Map<string, unknown>): void {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('maxLines')) {\n\t\t\t// Remove all line-clamp classes\n\t\t\tthis.classList.remove('line-clamp-1', 'line-clamp-2', 'line-clamp-3', 'line-clamp-4', 'line-clamp-5', 'line-clamp-6')\n\t\t\t// Add the appropriate one\n\t\t\tif (this.maxLines) {\n\t\t\t\tthis.classList.add(`line-clamp-${this.maxLines}`)\n\t\t\t}\n\t\t}\n\t\tif ((changedProperties.has('value') || changedProperties.has('editable')) && this.editable) {\n\t\t\tconst el = this._editRef.value\n\t\t\tif (el && document.activeElement !== el) {\n\t\t\t\tif (this.value) {\n\t\t\t\t\tel.innerText = this.value\n\t\t\t\t} else {\n\t\t\t\t\tel.textContent = ''\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tprotected render(): unknown {\n\t\tif (this.editable) {\n\t\t\treturn html`<div\n\t\t\t\t${ref(this._editRef)}\n\t\t\t\tclass=\"edit\"\n\t\t\t\tcontenteditable=\"true\"\n\t\t\t\tdata-placeholder=${this.placeholder ?? ''}\n\t\t\t></div>`\n\t\t}\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-typography': SchmancyTypography\n\t}\n}"],"mappings":"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"}
+{"version":3,"file":"typography-SZhjb_4R.js","names":[],"sources":["../src/typography/typography.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { createRef, ref } from 'lit/directives/ref.js'\nimport { fromEvent } from 'rxjs'\nimport { filter, tap, takeUntil } from 'rxjs/operators'\n\n// Material Design 3 typography - https://m3.material.io/styles/typography/type-scale-tokens\n\n/**\n * @element schmancy-typography\n * @slot - The text for the typography.\n */\n@customElement('schmancy-typography')\nexport class SchmancyTypography extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tfont-family: inherit;\n\t\thyphens: none;\n\t}\n\n\t/* Text alignment */\n\t:host([align='center']) {\n\t\ttext-align: center;\n\t}\n\n\t:host([align='left']) {\n\t\ttext-align: start;\n\t}\n\n\t:host([align='right']) {\n\t\ttext-align: right;\n\t}\n\n\t:host([align='justify']) {\n\t\ttext-align: justify;\n\t}\n\n\t/* Font weight */\n\t:host([weight='bold']) {\n\t\tfont-weight: 700;\n\t}\n\n\t:host([weight='medium']) {\n\t\tfont-weight: 500;\n\t}\n\n\t:host([weight='normal']) {\n\t\tfont-weight: 400;\n\t}\n\n\t/* Text transform */\n\t:host([transform='uppercase']) {\n\t\ttext-transform: uppercase;\n\t}\n\n\t:host([transform='lowercase']) {\n\t\ttext-transform: lowercase;\n\t}\n\n\t:host([transform='capitalize']) {\n\t\ttext-transform: capitalize;\n\t}\n\n\t:host([transform='normal']) {\n\t\ttext-transform: none;\n\t}\n\n\t/* Type-based weight defaults (when using Tailwind classes without token) */\n\t:host([type='display']),\n\t:host([type='headline']),\n\t:host([type='body']) {\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='label']),\n\t:host([type='subtitle']),\n\t:host([type='title']) {\n\t\tfont-weight: 500;\n\t}\n\n\t/* Display typography variants - Material Design 3 + Extended */\n\t:host([type='display'][token='xl']) {\n\t\tfont-size: 72px;\n\t\tline-height: 80px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='lg']) {\n\t\tfont-size: 57px;\n\t\tline-height: 64px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='md']) {\n\t\tfont-size: 45px;\n\t\tline-height: 52px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='sm']) {\n\t\tfont-size: 36px;\n\t\tline-height: 44px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='display'][token='xs']) {\n\t\tfont-size: 28px;\n\t\tline-height: 36px;\n\t\tfont-weight: 400;\n\t}\n\n\t/* Headline typography variants - Material Design 3 + Extended */\n\t:host([type='headline'][token='xl']) {\n\t\tfont-size: 36px;\n\t\tline-height: 44px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='lg']) {\n\t\tfont-size: 32px;\n\t\tline-height: 40px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='md']) {\n\t\tfont-size: 28px;\n\t\tline-height: 36px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='sm']) {\n\t\tfont-size: 24px;\n\t\tline-height: 32px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='headline'][token='xs']) {\n\t\tfont-size: 20px;\n\t\tline-height: 28px;\n\t\tfont-weight: 400;\n\t}\n\n\t/* Title typography variants - Material Design 3 + Extended */\n\t:host([type='title'][token='xl']) {\n\t\tfont-size: 24px;\n\t\tline-height: 32px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='title'][token='lg']) {\n\t\tfont-size: 22px;\n\t\tline-height: 28px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='title'][token='md']) {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='title'][token='sm']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='title'][token='xs']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t/* Subtitle typography variants - Extended from Material Design 3 */\n\t:host([type='subtitle'][token='xl']) {\n\t\tfont-size: 20px;\n\t\tline-height: 28px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='lg']) {\n\t\tfont-size: 18px;\n\t\tline-height: 24px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='md']) {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='sm']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='subtitle'][token='xs']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t/* Body typography variants - Material Design 3 + Extended */\n\t:host([type='body'][token='xl']) {\n\t\tfont-size: 18px;\n\t\tline-height: 28px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='lg']) {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='md']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='sm']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 400;\n\t}\n\n\t:host([type='body'][token='xs']) {\n\t\tfont-size: 10px;\n\t\tline-height: 14px;\n\t\tfont-weight: 400;\n\t}\n\n\t/* Label typography variants - Material Design 3 + Extended */\n\t:host([type='label'][token='xl']) {\n\t\tfont-size: 16px;\n\t\tline-height: 22px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='lg']) {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='md']) {\n\t\tfont-size: 12px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='sm']) {\n\t\tfont-size: 11px;\n\t\tline-height: 16px;\n\t\tfont-weight: 500;\n\t}\n\n\t:host([type='label'][token='xs']) {\n\t\tfont-size: 10px;\n\t\tline-height: 14px;\n\t\tfont-weight: 500;\n\t}\n\n\t/* Note: Custom letter-spacing, font-size, and line-height should be applied via inline styles or Tailwind classes */\n\n\t:host([editable]) {\n\t\tcursor: text;\n\t\tborder-radius: 4px;\n\t\ttransition: background 150ms;\n\t\tmin-height: 1em;\n\t}\n\t/* Editable div lives in shadow DOM so light DOM (Lit markers) is untouched */\n\t.edit {\n\t\toutline: none;\n\t\tmin-height: 1em;\n\t\tfont: inherit;\n\t\tcolor: inherit;\n\t\tletter-spacing: inherit;\n\t\tline-height: inherit;\n\t}\n\t.edit:empty::before {\n\t\tcontent: attr(data-placeholder);\n\t\tpointer-events: none;\n\t\tdisplay: block;\n\t\topacity: 0.35;\n\t}\n`];\n\tstatic shadowRootOptions: ShadowRootInit = {\n\t\tmode: 'open',\n\t\tdelegatesFocus: true,\n\t}\n\n\t/**\n\t * @attr type - The type of the typography.\n\t * @default 'body'\n\t * @type {'display' | 'headline' | 'title' | 'subtitle' | 'body' | 'label'}\n\t */\n\t@property({ type: String, reflect: true })\n\ttype: 'display' | 'headline' | 'title' | 'subtitle' | 'body' | 'label' = 'body'\n\n\t/**\n\t * @attr token - The size token.\n\t * @deprecated Prefer using Tailwind responsive text classes for better responsive design.\n\t * Set token=\"\" and use class=\"text-sm md:text-base lg:text-lg\" instead.\n\t * Example: <schmancy-typography type=\"display\" token=\"\" class=\"text-2xl sm:text-3xl md:text-4xl\">\n\t * @default 'md'\n\t * @type {'xs' | 'sm' | 'md' | 'lg' | 'xl' | ''}\n\t */\n\t@property({ type: String, reflect: true })\n\ttoken: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '' = 'md'\n\n\t/**\n\t * @attr\n\t * @default inherit\n\t * @type {'left' |'center' |'right'}\n\t */\n\t@property({ type: String, reflect: true })\n\talign: 'left' | 'center' | 'justify' | 'right' | undefined\n\n\t/**\n\t * @attr\n\t * @default inherit\n\t * @type {'normal' | 'medium' |'bold'}\n\t * @public\n\t */\n\t@property({ type: String, reflect: true })\n\tweight: 'normal' | 'medium' | 'bold' | undefined\n\t\n\t/**\n\t *\n\t * @attr\n\t * @default inherit\n\t * @type {'uppercase' |'lowercase' |'capitalize' |'normal'}\n\t * @public\n\t */\n\t@property({ type: String, reflect: true }) \n\ttransform: 'uppercase' | 'lowercase' | 'capitalize' | 'normal' | undefined\n\n\t@property({ type: Number })\n\tmaxLines: 1 | 2 | 3 | 4 | 5 | 6 | undefined\n\n\t/** When true, the element becomes contenteditable and dispatches 'change' events on blur/Enter */\n\t@property({ type: Boolean, reflect: true }) editable = false\n\t/** The text value when in editable mode. Set via property binding: .value=${...} */\n\t@property({ type: String }) value = ''\n\t/** Placeholder shown when editable and empty */\n\t@property({ type: String }) placeholder = ''\n\n\tprivate editRef = createRef<HTMLDivElement>()\n\n\t/** Focus and select all text in editable mode */\n\tselectAll() {\n\t\tconst el = this.editRef.value\n\t\tif (!el) return\n\t\tel.focus()\n\t\tconst sel = window.getSelection()\n\t\tif (sel && el.textContent) {\n\t\t\tconst range = document.createRange()\n\t\t\trange.selectNodeContents(el)\n\t\t\tsel.removeAllRanges()\n\t\t\tsel.addRange(range)\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tfromEvent<FocusEvent>(this, 'focusout').pipe(\n\t\t\tfilter(() => this.editable),\n\t\t\ttap(() => {\n\t\t\t\tconst el = this.editRef.value\n\t\t\t\tif (!el) return\n\t\t\t\tconst newValue = el.innerText.trim()\n\t\t\t\tif (newValue !== this.value) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('change', {\n\t\t\t\t\t\tdetail: { value: newValue },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}))\n\t\t\t\t}\n\t\t\t\t// Ensure truly empty so :empty CSS placeholder works\n\t\t\t\tif (!newValue) el.textContent = ''\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\n\t\t// Clean stray <br> / whitespace nodes so :empty CSS matches\n\t\tfromEvent(this, 'input').pipe(\n\t\t\tfilter(() => this.editable),\n\t\t\ttap(() => {\n\t\t\t\tconst el = this.editRef.value\n\t\t\t\tif (el && !el.innerText.trim()) el.textContent = ''\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\n\t\tfromEvent<KeyboardEvent>(this, 'keydown').pipe(\n\t\t\tfilter(() => this.editable),\n\t\t\tfilter(e => e.key === 'Enter'),\n\t\t\ttap(e => { e.preventDefault(); (this.editRef.value ?? this).blur() }),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\t}\n\n\tprotected updated(changedProperties: Map<string, unknown>): void {\n\t\tsuper.updated(changedProperties)\n\t\tif (changedProperties.has('maxLines')) {\n\t\t\t// Remove all line-clamp classes\n\t\t\tthis.classList.remove('line-clamp-1', 'line-clamp-2', 'line-clamp-3', 'line-clamp-4', 'line-clamp-5', 'line-clamp-6')\n\t\t\t// Add the appropriate one\n\t\t\tif (this.maxLines) {\n\t\t\t\tthis.classList.add(`line-clamp-${this.maxLines}`)\n\t\t\t}\n\t\t}\n\t\tif ((changedProperties.has('value') || changedProperties.has('editable')) && this.editable) {\n\t\t\tconst el = this.editRef.value\n\t\t\tif (el && document.activeElement !== el) {\n\t\t\t\tif (this.value) {\n\t\t\t\t\tel.innerText = this.value\n\t\t\t\t} else {\n\t\t\t\t\tel.textContent = ''\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tprotected render(): unknown {\n\t\tif (this.editable) {\n\t\t\treturn html`<div\n\t\t\t\t${ref(this.editRef)}\n\t\t\t\tclass=\"edit\"\n\t\t\t\tcontenteditable=\"true\"\n\t\t\t\tdata-placeholder=${this.placeholder ?? ''}\n\t\t\t></div>`\n\t\t}\n\t\treturn html`<slot></slot>`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-typography': SchmancyTypography\n\t}\n}"],"mappings":"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"}

package/dist/typography.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./typography-CxA3sx9B.cjs`);Object.defineProperty(exports,`SchmancyTypography`,{enumerable:!0,get:function(){return e.t}});
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./typography-D4Fo1UGh.cjs`);Object.defineProperty(exports,`SchmancyTypography`,{enumerable:!0,get:function(){return e.t}});

package/dist/typography.js

@@ -1,2 +1,2 @@
-import { t as e } from "./typography-BEGLfHwz.js";
+import { t as e } from "./typography-SZhjb_4R.js";
 export { e as SchmancyTypography };

package/dist/visually-hidden.cjs

@@ -1,4 +1,4 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-CncqDLb2.cjs`);const e=require(`./SchmancyElement-BBzRWB1w.cjs`);require(`./mixins-DPdzC9ZH.cjs`);let t=require(`lit/decorators.js`),n=require(`lit`);var r=class extends e.t{static{this.styles=[n.css`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-CncqDLb2.cjs`);const e=require(`./SchmancyElement-C41uPa6l.cjs`);require(`./mixins-fIpzhVMd.cjs`);let t=require(`lit/decorators.js`),n=require(`lit`);var r=class extends e.t{static{this.styles=[n.css`
 	:host {
 		position: absolute;
 		width: 1px;

package/dist/visually-hidden.js

@@ -1,5 +1,5 @@
-import { t as e, u as t } from "./SchmancyElement-C3CpdNsi.js";
-import "./mixins-DTzfFVyv.js";
+import { t as e, u as t } from "./SchmancyElement-BNnyBOwk.js";
+import "./mixins-DGBI7YPO.js";
 import { customElement as n } from "lit/decorators.js";
 import { css as r, html as i } from "lit";
 var a = class extends e {

package/dist/{window-B_n4P9az.js → window-BDVyrBnk.js}

@@ -1,9 +1,9 @@
-import { t as e, u as t } from "./SchmancyElement-C3CpdNsi.js";
-import "./mixins-DTzfFVyv.js";
+import { t as e, u as t } from "./SchmancyElement-BNnyBOwk.js";
+import "./mixins-DGBI7YPO.js";
 import { d as n, f as r } from "./animation-DCznELuT.js";
 import { t as i } from "./reduced-motion-D-L12p7G.js";
 import { t as a } from "./cursor-glow-Ah7VXSj7.js";
-import { n as o } from "./theme.service-BfTK1Wtl.js";
+import { n as o } from "./theme.service-7VkM-hVf.js";
 import { t as s } from "./overlay-stack-D2rgxQLh.js";
 import { BehaviorSubject as c, EMPTY as l, Observable as u, animationFrameScheduler as d, auditTime as f, catchError as p, distinctUntilChanged as m, filter as h, finalize as g, from as _, fromEvent as v, map as y, merge as b, switchMap as x, take as S, takeUntil as C, tap as w } from "rxjs";
 import { classMap as T } from "lit/directives/class-map.js";
@@ -16,24 +16,25 @@ function L(e, t) {
 	return !(e.left >= t.left + t.width || e.left + e.width <= t.left || e.top >= t.top + t.height || e.top + e.height <= t.top);
 }
 var R, z = class e {
+	#e;
 	constructor() {
-		this._state$ = new c({
+		this.#e = new c({
 			windows: /* @__PURE__ */ new Map(),
 			focusedId: null,
 			stackOrder: []
-		}), this.state$ = this._state$.asObservable();
+		}), this.state$ = this.#e.asObservable();
 	}
 	static getInstance() {
 		return e.instance ||= new e(), e.instance;
 	}
 	get windows() {
-		return this._state$.value.windows;
+		return this.#e.value.windows;
 	}
 	get focusedId() {
-		return this._state$.value.focusedId;
+		return this.#e.value.focusedId;
 	}
 	register(e, t, n) {
-		let r = this._state$.value;
+		let r = this.#e.value;
 		if (r.windows.has(e)) return;
 		let i = {
 			id: e,
@@ -45,20 +46,20 @@ var R, z = class e {
 		}, a = new Map(r.windows);
 		a.set(e, i);
 		let o = s.getStackOrder();
-		this._state$.next({
+		this.#e.next({
 			...r,
 			windows: a,
 			stackOrder: o
 		});
 	}
 	unregister(e) {
-		let t = this._state$.value;
+		let t = this.#e.value;
 		if (!t.windows.has(e)) return;
 		s.releaseId(e);
 		let n = new Map(t.windows);
 		n.delete(e);
 		let r = s.getStackOrder(), i = t.focusedId === e ? null : t.focusedId;
-		this._state$.next({
+		this.#e.next({
 			...t,
 			windows: n,
 			stackOrder: r,
@@ -66,16 +67,16 @@ var R, z = class e {
 		});
 	}
 	updateBounds(e, t) {
-		this._updateRecord(e, { bounds: t });
+		this.updateRecord(e, { bounds: t });
 	}
 	updateVisualState(e, t) {
-		this._updateRecord(e, { visualState: t });
+		this.updateRecord(e, { visualState: t });
 	}
 	updateOpen(e, t) {
-		this._updateRecord(e, { open: t });
+		this.updateRecord(e, { open: t });
 	}
 	focus(e) {
-		let t = this._state$.value;
+		let t = this.#e.value;
 		if (!t.windows.has(e) || t.focusedId === e) return;
 		let n = s.bringToFront(e), r = new Map(t.windows), i = r.get(e);
 		i && r.set(e, {
@@ -83,7 +84,7 @@ var R, z = class e {
 			zIndex: n
 		});
 		let a = s.getStackOrder();
-		this._state$.next({
+		this.#e.next({
 			...t,
 			windows: r,
 			stackOrder: a,
@@ -92,19 +93,19 @@ var R, z = class e {
 	}
 	findOverlaps(e, t) {
 		let n = [];
-		for (let [r, i] of this._state$.value.windows) r !== t && L(e, i.bounds) && n.push(i);
+		for (let [r, i] of this.#e.value.windows) r !== t && L(e, i.bounds) && n.push(i);
 		return n;
 	}
 	getNeighbors(e) {
 		let t = [];
-		for (let [n, r] of this._state$.value.windows) n !== e && t.push(r);
+		for (let [n, r] of this.#e.value.windows) n !== e && t.push(r);
 		return t;
 	}
 	selectWindow(e) {
-		return this._state$.pipe(y((t) => t.windows.get(e)), m());
+		return this.#e.pipe(y((t) => t.windows.get(e)), m());
 	}
 	selectFocused() {
-		return this._state$.pipe(y((e) => e.focusedId), m());
+		return this.#e.pipe(y((e) => e.focusedId), m());
 	}
 	loadPosition(e) {
 		try {
@@ -124,14 +125,14 @@ var R, z = class e {
 			localStorage.removeItem(F + e), localStorage.removeItem(I + e);
 		} catch {}
 	}
-	_updateRecord(e, t) {
-		let n = this._state$.value, r = n.windows.get(e);
+	updateRecord(e, t) {
+		let n = this.#e.value, r = n.windows.get(e);
 		if (!r) return;
 		let i = new Map(n.windows);
 		i.set(e, {
 			...r,
 			...t
-		}), this._state$.next({
+		}), this.#e.next({
 			...n,
 			windows: i
 		});
@@ -157,18 +158,18 @@ var V = 48, H = class extends e {
 		R = this;
 	}
 	constructor(...e) {
-		super(...e), this.id = "default", this.lowered = !1, this.corner = "bottom-right", this.resizable = !1, this.freePosition = !1, this.visualState = "normal", this.minWidth = 280, this.minHeight = 200, this.open = !1, this._hasOpened = !1, this._position = {
+		super(...e), this.id = "default", this.lowered = !1, this.corner = "bottom-right", this.resizable = !1, this.freePosition = !1, this.visualState = "normal", this.minWidth = 280, this.minHeight = 200, this.open = !1, this.hasOpened = !1, this.position = {
 			x: 16,
 			y: 16
-		}, this._currentCorner = "bottom-right", this._appliedCorner = "", this._containerRef = N(), this._bodyRef = N(), this._headRef = N(), this._handleFocus = () => z.focus(this.id), this._handleHeadKeydown = (e) => {
+		}, this.currentCorner = "bottom-right", this.appliedCorner = "", this.containerRef = N(), this.bodyRef = N(), this.headRef = N(), this.handleFocus = () => z.focus(this.id), this.handleHeadKeydown = (e) => {
 			if (e.key === "Enter" || e.key === " ") return e.preventDefault(), void this.toggle();
 			if (e.key === "ArrowUp" || e.key === "ArrowDown" || e.key === "ArrowLeft" || e.key === "ArrowRight") {
 				e.preventDefault();
 				let t = e.shiftKey ? 20 : 5, n = e.key === "ArrowRight" ? t : e.key === "ArrowLeft" ? -t : 0, r = e.key === "ArrowDown" ? t : e.key === "ArrowUp" ? -t : 0;
-				this._position = {
-					x: this._position.x + n,
-					y: this._position.y + r
-				}, this._applyContainerPosition(), this._savePosition();
+				this.position = {
+					x: this.position.x + n,
+					y: this.position.y + r
+				}, this.applyContainerPosition(), this.savePosition();
 			}
 		};
 	}
@@ -188,7 +189,7 @@ var V = 48, H = class extends e {
 		return this.expandedWidth ?? "min(360px, calc(100vw - 32px))";
 	}
 	get isBottomCorner() {
-		return this._currentCorner.startsWith("bottom");
+		return this.currentCorner.startsWith("bottom");
 	}
 	get closedClipPath() {
 		return this.isBottomCorner ? "inset(calc(100% - 48px) 0px 0px 0px round 22px)" : "inset(0px 0px calc(100% - 48px) 0px round 22px)";
@@ -199,12 +200,12 @@ var V = 48, H = class extends e {
 	get elevation() {
 		return this.open ? 4 : this.lowered ? 1 : 3;
 	}
-	_applyContainerPosition() {
-		let e = this._containerRef.value;
+	applyContainerPosition() {
+		let e = this.containerRef.value;
 		if (!e) return;
-		this._appliedCorner !== this._currentCorner && (e.style.removeProperty("left"), e.style.removeProperty("right"), e.style.removeProperty("top"), e.style.removeProperty("bottom"), this._appliedCorner = this._currentCorner);
-		let { x: t, y: n } = this._position;
-		this._currentCorner.includes("right") ? e.style.right = `${t}px` : e.style.left = `${t}px`, this._currentCorner.includes("bottom") ? e.style.bottom = `${n + o.bottomOffset}px` : e.style.top = `${n}px`;
+		this.appliedCorner !== this.currentCorner && (e.style.removeProperty("left"), e.style.removeProperty("right"), e.style.removeProperty("top"), e.style.removeProperty("bottom"), this.appliedCorner = this.currentCorner);
+		let { x: t, y: n } = this.position;
+		this.currentCorner.includes("right") ? e.style.right = `${t}px` : e.style.left = `${t}px`, this.currentCorner.includes("bottom") ? e.style.bottom = `${n + o.bottomOffset}px` : e.style.top = `${n}px`;
 	}
 	static {
 		this.VALID_CORNERS = new Set([
@@ -214,34 +215,34 @@ var V = 48, H = class extends e {
 			"bottom-right"
 		]);
 	}
-	_loadPosition() {
+	loadPosition() {
 		let e = z.loadPosition(this.id);
-		e && (this._position = {
+		e && (this.position = {
 			x: e.x,
 			y: e.y
-		}, R.VALID_CORNERS.has(e.anchor) && (this._currentCorner = e.anchor));
+		}, R.VALID_CORNERS.has(e.anchor) && (this.currentCorner = e.anchor));
 	}
-	_savePosition() {
+	savePosition() {
 		z.savePosition(this.id, {
-			...this._position,
-			anchor: this._currentCorner
+			...this.position,
+			anchor: this.currentCorner
 		});
 	}
-	_validateBounds() {
-		let e = this._containerRef.value;
+	validateBounds() {
+		let e = this.containerRef.value;
 		if (!e) return;
 		let t = e.getBoundingClientRect();
 		if (t.width === 0) return;
-		let n = window.innerWidth, r = window.innerHeight, i = this._currentCorner.includes("right"), a = this._currentCorner.includes("bottom"), o = i ? n - this._position.x - t.width : this._position.x, s = a ? r - this._position.y - t.height : this._position.y, c = Math.max(0, Math.min(o, n - t.width)), l = Math.max(0, Math.min(s, r - t.height));
-		this._position = {
+		let n = window.innerWidth, r = window.innerHeight, i = this.currentCorner.includes("right"), a = this.currentCorner.includes("bottom"), o = i ? n - this.position.x - t.width : this.position.x, s = a ? r - this.position.y - t.height : this.position.y, c = Math.max(0, Math.min(o, n - t.width)), l = Math.max(0, Math.min(s, r - t.height));
+		this.position = {
 			x: i ? n - c - t.width : c,
 			y: a ? r - l - t.height : l
-		}, this._applyContainerPosition();
+		}, this.applyContainerPosition();
 	}
-	_reorientToNearestCorner(e = !1) {
+	reorientToNearestCorner(e = !1) {
 		if (this.freePosition) {
-			this._savePosition();
-			let e = this._containerRef.value?.getBoundingClientRect();
+			this.savePosition();
+			let e = this.containerRef.value?.getBoundingClientRect();
 			e && z.updateBounds(this.id, {
 				left: e.left,
 				top: e.top,
@@ -250,14 +251,14 @@ var V = 48, H = class extends e {
 			});
 			return;
 		}
-		let t = this._containerRef.value;
+		let t = this.containerRef.value;
 		if (!t) return;
-		let r = t.getBoundingClientRect(), a = this._currentCorner.includes("bottom"), o = r.left + r.width / 2, s = a ? r.bottom - 24 : r.top + 24, c = o > window.innerWidth / 2 ? "right" : "left", u = `${s > window.innerHeight / 2 ? "bottom" : "top"}-${c}`;
-		if (this._currentCorner = u, this._position = {
+		let r = t.getBoundingClientRect(), a = this.currentCorner.includes("bottom"), o = r.left + r.width / 2, s = a ? r.bottom - 24 : r.top + 24, c = o > window.innerWidth / 2 ? "right" : "left", u = `${s > window.innerHeight / 2 ? "bottom" : "top"}-${c}`;
+		if (this.currentCorner = u, this.position = {
 			x: 16,
 			y: 16
-		}, this._applyContainerPosition(), this.open || (t.style.clipPath = this.closedClipPath), e || i.value) {
-			this._savePosition();
+		}, this.applyContainerPosition(), this.open || (t.style.clipPath = this.closedClipPath), e || i.value) {
+			this.savePosition();
 			let e = t.getBoundingClientRect();
 			z.updateBounds(this.id, {
 				left: e.left,
@@ -283,11 +284,11 @@ var V = 48, H = class extends e {
 				width: e.width,
 				height: e.height
 			});
-		}), p(() => l), C(this.disconnecting)).subscribe(), this._savePosition();
+		}), p(() => l), C(this.disconnecting)).subscribe(), this.savePosition();
 	}
-	_drag$() {
+	drag$() {
 		return new u(() => {
-			let e = this._headRef.value, t = this._containerRef.value;
+			let e = this.headRef.value, t = this.containerRef.value;
 			if (!e || !t) return;
 			let n = !1, r = v(e, "pointerdown").pipe(h((e) => e.button === 0), h((e) => {
 				let t = e.target.tagName?.toLowerCase();
@@ -300,7 +301,7 @@ var V = 48, H = class extends e {
 			}), w((e) => {
 				e.preventDefault(), e.stopPropagation();
 			})).pipe(y((e) => {
-				let r = t.getBoundingClientRect(), i = this._currentCorner.includes("bottom"), a = this.open;
+				let r = t.getBoundingClientRect(), i = this.currentCorner.includes("bottom"), a = this.open;
 				return n = !1, {
 					startX: e.clientX,
 					startY: e.clientY,
@@ -320,19 +321,19 @@ var V = 48, H = class extends e {
 				}))), _ = v(window, "pointerup").pipe(h((e) => e.pointerId === p));
 				return m.pipe(w(({ clientX: d, clientY: f }) => {
 					let p = d - e, m = f - r;
-					if (Math.sqrt(p * p + m * m) > 5 && !n && (n = !0, this._applyDragVisuals(!0), u)) {
+					if (Math.sqrt(p * p + m * m) > 5 && !n && (n = !0, this.applyDragVisuals(!0), u)) {
 						this.open = !1, t.style.clipPath = this.closedClipPath, t.style.overflow = "hidden";
-						let e = this._bodyRef.value;
+						let e = this.bodyRef.value;
 						e && (e.inert = !0, e.style.visibility = "hidden");
 					}
 					if (!n) return;
 					let h = Math.max(0, Math.min(d - i, s - o.width)), g = l ? V - o.height : 0, _ = l ? c - o.height : c - V, v = Math.max(g, Math.min(f - a, _));
-					this._position = {
-						x: this._currentCorner.includes("right") ? s - h - o.width : h,
+					this.position = {
+						x: this.currentCorner.includes("right") ? s - h - o.width : h,
 						y: l ? c - v - o.height : v
-					}, this._applyContainerPosition();
+					}, this.applyContainerPosition();
 				}), C(_), g(() => {
-					n ? (this._reorientToNearestCorner(), this._applyDragVisuals(!1), n = !1) : (n = !1, this.toggle());
+					n ? (this.reorientToNearestCorner(), this.applyDragVisuals(!1), n = !1) : (n = !1, this.toggle());
 				}));
 			})).subscribe();
 			return () => r.unsubscribe();
@@ -340,8 +341,8 @@ var V = 48, H = class extends e {
 	}
 	connectedCallback() {
 		super.connectedCallback(), _(this.updateComplete).pipe(S(1), w(() => {
-			this._currentCorner = this.corner, this._loadPosition(), this._applyContainerPosition(), this._initDOMState();
-			let e = this._containerRef.value;
+			this.currentCorner = this.corner, this.loadPosition(), this.applyContainerPosition(), this.initDOMState();
+			let e = this.containerRef.value;
 			if (e) {
 				let t = e.getBoundingClientRect(), n = {
 					left: t.left,
@@ -349,25 +350,25 @@ var V = 48, H = class extends e {
 					width: t.width,
 					height: t.height
 				};
-				z.register(this.id, n, this.freePosition ? "free" : this._currentCorner);
+				z.register(this.id, n, this.freePosition ? "free" : this.currentCorner);
 			}
-		}), x(() => b(this._drag$(), z.selectWindow(this.id).pipe(w((e) => {
+		}), x(() => b(this.drag$(), z.selectWindow(this.id).pipe(w((e) => {
 			if (!e) return;
-			let t = this._containerRef.value;
+			let t = this.containerRef.value;
 			t && (t.style.zIndex = String(e.zIndex));
-		})))), C(this.disconnecting)).subscribe(), b(v(window, "resize").pipe(f(0, d), w(() => this._validateBounds())), o.bottomOffset$.pipe(w(() => this._applyContainerPosition()))).pipe(C(this.disconnecting)).subscribe();
+		})))), C(this.disconnecting)).subscribe(), b(v(window, "resize").pipe(f(0, d), w(() => this.validateBounds())), o.bottomOffset$.pipe(w(() => this.applyContainerPosition()))).pipe(C(this.disconnecting)).subscribe();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), z.unregister(this.id);
 	}
-	_initDOMState() {
-		let e = this._containerRef.value, t = this._bodyRef.value;
-		e && (this._applyContainerPosition(), this.open ? (this._hasOpened = !0, e.style.overflow = "", t && (t.inert = !1, t.style.visibility = "visible")) : (e.style.clipPath = this.closedClipPath, e.style.overflow = "hidden", t && (t.inert = !0, t.style.visibility = "hidden")));
+	initDOMState() {
+		let e = this.containerRef.value, t = this.bodyRef.value;
+		e && (this.applyContainerPosition(), this.open ? (this.hasOpened = !0, e.style.overflow = "", t && (t.inert = !1, t.style.visibility = "visible")) : (e.style.clipPath = this.closedClipPath, e.style.overflow = "hidden", t && (t.inert = !0, t.style.visibility = "hidden")));
 	}
-	_animateOpen() {
-		let e = this._containerRef.value, t = this._bodyRef.value;
+	animateOpen() {
+		let e = this.containerRef.value, t = this.bodyRef.value;
 		if (!e) return;
-		this._hasOpened = !0, this.open = !0;
+		this.hasOpened = !0, this.open = !0;
 		let n = e.getBoundingClientRect(), a = {
 			left: n.left,
 			top: this.isBottomCorner ? n.top - 400 : n.top,
@@ -380,15 +381,15 @@ var V = 48, H = class extends e {
 				height: window.innerHeight
 			});
 			if (Math.abs(e.left - a.left) > 10 || Math.abs(e.top - a.top) > 10) {
-				let t = this._currentCorner.includes("right"), n = this._currentCorner.includes("bottom");
-				this._position = {
+				let t = this.currentCorner.includes("right"), n = this.currentCorner.includes("bottom");
+				this.position = {
 					x: t ? window.innerWidth - e.left - e.width : e.left,
 					y: n ? window.innerHeight - e.top - e.height : e.top
-				}, this._applyContainerPosition();
+				}, this.applyContainerPosition();
 			}
 		}
 		if (t && (t.style.visibility = "visible", t.inert = !1), i.value) return e.style.clipPath = "", e.style.overflow = "", void this.dispatchScopedEvent("window-toggle", { state: "expanded" });
-		this._currentAnimation?.cancel(), e.style.overflow = "hidden", e.style.willChange = "opacity";
+		this.currentAnimation?.cancel(), e.style.overflow = "hidden", e.style.willChange = "opacity";
 		let s = [{
 			clipPath: this.closedClipPath,
 			opacity: .95
@@ -400,20 +401,20 @@ var V = 48, H = class extends e {
 			easing: r.easingFallback,
 			fill: "forwards"
 		});
-		this._currentAnimation = c, _(c.finished).pipe(S(1), w(() => {
+		this.currentAnimation = c, _(c.finished).pipe(S(1), w(() => {
 			e.isConnected && (e.style.clipPath = "", e.style.overflow = "", e.style.willChange = "");
 		}), p(() => l), C(this.disconnecting)).subscribe(), this.dispatchScopedEvent("window-toggle", { state: "expanded" });
 	}
-	_animateClose() {
-		let e = this._containerRef.value;
+	animateClose() {
+		let e = this.containerRef.value;
 		if (!e) return;
 		if (i.value) {
 			e.style.clipPath = this.closedClipPath, e.style.overflow = "hidden", this.open = !1;
-			let t = this._bodyRef.value;
+			let t = this.bodyRef.value;
 			t && (t.inert = !0, t.style.visibility = "hidden"), this.dispatchScopedEvent("window-toggle", { state: "collapsed" });
 			return;
 		}
-		this._currentAnimation?.cancel(), e.style.overflow = "hidden", e.style.willChange = "opacity";
+		this.currentAnimation?.cancel(), e.style.overflow = "hidden", e.style.willChange = "opacity";
 		let t = [{
 			clipPath: this.openClipPath,
 			opacity: 1
@@ -425,27 +426,27 @@ var V = 48, H = class extends e {
 			easing: "cubic-bezier(0.4, 0, 0.8, 0.15)",
 			fill: "forwards"
 		});
-		this._currentAnimation = n, _(n.finished).pipe(S(1), w(() => {
+		this.currentAnimation = n, _(n.finished).pipe(S(1), w(() => {
 			this.open = !1, e.style.willChange = "";
-			let t = this._bodyRef.value;
+			let t = this.bodyRef.value;
 			t && (t.inert = !0, t.style.visibility = "hidden");
 		}), p(() => l), C(this.disconnecting)).subscribe(), this.dispatchScopedEvent("window-toggle", { state: "collapsed" });
 	}
-	_applyDragVisuals(e) {
-		let t = this._headRef.value, n = this._containerRef.value;
+	applyDragVisuals(e) {
+		let t = this.headRef.value, n = this.containerRef.value;
 		t && (t.classList.toggle("cursor-grabbing", e), t.classList.toggle("cursor-move", !e)), n && (n.style.opacity = e ? "0.95" : "");
 	}
 	toggle() {
-		this.open ? this._animateClose() : this._animateOpen();
+		this.open ? this.animateClose() : this.animateOpen();
 	}
 	expand() {
-		this.open || this._animateOpen();
+		this.open || this.animateOpen();
 	}
 	close() {
-		this.open && this._animateClose();
+		this.open && this.animateClose();
 	}
 	render() {
-		let e = this._currentCorner.startsWith("bottom"), t = T({
+		let e = this.currentCorner.startsWith("bottom"), t = T({
 			fixed: !0,
 			flex: !0,
 			"flex-col": e,
@@ -469,23 +470,23 @@ var V = 48, H = class extends e {
 		});
 		return j`
 			<schmancy-surface
-				${P(this._containerRef)}
+				${P(this.containerRef)}
 				type="glass"
 				.elevation=${this.elevation}
 				class=${t}
 				style=${n}
 				aria-expanded=${this.open}
-				@pointerdown=${this._handleFocus}
+				@pointerdown=${this.handleFocus}
 			>
 				<!-- Details section (visually above summary for bottom corners) -->
 				<section
-					${P(this._bodyRef)}
+					${P(this.bodyRef)}
 					class="flex-1 min-h-0 overflow-hidden flex flex-col"
 					style=${r}
 					role="region"
 					aria-label="Expandable content"
 				>
-					${this._hasOpened ? j`<slot name="details"></slot>` : M}
+					${this.hasOpened ? j`<slot name="details"></slot>` : M}
 				</section>
 
 				<!-- Summary section -- always interactive, always visible -->
@@ -497,7 +498,7 @@ var V = 48, H = class extends e {
 		})}
 				>
 					<div
-						${P(this._headRef)}
+						${P(this.headRef)}
 						${a({
 			radius: 200,
 			intensity: .1
@@ -507,7 +508,7 @@ var V = 48, H = class extends e {
 						tabindex="0"
 						title="Drag to move, click to expand"
 						aria-label="${this.open ? "Collapse window" : "Expand window"}"
-						@keydown=${this._handleHeadKeydown}
+						@keydown=${this.handleHeadKeydown}
 					>
 						<div class="flex-1 min-w-0">
 							<slot></slot>
@@ -534,6 +535,6 @@ t([O({ type: String })], H.prototype, "id", void 0), t([O({ type: String })], H.
 })], H.prototype, "visualState", void 0), t([O({ type: Number })], H.prototype, "minWidth", void 0), t([O({ type: Number })], H.prototype, "minHeight", void 0), t([O({
 	type: Boolean,
 	reflect: !0
-})], H.prototype, "open", void 0), t([k()], H.prototype, "_hasOpened", void 0), t([k()], H.prototype, "_currentCorner", void 0);
+})], H.prototype, "open", void 0), t([k()], H.prototype, "hasOpened", void 0), t([k()], H.prototype, "currentCorner", void 0);
 var U = H = R = t([D("schmancy-window")], H);
 export { z as n, U as t };