@vielzeug/refine 2.0.0 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./styles/mixins/theme.css.cjs"),n=require("./core/date-picker.cjs"),r=require("./core/positioner.cjs"),i=require("./shared/prop-bundles.cjs"),a=require("./inputs/shared/native-field-event.cjs"),o=require("./inputs/date-picker/date-picker.css.cjs");let s=require("@vielzeug/ore"),c=require("@vielzeug/ripple"),l=require("@vielzeug/tempo");var u=`ore-date-picker`;(0,s.define)(u,{formAssociated:!0,props:{...i.themableBundle,...i.sizableBundle,...i.disablableBundle,...i.roundableBundle,error:s.prop.string(),fullwidth:s.prop.bool(!1),helper:s.prop.string(),label:s.prop.string(),"label-placement":s.prop.oneOf([`inset`,`outside`],`inset`),locale:s.prop.string(),max:s.prop.string(),min:s.prop.string(),name:s.prop.string(),placeholder:s.prop.string(),required:s.prop.bool(!1),success:s.prop.bool(!1),value:s.prop.string(),variant:s.prop.string(),"weekend-days":s.prop.json([])},setup(e){let t=(0,s.getHost)(),i=(0,c.signal)(!1),o=(0,c.signal)(void 0),u=(0,c.computed)(()=>o.value===void 0?n.parseIso(e.value.value):o.value);a.defineFieldValue(t,()=>n.toIsoString(u.value)??``,e=>{o.value=n.parseIso(e)});let d=(0,c.computed)(()=>!!e.disabled.value),f=(0,c.computed)(()=>e.locale.value||(typeof navigator<`u`?navigator.language:`en`)),p=n.createDatePickerControl({get locale(){return f.value},get max(){return n.parseIso(e.max.value)},get min(){return n.parseIso(e.min.value)},onChange(e){o.value=e,i.value=!1,p.setView(`day`),m.value=`day`,h.value=p.displayYear(),g.value=p.displayMonth(),a.setFieldValue(t,n.toIsoString(e)??``),a.dispatchNativeFieldEvent(t,`input`),a.dispatchNativeFieldEvent(t,`change`)},get value(){return u.value},get weekendDays(){return e[`weekend-days`].value??[]}}),m=(0,c.signal)(`day`),h=(0,c.signal)(p.displayYear()),g=(0,c.signal)(p.displayMonth());(0,s.useField)({disabled:d,toFormValue:e=>e||null,value:(0,c.computed)(()=>n.toIsoString(u.value)??``)});let _=`date-picker-${Math.random().toString(36).slice(2,9)}-calendar`,v=(0,s.ref)(),y=(0,s.ref)(),b=r.createDropdownPositioner({getFloating:()=>y.value??null,getReference:()=>v.value??null,matchWidth:!1,offsetPx:4}),x=null,S=(0,c.computed)(()=>u.value?n.formatDisplayDate(u.value,f.value):e.placeholder.value||``),C=(0,c.computed)(()=>{let e=l.Temporal.PlainDate.from({day:1,month:g.value,year:h.value});return(0,l.format)(e,{intl:{month:`long`},locale:f.value,tz:`UTC`})}),w=(0,c.computed)(()=>String(h.value)),T=(0,c.computed)(()=>`${C.value} ${w.value}`),E=(0,c.computed)(()=>(h.value,g.value,u.value,p.dayCells())),D=(0,c.computed)(()=>(h.value,p.monthCells())),O=(0,c.computed)(()=>(h.value,p.yearCells())),k=(0,c.computed)(()=>p.weekdayLabels()),A=()=>d.value?`-1`:`0`;function j(){m.value===`day`?p.prevMonth():p.prevYear(),h.value=p.displayYear(),g.value=p.displayMonth()}function M(){m.value===`day`?p.nextMonth():p.nextYear(),h.value=p.displayYear(),g.value=p.displayMonth()}function N(){let e=[`day`,`month`,`year`],t=e[(e.indexOf(m.value)+1)%e.length];p.setView(t),m.value=t}function P(e){p.goTo(p.displayYear(),e),p.setView(`day`),h.value=p.displayYear(),g.value=p.displayMonth(),m.value=`day`}function F(e){p.goTo(e,p.displayMonth()),p.setView(`month`),h.value=p.displayYear(),m.value=`month`}function I(e){let t=n.parseIso(e);t&&p.select(t)}function L(e){let t=e.currentTarget,n=t.closest(`.cal-grid-days`);if(!n)return;let r=Array.from(n.querySelectorAll(`.cal-cell-day`)),i=r.indexOf(t);if(i===-1)return;let a;if(e.key===`Enter`||e.key===` `){e.preventDefault(),I(t.dataset.iso??``);return}if(e.key===`ArrowRight`)a=r[i+1];else if(e.key===`ArrowLeft`)a=r[i-1];else if(e.key===`ArrowDown`)a=r[i+7];else if(e.key===`ArrowUp`)a=r[i-7];else if(e.key===`Home`)a=r[Math.floor(i/7)*7];else if(e.key===`End`)a=r[Math.floor(i/7)*7+6];else return;e.preventDefault(),a?.focus()}function R(e,t,n,r){let i=e.currentTarget,a=i.closest(`.cal-grid`);if(!a)return;let o=Array.from(a.querySelectorAll(t)),s=o.indexOf(i);if(s===-1)return;let c;if(e.key===`Enter`||e.key===` `){e.preventDefault(),r();return}if(e.key===`ArrowRight`)c=o[s+1];else if(e.key===`ArrowLeft`)c=o[s-1];else if(e.key===`ArrowDown`)c=o[s+n];else if(e.key===`ArrowUp`)c=o[s-n];else if(e.key===`Home`)c=o[Math.floor(s/n)*n];else if(e.key===`End`)c=o[Math.min(Math.floor(s/n)*n+n-1,o.length-1)];else return;e.preventDefault(),c?.focus()}function z(){if(d.value)return;i.value=!0,p.setView(`day`),m.value=`day`;let e=u.value;e&&(p.goTo(e.year,e.month),h.value=p.displayYear(),g.value=p.displayMonth()),b.update(),x=b.startAutoUpdate?.()??null}function B(){i.value=!1,p.setView(`day`),m.value=`day`,x?.(),x=null}function V(){i.value?B():z()}function H(e){d.value||(e.key===`Enter`||e.key===` `?(e.preventDefault(),V()):e.key===`Escape`&&i.value&&(e.preventDefault(),B()))}function U(e){e.key===`Escape`&&(e.preventDefault(),B())}function W(e){i.value&&(e.composedPath().includes(t)||B())}return(0,s.onMounted)(()=>(document.addEventListener(`pointerdown`,W,{capture:!0}),()=>{document.removeEventListener(`pointerdown`,W,{capture:!0}),x?.(),x=null})),(0,s.bind)({attr:{open:()=>i.value?!0:void 0}}),s.html`
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./styles/mixins/theme.css.cjs"),n=require("./core/date-picker.cjs"),r=require("./core/positioner.cjs"),i=require("./shared/prop-bundles.cjs"),a=require("./inputs/shared/native-field-event.cjs"),o=require("./inputs/date-picker/date-picker.css.cjs");let s=require("@vielzeug/ore"),c=require("@vielzeug/ripple"),l=require("@vielzeug/tempo");var u=`ore-date-picker`;(0,s.define)(u,{formAssociated:!0,props:{...i.themableBundle,...i.sizableBundle,...i.disablableBundle,...i.roundableBundle,error:s.prop.string(),fullwidth:s.prop.bool(!1),helper:s.prop.string(),label:s.prop.string(),"label-placement":s.prop.oneOf([`inset`,`outside`],`inset`),locale:s.prop.string(),max:s.prop.string(),min:s.prop.string(),name:s.prop.string(),placeholder:s.prop.string(),required:s.prop.bool(!1),success:s.prop.bool(!1),value:s.prop.string(),variant:s.prop.string(),"weekend-days":s.prop.json([])},setup(e){let t=(0,s.getHost)(),i=(0,c.signal)(!1),o=(0,c.signal)(void 0),u=(0,c.computed)(()=>o.value===void 0?n.parseIso(e.value.value):o.value);a.defineFieldValue(t,()=>n.toIsoString(u.value)??``,e=>{o.value=n.parseIso(e)});let d=(0,c.computed)(()=>!!e.disabled.value),f=(0,c.computed)(()=>e.locale.value||(typeof navigator<`u`?navigator.language:`en`)),p=n.createDatePickerControl({get locale(){return f.value},get max(){return n.parseIso(e.max.value)},get min(){return n.parseIso(e.min.value)},onChange(e){o.value=e,i.value=!1,p.setView(`day`),m.value=`day`,h.value=p.displayYear(),g.value=p.displayMonth(),a.setFieldValue(t,n.toIsoString(e)??``),a.dispatchNativeFieldEvent(t,`input`),a.dispatchNativeFieldEvent(t,`change`)},get value(){return u.value},get weekendDays(){return e[`weekend-days`].value??[]}}),m=(0,c.signal)(`day`),h=(0,c.signal)(p.displayYear()),g=(0,c.signal)(p.displayMonth());(0,s.useField)({disabled:d,toFormValue:e=>e||null,value:(0,c.computed)(()=>n.toIsoString(u.value)??``)});let _=`date-picker-${Math.random().toString(36).slice(2,9)}-calendar`,v=(0,s.ref)(),y=(0,s.ref)(),b=r.createDropdownPositioner({getFloating:()=>y.value??null,getReference:()=>v.value??null,matchWidth:!1,offsetPx:4}),x=null,S=(0,c.computed)(()=>u.value?n.formatDisplayDate(u.value,f.value):e.placeholder.value||``),C=(0,c.computed)(()=>{let e=l.Temporal.PlainDate.from({day:1,month:g.value,year:h.value});return(0,l.format)(e,{intl:{month:`long`},locale:f.value,timeZone:`UTC`})}),w=(0,c.computed)(()=>String(h.value)),T=(0,c.computed)(()=>`${C.value} ${w.value}`),E=(0,c.computed)(()=>(h.value,g.value,u.value,p.dayCells())),D=(0,c.computed)(()=>(h.value,p.monthCells())),O=(0,c.computed)(()=>(h.value,p.yearCells())),k=(0,c.computed)(()=>p.weekdayLabels()),A=()=>d.value?`-1`:`0`;function j(){m.value===`day`?p.prevMonth():p.prevYear(),h.value=p.displayYear(),g.value=p.displayMonth()}function M(){m.value===`day`?p.nextMonth():p.nextYear(),h.value=p.displayYear(),g.value=p.displayMonth()}function N(){let e=[`day`,`month`,`year`],t=e[(e.indexOf(m.value)+1)%e.length];p.setView(t),m.value=t}function P(e){p.goTo(p.displayYear(),e),p.setView(`day`),h.value=p.displayYear(),g.value=p.displayMonth(),m.value=`day`}function F(e){p.goTo(e,p.displayMonth()),p.setView(`month`),h.value=p.displayYear(),m.value=`month`}function I(e){let t=n.parseIso(e);t&&p.select(t)}function L(e){let t=e.currentTarget,n=t.closest(`.cal-grid-days`);if(!n)return;let r=Array.from(n.querySelectorAll(`.cal-cell-day`)),i=r.indexOf(t);if(i===-1)return;let a;if(e.key===`Enter`||e.key===` `){e.preventDefault(),I(t.dataset.iso??``);return}if(e.key===`ArrowRight`)a=r[i+1];else if(e.key===`ArrowLeft`)a=r[i-1];else if(e.key===`ArrowDown`)a=r[i+7];else if(e.key===`ArrowUp`)a=r[i-7];else if(e.key===`Home`)a=r[Math.floor(i/7)*7];else if(e.key===`End`)a=r[Math.floor(i/7)*7+6];else return;e.preventDefault(),a?.focus()}function R(e,t,n,r){let i=e.currentTarget,a=i.closest(`.cal-grid`);if(!a)return;let o=Array.from(a.querySelectorAll(t)),s=o.indexOf(i);if(s===-1)return;let c;if(e.key===`Enter`||e.key===` `){e.preventDefault(),r();return}if(e.key===`ArrowRight`)c=o[s+1];else if(e.key===`ArrowLeft`)c=o[s-1];else if(e.key===`ArrowDown`)c=o[s+n];else if(e.key===`ArrowUp`)c=o[s-n];else if(e.key===`Home`)c=o[Math.floor(s/n)*n];else if(e.key===`End`)c=o[Math.min(Math.floor(s/n)*n+n-1,o.length-1)];else return;e.preventDefault(),c?.focus()}function z(){if(d.value)return;i.value=!0,p.setView(`day`),m.value=`day`;let e=u.value;e&&(p.goTo(e.year,e.month),h.value=p.displayYear(),g.value=p.displayMonth()),b.update(),x=b.startAutoUpdate?.()??null}function B(){i.value=!1,p.setView(`day`),m.value=`day`,x?.(),x=null}function V(){i.value?B():z()}function H(e){d.value||(e.key===`Enter`||e.key===` `?(e.preventDefault(),V()):e.key===`Escape`&&i.value&&(e.preventDefault(),B()))}function U(e){e.key===`Escape`&&(e.preventDefault(),B())}function W(e){i.value&&(e.composedPath().includes(t)||B())}return(0,s.onMounted)(()=>(document.addEventListener(`pointerdown`,W,{capture:!0}),()=>{document.removeEventListener(`pointerdown`,W,{capture:!0}),x?.(),x=null})),(0,s.bind)({attr:{open:()=>i.value?!0:void 0}}),s.html`
2
2
  <!-- Trigger: ore-input in readonly display mode -->
3
3
  <ore-input
4
4
  class="trigger"
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker.cjs","names":[],"sources":["../src/inputs/date-picker/date-picker.ts"],"sourcesContent":["import { define, html, prop, ref, bind, getHost, onMounted } from '@vielzeug/ore';\nimport { useField } from '@vielzeug/ore';\nimport { computed, signal } from '@vielzeug/ripple';\nimport { Temporal, format } from '@vielzeug/tempo';\n\nimport type { ComponentSize, RoundedSize, ThemeColor, VisualVariant } from '../../shared';\n\nimport {\n createDatePickerControl,\n createDropdownPositioner,\n formatDisplayDate,\n parseIso,\n toIsoString,\n type DatePickerView,\n} from '../../core';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin } from '../../styles';\nimport { defineFieldValue, dispatchNativeFieldEvent, setFieldValue } from '../shared/native-field-event';\nimport componentStyles from './date-picker.css?inline';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type OreDatePickerEvents = {\n change: Event;\n input: Event;\n};\n\nexport type OreDatePickerProps = {\n /** Theme color */\n color?: ThemeColor;\n /** Disable the picker */\n disabled?: boolean;\n /** Validation error message */\n error?: string;\n /** Expand to container width */\n fullwidth?: boolean;\n /** Helper text below the field */\n helper?: string;\n /** Visible label */\n label?: string;\n /** Label placement */\n 'label-placement'?: 'inset' | 'outside';\n /** Locale for day/month names (default: browser locale) */\n locale?: string;\n /** Latest selectable date in ISO 8601 format (yyyy-MM-dd) */\n max?: string;\n /** Earliest selectable date in ISO 8601 format (yyyy-MM-dd) */\n min?: string;\n /** Form field name */\n name?: string;\n /** Placeholder shown in the text trigger */\n placeholder?: string;\n /** Mark field as required */\n required?: boolean;\n /** Border radius */\n rounded?: RoundedSize;\n /** Component size */\n size?: ComponentSize;\n /**\n * Shows an inline green check icon inside the field to confirm the value has\n * passed validation. Ignored while `error` is set — an error always wins.\n */\n success?: boolean;\n /**\n * Selected date in ISO 8601 format (yyyy-MM-dd).\n * @example '2025-06-15'\n */\n value?: string;\n /** Visual variant */\n variant?: Exclude<VisualVariant, 'text' | 'frost'>;\n /**\n * Day-of-week indices to disable (0 = Sunday … 6 = Saturday).\n * Pass as a JSON array attribute or a JS property.\n * @example\n * ```html\n * <ore-date-picker weekend-days=\"[0,6]\"></ore-date-picker>\n * ```\n */\n 'weekend-days'?: number[];\n};\n\n/**\n * An accessible, keyboard-navigable date picker with an inline calendar popup.\n * Supports min/max bounds, disabled weekend days, and form association.\n *\n * @element ore-date-picker\n *\n * @attr {string} value - Selected date in ISO 8601 format (yyyy-MM-dd)\n * @attr {string} min - Minimum selectable date (yyyy-MM-dd)\n * @attr {string} max - Maximum selectable date (yyyy-MM-dd)\n * @attr {string} label - Label text\n * @attr {string} label-placement - 'inset' | 'outside'\n * @attr {string} placeholder - Trigger placeholder\n * @attr {boolean} disabled - Disable the picker\n * @attr {boolean} required - Required field\n * @attr {string} name - Form field name\n * @attr {string} error - Error message\n * @attr {boolean} success - Show an inline success check icon (suppressed while `error` is set)\n * @attr {string} helper - Helper text\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - Component size: 'sm' | 'md' | 'lg'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} locale - BCP 47 locale string\n * @attr {string} weekend-days - Comma-separated day indices to disable\n *\n * @fires input - Fired when a date is selected.\n * @fires change - Fired when a date is selected.\n *\n * @slot label - Custom label for the trigger field\n * @slot prefix - Content before the trigger text (e.g. icon)\n * @slot helper - Custom helper text\n * @slot error - Custom error content\n *\n * @cssprop --date-picker-bg - Calendar background\n * @cssprop --date-picker-border-color - Calendar border color\n * @cssprop --date-picker-radius - Calendar border radius\n * @cssprop --date-picker-day-selected-bg - Background of selected day\n * @cssprop --date-picker-day-today-color - Color of today's date number\n * @cssprop --date-picker-day-outside-opacity - Opacity of days outside visible month\n *\n * @part field - The trigger button/field\n * @part calendar - The floating calendar panel\n * @part header - Calendar header (nav + label)\n * @part grid - Day grid\n * @part day - Individual day cell\n *\n * @example\n * ```html\n * <!-- Single date with constraints -->\n * <ore-date-picker label=\"Appointment date\" name=\"date\" min=\"2025-01-01\" max=\"2025-12-31\" color=\"primary\"></ore-date-picker>\n *\n *\n * <!-- Outside label, bordered variant -->\n * <ore-date-picker label=\"Start date\" label-placement=\"outside\" variant=\"bordered\"></ore-date-picker>\n * ```\n */\nexport const DATE_PICKER_TAG = 'ore-date-picker' as const;\n\ndefine<OreDatePickerProps>(DATE_PICKER_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n locale: prop.string(),\n max: prop.string(),\n min: prop.string(),\n name: prop.string(),\n placeholder: prop.string(),\n required: prop.bool(false),\n success: prop.bool(false),\n value: prop.string(),\n variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n 'weekend-days': prop.json([] as number[]),\n },\n\n setup(props) {\n const el = getHost();\n\n // ── Signals ─────────────────────────────────────────────────────────────\n\n const isOpen = signal(false);\n\n // ── Selected date: local-override pattern ──────────────────────────────\n // localSelection holds a user-initiated pick (or undefined = no override).\n // selectedDate falls back to the value prop reactively — no setInterval needed.\n\n const localSelection = signal<Temporal.PlainDate | null | undefined>(undefined);\n\n const selectedDate = computed(() =>\n localSelection.value !== undefined ? localSelection.value : parseIso(props.value.value),\n );\n\n defineFieldValue(\n el,\n () => toIsoString(selectedDate.value) ?? '',\n (value) => {\n localSelection.value = parseIso(value);\n },\n );\n\n const isDisabled = computed(() => Boolean(props.disabled.value));\n const locale = computed(() => props.locale.value || (typeof navigator !== 'undefined' ? navigator.language : 'en'));\n\n // ── Date-picker control ─────────────────────────────────────────────────\n\n const ctrl = createDatePickerControl({\n get locale() {\n return locale.value;\n },\n get max() {\n return parseIso(props.max.value);\n },\n get min() {\n return parseIso(props.min.value);\n },\n onChange(date) {\n localSelection.value = date;\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n setFieldValue(el, toIsoString(date) ?? '');\n dispatchNativeFieldEvent(el, 'input');\n dispatchNativeFieldEvent(el, 'change');\n },\n get value() {\n return selectedDate.value;\n },\n get weekendDays() {\n return props['weekend-days'].value ?? [];\n },\n });\n\n // ── Reactive display state ────────────────────────────────────────────\n // Three separate primitive signals — the proven pattern.\n\n const currentView = signal<DatePickerView>('day');\n const displayYear = signal(ctrl.displayYear());\n const displayMonth = signal(ctrl.displayMonth()); // 1-indexed (Temporal)\n\n // ── Form value (host is formAssociated) ──────────────────────────────────\n\n useField<string>({\n disabled: isDisabled,\n toFormValue: (v) => v || null,\n value: computed(() => toIsoString(selectedDate.value) ?? ''),\n });\n\n const dialogId = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`;\n\n // ── Floating position ────────────────────────────────────────────────────\n // The old CSS-only `position: absolute; top: 100%` positioned the calendar relative to\n // the host box — fine until the host sits near a scroll/clip ancestor's edge (e.g. a form\n // grid inside a dialog), where the same absolute box also expands that ancestor's\n // *scrollable* overflow area even though it never changes the ancestor's own layout size,\n // which reads as \"the dialog got bigger\"/jumped. `createDropdownPositioner` — the same\n // Orbit-powered primitive `ore-select`'s dropdown already uses — positions via `fixed` +\n // computed `top`/`left`, auto-detecting both the nearest clipping ancestor (so flip/shift\n // keep the calendar within the dialog panel, not just the page viewport) and any ancestor\n // that establishes a containing block for `position: fixed` (a dialog panel's entrance\n // transition commonly leaves a permanent, if visually-identity, `transform` at rest) —\n // see `createDropdownPositioner`'s own `boundary`/`containingBlock` docs.\n const triggerRef = ref<HTMLElement>();\n const calendarRef = ref<HTMLElement>();\n\n const positioner = createDropdownPositioner({\n getFloating: () => calendarRef.value ?? null,\n getReference: () => triggerRef.value ?? null,\n matchWidth: false,\n offsetPx: 4,\n });\n\n let stopAutoUpdate: (() => void) | null = null;\n\n // ── Derived display values ───────────────────────────────────────────────\n\n const triggerText = computed(() => {\n if (selectedDate.value) return formatDisplayDate(selectedDate.value, locale.value);\n\n return props.placeholder.value || '';\n });\n\n const displayMonth_ = computed(() => {\n const d = Temporal.PlainDate.from({ day: 1, month: displayMonth.value, year: displayYear.value });\n\n return format(d, { intl: { month: 'long' }, locale: locale.value, tz: 'UTC' });\n });\n\n const displayYear_ = computed(() => String(displayYear.value));\n const displayLabel = computed(() => `${displayMonth_.value} ${displayYear_.value}`);\n\n const dayCells = computed(() => {\n void displayYear.value;\n void displayMonth.value;\n void selectedDate.value; // re-run when selection changes to refresh isSelected flags\n\n return ctrl.dayCells();\n });\n const monthCells = computed(() => {\n void displayYear.value;\n\n return ctrl.monthCells();\n });\n const yearCells = computed(() => {\n void displayYear.value;\n\n return ctrl.yearCells();\n });\n const weekdayLabels = computed(() => ctrl.weekdayLabels());\n const tabIndex = () => (isDisabled.value ? '-1' : '0');\n\n // ── Navigation handlers ──────────────────────────────────────────────────\n // In year/month views navigate by year; in day view navigate by month.\n\n function handlePrev(): void {\n if (currentView.value === 'day') ctrl.prevMonth();\n else ctrl.prevYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleNext(): void {\n if (currentView.value === 'day') ctrl.nextMonth();\n else ctrl.nextYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleHeaderClick(): void {\n const views: DatePickerView[] = ['day', 'month', 'year'];\n const next = views[(views.indexOf(currentView.value) + 1) % views.length];\n\n ctrl.setView(next);\n currentView.value = next;\n }\n\n function handleSelectMonth(month: number): void {\n ctrl.goTo(ctrl.displayYear(), month);\n ctrl.setView('day');\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n currentView.value = 'day';\n }\n\n function handleSelectYear(year: number): void {\n ctrl.goTo(year, ctrl.displayMonth());\n ctrl.setView('month');\n displayYear.value = ctrl.displayYear();\n currentView.value = 'month';\n }\n\n function handleSelectDay(isoStr: string): void {\n const date = parseIso(isoStr);\n\n if (!date) return;\n\n ctrl.select(date);\n }\n\n function handleDayKeydown(e: KeyboardEvent): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid-days');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>('.cal-cell-day'));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleSelectDay(cell.dataset.iso ?? '');\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + 7];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - 7];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / 7) * 7];\n } else if (e.key === 'End') {\n target = allCells[Math.floor(idx / 7) * 7 + 6];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Month/year-cell keyboard navigation (fixed 4-column grid) ─────────────\n\n function handleGridKeydown(e: KeyboardEvent, cellSelector: string, columns: number, onSelect: () => void): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>(cellSelector));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onSelect();\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + columns];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - columns];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / columns) * columns];\n } else if (e.key === 'End') {\n target = allCells[Math.min(Math.floor(idx / columns) * columns + columns - 1, allCells.length - 1)];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Open / close ─────────────────────────────────────────────────────────\n\n function openPicker(): void {\n if (isDisabled.value) return;\n\n isOpen.value = true;\n ctrl.setView('day');\n currentView.value = 'day';\n\n const sel = selectedDate.value;\n\n if (sel) {\n ctrl.goTo(sel.year, sel.month);\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n positioner.update();\n stopAutoUpdate = positioner.startAutoUpdate?.() ?? null;\n }\n\n function closePicker(): void {\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n }\n\n function handleTriggerClick(): void {\n if (isOpen.value) closePicker();\n else openPicker();\n }\n\n // ── Keyboard handlers ────────────────────────────────────────────────────\n\n function handleTriggerKeydown(e: KeyboardEvent): void {\n if (isDisabled.value) return;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleTriggerClick();\n } else if (e.key === 'Escape' && isOpen.value) {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleCalendarKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleOutsideClick(e: PointerEvent | MouseEvent): void {\n if (!isOpen.value) return;\n\n const path = e.composedPath();\n\n if (!path.includes(el)) closePicker();\n }\n\n // ── Lifecycle ────────────────────────────────────────────────────────────\n\n onMounted(() => {\n document.addEventListener('pointerdown', handleOutsideClick, { capture: true });\n\n return () => {\n document.removeEventListener('pointerdown', handleOutsideClick, { capture: true });\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n };\n });\n\n // ── Host bindings ────────────────────────────────────────────────────────\n\n bind({\n attr: {\n open: () => (isOpen.value ? true : undefined),\n },\n });\n\n // ── Template ─────────────────────────────────────────────────────────────\n\n const inputValue = () => triggerText.value;\n const inputLabel = () => props.label.value ?? '';\n const inputPlaceholder = () => props.placeholder.value ?? '';\n const inputLabelPlacement = () => props['label-placement'].value ?? 'inset';\n const inputColor = () => props.color?.value ?? undefined;\n const inputSize = () => props.size?.value ?? undefined;\n const inputVariant = () => props.variant?.value ?? undefined;\n const inputRounded = () => props.rounded?.value ?? undefined;\n const inputHelper = () => props.helper.value ?? '';\n const inputError = () => props.error.value ?? '';\n const inputDisabled = () => (isDisabled.value ? true : undefined);\n const inputRequired = () => (props.required.value ? true : undefined);\n const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n return html`\n <!-- Trigger: ore-input in readonly display mode -->\n <ore-input\n class=\"trigger\"\n ref=\"${triggerRef}\"\n readonly\n tabindex=\"${tabIndex}\"\n role=\"combobox\"\n aria-haspopup=\"dialog\"\n aria-controls=\"${dialogId}\"\n aria-expanded=\"${() => String(isOpen.value)}\"\n aria-disabled=\"${() => (isDisabled.value ? 'true' : null)}\"\n value=\"${inputValue}\"\n label=\"${inputLabel}\"\n placeholder=\"${inputPlaceholder}\"\n label-placement=\"${inputLabelPlacement}\"\n color=\"${inputColor}\"\n size=\"${inputSize}\"\n variant=\"${inputVariant}\"\n rounded=\"${inputRounded}\"\n helper=\"${inputHelper}\"\n error=\"${inputError}\"\n ?disabled=\"${inputDisabled}\"\n ?required=\"${inputRequired}\"\n ?fullwidth=\"${inputFullwidth}\"\n ?success=\"${() => props.success.value}\"\n @click=\"${handleTriggerClick}\"\n @keydown=\"${handleTriggerKeydown}\">\n <ore-icon slot=\"suffix\" name=\"calendar\" size=\"16\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n </ore-input>\n\n <!-- Calendar popup -->\n <div\n class=\"calendar\"\n ref=\"${calendarRef}\"\n id=\"${dialogId}\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"${() => `Choose date — ${displayLabel.value}`}\"\n ?data-open=\"${isOpen}\"\n @keydown=\"${handleCalendarKeydown}\">\n <!-- Calendar header -->\n <div class=\"cal-header\" part=\"header\">\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Previous\" @click=\"${handlePrev}\">\n <ore-icon name=\"chevron-left\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n <button\n class=\"cal-label-btn\"\n type=\"button\"\n aria-label=\"${() =>\n `Switch to ${currentView.value === 'day' ? 'month' : currentView.value === 'month' ? 'year' : 'day'} view`}\"\n @click=\"${handleHeaderClick}\">\n <span class=\"cal-label-month\">${displayMonth_}</span>\n <span class=\"cal-label-sep\" aria-hidden=\"true\">/</span>\n <span class=\"cal-label-year\">${displayYear_}</span>\n </button>\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Next\" @click=\"${handleNext}\">\n <ore-icon name=\"chevron-right\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n </div>\n\n <!-- Day view: flat 7-column CSS grid, weekday headers + day cells -->\n <div\n class=\"cal-grid cal-grid-days\"\n role=\"grid\"\n part=\"grid\"\n aria-label=\"${() => displayLabel.value}\"\n ?hidden=\"${() => currentView.value !== 'day'}\">\n <div role=\"row\" class=\"cal-grid-row\">\n ${() =>\n weekdayLabels.value.map(\n (lbl) => html`\n <div class=\"cal-cell cal-cell-head\" role=\"columnheader\" aria-label=\"${lbl}\">${lbl}</div>\n `,\n )}\n </div>\n ${() => {\n const cells = dayCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));\n\n return rows.map(\n (row) => html`\n <div role=\"row\" class=\"cal-grid-row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-day\"\n role=\"gridcell\"\n part=\"day\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n aria-current=\"${() => (cell.isToday ? 'date' : null)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-today=\"${() => cell.isToday}\"\n ?data-outside=\"${() => cell.isOutsideMonth}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n data-iso=\"${cell.iso}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => handleSelectDay(cell.iso)}\"\n @keydown=\"${handleDayKeydown}\">\n ${String(cell.day)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Month view -->\n <div\n class=\"cal-grid cal-grid-months\"\n role=\"grid\"\n aria-label=\"${() => displayYear_.value}\"\n ?hidden=\"${() => currentView.value !== 'month'}\">\n ${() => {\n const cells = monthCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-month\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-month', 4, () => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n })}\">\n ${cell.shortLabel}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Year view -->\n <div\n class=\"cal-grid cal-grid-years\"\n role=\"grid\"\n aria-label=\"Select year\"\n ?hidden=\"${() => currentView.value !== 'year'}\">\n ${() => {\n const cells = yearCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-year\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-year', 4, () => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n })}\">\n ${String(cell.year)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n </div>\n `;\n },\n\n shadow: { delegatesFocus: true },\n styles: [colorThemeMixin, reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"date-picker.cjs","names":[],"sources":["../src/inputs/date-picker/date-picker.ts"],"sourcesContent":["import { define, html, prop, ref, bind, getHost, onMounted } from '@vielzeug/ore';\nimport { useField } from '@vielzeug/ore';\nimport { computed, signal } from '@vielzeug/ripple';\nimport { Temporal, format } from '@vielzeug/tempo';\n\nimport type { ComponentSize, RoundedSize, ThemeColor, VisualVariant } from '../../shared';\n\nimport {\n createDatePickerControl,\n createDropdownPositioner,\n formatDisplayDate,\n parseIso,\n toIsoString,\n type DatePickerView,\n} from '../../core';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin } from '../../styles';\nimport { defineFieldValue, dispatchNativeFieldEvent, setFieldValue } from '../shared/native-field-event';\nimport componentStyles from './date-picker.css?inline';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type OreDatePickerEvents = {\n change: Event;\n input: Event;\n};\n\nexport type OreDatePickerProps = {\n /** Theme color */\n color?: ThemeColor;\n /** Disable the picker */\n disabled?: boolean;\n /** Validation error message */\n error?: string;\n /** Expand to container width */\n fullwidth?: boolean;\n /** Helper text below the field */\n helper?: string;\n /** Visible label */\n label?: string;\n /** Label placement */\n 'label-placement'?: 'inset' | 'outside';\n /** Locale for day/month names (default: browser locale) */\n locale?: string;\n /** Latest selectable date in ISO 8601 format (yyyy-MM-dd) */\n max?: string;\n /** Earliest selectable date in ISO 8601 format (yyyy-MM-dd) */\n min?: string;\n /** Form field name */\n name?: string;\n /** Placeholder shown in the text trigger */\n placeholder?: string;\n /** Mark field as required */\n required?: boolean;\n /** Border radius */\n rounded?: RoundedSize;\n /** Component size */\n size?: ComponentSize;\n /**\n * Shows an inline green check icon inside the field to confirm the value has\n * passed validation. Ignored while `error` is set — an error always wins.\n */\n success?: boolean;\n /**\n * Selected date in ISO 8601 format (yyyy-MM-dd).\n * @example '2025-06-15'\n */\n value?: string;\n /** Visual variant */\n variant?: Exclude<VisualVariant, 'text' | 'frost'>;\n /**\n * Day-of-week indices to disable (0 = Sunday … 6 = Saturday).\n * Pass as a JSON array attribute or a JS property.\n * @example\n * ```html\n * <ore-date-picker weekend-days=\"[0,6]\"></ore-date-picker>\n * ```\n */\n 'weekend-days'?: number[];\n};\n\n/**\n * An accessible, keyboard-navigable date picker with an inline calendar popup.\n * Supports min/max bounds, disabled weekend days, and form association.\n *\n * @element ore-date-picker\n *\n * @attr {string} value - Selected date in ISO 8601 format (yyyy-MM-dd)\n * @attr {string} min - Minimum selectable date (yyyy-MM-dd)\n * @attr {string} max - Maximum selectable date (yyyy-MM-dd)\n * @attr {string} label - Label text\n * @attr {string} label-placement - 'inset' | 'outside'\n * @attr {string} placeholder - Trigger placeholder\n * @attr {boolean} disabled - Disable the picker\n * @attr {boolean} required - Required field\n * @attr {string} name - Form field name\n * @attr {string} error - Error message\n * @attr {boolean} success - Show an inline success check icon (suppressed while `error` is set)\n * @attr {string} helper - Helper text\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - Component size: 'sm' | 'md' | 'lg'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} locale - BCP 47 locale string\n * @attr {string} weekend-days - Comma-separated day indices to disable\n *\n * @fires input - Fired when a date is selected.\n * @fires change - Fired when a date is selected.\n *\n * @slot label - Custom label for the trigger field\n * @slot prefix - Content before the trigger text (e.g. icon)\n * @slot helper - Custom helper text\n * @slot error - Custom error content\n *\n * @cssprop --date-picker-bg - Calendar background\n * @cssprop --date-picker-border-color - Calendar border color\n * @cssprop --date-picker-radius - Calendar border radius\n * @cssprop --date-picker-day-selected-bg - Background of selected day\n * @cssprop --date-picker-day-today-color - Color of today's date number\n * @cssprop --date-picker-day-outside-opacity - Opacity of days outside visible month\n *\n * @part field - The trigger button/field\n * @part calendar - The floating calendar panel\n * @part header - Calendar header (nav + label)\n * @part grid - Day grid\n * @part day - Individual day cell\n *\n * @example\n * ```html\n * <!-- Single date with constraints -->\n * <ore-date-picker label=\"Appointment date\" name=\"date\" min=\"2025-01-01\" max=\"2025-12-31\" color=\"primary\"></ore-date-picker>\n *\n *\n * <!-- Outside label, bordered variant -->\n * <ore-date-picker label=\"Start date\" label-placement=\"outside\" variant=\"bordered\"></ore-date-picker>\n * ```\n */\nexport const DATE_PICKER_TAG = 'ore-date-picker' as const;\n\ndefine<OreDatePickerProps>(DATE_PICKER_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n locale: prop.string(),\n max: prop.string(),\n min: prop.string(),\n name: prop.string(),\n placeholder: prop.string(),\n required: prop.bool(false),\n success: prop.bool(false),\n value: prop.string(),\n variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n 'weekend-days': prop.json([] as number[]),\n },\n\n setup(props) {\n const el = getHost();\n\n // ── Signals ─────────────────────────────────────────────────────────────\n\n const isOpen = signal(false);\n\n // ── Selected date: local-override pattern ──────────────────────────────\n // localSelection holds a user-initiated pick (or undefined = no override).\n // selectedDate falls back to the value prop reactively — no setInterval needed.\n\n const localSelection = signal<Temporal.PlainDate | null | undefined>(undefined);\n\n const selectedDate = computed(() =>\n localSelection.value !== undefined ? localSelection.value : parseIso(props.value.value),\n );\n\n defineFieldValue(\n el,\n () => toIsoString(selectedDate.value) ?? '',\n (value) => {\n localSelection.value = parseIso(value);\n },\n );\n\n const isDisabled = computed(() => Boolean(props.disabled.value));\n const locale = computed(() => props.locale.value || (typeof navigator !== 'undefined' ? navigator.language : 'en'));\n\n // ── Date-picker control ─────────────────────────────────────────────────\n\n const ctrl = createDatePickerControl({\n get locale() {\n return locale.value;\n },\n get max() {\n return parseIso(props.max.value);\n },\n get min() {\n return parseIso(props.min.value);\n },\n onChange(date) {\n localSelection.value = date;\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n setFieldValue(el, toIsoString(date) ?? '');\n dispatchNativeFieldEvent(el, 'input');\n dispatchNativeFieldEvent(el, 'change');\n },\n get value() {\n return selectedDate.value;\n },\n get weekendDays() {\n return props['weekend-days'].value ?? [];\n },\n });\n\n // ── Reactive display state ────────────────────────────────────────────\n // Three separate primitive signals — the proven pattern.\n\n const currentView = signal<DatePickerView>('day');\n const displayYear = signal(ctrl.displayYear());\n const displayMonth = signal(ctrl.displayMonth()); // 1-indexed (Temporal)\n\n // ── Form value (host is formAssociated) ──────────────────────────────────\n\n useField<string>({\n disabled: isDisabled,\n toFormValue: (v) => v || null,\n value: computed(() => toIsoString(selectedDate.value) ?? ''),\n });\n\n const dialogId = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`;\n\n // ── Floating position ────────────────────────────────────────────────────\n // The old CSS-only `position: absolute; top: 100%` positioned the calendar relative to\n // the host box — fine until the host sits near a scroll/clip ancestor's edge (e.g. a form\n // grid inside a dialog), where the same absolute box also expands that ancestor's\n // *scrollable* overflow area even though it never changes the ancestor's own layout size,\n // which reads as \"the dialog got bigger\"/jumped. `createDropdownPositioner` — the same\n // Orbit-powered primitive `ore-select`'s dropdown already uses — positions via `fixed` +\n // computed `top`/`left`, auto-detecting both the nearest clipping ancestor (so flip/shift\n // keep the calendar within the dialog panel, not just the page viewport) and any ancestor\n // that establishes a containing block for `position: fixed` (a dialog panel's entrance\n // transition commonly leaves a permanent, if visually-identity, `transform` at rest) —\n // see `createDropdownPositioner`'s own `boundary`/`containingBlock` docs.\n const triggerRef = ref<HTMLElement>();\n const calendarRef = ref<HTMLElement>();\n\n const positioner = createDropdownPositioner({\n getFloating: () => calendarRef.value ?? null,\n getReference: () => triggerRef.value ?? null,\n matchWidth: false,\n offsetPx: 4,\n });\n\n let stopAutoUpdate: (() => void) | null = null;\n\n // ── Derived display values ───────────────────────────────────────────────\n\n const triggerText = computed(() => {\n if (selectedDate.value) return formatDisplayDate(selectedDate.value, locale.value);\n\n return props.placeholder.value || '';\n });\n\n const displayMonth_ = computed(() => {\n const d = Temporal.PlainDate.from({ day: 1, month: displayMonth.value, year: displayYear.value });\n\n return format(d, { intl: { month: 'long' }, locale: locale.value, timeZone: 'UTC' });\n });\n\n const displayYear_ = computed(() => String(displayYear.value));\n const displayLabel = computed(() => `${displayMonth_.value} ${displayYear_.value}`);\n\n const dayCells = computed(() => {\n void displayYear.value;\n void displayMonth.value;\n void selectedDate.value; // re-run when selection changes to refresh isSelected flags\n\n return ctrl.dayCells();\n });\n const monthCells = computed(() => {\n void displayYear.value;\n\n return ctrl.monthCells();\n });\n const yearCells = computed(() => {\n void displayYear.value;\n\n return ctrl.yearCells();\n });\n const weekdayLabels = computed(() => ctrl.weekdayLabels());\n const tabIndex = () => (isDisabled.value ? '-1' : '0');\n\n // ── Navigation handlers ──────────────────────────────────────────────────\n // In year/month views navigate by year; in day view navigate by month.\n\n function handlePrev(): void {\n if (currentView.value === 'day') ctrl.prevMonth();\n else ctrl.prevYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleNext(): void {\n if (currentView.value === 'day') ctrl.nextMonth();\n else ctrl.nextYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleHeaderClick(): void {\n const views: DatePickerView[] = ['day', 'month', 'year'];\n const next = views[(views.indexOf(currentView.value) + 1) % views.length];\n\n ctrl.setView(next);\n currentView.value = next;\n }\n\n function handleSelectMonth(month: number): void {\n ctrl.goTo(ctrl.displayYear(), month);\n ctrl.setView('day');\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n currentView.value = 'day';\n }\n\n function handleSelectYear(year: number): void {\n ctrl.goTo(year, ctrl.displayMonth());\n ctrl.setView('month');\n displayYear.value = ctrl.displayYear();\n currentView.value = 'month';\n }\n\n function handleSelectDay(isoStr: string): void {\n const date = parseIso(isoStr);\n\n if (!date) return;\n\n ctrl.select(date);\n }\n\n function handleDayKeydown(e: KeyboardEvent): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid-days');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>('.cal-cell-day'));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleSelectDay(cell.dataset.iso ?? '');\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + 7];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - 7];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / 7) * 7];\n } else if (e.key === 'End') {\n target = allCells[Math.floor(idx / 7) * 7 + 6];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Month/year-cell keyboard navigation (fixed 4-column grid) ─────────────\n\n function handleGridKeydown(e: KeyboardEvent, cellSelector: string, columns: number, onSelect: () => void): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>(cellSelector));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onSelect();\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + columns];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - columns];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / columns) * columns];\n } else if (e.key === 'End') {\n target = allCells[Math.min(Math.floor(idx / columns) * columns + columns - 1, allCells.length - 1)];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Open / close ─────────────────────────────────────────────────────────\n\n function openPicker(): void {\n if (isDisabled.value) return;\n\n isOpen.value = true;\n ctrl.setView('day');\n currentView.value = 'day';\n\n const sel = selectedDate.value;\n\n if (sel) {\n ctrl.goTo(sel.year, sel.month);\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n positioner.update();\n stopAutoUpdate = positioner.startAutoUpdate?.() ?? null;\n }\n\n function closePicker(): void {\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n }\n\n function handleTriggerClick(): void {\n if (isOpen.value) closePicker();\n else openPicker();\n }\n\n // ── Keyboard handlers ────────────────────────────────────────────────────\n\n function handleTriggerKeydown(e: KeyboardEvent): void {\n if (isDisabled.value) return;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleTriggerClick();\n } else if (e.key === 'Escape' && isOpen.value) {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleCalendarKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleOutsideClick(e: PointerEvent | MouseEvent): void {\n if (!isOpen.value) return;\n\n const path = e.composedPath();\n\n if (!path.includes(el)) closePicker();\n }\n\n // ── Lifecycle ────────────────────────────────────────────────────────────\n\n onMounted(() => {\n document.addEventListener('pointerdown', handleOutsideClick, { capture: true });\n\n return () => {\n document.removeEventListener('pointerdown', handleOutsideClick, { capture: true });\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n };\n });\n\n // ── Host bindings ────────────────────────────────────────────────────────\n\n bind({\n attr: {\n open: () => (isOpen.value ? true : undefined),\n },\n });\n\n // ── Template ─────────────────────────────────────────────────────────────\n\n const inputValue = () => triggerText.value;\n const inputLabel = () => props.label.value ?? '';\n const inputPlaceholder = () => props.placeholder.value ?? '';\n const inputLabelPlacement = () => props['label-placement'].value ?? 'inset';\n const inputColor = () => props.color?.value ?? undefined;\n const inputSize = () => props.size?.value ?? undefined;\n const inputVariant = () => props.variant?.value ?? undefined;\n const inputRounded = () => props.rounded?.value ?? undefined;\n const inputHelper = () => props.helper.value ?? '';\n const inputError = () => props.error.value ?? '';\n const inputDisabled = () => (isDisabled.value ? true : undefined);\n const inputRequired = () => (props.required.value ? true : undefined);\n const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n return html`\n <!-- Trigger: ore-input in readonly display mode -->\n <ore-input\n class=\"trigger\"\n ref=\"${triggerRef}\"\n readonly\n tabindex=\"${tabIndex}\"\n role=\"combobox\"\n aria-haspopup=\"dialog\"\n aria-controls=\"${dialogId}\"\n aria-expanded=\"${() => String(isOpen.value)}\"\n aria-disabled=\"${() => (isDisabled.value ? 'true' : null)}\"\n value=\"${inputValue}\"\n label=\"${inputLabel}\"\n placeholder=\"${inputPlaceholder}\"\n label-placement=\"${inputLabelPlacement}\"\n color=\"${inputColor}\"\n size=\"${inputSize}\"\n variant=\"${inputVariant}\"\n rounded=\"${inputRounded}\"\n helper=\"${inputHelper}\"\n error=\"${inputError}\"\n ?disabled=\"${inputDisabled}\"\n ?required=\"${inputRequired}\"\n ?fullwidth=\"${inputFullwidth}\"\n ?success=\"${() => props.success.value}\"\n @click=\"${handleTriggerClick}\"\n @keydown=\"${handleTriggerKeydown}\">\n <ore-icon slot=\"suffix\" name=\"calendar\" size=\"16\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n </ore-input>\n\n <!-- Calendar popup -->\n <div\n class=\"calendar\"\n ref=\"${calendarRef}\"\n id=\"${dialogId}\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"${() => `Choose date — ${displayLabel.value}`}\"\n ?data-open=\"${isOpen}\"\n @keydown=\"${handleCalendarKeydown}\">\n <!-- Calendar header -->\n <div class=\"cal-header\" part=\"header\">\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Previous\" @click=\"${handlePrev}\">\n <ore-icon name=\"chevron-left\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n <button\n class=\"cal-label-btn\"\n type=\"button\"\n aria-label=\"${() =>\n `Switch to ${currentView.value === 'day' ? 'month' : currentView.value === 'month' ? 'year' : 'day'} view`}\"\n @click=\"${handleHeaderClick}\">\n <span class=\"cal-label-month\">${displayMonth_}</span>\n <span class=\"cal-label-sep\" aria-hidden=\"true\">/</span>\n <span class=\"cal-label-year\">${displayYear_}</span>\n </button>\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Next\" @click=\"${handleNext}\">\n <ore-icon name=\"chevron-right\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n </div>\n\n <!-- Day view: flat 7-column CSS grid, weekday headers + day cells -->\n <div\n class=\"cal-grid cal-grid-days\"\n role=\"grid\"\n part=\"grid\"\n aria-label=\"${() => displayLabel.value}\"\n ?hidden=\"${() => currentView.value !== 'day'}\">\n <div role=\"row\" class=\"cal-grid-row\">\n ${() =>\n weekdayLabels.value.map(\n (lbl) => html`\n <div class=\"cal-cell cal-cell-head\" role=\"columnheader\" aria-label=\"${lbl}\">${lbl}</div>\n `,\n )}\n </div>\n ${() => {\n const cells = dayCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));\n\n return rows.map(\n (row) => html`\n <div role=\"row\" class=\"cal-grid-row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-day\"\n role=\"gridcell\"\n part=\"day\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n aria-current=\"${() => (cell.isToday ? 'date' : null)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-today=\"${() => cell.isToday}\"\n ?data-outside=\"${() => cell.isOutsideMonth}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n data-iso=\"${cell.iso}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => handleSelectDay(cell.iso)}\"\n @keydown=\"${handleDayKeydown}\">\n ${String(cell.day)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Month view -->\n <div\n class=\"cal-grid cal-grid-months\"\n role=\"grid\"\n aria-label=\"${() => displayYear_.value}\"\n ?hidden=\"${() => currentView.value !== 'month'}\">\n ${() => {\n const cells = monthCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-month\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-month', 4, () => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n })}\">\n ${cell.shortLabel}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Year view -->\n <div\n class=\"cal-grid cal-grid-years\"\n role=\"grid\"\n aria-label=\"Select year\"\n ?hidden=\"${() => currentView.value !== 'year'}\">\n ${() => {\n const cells = yearCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-year\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-year', 4, () => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n })}\">\n ${String(cell.year)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n </div>\n `;\n },\n\n shadow: { delegatesFocus: true },\n styles: [colorThemeMixin, reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}
@@ -77,7 +77,7 @@ g(E, {
77
77
  return ee(e, {
78
78
  intl: { month: "long" },
79
79
  locale: m.value,
80
- tz: "UTC"
80
+ timeZone: "UTC"
81
81
  });
82
82
  }), F = C(() => String(E.value)), I = C(() => `${P.value} ${F.value}`), L = C(() => (E.value, D.value, l.value, g.dayCells())), R = C(() => (E.value, g.monthCells())), z = C(() => (E.value, g.yearCells())), B = C(() => g.weekdayLabels()), V = () => u.value ? "-1" : "0";
83
83
  function H() {
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker.js","names":[],"sources":["../src/inputs/date-picker/date-picker.ts"],"sourcesContent":["import { define, html, prop, ref, bind, getHost, onMounted } from '@vielzeug/ore';\nimport { useField } from '@vielzeug/ore';\nimport { computed, signal } from '@vielzeug/ripple';\nimport { Temporal, format } from '@vielzeug/tempo';\n\nimport type { ComponentSize, RoundedSize, ThemeColor, VisualVariant } from '../../shared';\n\nimport {\n createDatePickerControl,\n createDropdownPositioner,\n formatDisplayDate,\n parseIso,\n toIsoString,\n type DatePickerView,\n} from '../../core';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin } from '../../styles';\nimport { defineFieldValue, dispatchNativeFieldEvent, setFieldValue } from '../shared/native-field-event';\nimport componentStyles from './date-picker.css?inline';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type OreDatePickerEvents = {\n change: Event;\n input: Event;\n};\n\nexport type OreDatePickerProps = {\n /** Theme color */\n color?: ThemeColor;\n /** Disable the picker */\n disabled?: boolean;\n /** Validation error message */\n error?: string;\n /** Expand to container width */\n fullwidth?: boolean;\n /** Helper text below the field */\n helper?: string;\n /** Visible label */\n label?: string;\n /** Label placement */\n 'label-placement'?: 'inset' | 'outside';\n /** Locale for day/month names (default: browser locale) */\n locale?: string;\n /** Latest selectable date in ISO 8601 format (yyyy-MM-dd) */\n max?: string;\n /** Earliest selectable date in ISO 8601 format (yyyy-MM-dd) */\n min?: string;\n /** Form field name */\n name?: string;\n /** Placeholder shown in the text trigger */\n placeholder?: string;\n /** Mark field as required */\n required?: boolean;\n /** Border radius */\n rounded?: RoundedSize;\n /** Component size */\n size?: ComponentSize;\n /**\n * Shows an inline green check icon inside the field to confirm the value has\n * passed validation. Ignored while `error` is set — an error always wins.\n */\n success?: boolean;\n /**\n * Selected date in ISO 8601 format (yyyy-MM-dd).\n * @example '2025-06-15'\n */\n value?: string;\n /** Visual variant */\n variant?: Exclude<VisualVariant, 'text' | 'frost'>;\n /**\n * Day-of-week indices to disable (0 = Sunday … 6 = Saturday).\n * Pass as a JSON array attribute or a JS property.\n * @example\n * ```html\n * <ore-date-picker weekend-days=\"[0,6]\"></ore-date-picker>\n * ```\n */\n 'weekend-days'?: number[];\n};\n\n/**\n * An accessible, keyboard-navigable date picker with an inline calendar popup.\n * Supports min/max bounds, disabled weekend days, and form association.\n *\n * @element ore-date-picker\n *\n * @attr {string} value - Selected date in ISO 8601 format (yyyy-MM-dd)\n * @attr {string} min - Minimum selectable date (yyyy-MM-dd)\n * @attr {string} max - Maximum selectable date (yyyy-MM-dd)\n * @attr {string} label - Label text\n * @attr {string} label-placement - 'inset' | 'outside'\n * @attr {string} placeholder - Trigger placeholder\n * @attr {boolean} disabled - Disable the picker\n * @attr {boolean} required - Required field\n * @attr {string} name - Form field name\n * @attr {string} error - Error message\n * @attr {boolean} success - Show an inline success check icon (suppressed while `error` is set)\n * @attr {string} helper - Helper text\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - Component size: 'sm' | 'md' | 'lg'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} locale - BCP 47 locale string\n * @attr {string} weekend-days - Comma-separated day indices to disable\n *\n * @fires input - Fired when a date is selected.\n * @fires change - Fired when a date is selected.\n *\n * @slot label - Custom label for the trigger field\n * @slot prefix - Content before the trigger text (e.g. icon)\n * @slot helper - Custom helper text\n * @slot error - Custom error content\n *\n * @cssprop --date-picker-bg - Calendar background\n * @cssprop --date-picker-border-color - Calendar border color\n * @cssprop --date-picker-radius - Calendar border radius\n * @cssprop --date-picker-day-selected-bg - Background of selected day\n * @cssprop --date-picker-day-today-color - Color of today's date number\n * @cssprop --date-picker-day-outside-opacity - Opacity of days outside visible month\n *\n * @part field - The trigger button/field\n * @part calendar - The floating calendar panel\n * @part header - Calendar header (nav + label)\n * @part grid - Day grid\n * @part day - Individual day cell\n *\n * @example\n * ```html\n * <!-- Single date with constraints -->\n * <ore-date-picker label=\"Appointment date\" name=\"date\" min=\"2025-01-01\" max=\"2025-12-31\" color=\"primary\"></ore-date-picker>\n *\n *\n * <!-- Outside label, bordered variant -->\n * <ore-date-picker label=\"Start date\" label-placement=\"outside\" variant=\"bordered\"></ore-date-picker>\n * ```\n */\nexport const DATE_PICKER_TAG = 'ore-date-picker' as const;\n\ndefine<OreDatePickerProps>(DATE_PICKER_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n locale: prop.string(),\n max: prop.string(),\n min: prop.string(),\n name: prop.string(),\n placeholder: prop.string(),\n required: prop.bool(false),\n success: prop.bool(false),\n value: prop.string(),\n variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n 'weekend-days': prop.json([] as number[]),\n },\n\n setup(props) {\n const el = getHost();\n\n // ── Signals ─────────────────────────────────────────────────────────────\n\n const isOpen = signal(false);\n\n // ── Selected date: local-override pattern ──────────────────────────────\n // localSelection holds a user-initiated pick (or undefined = no override).\n // selectedDate falls back to the value prop reactively — no setInterval needed.\n\n const localSelection = signal<Temporal.PlainDate | null | undefined>(undefined);\n\n const selectedDate = computed(() =>\n localSelection.value !== undefined ? localSelection.value : parseIso(props.value.value),\n );\n\n defineFieldValue(\n el,\n () => toIsoString(selectedDate.value) ?? '',\n (value) => {\n localSelection.value = parseIso(value);\n },\n );\n\n const isDisabled = computed(() => Boolean(props.disabled.value));\n const locale = computed(() => props.locale.value || (typeof navigator !== 'undefined' ? navigator.language : 'en'));\n\n // ── Date-picker control ─────────────────────────────────────────────────\n\n const ctrl = createDatePickerControl({\n get locale() {\n return locale.value;\n },\n get max() {\n return parseIso(props.max.value);\n },\n get min() {\n return parseIso(props.min.value);\n },\n onChange(date) {\n localSelection.value = date;\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n setFieldValue(el, toIsoString(date) ?? '');\n dispatchNativeFieldEvent(el, 'input');\n dispatchNativeFieldEvent(el, 'change');\n },\n get value() {\n return selectedDate.value;\n },\n get weekendDays() {\n return props['weekend-days'].value ?? [];\n },\n });\n\n // ── Reactive display state ────────────────────────────────────────────\n // Three separate primitive signals — the proven pattern.\n\n const currentView = signal<DatePickerView>('day');\n const displayYear = signal(ctrl.displayYear());\n const displayMonth = signal(ctrl.displayMonth()); // 1-indexed (Temporal)\n\n // ── Form value (host is formAssociated) ──────────────────────────────────\n\n useField<string>({\n disabled: isDisabled,\n toFormValue: (v) => v || null,\n value: computed(() => toIsoString(selectedDate.value) ?? ''),\n });\n\n const dialogId = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`;\n\n // ── Floating position ────────────────────────────────────────────────────\n // The old CSS-only `position: absolute; top: 100%` positioned the calendar relative to\n // the host box — fine until the host sits near a scroll/clip ancestor's edge (e.g. a form\n // grid inside a dialog), where the same absolute box also expands that ancestor's\n // *scrollable* overflow area even though it never changes the ancestor's own layout size,\n // which reads as \"the dialog got bigger\"/jumped. `createDropdownPositioner` — the same\n // Orbit-powered primitive `ore-select`'s dropdown already uses — positions via `fixed` +\n // computed `top`/`left`, auto-detecting both the nearest clipping ancestor (so flip/shift\n // keep the calendar within the dialog panel, not just the page viewport) and any ancestor\n // that establishes a containing block for `position: fixed` (a dialog panel's entrance\n // transition commonly leaves a permanent, if visually-identity, `transform` at rest) —\n // see `createDropdownPositioner`'s own `boundary`/`containingBlock` docs.\n const triggerRef = ref<HTMLElement>();\n const calendarRef = ref<HTMLElement>();\n\n const positioner = createDropdownPositioner({\n getFloating: () => calendarRef.value ?? null,\n getReference: () => triggerRef.value ?? null,\n matchWidth: false,\n offsetPx: 4,\n });\n\n let stopAutoUpdate: (() => void) | null = null;\n\n // ── Derived display values ───────────────────────────────────────────────\n\n const triggerText = computed(() => {\n if (selectedDate.value) return formatDisplayDate(selectedDate.value, locale.value);\n\n return props.placeholder.value || '';\n });\n\n const displayMonth_ = computed(() => {\n const d = Temporal.PlainDate.from({ day: 1, month: displayMonth.value, year: displayYear.value });\n\n return format(d, { intl: { month: 'long' }, locale: locale.value, tz: 'UTC' });\n });\n\n const displayYear_ = computed(() => String(displayYear.value));\n const displayLabel = computed(() => `${displayMonth_.value} ${displayYear_.value}`);\n\n const dayCells = computed(() => {\n void displayYear.value;\n void displayMonth.value;\n void selectedDate.value; // re-run when selection changes to refresh isSelected flags\n\n return ctrl.dayCells();\n });\n const monthCells = computed(() => {\n void displayYear.value;\n\n return ctrl.monthCells();\n });\n const yearCells = computed(() => {\n void displayYear.value;\n\n return ctrl.yearCells();\n });\n const weekdayLabels = computed(() => ctrl.weekdayLabels());\n const tabIndex = () => (isDisabled.value ? '-1' : '0');\n\n // ── Navigation handlers ──────────────────────────────────────────────────\n // In year/month views navigate by year; in day view navigate by month.\n\n function handlePrev(): void {\n if (currentView.value === 'day') ctrl.prevMonth();\n else ctrl.prevYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleNext(): void {\n if (currentView.value === 'day') ctrl.nextMonth();\n else ctrl.nextYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleHeaderClick(): void {\n const views: DatePickerView[] = ['day', 'month', 'year'];\n const next = views[(views.indexOf(currentView.value) + 1) % views.length];\n\n ctrl.setView(next);\n currentView.value = next;\n }\n\n function handleSelectMonth(month: number): void {\n ctrl.goTo(ctrl.displayYear(), month);\n ctrl.setView('day');\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n currentView.value = 'day';\n }\n\n function handleSelectYear(year: number): void {\n ctrl.goTo(year, ctrl.displayMonth());\n ctrl.setView('month');\n displayYear.value = ctrl.displayYear();\n currentView.value = 'month';\n }\n\n function handleSelectDay(isoStr: string): void {\n const date = parseIso(isoStr);\n\n if (!date) return;\n\n ctrl.select(date);\n }\n\n function handleDayKeydown(e: KeyboardEvent): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid-days');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>('.cal-cell-day'));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleSelectDay(cell.dataset.iso ?? '');\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + 7];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - 7];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / 7) * 7];\n } else if (e.key === 'End') {\n target = allCells[Math.floor(idx / 7) * 7 + 6];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Month/year-cell keyboard navigation (fixed 4-column grid) ─────────────\n\n function handleGridKeydown(e: KeyboardEvent, cellSelector: string, columns: number, onSelect: () => void): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>(cellSelector));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onSelect();\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + columns];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - columns];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / columns) * columns];\n } else if (e.key === 'End') {\n target = allCells[Math.min(Math.floor(idx / columns) * columns + columns - 1, allCells.length - 1)];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Open / close ─────────────────────────────────────────────────────────\n\n function openPicker(): void {\n if (isDisabled.value) return;\n\n isOpen.value = true;\n ctrl.setView('day');\n currentView.value = 'day';\n\n const sel = selectedDate.value;\n\n if (sel) {\n ctrl.goTo(sel.year, sel.month);\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n positioner.update();\n stopAutoUpdate = positioner.startAutoUpdate?.() ?? null;\n }\n\n function closePicker(): void {\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n }\n\n function handleTriggerClick(): void {\n if (isOpen.value) closePicker();\n else openPicker();\n }\n\n // ── Keyboard handlers ────────────────────────────────────────────────────\n\n function handleTriggerKeydown(e: KeyboardEvent): void {\n if (isDisabled.value) return;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleTriggerClick();\n } else if (e.key === 'Escape' && isOpen.value) {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleCalendarKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleOutsideClick(e: PointerEvent | MouseEvent): void {\n if (!isOpen.value) return;\n\n const path = e.composedPath();\n\n if (!path.includes(el)) closePicker();\n }\n\n // ── Lifecycle ────────────────────────────────────────────────────────────\n\n onMounted(() => {\n document.addEventListener('pointerdown', handleOutsideClick, { capture: true });\n\n return () => {\n document.removeEventListener('pointerdown', handleOutsideClick, { capture: true });\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n };\n });\n\n // ── Host bindings ────────────────────────────────────────────────────────\n\n bind({\n attr: {\n open: () => (isOpen.value ? true : undefined),\n },\n });\n\n // ── Template ─────────────────────────────────────────────────────────────\n\n const inputValue = () => triggerText.value;\n const inputLabel = () => props.label.value ?? '';\n const inputPlaceholder = () => props.placeholder.value ?? '';\n const inputLabelPlacement = () => props['label-placement'].value ?? 'inset';\n const inputColor = () => props.color?.value ?? undefined;\n const inputSize = () => props.size?.value ?? undefined;\n const inputVariant = () => props.variant?.value ?? undefined;\n const inputRounded = () => props.rounded?.value ?? undefined;\n const inputHelper = () => props.helper.value ?? '';\n const inputError = () => props.error.value ?? '';\n const inputDisabled = () => (isDisabled.value ? true : undefined);\n const inputRequired = () => (props.required.value ? true : undefined);\n const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n return html`\n <!-- Trigger: ore-input in readonly display mode -->\n <ore-input\n class=\"trigger\"\n ref=\"${triggerRef}\"\n readonly\n tabindex=\"${tabIndex}\"\n role=\"combobox\"\n aria-haspopup=\"dialog\"\n aria-controls=\"${dialogId}\"\n aria-expanded=\"${() => String(isOpen.value)}\"\n aria-disabled=\"${() => (isDisabled.value ? 'true' : null)}\"\n value=\"${inputValue}\"\n label=\"${inputLabel}\"\n placeholder=\"${inputPlaceholder}\"\n label-placement=\"${inputLabelPlacement}\"\n color=\"${inputColor}\"\n size=\"${inputSize}\"\n variant=\"${inputVariant}\"\n rounded=\"${inputRounded}\"\n helper=\"${inputHelper}\"\n error=\"${inputError}\"\n ?disabled=\"${inputDisabled}\"\n ?required=\"${inputRequired}\"\n ?fullwidth=\"${inputFullwidth}\"\n ?success=\"${() => props.success.value}\"\n @click=\"${handleTriggerClick}\"\n @keydown=\"${handleTriggerKeydown}\">\n <ore-icon slot=\"suffix\" name=\"calendar\" size=\"16\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n </ore-input>\n\n <!-- Calendar popup -->\n <div\n class=\"calendar\"\n ref=\"${calendarRef}\"\n id=\"${dialogId}\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"${() => `Choose date — ${displayLabel.value}`}\"\n ?data-open=\"${isOpen}\"\n @keydown=\"${handleCalendarKeydown}\">\n <!-- Calendar header -->\n <div class=\"cal-header\" part=\"header\">\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Previous\" @click=\"${handlePrev}\">\n <ore-icon name=\"chevron-left\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n <button\n class=\"cal-label-btn\"\n type=\"button\"\n aria-label=\"${() =>\n `Switch to ${currentView.value === 'day' ? 'month' : currentView.value === 'month' ? 'year' : 'day'} view`}\"\n @click=\"${handleHeaderClick}\">\n <span class=\"cal-label-month\">${displayMonth_}</span>\n <span class=\"cal-label-sep\" aria-hidden=\"true\">/</span>\n <span class=\"cal-label-year\">${displayYear_}</span>\n </button>\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Next\" @click=\"${handleNext}\">\n <ore-icon name=\"chevron-right\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n </div>\n\n <!-- Day view: flat 7-column CSS grid, weekday headers + day cells -->\n <div\n class=\"cal-grid cal-grid-days\"\n role=\"grid\"\n part=\"grid\"\n aria-label=\"${() => displayLabel.value}\"\n ?hidden=\"${() => currentView.value !== 'day'}\">\n <div role=\"row\" class=\"cal-grid-row\">\n ${() =>\n weekdayLabels.value.map(\n (lbl) => html`\n <div class=\"cal-cell cal-cell-head\" role=\"columnheader\" aria-label=\"${lbl}\">${lbl}</div>\n `,\n )}\n </div>\n ${() => {\n const cells = dayCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));\n\n return rows.map(\n (row) => html`\n <div role=\"row\" class=\"cal-grid-row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-day\"\n role=\"gridcell\"\n part=\"day\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n aria-current=\"${() => (cell.isToday ? 'date' : null)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-today=\"${() => cell.isToday}\"\n ?data-outside=\"${() => cell.isOutsideMonth}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n data-iso=\"${cell.iso}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => handleSelectDay(cell.iso)}\"\n @keydown=\"${handleDayKeydown}\">\n ${String(cell.day)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Month view -->\n <div\n class=\"cal-grid cal-grid-months\"\n role=\"grid\"\n aria-label=\"${() => displayYear_.value}\"\n ?hidden=\"${() => currentView.value !== 'month'}\">\n ${() => {\n const cells = monthCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-month\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-month', 4, () => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n })}\">\n ${cell.shortLabel}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Year view -->\n <div\n class=\"cal-grid cal-grid-years\"\n role=\"grid\"\n aria-label=\"Select year\"\n ?hidden=\"${() => currentView.value !== 'year'}\">\n ${() => {\n const cells = yearCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-year\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-year', 4, () => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n })}\">\n ${String(cell.year)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n </div>\n `;\n },\n\n shadow: { delegatesFocus: true },\n styles: [colorThemeMixin, reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"date-picker.js","names":[],"sources":["../src/inputs/date-picker/date-picker.ts"],"sourcesContent":["import { define, html, prop, ref, bind, getHost, onMounted } from '@vielzeug/ore';\nimport { useField } from '@vielzeug/ore';\nimport { computed, signal } from '@vielzeug/ripple';\nimport { Temporal, format } from '@vielzeug/tempo';\n\nimport type { ComponentSize, RoundedSize, ThemeColor, VisualVariant } from '../../shared';\n\nimport {\n createDatePickerControl,\n createDropdownPositioner,\n formatDisplayDate,\n parseIso,\n toIsoString,\n type DatePickerView,\n} from '../../core';\nimport '../../content/icon/icon';\nimport '../input/input';\nimport { disablableBundle, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport { colorThemeMixin, reducedMotionMixin } from '../../styles';\nimport { defineFieldValue, dispatchNativeFieldEvent, setFieldValue } from '../shared/native-field-event';\nimport componentStyles from './date-picker.css?inline';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type OreDatePickerEvents = {\n change: Event;\n input: Event;\n};\n\nexport type OreDatePickerProps = {\n /** Theme color */\n color?: ThemeColor;\n /** Disable the picker */\n disabled?: boolean;\n /** Validation error message */\n error?: string;\n /** Expand to container width */\n fullwidth?: boolean;\n /** Helper text below the field */\n helper?: string;\n /** Visible label */\n label?: string;\n /** Label placement */\n 'label-placement'?: 'inset' | 'outside';\n /** Locale for day/month names (default: browser locale) */\n locale?: string;\n /** Latest selectable date in ISO 8601 format (yyyy-MM-dd) */\n max?: string;\n /** Earliest selectable date in ISO 8601 format (yyyy-MM-dd) */\n min?: string;\n /** Form field name */\n name?: string;\n /** Placeholder shown in the text trigger */\n placeholder?: string;\n /** Mark field as required */\n required?: boolean;\n /** Border radius */\n rounded?: RoundedSize;\n /** Component size */\n size?: ComponentSize;\n /**\n * Shows an inline green check icon inside the field to confirm the value has\n * passed validation. Ignored while `error` is set — an error always wins.\n */\n success?: boolean;\n /**\n * Selected date in ISO 8601 format (yyyy-MM-dd).\n * @example '2025-06-15'\n */\n value?: string;\n /** Visual variant */\n variant?: Exclude<VisualVariant, 'text' | 'frost'>;\n /**\n * Day-of-week indices to disable (0 = Sunday … 6 = Saturday).\n * Pass as a JSON array attribute or a JS property.\n * @example\n * ```html\n * <ore-date-picker weekend-days=\"[0,6]\"></ore-date-picker>\n * ```\n */\n 'weekend-days'?: number[];\n};\n\n/**\n * An accessible, keyboard-navigable date picker with an inline calendar popup.\n * Supports min/max bounds, disabled weekend days, and form association.\n *\n * @element ore-date-picker\n *\n * @attr {string} value - Selected date in ISO 8601 format (yyyy-MM-dd)\n * @attr {string} min - Minimum selectable date (yyyy-MM-dd)\n * @attr {string} max - Maximum selectable date (yyyy-MM-dd)\n * @attr {string} label - Label text\n * @attr {string} label-placement - 'inset' | 'outside'\n * @attr {string} placeholder - Trigger placeholder\n * @attr {boolean} disabled - Disable the picker\n * @attr {boolean} required - Required field\n * @attr {string} name - Form field name\n * @attr {string} error - Error message\n * @attr {boolean} success - Show an inline success check icon (suppressed while `error` is set)\n * @attr {string} helper - Helper text\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} size - Component size: 'sm' | 'md' | 'lg'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n * @attr {string} locale - BCP 47 locale string\n * @attr {string} weekend-days - Comma-separated day indices to disable\n *\n * @fires input - Fired when a date is selected.\n * @fires change - Fired when a date is selected.\n *\n * @slot label - Custom label for the trigger field\n * @slot prefix - Content before the trigger text (e.g. icon)\n * @slot helper - Custom helper text\n * @slot error - Custom error content\n *\n * @cssprop --date-picker-bg - Calendar background\n * @cssprop --date-picker-border-color - Calendar border color\n * @cssprop --date-picker-radius - Calendar border radius\n * @cssprop --date-picker-day-selected-bg - Background of selected day\n * @cssprop --date-picker-day-today-color - Color of today's date number\n * @cssprop --date-picker-day-outside-opacity - Opacity of days outside visible month\n *\n * @part field - The trigger button/field\n * @part calendar - The floating calendar panel\n * @part header - Calendar header (nav + label)\n * @part grid - Day grid\n * @part day - Individual day cell\n *\n * @example\n * ```html\n * <!-- Single date with constraints -->\n * <ore-date-picker label=\"Appointment date\" name=\"date\" min=\"2025-01-01\" max=\"2025-12-31\" color=\"primary\"></ore-date-picker>\n *\n *\n * <!-- Outside label, bordered variant -->\n * <ore-date-picker label=\"Start date\" label-placement=\"outside\" variant=\"bordered\"></ore-date-picker>\n * ```\n */\nexport const DATE_PICKER_TAG = 'ore-date-picker' as const;\n\ndefine<OreDatePickerProps>(DATE_PICKER_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n locale: prop.string(),\n max: prop.string(),\n min: prop.string(),\n name: prop.string(),\n placeholder: prop.string(),\n required: prop.bool(false),\n success: prop.bool(false),\n value: prop.string(),\n variant: prop.string<'flat' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n 'weekend-days': prop.json([] as number[]),\n },\n\n setup(props) {\n const el = getHost();\n\n // ── Signals ─────────────────────────────────────────────────────────────\n\n const isOpen = signal(false);\n\n // ── Selected date: local-override pattern ──────────────────────────────\n // localSelection holds a user-initiated pick (or undefined = no override).\n // selectedDate falls back to the value prop reactively — no setInterval needed.\n\n const localSelection = signal<Temporal.PlainDate | null | undefined>(undefined);\n\n const selectedDate = computed(() =>\n localSelection.value !== undefined ? localSelection.value : parseIso(props.value.value),\n );\n\n defineFieldValue(\n el,\n () => toIsoString(selectedDate.value) ?? '',\n (value) => {\n localSelection.value = parseIso(value);\n },\n );\n\n const isDisabled = computed(() => Boolean(props.disabled.value));\n const locale = computed(() => props.locale.value || (typeof navigator !== 'undefined' ? navigator.language : 'en'));\n\n // ── Date-picker control ─────────────────────────────────────────────────\n\n const ctrl = createDatePickerControl({\n get locale() {\n return locale.value;\n },\n get max() {\n return parseIso(props.max.value);\n },\n get min() {\n return parseIso(props.min.value);\n },\n onChange(date) {\n localSelection.value = date;\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n setFieldValue(el, toIsoString(date) ?? '');\n dispatchNativeFieldEvent(el, 'input');\n dispatchNativeFieldEvent(el, 'change');\n },\n get value() {\n return selectedDate.value;\n },\n get weekendDays() {\n return props['weekend-days'].value ?? [];\n },\n });\n\n // ── Reactive display state ────────────────────────────────────────────\n // Three separate primitive signals — the proven pattern.\n\n const currentView = signal<DatePickerView>('day');\n const displayYear = signal(ctrl.displayYear());\n const displayMonth = signal(ctrl.displayMonth()); // 1-indexed (Temporal)\n\n // ── Form value (host is formAssociated) ──────────────────────────────────\n\n useField<string>({\n disabled: isDisabled,\n toFormValue: (v) => v || null,\n value: computed(() => toIsoString(selectedDate.value) ?? ''),\n });\n\n const dialogId = `date-picker-${Math.random().toString(36).slice(2, 9)}-calendar`;\n\n // ── Floating position ────────────────────────────────────────────────────\n // The old CSS-only `position: absolute; top: 100%` positioned the calendar relative to\n // the host box — fine until the host sits near a scroll/clip ancestor's edge (e.g. a form\n // grid inside a dialog), where the same absolute box also expands that ancestor's\n // *scrollable* overflow area even though it never changes the ancestor's own layout size,\n // which reads as \"the dialog got bigger\"/jumped. `createDropdownPositioner` — the same\n // Orbit-powered primitive `ore-select`'s dropdown already uses — positions via `fixed` +\n // computed `top`/`left`, auto-detecting both the nearest clipping ancestor (so flip/shift\n // keep the calendar within the dialog panel, not just the page viewport) and any ancestor\n // that establishes a containing block for `position: fixed` (a dialog panel's entrance\n // transition commonly leaves a permanent, if visually-identity, `transform` at rest) —\n // see `createDropdownPositioner`'s own `boundary`/`containingBlock` docs.\n const triggerRef = ref<HTMLElement>();\n const calendarRef = ref<HTMLElement>();\n\n const positioner = createDropdownPositioner({\n getFloating: () => calendarRef.value ?? null,\n getReference: () => triggerRef.value ?? null,\n matchWidth: false,\n offsetPx: 4,\n });\n\n let stopAutoUpdate: (() => void) | null = null;\n\n // ── Derived display values ───────────────────────────────────────────────\n\n const triggerText = computed(() => {\n if (selectedDate.value) return formatDisplayDate(selectedDate.value, locale.value);\n\n return props.placeholder.value || '';\n });\n\n const displayMonth_ = computed(() => {\n const d = Temporal.PlainDate.from({ day: 1, month: displayMonth.value, year: displayYear.value });\n\n return format(d, { intl: { month: 'long' }, locale: locale.value, timeZone: 'UTC' });\n });\n\n const displayYear_ = computed(() => String(displayYear.value));\n const displayLabel = computed(() => `${displayMonth_.value} ${displayYear_.value}`);\n\n const dayCells = computed(() => {\n void displayYear.value;\n void displayMonth.value;\n void selectedDate.value; // re-run when selection changes to refresh isSelected flags\n\n return ctrl.dayCells();\n });\n const monthCells = computed(() => {\n void displayYear.value;\n\n return ctrl.monthCells();\n });\n const yearCells = computed(() => {\n void displayYear.value;\n\n return ctrl.yearCells();\n });\n const weekdayLabels = computed(() => ctrl.weekdayLabels());\n const tabIndex = () => (isDisabled.value ? '-1' : '0');\n\n // ── Navigation handlers ──────────────────────────────────────────────────\n // In year/month views navigate by year; in day view navigate by month.\n\n function handlePrev(): void {\n if (currentView.value === 'day') ctrl.prevMonth();\n else ctrl.prevYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleNext(): void {\n if (currentView.value === 'day') ctrl.nextMonth();\n else ctrl.nextYear();\n\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n function handleHeaderClick(): void {\n const views: DatePickerView[] = ['day', 'month', 'year'];\n const next = views[(views.indexOf(currentView.value) + 1) % views.length];\n\n ctrl.setView(next);\n currentView.value = next;\n }\n\n function handleSelectMonth(month: number): void {\n ctrl.goTo(ctrl.displayYear(), month);\n ctrl.setView('day');\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n currentView.value = 'day';\n }\n\n function handleSelectYear(year: number): void {\n ctrl.goTo(year, ctrl.displayMonth());\n ctrl.setView('month');\n displayYear.value = ctrl.displayYear();\n currentView.value = 'month';\n }\n\n function handleSelectDay(isoStr: string): void {\n const date = parseIso(isoStr);\n\n if (!date) return;\n\n ctrl.select(date);\n }\n\n function handleDayKeydown(e: KeyboardEvent): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid-days');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>('.cal-cell-day'));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleSelectDay(cell.dataset.iso ?? '');\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + 7];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - 7];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / 7) * 7];\n } else if (e.key === 'End') {\n target = allCells[Math.floor(idx / 7) * 7 + 6];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Month/year-cell keyboard navigation (fixed 4-column grid) ─────────────\n\n function handleGridKeydown(e: KeyboardEvent, cellSelector: string, columns: number, onSelect: () => void): void {\n const cell = e.currentTarget as HTMLElement;\n const grid = cell.closest('.cal-grid');\n\n if (!grid) return;\n\n const allCells = Array.from(grid.querySelectorAll<HTMLElement>(cellSelector));\n const idx = allCells.indexOf(cell);\n\n if (idx === -1) return;\n\n let target: HTMLElement | undefined;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onSelect();\n\n return;\n } else if (e.key === 'ArrowRight') {\n target = allCells[idx + 1];\n } else if (e.key === 'ArrowLeft') {\n target = allCells[idx - 1];\n } else if (e.key === 'ArrowDown') {\n target = allCells[idx + columns];\n } else if (e.key === 'ArrowUp') {\n target = allCells[idx - columns];\n } else if (e.key === 'Home') {\n target = allCells[Math.floor(idx / columns) * columns];\n } else if (e.key === 'End') {\n target = allCells[Math.min(Math.floor(idx / columns) * columns + columns - 1, allCells.length - 1)];\n } else {\n return;\n }\n\n e.preventDefault();\n target?.focus();\n }\n\n // ── Open / close ─────────────────────────────────────────────────────────\n\n function openPicker(): void {\n if (isDisabled.value) return;\n\n isOpen.value = true;\n ctrl.setView('day');\n currentView.value = 'day';\n\n const sel = selectedDate.value;\n\n if (sel) {\n ctrl.goTo(sel.year, sel.month);\n displayYear.value = ctrl.displayYear();\n displayMonth.value = ctrl.displayMonth();\n }\n\n positioner.update();\n stopAutoUpdate = positioner.startAutoUpdate?.() ?? null;\n }\n\n function closePicker(): void {\n isOpen.value = false;\n ctrl.setView('day');\n currentView.value = 'day';\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n }\n\n function handleTriggerClick(): void {\n if (isOpen.value) closePicker();\n else openPicker();\n }\n\n // ── Keyboard handlers ────────────────────────────────────────────────────\n\n function handleTriggerKeydown(e: KeyboardEvent): void {\n if (isDisabled.value) return;\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleTriggerClick();\n } else if (e.key === 'Escape' && isOpen.value) {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleCalendarKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') {\n e.preventDefault();\n closePicker();\n }\n }\n\n function handleOutsideClick(e: PointerEvent | MouseEvent): void {\n if (!isOpen.value) return;\n\n const path = e.composedPath();\n\n if (!path.includes(el)) closePicker();\n }\n\n // ── Lifecycle ────────────────────────────────────────────────────────────\n\n onMounted(() => {\n document.addEventListener('pointerdown', handleOutsideClick, { capture: true });\n\n return () => {\n document.removeEventListener('pointerdown', handleOutsideClick, { capture: true });\n stopAutoUpdate?.();\n stopAutoUpdate = null;\n };\n });\n\n // ── Host bindings ────────────────────────────────────────────────────────\n\n bind({\n attr: {\n open: () => (isOpen.value ? true : undefined),\n },\n });\n\n // ── Template ─────────────────────────────────────────────────────────────\n\n const inputValue = () => triggerText.value;\n const inputLabel = () => props.label.value ?? '';\n const inputPlaceholder = () => props.placeholder.value ?? '';\n const inputLabelPlacement = () => props['label-placement'].value ?? 'inset';\n const inputColor = () => props.color?.value ?? undefined;\n const inputSize = () => props.size?.value ?? undefined;\n const inputVariant = () => props.variant?.value ?? undefined;\n const inputRounded = () => props.rounded?.value ?? undefined;\n const inputHelper = () => props.helper.value ?? '';\n const inputError = () => props.error.value ?? '';\n const inputDisabled = () => (isDisabled.value ? true : undefined);\n const inputRequired = () => (props.required.value ? true : undefined);\n const inputFullwidth = () => (props.fullwidth.value ? true : undefined);\n\n return html`\n <!-- Trigger: ore-input in readonly display mode -->\n <ore-input\n class=\"trigger\"\n ref=\"${triggerRef}\"\n readonly\n tabindex=\"${tabIndex}\"\n role=\"combobox\"\n aria-haspopup=\"dialog\"\n aria-controls=\"${dialogId}\"\n aria-expanded=\"${() => String(isOpen.value)}\"\n aria-disabled=\"${() => (isDisabled.value ? 'true' : null)}\"\n value=\"${inputValue}\"\n label=\"${inputLabel}\"\n placeholder=\"${inputPlaceholder}\"\n label-placement=\"${inputLabelPlacement}\"\n color=\"${inputColor}\"\n size=\"${inputSize}\"\n variant=\"${inputVariant}\"\n rounded=\"${inputRounded}\"\n helper=\"${inputHelper}\"\n error=\"${inputError}\"\n ?disabled=\"${inputDisabled}\"\n ?required=\"${inputRequired}\"\n ?fullwidth=\"${inputFullwidth}\"\n ?success=\"${() => props.success.value}\"\n @click=\"${handleTriggerClick}\"\n @keydown=\"${handleTriggerKeydown}\">\n <ore-icon slot=\"suffix\" name=\"calendar\" size=\"16\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n </ore-input>\n\n <!-- Calendar popup -->\n <div\n class=\"calendar\"\n ref=\"${calendarRef}\"\n id=\"${dialogId}\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"${() => `Choose date — ${displayLabel.value}`}\"\n ?data-open=\"${isOpen}\"\n @keydown=\"${handleCalendarKeydown}\">\n <!-- Calendar header -->\n <div class=\"cal-header\" part=\"header\">\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Previous\" @click=\"${handlePrev}\">\n <ore-icon name=\"chevron-left\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n <button\n class=\"cal-label-btn\"\n type=\"button\"\n aria-label=\"${() =>\n `Switch to ${currentView.value === 'day' ? 'month' : currentView.value === 'month' ? 'year' : 'day'} view`}\"\n @click=\"${handleHeaderClick}\">\n <span class=\"cal-label-month\">${displayMonth_}</span>\n <span class=\"cal-label-sep\" aria-hidden=\"true\">/</span>\n <span class=\"cal-label-year\">${displayYear_}</span>\n </button>\n <button class=\"nav-btn\" type=\"button\" aria-label=\"Next\" @click=\"${handleNext}\">\n <ore-icon name=\"chevron-right\" size=\"16\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n </button>\n </div>\n\n <!-- Day view: flat 7-column CSS grid, weekday headers + day cells -->\n <div\n class=\"cal-grid cal-grid-days\"\n role=\"grid\"\n part=\"grid\"\n aria-label=\"${() => displayLabel.value}\"\n ?hidden=\"${() => currentView.value !== 'day'}\">\n <div role=\"row\" class=\"cal-grid-row\">\n ${() =>\n weekdayLabels.value.map(\n (lbl) => html`\n <div class=\"cal-cell cal-cell-head\" role=\"columnheader\" aria-label=\"${lbl}\">${lbl}</div>\n `,\n )}\n </div>\n ${() => {\n const cells = dayCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 7) rows.push(cells.slice(i, i + 7));\n\n return rows.map(\n (row) => html`\n <div role=\"row\" class=\"cal-grid-row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-day\"\n role=\"gridcell\"\n part=\"day\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n aria-current=\"${() => (cell.isToday ? 'date' : null)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-today=\"${() => cell.isToday}\"\n ?data-outside=\"${() => cell.isOutsideMonth}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n data-iso=\"${cell.iso}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => handleSelectDay(cell.iso)}\"\n @keydown=\"${handleDayKeydown}\">\n ${String(cell.day)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Month view -->\n <div\n class=\"cal-grid cal-grid-months\"\n role=\"grid\"\n aria-label=\"${() => displayYear_.value}\"\n ?hidden=\"${() => currentView.value !== 'month'}\">\n ${() => {\n const cells = monthCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-month\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-month', 4, () => {\n if (!cell.isDisabled) handleSelectMonth(cell.month);\n })}\">\n ${cell.shortLabel}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n\n <!-- Year view -->\n <div\n class=\"cal-grid cal-grid-years\"\n role=\"grid\"\n aria-label=\"Select year\"\n ?hidden=\"${() => currentView.value !== 'year'}\">\n ${() => {\n const cells = yearCells.value;\n const rows: (typeof cells)[number][][] = [];\n\n for (let i = 0; i < cells.length; i += 4) rows.push(cells.slice(i, i + 4));\n\n return rows.map(\n (row) => html`\n <div role=\"row\">\n ${row.map(\n (cell) => html`\n <div\n class=\"cal-cell cal-cell-year\"\n role=\"gridcell\"\n aria-selected=\"${() => String(cell.isSelected)}\"\n aria-disabled=\"${() => String(cell.isDisabled)}\"\n ?data-selected=\"${() => cell.isSelected}\"\n ?data-disabled=\"${() => cell.isDisabled}\"\n tabindex=\"${() => (cell.isDisabled ? '-1' : '0')}\"\n @click=\"${() => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n }}\"\n @keydown=\"${(e: KeyboardEvent) =>\n handleGridKeydown(e, '.cal-cell-year', 4, () => {\n if (!cell.isDisabled) handleSelectYear(cell.year);\n })}\">\n ${String(cell.year)}\n </div>\n `,\n )}\n </div>\n `,\n );\n }}\n </div>\n </div>\n `;\n },\n\n shadow: { delegatesFocus: true },\n styles: [colorThemeMixin, reducedMotionMixin, componentStyles],\n});\n"],"mappings":";;;;;;;;;;;AA2IA,IAAa,IAAkB;AAE/B,EAA2B,GAAiB;CAC1C,gBAAgB;CAChB,OAAO;EACL,GAAG;EACH,GAAG;EACH,GAAG;EACH,GAAG;EACH,OAAO,EAAK,OAAO;EACnB,WAAW,EAAK,KAAK,EAAK;EAC1B,QAAQ,EAAK,OAAO;EACpB,OAAO,EAAK,OAAO;EACnB,mBAAmB,EAAK,MAAM,CAAC,SAAS,SAAS,GAAY,OAAO;EACpE,QAAQ,EAAK,OAAO;EACpB,KAAK,EAAK,OAAO;EACjB,KAAK,EAAK,OAAO;EACjB,MAAM,EAAK,OAAO;EAClB,aAAa,EAAK,OAAO;EACzB,UAAU,EAAK,KAAK,EAAK;EACzB,SAAS,EAAK,KAAK,EAAK;EACxB,OAAO,EAAK,OAAO;EACnB,SAAS,EAAK,OAA4D;EAC1E,gBAAgB,EAAK,KAAK,CAAC,CAAa;CAC1C;CAEA,MAAM,GAAO;EACX,IAAM,IAAK,EAAQ,GAIb,IAAS,EAAO,EAAK,GAMrB,IAAiB,EAA8C,KAAA,CAAS,GAExE,IAAe,QACnB,EAAe,UAAU,KAAA,IAAmC,EAAS,EAAM,MAAM,KAAK,IAAjD,EAAe,KACtD;EAEA,EACE,SACM,EAAY,EAAa,KAAK,KAAK,KACxC,MAAU;GACT,EAAe,QAAQ,EAAS,CAAK;EACvC,CACF;EAEA,IAAM,IAAa,QAAe,EAAQ,EAAM,SAAS,KAAM,GACzD,IAAS,QAAe,EAAM,OAAO,UAAU,OAAO,YAAc,MAAc,UAAU,WAAW,KAAK,GAI5G,IAAO,EAAwB;GACnC,IAAI,SAAS;IACX,OAAO,EAAO;GAChB;GACA,IAAI,MAAM;IACR,OAAO,EAAS,EAAM,IAAI,KAAK;GACjC;GACA,IAAI,MAAM;IACR,OAAO,EAAS,EAAM,IAAI,KAAK;GACjC;GACA,SAAS,GAAM;IASb,AARA,EAAe,QAAQ,GACvB,EAAO,QAAQ,IACf,EAAK,QAAQ,KAAK,GAClB,EAAY,QAAQ,OACpB,EAAY,QAAQ,EAAK,YAAY,GACrC,EAAa,QAAQ,EAAK,aAAa,GACvC,EAAc,GAAI,EAAY,CAAI,KAAK,EAAE,GACzC,EAAyB,GAAI,OAAO,GACpC,EAAyB,GAAI,QAAQ;GACvC;GACA,IAAI,QAAQ;IACV,OAAO,EAAa;GACtB;GACA,IAAI,cAAc;IAChB,OAAO,EAAM,eAAe,CAAC,SAAS,CAAC;GACzC;EACF,CAAC,GAKK,IAAc,EAAuB,KAAK,GAC1C,IAAc,EAAO,EAAK,YAAY,CAAC,GACvC,IAAe,EAAO,EAAK,aAAa,CAAC;EAI/C,EAAiB;GACf,UAAU;GACV,cAAc,MAAM,KAAK;GACzB,OAAO,QAAe,EAAY,EAAa,KAAK,KAAK,EAAE;EAC7D,CAAC;EAED,IAAM,IAAW,eAAe,KAAK,OAAO,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE,YAcjE,IAAa,EAAiB,GAC9B,IAAc,EAAiB,GAE/B,IAAa,EAAyB;GAC1C,mBAAmB,EAAY,SAAS;GACxC,oBAAoB,EAAW,SAAS;GACxC,YAAY;GACZ,UAAU;EACZ,CAAC,GAEG,IAAsC,MAIpC,IAAc,QACd,EAAa,QAAc,EAAkB,EAAa,OAAO,EAAO,KAAK,IAE1E,EAAM,YAAY,SAAS,EACnC,GAEK,IAAgB,QAAe;GACnC,IAAM,IAAI,EAAS,UAAU,KAAK;IAAE,KAAK;IAAG,OAAO,EAAa;IAAO,MAAM,EAAY;GAAM,CAAC;GAEhG,OAAO,GAAO,GAAG;IAAE,MAAM,EAAE,OAAO,OAAO;IAAG,QAAQ,EAAO;IAAO,UAAU;GAAM,CAAC;EACrF,CAAC,GAEK,IAAe,QAAe,OAAO,EAAY,KAAK,CAAC,GACvD,IAAe,QAAe,GAAG,EAAc,MAAM,GAAG,EAAa,OAAO,GAE5E,IAAW,SACf,EAAiB,OACjB,EAAkB,OAClB,EAAkB,OAEX,EAAK,SAAS,EACtB,GACK,IAAa,SACjB,EAAiB,OAEV,EAAK,WAAW,EACxB,GACK,IAAY,SAChB,EAAiB,OAEV,EAAK,UAAU,EACvB,GACK,IAAgB,QAAe,EAAK,cAAc,CAAC,GACnD,UAAkB,EAAW,QAAQ,OAAO;EAKlD,SAAS,IAAmB;GAK1B,AAJI,EAAY,UAAU,QAAO,EAAK,UAAU,IAC3C,EAAK,SAAS,GAEnB,EAAY,QAAQ,EAAK,YAAY,GACrC,EAAa,QAAQ,EAAK,aAAa;EACzC;EAEA,SAAS,IAAmB;GAK1B,AAJI,EAAY,UAAU,QAAO,EAAK,UAAU,IAC3C,EAAK,SAAS,GAEnB,EAAY,QAAQ,EAAK,YAAY,GACrC,EAAa,QAAQ,EAAK,aAAa;EACzC;EAEA,SAAS,IAA0B;GACjC,IAAM,IAA0B;IAAC;IAAO;IAAS;GAAM,GACjD,IAAO,GAAO,EAAM,QAAQ,EAAY,KAAK,IAAI,KAAK,EAAM;GAGlE,AADA,EAAK,QAAQ,CAAI,GACjB,EAAY,QAAQ;EACtB;EAEA,SAAS,EAAkB,GAAqB;GAK9C,AAJA,EAAK,KAAK,EAAK,YAAY,GAAG,CAAK,GACnC,EAAK,QAAQ,KAAK,GAClB,EAAY,QAAQ,EAAK,YAAY,GACrC,EAAa,QAAQ,EAAK,aAAa,GACvC,EAAY,QAAQ;EACtB;EAEA,SAAS,EAAiB,GAAoB;GAI5C,AAHA,EAAK,KAAK,GAAM,EAAK,aAAa,CAAC,GACnC,EAAK,QAAQ,OAAO,GACpB,EAAY,QAAQ,EAAK,YAAY,GACrC,EAAY,QAAQ;EACtB;EAEA,SAAS,EAAgB,GAAsB;GAC7C,IAAM,IAAO,EAAS,CAAM;GAEvB,KAEL,EAAK,OAAO,CAAI;EAClB;EAEA,SAAS,EAAiB,GAAwB;GAChD,IAAM,IAAO,EAAE,eACT,IAAO,EAAK,QAAQ,gBAAgB;GAE1C,IAAI,CAAC,GAAM;GAEX,IAAM,IAAW,MAAM,KAAK,EAAK,iBAA8B,eAAe,CAAC,GACzE,IAAM,EAAS,QAAQ,CAAI;GAEjC,IAAI,MAAQ,IAAI;GAEhB,IAAI;GAEJ,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;IAEtC,AADA,EAAE,eAAe,GACjB,EAAgB,EAAK,QAAQ,OAAO,EAAE;IAEtC;GACF;GAAO,IAAI,EAAE,QAAQ,cACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,aACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,aACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,WACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,QACnB,IAAS,EAAS,KAAK,MAAM,IAAM,CAAC,IAAI;QACnC,IAAI,EAAE,QAAQ,OACnB,IAAS,EAAS,KAAK,MAAM,IAAM,CAAC,IAAI,IAAI;QAE5C;GAIF,AADA,EAAE,eAAe,GACjB,GAAQ,MAAM;EAChB;EAIA,SAAS,EAAkB,GAAkB,GAAsB,GAAiB,GAA4B;GAC9G,IAAM,IAAO,EAAE,eACT,IAAO,EAAK,QAAQ,WAAW;GAErC,IAAI,CAAC,GAAM;GAEX,IAAM,IAAW,MAAM,KAAK,EAAK,iBAA8B,CAAY,CAAC,GACtE,IAAM,EAAS,QAAQ,CAAI;GAEjC,IAAI,MAAQ,IAAI;GAEhB,IAAI;GAEJ,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;IAEtC,AADA,EAAE,eAAe,GACjB,EAAS;IAET;GACF;GAAO,IAAI,EAAE,QAAQ,cACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,aACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,aACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,WACnB,IAAS,EAAS,IAAM;QACnB,IAAI,EAAE,QAAQ,QACnB,IAAS,EAAS,KAAK,MAAM,IAAM,CAAO,IAAI;QACzC,IAAI,EAAE,QAAQ,OACnB,IAAS,EAAS,KAAK,IAAI,KAAK,MAAM,IAAM,CAAO,IAAI,IAAU,IAAU,GAAG,EAAS,SAAS,CAAC;QAEjG;GAIF,AADA,EAAE,eAAe,GACjB,GAAQ,MAAM;EAChB;EAIA,SAAS,IAAmB;GAC1B,IAAI,EAAW,OAAO;GAItB,AAFA,EAAO,QAAQ,IACf,EAAK,QAAQ,KAAK,GAClB,EAAY,QAAQ;GAEpB,IAAM,IAAM,EAAa;GASzB,AAPI,MACF,EAAK,KAAK,EAAI,MAAM,EAAI,KAAK,GAC7B,EAAY,QAAQ,EAAK,YAAY,GACrC,EAAa,QAAQ,EAAK,aAAa,IAGzC,EAAW,OAAO,GAClB,IAAiB,EAAW,kBAAkB,KAAK;EACrD;EAEA,SAAS,IAAoB;GAK3B,AAJA,EAAO,QAAQ,IACf,EAAK,QAAQ,KAAK,GAClB,EAAY,QAAQ,OACpB,IAAiB,GACjB,IAAiB;EACnB;EAEA,SAAS,IAA2B;GAClC,AAAI,EAAO,QAAO,EAAY,IACzB,EAAW;EAClB;EAIA,SAAS,GAAqB,GAAwB;GAChD,EAAW,UAEX,EAAE,QAAQ,WAAW,EAAE,QAAQ,OACjC,EAAE,eAAe,GACjB,EAAmB,KACV,EAAE,QAAQ,YAAY,EAAO,UACtC,EAAE,eAAe,GACjB,EAAY;EAEhB;EAEA,SAAS,GAAsB,GAAwB;GACrD,AAAI,EAAE,QAAQ,aACZ,EAAE,eAAe,GACjB,EAAY;EAEhB;EAEA,SAAS,EAAmB,GAAoC;GACzD,EAAO,UAEC,EAAE,aAEV,CAAA,CAAK,SAAS,CAAE,KAAG,EAAY;EACtC;EAsCA,OAlCA,SACE,SAAS,iBAAiB,eAAe,GAAoB,EAAE,SAAS,GAAK,CAAC,SAEjE;GAGX,AAFA,SAAS,oBAAoB,eAAe,GAAoB,EAAE,SAAS,GAAK,CAAC,GACjF,IAAiB,GACjB,IAAiB;EACnB,EACD,GAID,EAAK,EACH,MAAM,EACJ,YAAa,EAAO,QAAQ,KAAO,KAAA,EACrC,EACF,CAAC,GAkBM,CAAI;;;;eAIA,EAAW;;oBAEN,EAAS;;;yBAGJ,EAAS;+BACH,OAAO,EAAO,KAAK,EAAE;+BACpB,EAAW,QAAQ,SAAS,KAAM;uBAzBrC,EAAY,MA0Bb;uBAzBC,EAAM,MAAM,SAAS,GA0BtB;6BAzBO,EAAM,YAAY,SAAS,GA0BtB;iCAzBF,EAAM,kBAAkB,CAAC,SAAS,QA0BzB;uBAzBlB,EAAM,OAAO,SAAS,KAAA,EA0BvB;sBAzBA,EAAM,MAAM,SAAS,KAAA,EA0BvB;yBAzBK,EAAM,SAAS,SAAS,KAAA,EA0BvB;yBAzBD,EAAM,SAAS,SAAS,KAAA,EA0BvB;wBAzBF,EAAM,OAAO,SAAS,GA0BtB;uBAzBD,EAAM,MAAM,SAAS,GA0BtB;2BAzBK,EAAW,QAAQ,KAAO,KAAA,EA0BxB;2BAzBF,EAAM,SAAS,QAAQ,KAAO,KAAA,EA0B5B;4BAzBD,EAAM,UAAU,QAAQ,KAAO,KAAA,EA0B5B;0BACX,EAAM,QAAQ,MAAM;kBAC5B,EAAmB;oBACjB,GAAqB;;;;;;;eAO1B,EAAY;cACb,EAAS;;;4BAGK,iBAAiB,EAAa,QAAQ;sBAC5C,EAAO;oBACT,GAAsB;;;gFAGsC,EAAW;;;;;;gCAO7E,aAAa,EAAY,UAAU,QAAQ,UAAU,EAAY,UAAU,UAAU,SAAS,MAAM,OAAO;sBACnG,EAAkB;4CACI,EAAc;;2CAEf,EAAa;;4EAEoB,EAAW;;;;;;;;;;8BAUzD,EAAa,MAAM;2BACtB,EAAY,UAAU,MAAM;;oBAGzC,EAAc,MAAM,KACjB,MAAQ,CAAI;wFAC2D,EAAI,IAAI,EAAI;iBAEtF,EAAE;;kBAEE;GACN,IAAM,IAAQ,EAAS,OACjB,IAAmC,CAAC;GAE1C,KAAK,IAAI,IAAI,GAAG,IAAI,EAAM,QAAQ,KAAK,GAAG,EAAK,KAAK,EAAM,MAAM,GAAG,IAAI,CAAC,CAAC;GAEzE,OAAO,EAAK,KACT,MAAQ,CAAI;;oBAEP,EAAI,KACH,MAAS,CAAI;;;;;+CAKa,OAAO,EAAK,UAAU,EAAE;+CACxB,OAAO,EAAK,UAAU,EAAE;8CACxB,EAAK,UAAU,SAAS,KAAM;gDAC7B,EAAK,WAAW;6CACnB,EAAK,QAAQ;+CACX,EAAK,eAAe;gDACnB,EAAK,WAAW;oCAC5B,EAAK,IAAI;0CACF,EAAK,aAAa,OAAO,IAAK;wCACjC,EAAgB,EAAK,GAAG,EAAE;oCAC9B,EAAiB;0BAC3B,OAAO,EAAK,GAAG,EAAE;;qBAGzB,EAAE;;eAGR;EACF,EAAE;;;;;;;8BAOkB,EAAa,MAAM;2BACtB,EAAY,UAAU,QAAQ;kBACvC;GACN,IAAM,IAAQ,EAAW,OACnB,IAAmC,CAAC;GAE1C,KAAK,IAAI,IAAI,GAAG,IAAI,EAAM,QAAQ,KAAK,GAAG,EAAK,KAAK,EAAM,MAAM,GAAG,IAAI,CAAC,CAAC;GAEzE,OAAO,EAAK,KACT,MAAQ,CAAI;;oBAEP,EAAI,KACH,MAAS,CAAI;;;;+CAIa,OAAO,EAAK,UAAU,EAAE;+CACxB,OAAO,EAAK,UAAU,EAAE;gDACvB,EAAK,WAAW;gDAChB,EAAK,WAAW;0CACrB,EAAK,aAAa,OAAO,IAAK;wCACjC;IACd,AAAK,EAAK,cAAY,EAAkB,EAAK,KAAK;GACpD,EAAE;qCACW,MACX,EAAkB,GAAG,mBAAmB,SAAS;IAC/C,AAAK,EAAK,cAAY,EAAkB,EAAK,KAAK;GACpD,CAAC,EAAE;0BACH,EAAK,WAAW;;qBAGxB,EAAE;;eAGR;EACF,EAAE;;;;;;;;2BAQe,EAAY,UAAU,OAAO;kBACtC;GACN,IAAM,IAAQ,EAAU,OAClB,IAAmC,CAAC;GAE1C,KAAK,IAAI,IAAI,GAAG,IAAI,EAAM,QAAQ,KAAK,GAAG,EAAK,KAAK,EAAM,MAAM,GAAG,IAAI,CAAC,CAAC;GAEzE,OAAO,EAAK,KACT,MAAQ,CAAI;;oBAEP,EAAI,KACH,MAAS,CAAI;;;;+CAIa,OAAO,EAAK,UAAU,EAAE;+CACxB,OAAO,EAAK,UAAU,EAAE;gDACvB,EAAK,WAAW;gDAChB,EAAK,WAAW;0CACrB,EAAK,aAAa,OAAO,IAAK;wCACjC;IACd,AAAK,EAAK,cAAY,EAAiB,EAAK,IAAI;GAClD,EAAE;qCACW,MACX,EAAkB,GAAG,kBAAkB,SAAS;IAC9C,AAAK,EAAK,cAAY,EAAiB,EAAK,IAAI;GAClD,CAAC,EAAE;0BACH,OAAO,EAAK,IAAI,EAAE;;qBAG1B,EAAE;;eAGR;EACF,EAAE;;;;CAIV;CAEA,QAAQ,EAAE,gBAAgB,GAAK;CAC/B,QAAQ;EAAC;EAAiB;EAAoB;CAAe;AAC/D,CAAC"}
@@ -1,2 +1,2 @@
1
- const e=require("../../core/ore.cjs"),t=require("../../core/overlay.cjs");let n=require("@vielzeug/ripple"),r=require("@vielzeug/ripple/watch"),i=require("@vielzeug/orbit");var a=a=>{let{bindTriggerAria:o,defaultOpen:s,disabled:c,getPanel:l,onClose:u,onOpen:d,onPlacementChange:f,openProp:p,placement:m,slot:h,slotElements:g,triggers:_}=a,v=()=>typeof h==`function`?h():h,y=()=>{let e=a.offset;return e==null?8:(typeof e==`object`?e.value:e)??8},b=e.lifecycleSignal(a.onCleanup),x=(0,n.signal)(!1),S=()=>p.value!==void 0,C=null,w=null;function T(){let e=l();if(!e||!C)return;let t=(0,i.computePosition)(C,e,{middleware:[(0,i.offset)(y()),(0,i.flip)(),(0,i.shift)({padding:8})],placement:m.value});e.style.left=`${t.x}px`,e.style.top=`${t.y}px`,e.dataset.placement=t.placement,f?.(t.placement)}function E(){x.value=!0;let e=l();if(e&&(e.dataset.open=``,`showPopover`in e))try{e.matches(`:popover-open`)||e.showPopover()}catch{}T()}function D(){x.value=!1;let e=l();if(e&&(delete e.dataset.open,`hidePopover`in e))try{e.matches(`:popover-open`)&&e.hidePopover()}catch{}}function O(e=`programmatic`){S()||c.value||x.value||(E(),d?.(e))}function k(e=`trigger`){S()||!x.value||(D(),u?.(e))}function A(){S()||(x.value?k():O(`click`))}function j(e){e.key===`Escape`&&k(`escape`)}function M(e){let t=e.relatedTarget,n=l();t&&n?.contains(t)||t&&C?.contains(t)||k(`trigger`)}let N=()=>{w?.(),w=null;let e=v()?.assignedElements({flatten:!0})[0];if(!e){C=null;return}C=e;let t=o(e),n=[],r=(e,t,r,i)=>{e.addEventListener(t,r,i),n.push(()=>e.removeEventListener(t,r,i))},i=_.value;if(i.includes(`click`)&&r(e,`click`,A),i.includes(`hover`)){r(e,`pointerenter`,()=>O(`hover`)),r(e,`pointerleave`,()=>k(`trigger`));let t=l();t&&(r(t,`pointerenter`,()=>O(`hover`)),r(t,`pointerleave`,()=>k(`trigger`)))}if(i.includes(`focus`)){r(e,`focusin`,()=>O(`focus`)),r(e,`focusout`,M);let t=l();t&&r(t,`focusout`,M)}r(document,`keydown`,j),w=()=>{t();for(let e of n)e();C=null}},P=t.createOutsidePointerDismissal({getTargets:()=>[C,l(),a.getHost?.()],isActive:()=>x.value&&_.value.includes(`click`),onDismiss:()=>k(`outsideClick`),signal:b});return{close:k,mount:()=>{let e=!1;return(0,r.watch)(g,N,{immediate:!0}),(0,r.watch)(p,t=>{if(t==null){e&&x.value&&(D(),u?.(`programmatic`)),e=!0;return}e=!0,t?(E(),d?.(`programmatic`)):x.value&&(D(),u?.(`programmatic`))},{immediate:!0}),p.value===void 0&&s.value&&(E(),d?.(`programmatic`)),(0,r.watch)(c,e=>{e&&k(`programmatic`)}),()=>{w?.(),w=null;let e=l();if(e&&(delete e.dataset.open,`hidePopover`in e))try{e.matches(`:popover-open`)&&e.hidePopover()}catch{}P()}},open:O,toggle:A,updatePosition:T,visible:x}};exports.useFloatingTrigger=a;
1
+ const e=require("../../core/ore.cjs"),t=require("../../core/overlay.cjs");let n=require("@vielzeug/ripple"),r=require("@vielzeug/ripple/watch"),i=require("@vielzeug/orbit");var a=a=>{let{bindTriggerAria:o,defaultOpen:s,disabled:c,getPanel:l,onClose:u,onOpen:d,onPlacementChange:f,openProp:p,placement:m,slot:h,slotElements:g,triggers:_}=a,v=()=>typeof h==`function`?h():h,y=()=>{let e=a.offset;return e==null?8:(typeof e==`object`?e.value:e)??8},b=e.lifecycleSignal(a.onCleanup),x=(0,n.signal)(!1),S=()=>p.value!==void 0,C=null,w=null;function T(){let e=l(),t=C??v()?.assignedElements({flatten:!0})[0];if(!e||!t)return;let n=e.style.transition,r=e.style.transform;e.style.transition=`none`,e.style.transform=`none`;let a=(0,i.computePosition)(t,e,{middleware:[(0,i.offset)(y()),(0,i.flip)(),(0,i.shift)({padding:8})],placement:m.value});e.style.left=`${a.x}px`,e.style.top=`${a.y}px`,e.style.transition=n,e.style.transform=r,e.dataset.placement=a.placement,f?.(a.placement)}function E(){x.value=!0;let e=l();if(e&&(e.dataset.open=``,`showPopover`in e))try{e.matches(`:popover-open`)||e.showPopover()}catch{}T()}function D(){x.value=!1;let e=l();if(e&&(delete e.dataset.open,`hidePopover`in e))try{e.matches(`:popover-open`)&&e.hidePopover()}catch{}}function O(e=`programmatic`){S()||c.value||x.value||(E(),d?.(e))}function k(e=`trigger`){S()||!x.value||(D(),u?.(e))}function A(){S()||(x.value?k():O(`click`))}function j(e){e.key===`Escape`&&k(`escape`)}function M(e){let t=e.relatedTarget,n=l();t&&n?.contains(t)||t&&C?.contains(t)||k(`trigger`)}let N=()=>{w?.(),w=null;let e=v()?.assignedElements({flatten:!0})[0];if(!e){C=null;return}C=e;let t=o(e),n=[],r=(e,t,r,i)=>{e.addEventListener(t,r,i),n.push(()=>e.removeEventListener(t,r,i))},i=_.value;if(i.includes(`click`)&&r(e,`click`,A),i.includes(`hover`)){r(e,`pointerenter`,()=>O(`hover`)),r(e,`pointerleave`,()=>k(`trigger`));let t=l();t&&(r(t,`pointerenter`,()=>O(`hover`)),r(t,`pointerleave`,()=>k(`trigger`)))}if(i.includes(`focus`)){r(e,`focusin`,()=>O(`focus`)),r(e,`focusout`,M);let t=l();t&&r(t,`focusout`,M)}r(document,`keydown`,j),w=()=>{t();for(let e of n)e();C=null}},P=t.createOutsidePointerDismissal({getTargets:()=>[C,l(),a.getHost?.()],isActive:()=>x.value&&_.value.includes(`click`),onDismiss:()=>k(`outsideClick`),signal:b});return{close:k,mount:()=>{let e=!1,t=v(),n=()=>{queueMicrotask(()=>{b.aborted||N()})};return t?.addEventListener(`slotchange`,n),n(),(0,r.watch)(g,N,{immediate:!0}),(0,r.watch)(p,t=>{if(t==null){e&&x.value&&(D(),u?.(`programmatic`)),e=!0;return}e=!0,t?(E(),d?.(`programmatic`)):x.value&&(D(),u?.(`programmatic`))},{immediate:!0}),p.value===void 0&&s.value&&(E(),d?.(`programmatic`)),(0,r.watch)(c,e=>{e&&k(`programmatic`)}),()=>{t?.removeEventListener(`slotchange`,n),w?.(),w=null;let e=l();if(e&&(delete e.dataset.open,`hidePopover`in e))try{e.matches(`:popover-open`)&&e.hidePopover()}catch{}P()}},open:O,toggle:A,updatePosition:T,visible:x}};exports.useFloatingTrigger=a;
2
2
  //# sourceMappingURL=use-floating-trigger.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"use-floating-trigger.cjs","names":[],"sources":["../../../src/overlay/shared/use-floating-trigger.ts"],"sourcesContent":["import type { Placement } from '@vielzeug/orbit';\n\nimport { computePosition, flip, offset, shift } from '@vielzeug/orbit';\nimport { type Readable, type Signal, signal } from '@vielzeug/ripple';\nimport { watch } from '@vielzeug/ripple/watch';\n\nimport { lifecycleSignal, type DialogCloseReason, type OverlayOpenReason } from '../../core';\nimport { createOutsidePointerDismissal } from '../../core/overlay';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type FloatingTriggerType = 'click' | 'focus' | 'hover';\n\nexport type AriaBindFn = (triggerEl: HTMLElement) => () => void;\n\nexport type FloatingTriggerOptions = {\n /** ARIA binding factory: called with the trigger element, returns a cleanup. */\n bindTriggerAria: AriaBindFn;\n /** Initial uncontrolled visibility. Ignored when `openProp` is defined. */\n defaultOpen: Readable<boolean | undefined>;\n /** If true, disable all trigger interactions and close if open. */\n disabled: Readable<boolean>;\n /** Returns the host element (e.g. ore-popover) so slotted content clicks aren't treated as outside clicks. */\n getHost?: () => Element | null;\n /** Returns the panel element, if mounted. */\n getPanel: () => HTMLElement | null;\n /** Gap from reference to floating panel in px. Default: 8. Accepts a signal for runtime reactivity. */\n offset?: Readable<number | undefined> | number;\n /** Cleanup registrar from the component setup ctx. Automatically called on disconnect. */\n onCleanup: (fn: () => void) => void;\n /** Called when the popover closes. */\n onClose?: (reason: DialogCloseReason) => void;\n /** Called when the popover opens. */\n onOpen?: (reason: OverlayOpenReason) => void;\n /** Callback when resolved placement changes (useful for CSS attribute). */\n onPlacementChange?: (placement: Placement) => void;\n /** Controlled open prop. When defined, disables uncontrolled logic. */\n openProp: Readable<boolean | undefined>;\n /** Preferred placement. Default: 'bottom'. */\n placement: Readable<Placement>;\n /** Slot element or a factory to lazily find it. Resolved each time bindEvents runs. */\n slot: HTMLSlotElement | null | (() => HTMLSlotElement | null);\n /** Slot elements signal — used to rebind when slotted elements change. */\n slotElements: Readable<Element[]>;\n /** Which triggers are active. Set to empty array or omit if handling events manually. */\n triggers: Readable<FloatingTriggerType[]>;\n};\n\nexport type FloatingTriggerHandle = {\n /** Closes the panel. No-op if controlled. */\n close: (reason?: DialogCloseReason) => void;\n /**\n * Call inside `onMounted`. Sets up slot + trigger event watchers\n * and returns a cleanup function to pass back to the framework.\n */\n mount: () => () => void;\n /** Opens the panel. No-op if controlled. */\n open: (reason?: OverlayOpenReason) => void;\n /** Toggles the panel. No-op if controlled. */\n toggle: () => void;\n /** Manually trigger a position recalculation. */\n updatePosition: () => void;\n /** Whether the panel is currently visible. */\n visible: Signal<boolean>;\n};\n\n// ── Implementation ─────────────────────────────────────────────────────────────\n\n/**\n * Shared logic for floating-panel triggers (tooltip, popover).\n *\n * Handles:\n * - Slot-based trigger element detection and rebinding\n * - Event binding per trigger type (hover / focus / click)\n * - Floating-element positioning via `@vielzeug/orbit`\n * - Controlled mode via `openProp` watcher\n * - Keyboard escape dismissal\n *\n * ARIA binding is intentionally delegated to the caller via `bindTriggerAria`\n * so that tooltip (`describedby`) and popover (`expanded`/`controls`/…) can diverge.\n */\nexport const useFloatingTrigger = (options: FloatingTriggerOptions): FloatingTriggerHandle => {\n const {\n bindTriggerAria,\n defaultOpen,\n disabled,\n getPanel,\n onClose,\n onOpen,\n onPlacementChange,\n openProp,\n placement,\n slot,\n slotElements,\n triggers,\n } = options;\n\n const resolveSlot = (): HTMLSlotElement | null => (typeof slot === 'function' ? slot() : slot);\n const getOffset = (): number => {\n const o = options.offset;\n\n if (o == null) return 8;\n\n const val = typeof o === 'object' ? (o as Readable<number | undefined>).value : o;\n\n return val ?? 8;\n };\n const abortSignal = lifecycleSignal(options.onCleanup);\n const visible = signal(false);\n const isControlled = () => openProp.value !== undefined;\n let currentTrigger: HTMLElement | null = null;\n let triggerBinding: (() => void) | null = null;\n\n function updatePosition(): void {\n const panel = getPanel();\n\n if (!panel || !currentTrigger) return;\n\n const result = computePosition(currentTrigger, panel, {\n middleware: [offset(getOffset()), flip(), shift({ padding: 8 })],\n placement: placement.value,\n });\n\n panel.style.left = `${result.x}px`;\n panel.style.top = `${result.y}px`;\n\n panel.dataset.placement = result.placement;\n\n onPlacementChange?.(result.placement as Placement);\n }\n\n function showFloat(): void {\n visible.value = true;\n\n const panel = getPanel();\n\n if (panel) {\n panel.dataset.open = '';\n\n if ('showPopover' in panel) {\n try {\n if (!panel.matches(':popover-open')) panel.showPopover();\n } catch {\n // Popover API restricted (e.g. sandboxed iframe); data-open CSS fallback handles visibility.\n }\n }\n }\n\n updatePosition();\n }\n\n function hideFloat(): void {\n visible.value = false;\n\n const panel = getPanel();\n\n if (panel) {\n delete panel.dataset.open;\n\n if ('hidePopover' in panel) {\n try {\n if (panel.matches(':popover-open')) panel.hidePopover();\n } catch {\n // Popover API restricted; data-open removal handles visibility.\n }\n }\n }\n }\n\n function open(reason: OverlayOpenReason = 'programmatic'): void {\n if (isControlled() || disabled.value || visible.value) return;\n\n showFloat();\n onOpen?.(reason);\n }\n\n function close(reason: DialogCloseReason = 'trigger'): void {\n if (isControlled() || !visible.value) return;\n\n hideFloat();\n onClose?.(reason);\n }\n\n function toggle(): void {\n if (isControlled()) return;\n\n if (visible.value) close();\n else open('click');\n }\n\n function handleKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') close('escape');\n }\n\n function handleFocusOut(e: FocusEvent): void {\n const next = e.relatedTarget as Element | null;\n const panel = getPanel();\n\n if (next && panel?.contains(next)) return;\n\n if (next && currentTrigger?.contains(next)) return;\n\n close('trigger');\n }\n\n const bindEvents = (): void => {\n triggerBinding?.();\n triggerBinding = null;\n\n const triggerEl = resolveSlot()?.assignedElements({ flatten: true })[0] as HTMLElement | undefined;\n\n if (!triggerEl) {\n currentTrigger = null;\n\n return;\n }\n\n currentTrigger = triggerEl;\n\n const removeAria = bindTriggerAria(triggerEl);\n const cleanups: Array<() => void> = [];\n\n const add = (\n target: EventTarget,\n event: string,\n listener: EventListener,\n eventOptions?: AddEventListenerOptions,\n ): void => {\n target.addEventListener(event, listener, eventOptions);\n cleanups.push(() => target.removeEventListener(event, listener, eventOptions));\n };\n\n const t = triggers.value;\n\n if (t.includes('click')) {\n add(triggerEl, 'click', toggle as EventListener);\n }\n\n if (t.includes('hover')) {\n add(triggerEl, 'pointerenter', () => open('hover'));\n add(triggerEl, 'pointerleave', () => close('trigger'));\n\n const panelEl = getPanel();\n\n if (panelEl) {\n add(panelEl, 'pointerenter', () => open('hover'));\n add(panelEl, 'pointerleave', () => close('trigger'));\n }\n }\n\n if (t.includes('focus')) {\n add(triggerEl, 'focusin', () => open('focus'));\n add(triggerEl, 'focusout', handleFocusOut as EventListener);\n\n const panelEl = getPanel();\n\n if (panelEl) add(panelEl, 'focusout', handleFocusOut as EventListener);\n }\n\n add(document, 'keydown', handleKeydown as EventListener);\n\n triggerBinding = () => {\n removeAria();\n\n for (const cleanup of cleanups) cleanup();\n\n currentTrigger = null;\n };\n };\n\n const stopOutsidePointerDismissal = createOutsidePointerDismissal({\n getTargets: () => [currentTrigger, getPanel(), options.getHost?.()],\n isActive: () => visible.value && triggers.value.includes('click'),\n onDismiss: () => close('outsideClick'),\n signal: abortSignal,\n });\n\n const mount = (): (() => void) => {\n let initializedOpenProp = false;\n\n watch(slotElements, bindEvents, { immediate: true });\n\n watch(\n openProp,\n (openVal) => {\n if (openVal === undefined || openVal === null) {\n if (initializedOpenProp && visible.value) {\n hideFloat();\n onClose?.('programmatic');\n }\n\n initializedOpenProp = true;\n\n return;\n }\n\n initializedOpenProp = true;\n\n if (openVal) {\n showFloat();\n onOpen?.('programmatic');\n } else if (visible.value) {\n hideFloat();\n onClose?.('programmatic');\n }\n },\n { immediate: true },\n );\n\n if (openProp.value === undefined && defaultOpen.value) {\n showFloat();\n onOpen?.('programmatic');\n }\n\n watch(disabled, (isNowDisabled) => {\n if (isNowDisabled) close('programmatic');\n });\n\n return () => {\n triggerBinding?.();\n triggerBinding = null;\n\n const panel = getPanel();\n\n if (panel) {\n delete panel.dataset.open;\n\n if ('hidePopover' in panel) {\n try {\n if (panel.matches(':popover-open')) panel.hidePopover();\n } catch {\n // Popover API restricted; data-open removal handles visibility.\n }\n }\n }\n\n stopOutsidePointerDismissal();\n };\n };\n\n return { close, mount, open, toggle, updatePosition, visible };\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"use-floating-trigger.cjs","names":[],"sources":["../../../src/overlay/shared/use-floating-trigger.ts"],"sourcesContent":["import type { Placement } from '@vielzeug/orbit';\n\nimport { computePosition, flip, offset, shift } from '@vielzeug/orbit';\nimport { type Readable, type Signal, signal } from '@vielzeug/ripple';\nimport { watch } from '@vielzeug/ripple/watch';\n\nimport { lifecycleSignal, type DialogCloseReason, type OverlayOpenReason } from '../../core';\nimport { createOutsidePointerDismissal } from '../../core/overlay';\n\n// ── Types ─────────────────────────────────────────────────────────────────────\n\nexport type FloatingTriggerType = 'click' | 'focus' | 'hover';\n\nexport type AriaBindFn = (triggerEl: HTMLElement) => () => void;\n\nexport type FloatingTriggerOptions = {\n /** ARIA binding factory: called with the trigger element, returns a cleanup. */\n bindTriggerAria: AriaBindFn;\n /** Initial uncontrolled visibility. Ignored when `openProp` is defined. */\n defaultOpen: Readable<boolean | undefined>;\n /** If true, disable all trigger interactions and close if open. */\n disabled: Readable<boolean>;\n /** Returns the host element (e.g. ore-popover) so slotted content clicks aren't treated as outside clicks. */\n getHost?: () => Element | null;\n /** Returns the panel element, if mounted. */\n getPanel: () => HTMLElement | null;\n /** Gap from reference to floating panel in px. Default: 8. Accepts a signal for runtime reactivity. */\n offset?: Readable<number | undefined> | number;\n /** Cleanup registrar from the component setup ctx. Automatically called on disconnect. */\n onCleanup: (fn: () => void) => void;\n /** Called when the popover closes. */\n onClose?: (reason: DialogCloseReason) => void;\n /** Called when the popover opens. */\n onOpen?: (reason: OverlayOpenReason) => void;\n /** Callback when resolved placement changes (useful for CSS attribute). */\n onPlacementChange?: (placement: Placement) => void;\n /** Controlled open prop. When defined, disables uncontrolled logic. */\n openProp: Readable<boolean | undefined>;\n /** Preferred placement. Default: 'bottom'. */\n placement: Readable<Placement>;\n /** Slot element or a factory to lazily find it. Resolved each time bindEvents runs. */\n slot: HTMLSlotElement | null | (() => HTMLSlotElement | null);\n /** Slot elements signal — used to rebind when slotted elements change. */\n slotElements: Readable<Element[]>;\n /** Which triggers are active. Set to empty array or omit if handling events manually. */\n triggers: Readable<FloatingTriggerType[]>;\n};\n\nexport type FloatingTriggerHandle = {\n /** Closes the panel. No-op if controlled. */\n close: (reason?: DialogCloseReason) => void;\n /**\n * Call inside `onMounted`. Sets up slot + trigger event watchers\n * and returns a cleanup function to pass back to the framework.\n */\n mount: () => () => void;\n /** Opens the panel. No-op if controlled. */\n open: (reason?: OverlayOpenReason) => void;\n /** Toggles the panel. No-op if controlled. */\n toggle: () => void;\n /** Manually trigger a position recalculation. */\n updatePosition: () => void;\n /** Whether the panel is currently visible. */\n visible: Signal<boolean>;\n};\n\n// ── Implementation ─────────────────────────────────────────────────────────────\n\n/**\n * Shared logic for floating-panel triggers (tooltip, popover).\n *\n * Handles:\n * - Slot-based trigger element detection and rebinding\n * - Event binding per trigger type (hover / focus / click)\n * - Floating-element positioning via `@vielzeug/orbit`\n * - Controlled mode via `openProp` watcher\n * - Keyboard escape dismissal\n *\n * ARIA binding is intentionally delegated to the caller via `bindTriggerAria`\n * so that tooltip (`describedby`) and popover (`expanded`/`controls`/…) can diverge.\n */\nexport const useFloatingTrigger = (options: FloatingTriggerOptions): FloatingTriggerHandle => {\n const {\n bindTriggerAria,\n defaultOpen,\n disabled,\n getPanel,\n onClose,\n onOpen,\n onPlacementChange,\n openProp,\n placement,\n slot,\n slotElements,\n triggers,\n } = options;\n\n const resolveSlot = (): HTMLSlotElement | null => (typeof slot === 'function' ? slot() : slot);\n const getOffset = (): number => {\n const o = options.offset;\n\n if (o == null) return 8;\n\n const val = typeof o === 'object' ? (o as Readable<number | undefined>).value : o;\n\n return val ?? 8;\n };\n const abortSignal = lifecycleSignal(options.onCleanup);\n const visible = signal(false);\n const isControlled = () => openProp.value !== undefined;\n let currentTrigger: HTMLElement | null = null;\n let triggerBinding: (() => void) | null = null;\n\n function updatePosition(): void {\n const panel = getPanel();\n const trigger =\n currentTrigger ?? (resolveSlot()?.assignedElements({ flatten: true })[0] as HTMLElement | undefined);\n\n if (!panel || !trigger) return;\n\n const previousTransition = panel.style.transition;\n const previousTransform = panel.style.transform;\n\n panel.style.transition = 'none';\n panel.style.transform = 'none';\n\n const result = computePosition(trigger, panel, {\n middleware: [offset(getOffset()), flip(), shift({ padding: 8 })],\n placement: placement.value,\n });\n\n panel.style.left = `${result.x}px`;\n panel.style.top = `${result.y}px`;\n panel.style.transition = previousTransition;\n panel.style.transform = previousTransform;\n panel.dataset.placement = result.placement;\n\n onPlacementChange?.(result.placement as Placement);\n }\n\n function showFloat(): void {\n visible.value = true;\n\n const panel = getPanel();\n\n if (panel) {\n panel.dataset.open = '';\n\n if ('showPopover' in panel) {\n try {\n if (!panel.matches(':popover-open')) panel.showPopover();\n } catch {\n // Popover API restricted (e.g. sandboxed iframe); data-open CSS fallback handles visibility.\n }\n }\n }\n\n updatePosition();\n }\n\n function hideFloat(): void {\n visible.value = false;\n\n const panel = getPanel();\n\n if (panel) {\n delete panel.dataset.open;\n\n if ('hidePopover' in panel) {\n try {\n if (panel.matches(':popover-open')) panel.hidePopover();\n } catch {\n // Popover API restricted; data-open removal handles visibility.\n }\n }\n }\n }\n\n function open(reason: OverlayOpenReason = 'programmatic'): void {\n if (isControlled() || disabled.value || visible.value) return;\n\n showFloat();\n onOpen?.(reason);\n }\n\n function close(reason: DialogCloseReason = 'trigger'): void {\n if (isControlled() || !visible.value) return;\n\n hideFloat();\n onClose?.(reason);\n }\n\n function toggle(): void {\n if (isControlled()) return;\n\n if (visible.value) close();\n else open('click');\n }\n\n function handleKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape') close('escape');\n }\n\n function handleFocusOut(e: FocusEvent): void {\n const next = e.relatedTarget as Element | null;\n const panel = getPanel();\n\n if (next && panel?.contains(next)) return;\n\n if (next && currentTrigger?.contains(next)) return;\n\n close('trigger');\n }\n\n const bindEvents = (): void => {\n triggerBinding?.();\n triggerBinding = null;\n\n const triggerEl = resolveSlot()?.assignedElements({ flatten: true })[0] as HTMLElement | undefined;\n\n if (!triggerEl) {\n currentTrigger = null;\n\n return;\n }\n\n currentTrigger = triggerEl;\n\n const removeAria = bindTriggerAria(triggerEl);\n const cleanups: Array<() => void> = [];\n\n const add = (\n target: EventTarget,\n event: string,\n listener: EventListener,\n eventOptions?: AddEventListenerOptions,\n ): void => {\n target.addEventListener(event, listener, eventOptions);\n cleanups.push(() => target.removeEventListener(event, listener, eventOptions));\n };\n\n const t = triggers.value;\n\n if (t.includes('click')) {\n add(triggerEl, 'click', toggle as EventListener);\n }\n\n if (t.includes('hover')) {\n add(triggerEl, 'pointerenter', () => open('hover'));\n add(triggerEl, 'pointerleave', () => close('trigger'));\n\n const panelEl = getPanel();\n\n if (panelEl) {\n add(panelEl, 'pointerenter', () => open('hover'));\n add(panelEl, 'pointerleave', () => close('trigger'));\n }\n }\n\n if (t.includes('focus')) {\n add(triggerEl, 'focusin', () => open('focus'));\n add(triggerEl, 'focusout', handleFocusOut as EventListener);\n\n const panelEl = getPanel();\n\n if (panelEl) add(panelEl, 'focusout', handleFocusOut as EventListener);\n }\n\n add(document, 'keydown', handleKeydown as EventListener);\n\n triggerBinding = () => {\n removeAria();\n\n for (const cleanup of cleanups) cleanup();\n\n currentTrigger = null;\n };\n };\n\n const stopOutsidePointerDismissal = createOutsidePointerDismissal({\n getTargets: () => [currentTrigger, getPanel(), options.getHost?.()],\n isActive: () => visible.value && triggers.value.includes('click'),\n onDismiss: () => close('outsideClick'),\n signal: abortSignal,\n });\n\n const mount = (): (() => void) => {\n let initializedOpenProp = false;\n const triggerSlot = resolveSlot();\n const rebind = (): void => {\n queueMicrotask(() => {\n if (!abortSignal.aborted) bindEvents();\n });\n };\n\n triggerSlot?.addEventListener('slotchange', rebind);\n rebind();\n watch(slotElements, bindEvents, { immediate: true });\n\n watch(\n openProp,\n (openVal) => {\n if (openVal === undefined || openVal === null) {\n if (initializedOpenProp && visible.value) {\n hideFloat();\n onClose?.('programmatic');\n }\n\n initializedOpenProp = true;\n\n return;\n }\n\n initializedOpenProp = true;\n\n if (openVal) {\n showFloat();\n onOpen?.('programmatic');\n } else if (visible.value) {\n hideFloat();\n onClose?.('programmatic');\n }\n },\n { immediate: true },\n );\n\n if (openProp.value === undefined && defaultOpen.value) {\n showFloat();\n onOpen?.('programmatic');\n }\n\n watch(disabled, (isNowDisabled) => {\n if (isNowDisabled) close('programmatic');\n });\n\n return () => {\n triggerSlot?.removeEventListener('slotchange', rebind);\n triggerBinding?.();\n triggerBinding = null;\n\n const panel = getPanel();\n\n if (panel) {\n delete panel.dataset.open;\n\n if ('hidePopover' in panel) {\n try {\n if (panel.matches(':popover-open')) panel.hidePopover();\n } catch {\n // Popover API restricted; data-open removal handles visibility.\n }\n }\n }\n\n stopOutsidePointerDismissal();\n };\n };\n\n return { close, mount, open, toggle, updatePosition, visible };\n};\n"],"mappings":"6KAiFA,IAAa,EAAsB,GAA2D,CAC5F,GAAM,CACJ,kBACA,cACA,WACA,WACA,UACA,SACA,oBACA,WACA,YACA,OACA,eACA,YACE,EAEE,MAA6C,OAAO,GAAS,WAAa,EAAK,EAAI,EACnF,MAA0B,CAC9B,IAAM,EAAI,EAAQ,OAMlB,OAJI,GAAK,KAAa,GAEV,OAAO,GAAM,SAAY,EAAmC,MAAQ,IAElE,CAChB,EACM,EAAc,EAAA,gBAAgB,EAAQ,SAAS,EAC/C,GAAA,EAAU,EAAA,OAAA,CAAO,EAAK,EACtB,MAAqB,EAAS,QAAU,IAAA,GAC1C,EAAqC,KACrC,EAAsC,KAE1C,SAAS,GAAuB,CAC9B,IAAM,EAAQ,EAAS,EACjB,EACJ,GAAmB,EAAY,CAAC,EAAE,iBAAiB,CAAE,QAAS,EAAK,CAAC,CAAC,CAAC,GAExE,GAAI,CAAC,GAAS,CAAC,EAAS,OAExB,IAAM,EAAqB,EAAM,MAAM,WACjC,EAAoB,EAAM,MAAM,UAEtC,EAAM,MAAM,WAAa,OACzB,EAAM,MAAM,UAAY,OAExB,IAAM,GAAA,EAAS,EAAA,gBAAA,CAAgB,EAAS,EAAO,CAC7C,WAAY,EAAC,EAAA,EAAA,OAAA,CAAO,EAAU,CAAC,GAAG,EAAA,EAAA,KAAA,CAAK,GAAG,EAAA,EAAA,MAAA,CAAM,CAAE,QAAS,CAAE,CAAC,CAAC,EAC/D,UAAW,EAAU,KACvB,CAAC,EAED,EAAM,MAAM,KAAO,GAAG,EAAO,EAAE,IAC/B,EAAM,MAAM,IAAM,GAAG,EAAO,EAAE,IAC9B,EAAM,MAAM,WAAa,EACzB,EAAM,MAAM,UAAY,EACxB,EAAM,QAAQ,UAAY,EAAO,UAEjC,IAAoB,EAAO,SAAsB,CACnD,CAEA,SAAS,GAAkB,CACzB,EAAQ,MAAQ,GAEhB,IAAM,EAAQ,EAAS,EAEvB,GAAI,IACF,EAAM,QAAQ,KAAO,GAEjB,gBAAiB,GACnB,GAAI,CACG,EAAM,QAAQ,eAAe,GAAG,EAAM,YAAY,CACzD,MAAQ,CAER,CAIJ,EAAe,CACjB,CAEA,SAAS,GAAkB,CACzB,EAAQ,MAAQ,GAEhB,IAAM,EAAQ,EAAS,EAEvB,GAAI,IACF,OAAO,EAAM,QAAQ,KAEjB,gBAAiB,GACnB,GAAI,CACE,EAAM,QAAQ,eAAe,GAAG,EAAM,YAAY,CACxD,MAAQ,CAER,CAGN,CAEA,SAAS,EAAK,EAA4B,eAAsB,CAC1D,EAAa,GAAK,EAAS,OAAS,EAAQ,QAEhD,EAAU,EACV,IAAS,CAAM,EACjB,CAEA,SAAS,EAAM,EAA4B,UAAiB,CACtD,EAAa,GAAK,CAAC,EAAQ,QAE/B,EAAU,EACV,IAAU,CAAM,EAClB,CAEA,SAAS,GAAe,CAClB,EAAa,IAEb,EAAQ,MAAO,EAAM,EACpB,EAAK,OAAO,EACnB,CAEA,SAAS,EAAc,EAAwB,CACzC,EAAE,MAAQ,UAAU,EAAM,QAAQ,CACxC,CAEA,SAAS,EAAe,EAAqB,CAC3C,IAAM,EAAO,EAAE,cACT,EAAQ,EAAS,EAEnB,GAAQ,GAAO,SAAS,CAAI,GAE5B,GAAQ,GAAgB,SAAS,CAAI,GAEzC,EAAM,SAAS,CACjB,CAEA,IAAM,MAAyB,CAC7B,IAAiB,EACjB,EAAiB,KAEjB,IAAM,EAAY,EAAY,CAAC,EAAE,iBAAiB,CAAE,QAAS,EAAK,CAAC,CAAC,CAAC,GAErE,GAAI,CAAC,EAAW,CACd,EAAiB,KAEjB,MACF,CAEA,EAAiB,EAEjB,IAAM,EAAa,EAAgB,CAAS,EACtC,EAA8B,CAAC,EAE/B,GACJ,EACA,EACA,EACA,IACS,CACT,EAAO,iBAAiB,EAAO,EAAU,CAAY,EACrD,EAAS,SAAW,EAAO,oBAAoB,EAAO,EAAU,CAAY,CAAC,CAC/E,EAEM,EAAI,EAAS,MAMnB,GAJI,EAAE,SAAS,OAAO,GACpB,EAAI,EAAW,QAAS,CAAuB,EAG7C,EAAE,SAAS,OAAO,EAAG,CACvB,EAAI,EAAW,mBAAsB,EAAK,OAAO,CAAC,EAClD,EAAI,EAAW,mBAAsB,EAAM,SAAS,CAAC,EAErD,IAAM,EAAU,EAAS,EAErB,IACF,EAAI,EAAS,mBAAsB,EAAK,OAAO,CAAC,EAChD,EAAI,EAAS,mBAAsB,EAAM,SAAS,CAAC,EAEvD,CAEA,GAAI,EAAE,SAAS,OAAO,EAAG,CACvB,EAAI,EAAW,cAAiB,EAAK,OAAO,CAAC,EAC7C,EAAI,EAAW,WAAY,CAA+B,EAE1D,IAAM,EAAU,EAAS,EAErB,GAAS,EAAI,EAAS,WAAY,CAA+B,CACvE,CAEA,EAAI,SAAU,UAAW,CAA8B,EAEvD,MAAuB,CACrB,EAAW,EAEX,IAAK,IAAM,KAAW,EAAU,EAAQ,EAExC,EAAiB,IACnB,CACF,EAEM,EAA8B,EAAA,8BAA8B,CAChE,eAAkB,CAAC,EAAgB,EAAS,EAAG,EAAQ,UAAU,CAAC,EAClE,aAAgB,EAAQ,OAAS,EAAS,MAAM,SAAS,OAAO,EAChE,cAAiB,EAAM,cAAc,EACrC,OAAQ,CACV,CAAC,EA0ED,MAAO,CAAE,QAAO,UAxEkB,CAChC,IAAI,EAAsB,GACpB,EAAc,EAAY,EAC1B,MAAqB,CACzB,mBAAqB,CACd,EAAY,SAAS,EAAW,CACvC,CAAC,CACH,EA0CA,OAxCA,GAAa,iBAAiB,aAAc,CAAM,EAClD,EAAO,GACP,EAAA,EAAA,MAAA,CAAM,EAAc,EAAY,CAAE,UAAW,EAAK,CAAC,GAEnD,EAAA,EAAA,MAAA,CACE,EACC,GAAY,CACX,GAAI,GAAqC,KAAM,CACzC,GAAuB,EAAQ,QACjC,EAAU,EACV,IAAU,cAAc,GAG1B,EAAsB,GAEtB,MACF,CAEA,EAAsB,GAElB,GACF,EAAU,EACV,IAAS,cAAc,GACd,EAAQ,QACjB,EAAU,EACV,IAAU,cAAc,EAE5B,EACA,CAAE,UAAW,EAAK,CACpB,EAEI,EAAS,QAAU,IAAA,IAAa,EAAY,QAC9C,EAAU,EACV,IAAS,cAAc,IAGzB,EAAA,EAAA,MAAA,CAAM,EAAW,GAAkB,CAC7B,GAAe,EAAM,cAAc,CACzC,CAAC,MAEY,CACX,GAAa,oBAAoB,aAAc,CAAM,EACrD,IAAiB,EACjB,EAAiB,KAEjB,IAAM,EAAQ,EAAS,EAEvB,GAAI,IACF,OAAO,EAAM,QAAQ,KAEjB,gBAAiB,GACnB,GAAI,CACE,EAAM,QAAQ,eAAe,GAAG,EAAM,YAAY,CACxD,MAAQ,CAER,CAIJ,EAA4B,CAC9B,CACF,EAEuB,OAAM,SAAQ,iBAAgB,SAAQ,CAC/D"}
@@ -1 +1 @@
1
- {"version":3,"file":"use-floating-trigger.d.ts","sourceRoot":"","sources":["../../../src/overlay/shared/use-floating-trigger.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAGjD,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,MAAM,EAAU,MAAM,kBAAkB,CAAC;AAGtE,OAAO,EAAmB,KAAK,iBAAiB,EAAE,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAK7F,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAE9D,MAAM,MAAM,UAAU,GAAG,CAAC,SAAS,EAAE,WAAW,KAAK,MAAM,IAAI,CAAC;AAEhE,MAAM,MAAM,sBAAsB,GAAG;IACnC,gFAAgF;IAChF,eAAe,EAAE,UAAU,CAAC;IAC5B,2EAA2E;IAC3E,WAAW,EAAE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IAC3C,mEAAmE;IACnE,QAAQ,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC5B,8GAA8G;IAC9G,OAAO,CAAC,EAAE,MAAM,OAAO,GAAG,IAAI,CAAC;IAC/B,6CAA6C;IAC7C,QAAQ,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IACnC,uGAAuG;IACvG,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,GAAG,MAAM,CAAC;IAC/C,0FAA0F;IAC1F,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IACpC,sCAAsC;IACtC,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC9C,qCAAqC;IACrC,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC7C,2EAA2E;IAC3E,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACnD,uEAAuE;IACvE,QAAQ,EAAE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IACxC,8CAA8C;IAC9C,SAAS,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;IAC/B,uFAAuF;IACvF,IAAI,EAAE,eAAe,GAAG,IAAI,GAAG,CAAC,MAAM,eAAe,GAAG,IAAI,CAAC,CAAC;IAC9D,0EAA0E;IAC1E,YAAY,EAAE,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC;IAClC,yFAAyF;IACzF,QAAQ,EAAE,QAAQ,CAAC,mBAAmB,EAAE,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,6CAA6C;IAC7C,KAAK,EAAE,CAAC,MAAM,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC5C;;;OAGG;IACH,KAAK,EAAE,MAAM,MAAM,IAAI,CAAC;IACxB,4CAA4C;IAC5C,IAAI,EAAE,CAAC,MAAM,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC3C,8CAA8C;IAC9C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,iDAAiD;IACjD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,8CAA8C;IAC9C,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;CAC1B,CAAC;AAIF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,kBAAkB,GAAI,SAAS,sBAAsB,KAAG,qBAoQpE,CAAC"}
1
+ {"version":3,"file":"use-floating-trigger.d.ts","sourceRoot":"","sources":["../../../src/overlay/shared/use-floating-trigger.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAGjD,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,MAAM,EAAU,MAAM,kBAAkB,CAAC;AAGtE,OAAO,EAAmB,KAAK,iBAAiB,EAAE,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAK7F,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAE9D,MAAM,MAAM,UAAU,GAAG,CAAC,SAAS,EAAE,WAAW,KAAK,MAAM,IAAI,CAAC;AAEhE,MAAM,MAAM,sBAAsB,GAAG;IACnC,gFAAgF;IAChF,eAAe,EAAE,UAAU,CAAC;IAC5B,2EAA2E;IAC3E,WAAW,EAAE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IAC3C,mEAAmE;IACnE,QAAQ,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;IAC5B,8GAA8G;IAC9G,OAAO,CAAC,EAAE,MAAM,OAAO,GAAG,IAAI,CAAC;IAC/B,6CAA6C;IAC7C,QAAQ,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IACnC,uGAAuG;IACvG,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,GAAG,MAAM,CAAC;IAC/C,0FAA0F;IAC1F,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;IACpC,sCAAsC;IACtC,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC9C,qCAAqC;IACrC,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC7C,2EAA2E;IAC3E,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACnD,uEAAuE;IACvE,QAAQ,EAAE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IACxC,8CAA8C;IAC9C,SAAS,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;IAC/B,uFAAuF;IACvF,IAAI,EAAE,eAAe,GAAG,IAAI,GAAG,CAAC,MAAM,eAAe,GAAG,IAAI,CAAC,CAAC;IAC9D,0EAA0E;IAC1E,YAAY,EAAE,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC;IAClC,yFAAyF;IACzF,QAAQ,EAAE,QAAQ,CAAC,mBAAmB,EAAE,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,6CAA6C;IAC7C,KAAK,EAAE,CAAC,MAAM,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC5C;;;OAGG;IACH,KAAK,EAAE,MAAM,MAAM,IAAI,CAAC;IACxB,4CAA4C;IAC5C,IAAI,EAAE,CAAC,MAAM,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC3C,8CAA8C;IAC9C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,iDAAiD;IACjD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,8CAA8C;IAC9C,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;CAC1B,CAAC;AAIF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,kBAAkB,GAAI,SAAS,sBAAsB,KAAG,qBAsRpE,CAAC"}
@@ -10,9 +10,11 @@ var c = (c) => {
10
10
  return e == null ? 8 : (typeof e == "object" ? e.value : e) ?? 8;
11
11
  }, C = e(c.onCleanup), w = n(!1), T = () => g.value !== void 0, E = null, D = null;
12
12
  function O() {
13
- let e = f();
14
- if (!e || !E) return;
15
- let t = i(E, e, {
13
+ let e = f(), t = E ?? x()?.assignedElements({ flatten: !0 })[0];
14
+ if (!e || !t) return;
15
+ let n = e.style.transition, r = e.style.transform;
16
+ e.style.transition = "none", e.style.transform = "none";
17
+ let c = i(t, e, {
16
18
  middleware: [
17
19
  o(S()),
18
20
  a(),
@@ -20,7 +22,7 @@ var c = (c) => {
20
22
  ],
21
23
  placement: _.value
22
24
  });
23
- e.style.left = `${t.x}px`, e.style.top = `${t.y}px`, e.dataset.placement = t.placement, h?.(t.placement);
25
+ e.style.left = `${c.x}px`, e.style.top = `${c.y}px`, e.style.transition = n, e.style.transform = r, e.dataset.placement = c.placement, h?.(c.placement);
24
26
  }
25
27
  function k() {
26
28
  w.value = !0;
@@ -92,8 +94,12 @@ var c = (c) => {
92
94
  return {
93
95
  close: M,
94
96
  mount: () => {
95
- let e = !1;
96
- return r(y, I, { immediate: !0 }), r(g, (t) => {
97
+ let e = !1, t = x(), n = () => {
98
+ queueMicrotask(() => {
99
+ C.aborted || I();
100
+ });
101
+ };
102
+ return t?.addEventListener("slotchange", n), n(), r(y, I, { immediate: !0 }), r(g, (t) => {
97
103
  if (t == null) {
98
104
  e && w.value && (A(), p?.("programmatic")), e = !0;
99
105
  return;
@@ -102,7 +108,7 @@ var c = (c) => {
102
108
  }, { immediate: !0 }), g.value === void 0 && u.value && (k(), m?.("programmatic")), r(d, (e) => {
103
109
  e && M("programmatic");
104
110
  }), () => {
105
- D?.(), D = null;
111
+ t?.removeEventListener("slotchange", n), D?.(), D = null;
106
112
  let e = f();
107
113
  if (e && (delete e.dataset.open, "hidePopover" in e)) try {
108
114
  e.matches(":popover-open") && e.hidePopover();