@ecoma-io/loom 0.4.0 → 0.5.0

package/dist/packages/labels/src/field-context.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-context.js","names":[],"sources":["../../../../packages/labels/src/field-context.ts"],"sourcesContent":["import {\n  computed,\n  inject,\n  onScopeDispose,\n  provide,\n  reactive,\n  ref,\n  watchEffect,\n  type ComputedRef,\n  type InjectionKey,\n} from \"vue\";\nimport { optional } from \"@ecoma-io/loom-core\";\n\n/**\n * What a form-row wrapper (Field, Fieldset) knows about the control inside it.\n *\n * A wrapper renders a `<label for>` and a hint-or-error line, and it is the\n * only thing in the tree that knows the id it pointed that label at, the id of\n * the message, and whether the row is mandatory or in error. None of that can\n * reach a slotted control through props — the wrapper never rendered it — so\n * before this existed the caller copied three attributes by hand at every call\n * site, and forgetting one was a silent accessibility defect.\n *\n * Every member is a `ComputedRef` rather than a value. A row's `error` arrives\n * and clears while the control stays mounted, so the context has to move with\n * it; and a per-key ref is what lets one wrapper inherit a single key from\n * another (Field reads `readonly` off a Fieldset above it) without a hidden\n * whole-object merge.\n *\n * On the booleans, `undefined` means \"this wrapper has no opinion\" and never\n * \"false\". That is the whole precedence story — see `useFieldControl` — and it\n * is the same distinction `./props.ts` exists to explain, arriving from the\n * other side: there, a key is dropped so a child sees an absence; here, an\n * absence is a value a wrapper is allowed to hold.\n */\nexport interface FieldContext {\n  /** The id the primary control adopts, so the wrapper's `<label for>` names it. */\n  readonly controlId: ComputedRef<string | undefined>;\n  /** The id of the wrapper's `<label>`, for group controls to reference via `aria-labelledby`. */\n  readonly labelledBy: ComputedRef<string | undefined>;\n  /** The id of the hint-or-error line, and `undefined` while no message is rendered. */\n  readonly describedBy: ComputedRef<string | undefined>;\n  /** The form field name the control submits under. */\n  readonly name: ComputedRef<string | undefined>;\n  /** Whether the wrapper marks the row mandatory. Becomes `aria-required`. */\n  readonly required: ComputedRef<boolean | undefined>;\n  /** Whether the wrapper is showing an error, which is the same fact as the control being invalid. */\n  readonly invalid: ComputedRef<boolean | undefined>;\n  /** Whether the wrapper disables what is inside it. */\n  readonly disabled: ComputedRef<boolean | undefined>;\n  /** Whether the wrapper renders what is inside it read-only. */\n  readonly readonly: ComputedRef<boolean | undefined>;\n  /**\n   * Claims the row's single control id, and reports whether this control won it.\n   *\n   * `<Field><TextField /><TextField /></Field>` is a shape somebody will write,\n   * and without a claim both inputs adopt the same generated id — a duplicate\n   * id, and a `<label for>` that resolves to whichever the browser reaches\n   * first. The `axe` gate cannot be the backstop: `duplicate-id-active` is\n   * tagged `wcag2a-obsolete`/`deprecated` in axe-core, not `wcag2a`, so it does\n   * not match `WCAG_TAGS` and `e2e/accessibility.e2e.ts` never runs it.\n   *\n   * Reactive rather than a plain boolean because the claim can move: a `v-if`\n   * swapping the first control for the second must promote the second, or the\n   * label points at an id no longer in the document.\n   */\n  claimControlId(): ComputedRef<boolean>;\n}\n\n/**\n * What a wrapper hands `provideFieldContext`, as getters rather than values —\n * the wrapper writes plain expressions over its own props and this file does\n * the wrapping, so a wrapper never has to remember which of its answers are\n * derived.\n */\nexport interface FieldContextSource {\n  controlId: () => string | undefined;\n  labelledBy?: () => string | undefined;\n  describedBy: () => string | undefined;\n  name: () => string | undefined;\n  required: () => boolean | undefined;\n  invalid: () => boolean | undefined;\n  disabled: () => boolean | undefined;\n  readonly: () => boolean | undefined;\n}\n\n/**\n * The control's own side of the contract: what this control was told directly,\n * with `undefined` for everything the caller left unset.\n *\n * Each key is `?: T | undefined` rather than `?: T`. Under\n * `exactOptionalPropertyTypes` that is the form that accepts both an omitted\n * key and an explicit `undefined` — and an explicit `undefined` is exactly what\n * a control passes when its own prop is unset.\n */\nexport interface FieldControlProps {\n  /** The caller's `id`, which reaches a bare control as a fallthrough attr rather than a prop. */\n  readonly id?: string | undefined;\n  /** The caller's `aria-describedby`, likewise a fallthrough attr. */\n  readonly describedBy?: string | undefined;\n  /** The caller's `aria-labelledby`, for group controls that name themselves rather than being named by `label for`. */\n  readonly ariaLabelledby?: string | undefined;\n  readonly name?: string | undefined;\n  readonly required?: boolean | undefined;\n  readonly invalid?: boolean | undefined;\n  readonly disabled?: boolean | undefined;\n  readonly readonly?: boolean | undefined;\n}\n\n/**\n * The resolved attributes, ready to spread onto whichever node carries the\n * control's ARIA.\n *\n * A key whose value resolved to `undefined` is **absent**, not present-and-\n * undefined — `optional()` drops it. That is what makes the spread purely\n * additive: `v-bind=\"{ ...rest, ...field.attrs }\"` can never blank out an\n * attribute the caller passed through fallthrough, so a control renders exactly\n * what it renders today whenever there is no wrapper above it.\n *\n * `aria-required` and `aria-invalid` are omitted rather than set to `\"false\"`.\n * Both are legal and both say nothing, and the absent attribute already means\n * the same thing — the house `x || undefined` idiom, moved one layer in.\n */\nexport interface FieldControlAttrs {\n  readonly id?: string;\n  readonly name?: string;\n  readonly \"aria-describedby\"?: string;\n  // Narrowed to the literal rather than `string`: Vue types `aria-invalid` on a\n  // native element as `Booleanish | \"grammar\" | \"spelling\"`, so a widened\n  // `string` here fails to spread onto the very `<input>` this exists for.\n  readonly \"aria-required\"?: \"true\";\n  readonly \"aria-invalid\"?: \"true\";\n}\n\n/**\n * What `useFieldControl` resolved, after the control's own props won.\n *\n * Returned `reactive` rather than as a bag of refs, which is the one place in\n * `src/lib/` that does so. A template unwraps only a *top-level* ref, and a\n * control needs four of these at once under names — `disabled`, `invalid`,\n * `readonly`, `required` — that each shadow a prop of the same name. `reactive`\n * gives `field.invalid` in both the script and the template, and the shadowing\n * question never arises. Destructuring it does lose reactivity; read through\n * `field.` and there is nothing to get wrong.\n */\nexport interface FieldControl {\n  /** Spread onto the node that carries the control's ARIA, **after** the fallthrough attrs. */\n  readonly attrs: FieldControlAttrs;\n  readonly id: string | undefined;\n  readonly labelledBy: string | undefined;\n  readonly name: string | undefined;\n  readonly disabled: boolean;\n  readonly invalid: boolean;\n  readonly readonly: boolean;\n  readonly required: boolean;\n}\n\n/**\n * A `Symbol`, and not exported from `src/index.ts`: a consumer pinned to the\n * key is pinned to a shape that moves whenever a wrapper does. `useFieldControl`\n * is the supported way in.\n */\nconst FIELD_CONTEXT: InjectionKey<FieldContext> = Symbol(\"loom.field\");\n\n/**\n * The wrapper above this one, for a wrapper that composes over another.\n *\n * Only Field needs it, and only for `readonly`: Vue resolves `inject` to the\n * nearest provider **wholesale**, not per key, so a Field shadows the Fieldset\n * above it entirely. Any key both wrappers answer has to be merged by hand, and\n * reading the outer context here rather than merging inside\n * `provideFieldContext` keeps that decision visible in Field.vue, where the\n * reason for it lives.\n */\nexport function useOuterFieldContext(): FieldContext | undefined {\n  return inject(FIELD_CONTEXT, undefined);\n}\n\n/** Called by a wrapper — Field and Fieldset — from its own `setup`. */\nexport function provideFieldContext(source: FieldContextSource): void {\n  const claims = ref<symbol[]>([]);\n\n  provide(FIELD_CONTEXT, {\n    controlId: computed(source.controlId),\n    labelledBy: computed(source.labelledBy ?? (() => undefined)),\n    describedBy: computed(source.describedBy),\n    name: computed(source.name),\n    required: computed(source.required),\n    invalid: computed(source.invalid),\n    disabled: computed(source.disabled),\n    readonly: computed(source.readonly),\n    claimControlId() {\n      const token = Symbol(\"loom.field.control\");\n      claims.value = [...claims.value, token];\n      // The claiming scope is the control's, not the wrapper's, so this fires\n      // when that one control unmounts and the next in document order is\n      // promoted.\n      onScopeDispose(() => {\n        claims.value = claims.value.filter((held) => held !== token);\n      });\n      return computed(() => claims.value[0] === token);\n    },\n  });\n}\n\n/**\n * Opt a control into the wrapper around it. One call, one spread — see\n * `TextField.vue`, which is the worked example the rest of the family copies.\n *\n * **The rule is `own ?? wrapper ?? false`.** `??` and not `||`, so an explicit\n * `false` on the control beats a `true` from the wrapper: one control inside a\n * row that is showing an error can declare itself individually fine, and one\n * inside a clean row can declare itself individually invalid.\n *\n * That rule is worth nothing unless \"unset\" and \"set to `false`\" are still\n * different values by the time they arrive here, and by default they are not:\n * Vue resolves an absent `Boolean` prop with no declared default to `false`, so\n * `props.invalid ?? field` would short-circuit forever and the context would be\n * inert while looking perfectly wired. **Every participating prop must be\n * declared `boolean | undefined` with an explicit `undefined` default** — the\n * `| undefined` is what `exactOptionalPropertyTypes` needs to let `withDefaults`\n * take that default at all, and the default is what beats the Boolean cast.\n *\n * With no wrapper above, every chain falls through to the control's own props\n * and the `?? false` at the end is the same `false` the control's `withDefaults`\n * used to supply. Nothing about a control standing alone changes.\n *\n * The argument is a **getter**, not a props object, for the reason\n * `./attrs.ts` takes `useAttrs()` rather than a snapshot: a control feeds this a\n * mix of props and fallthrough attrs and both have to stay live.\n */\nexport function useFieldControl(own: () => FieldControlProps): FieldControl {\n  const field = inject(FIELD_CONTEXT, undefined);\n  const holdsControlId = field?.claimControlId();\n\n  const id = computed(\n    () => own().id ?? (holdsControlId?.value === true ? field?.controlId.value : undefined),\n  );\n  const name = computed(() => own().name ?? field?.name.value);\n  const labelledBy = computed(() => own().ariaLabelledby ?? field?.labelledBy.value);\n\n  // The one attribute whose rule is merge rather than replace, because\n  // `aria-describedby` is a token list: the row's message is additional to\n  // whatever else the caller pointed at, not an alternative to it. Replacing\n  // would silently drop the row's hint the moment a caller described their\n  // control for some other reason — which is the defect this file exists to\n  // remove, reintroduced from the other end. The control's own id reads first:\n  // a control that has something to say about itself is saying the more\n  // specific thing, and a screen reader reads the list in order.\n  const describedBy = computed(() => {\n    const ids = [own().describedBy, field?.describedBy.value].filter(\n      (candidate): candidate is string => candidate !== undefined && candidate.length > 0,\n    );\n    return ids.length > 0 ? ids.join(\" \") : undefined;\n  });\n\n  const required = computed(() => own().required ?? field?.required.value ?? false);\n  const invalid = computed(() => own().invalid ?? field?.invalid.value ?? false);\n  const disabled = computed(() => own().disabled ?? field?.disabled.value ?? false);\n  const readonly = computed(() => own().readonly ?? field?.readonly.value ?? false);\n\n  // A development-mode safety net for the one context key a control can\n  // deliberately decline. When a wrapper sets `readonly` but the control did\n  // not pass that key in its `FieldControlProps`, the wrapper's instruction is\n  // silently dropped — and without this warning the consumer has no signal\n  // that it was. The `\"readonly\" in own()` check distinguishes \"I defer to the\n  // wrapper\" (key present, value `undefined`) from \"I don't participate\" (key\n  // absent), which is the same distinction `exactOptionalPropertyTypes` makes\n  // at the type level.\n  if (import.meta.env.DEV && field) {\n    watchEffect(() => {\n      if (field.readonly.value && !(\"readonly\" in own())) {\n        console.warn(\"[Loom] readonly was set on the Field, but this control does not claim it.\");\n      }\n    });\n  }\n\n  const attrs = computed<FieldControlAttrs>(() =>\n    optional({\n      id: id.value,\n      name: name.value,\n      \"aria-describedby\": describedBy.value,\n      \"aria-required\": required.value ? (\"true\" as const) : undefined,\n      \"aria-invalid\": invalid.value ? (\"true\" as const) : undefined,\n    }),\n  );\n\n  return reactive({ attrs, id, labelledBy, name, disabled, invalid, readonly, required });\n}\n"],"mappings":";;;;;;;;;AAkKA,IAAM,gBAA4C,OAAO,YAAY;;;;;;;;;;;AAYrE,SAAgB,uBAAiD;CAC/D,OAAO,OAAO,eAAe,KAAA,CAAS;AACxC;;AAGA,SAAgB,oBAAoB,QAAkC;CACpE,MAAM,SAAS,IAAc,CAAC,CAAC;CAE/B,QAAQ,eAAe;EACrB,WAAW,SAAS,OAAO,SAAS;EACpC,YAAY,SAAS,OAAO,qBAAqB,KAAA,EAAU;EAC3D,aAAa,SAAS,OAAO,WAAW;EACxC,MAAM,SAAS,OAAO,IAAI;EAC1B,UAAU,SAAS,OAAO,QAAQ;EAClC,SAAS,SAAS,OAAO,OAAO;EAChC,UAAU,SAAS,OAAO,QAAQ;EAClC,UAAU,SAAS,OAAO,QAAQ;EAClC,iBAAiB;GACf,MAAM,QAAQ,OAAO,oBAAoB;GACzC,OAAO,QAAQ,CAAC,GAAG,OAAO,OAAO,KAAK;GAItC,qBAAqB;IACnB,OAAO,QAAQ,OAAO,MAAM,QAAQ,SAAS,SAAS,KAAK;GAC7D,CAAC;GACD,OAAO,eAAe,OAAO,MAAM,OAAO,KAAK;EACjD;CACF,CAAC;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,SAAgB,gBAAgB,KAA4C;CAC1E,MAAM,QAAQ,OAAO,eAAe,KAAA,CAAS;CAC7C,MAAM,iBAAiB,OAAO,eAAe;CAE7C,MAAM,KAAK,eACH,IAAI,CAAC,CAAC,OAAO,gBAAgB,UAAU,OAAO,OAAO,UAAU,QAAQ,KAAA,EAC/E;CACA,MAAM,OAAO,eAAe,IAAI,CAAC,CAAC,QAAQ,OAAO,KAAK,KAAK;CAC3D,MAAM,aAAa,eAAe,IAAI,CAAC,CAAC,kBAAkB,OAAO,WAAW,KAAK;CAUjF,MAAM,cAAc,eAAe;EACjC,MAAM,MAAM,CAAC,IAAI,CAAC,CAAC,aAAa,OAAO,YAAY,KAAK,CAAC,CAAC,QACvD,cAAmC,cAAc,KAAA,KAAa,UAAU,SAAS,CACpF;EACA,OAAO,IAAI,SAAS,IAAI,IAAI,KAAK,GAAG,IAAI,KAAA;CAC1C,CAAC;CAED,MAAM,WAAW,eAAe,IAAI,CAAC,CAAC,YAAY,OAAO,SAAS,SAAS,KAAK;CAChF,MAAM,UAAU,eAAe,IAAI,CAAC,CAAC,WAAW,OAAO,QAAQ,SAAS,KAAK;CAC7E,MAAM,WAAW,eAAe,IAAI,CAAC,CAAC,YAAY,OAAO,SAAS,SAAS,KAAK;CAChF,MAAM,WAAW,eAAe,IAAI,CAAC,CAAC,YAAY,OAAO,SAAS,SAAS,KAAK;CAkBhF,MAAM,QAAQ,eACZ,SAAS;EACP,IAAI,GAAG;EACP,MAAM,KAAK;EACX,oBAAoB,YAAY;EAChC,iBAAiB,SAAS,QAAS,SAAmB,KAAA;EACtD,gBAAgB,QAAQ,QAAS,SAAmB,KAAA;CACtD,CAAC,CACH;CAEA,OAAO,SAAS;EAAE;EAAO;EAAI;EAAY;EAAM;EAAU;EAAS;EAAU;CAAS,CAAC;AACxF"}
+{"version":3,"file":"field-context.js","names":[],"sources":["../../../../packages/labels/src/field-context.ts"],"sourcesContent":["import {\n  computed,\n  inject,\n  onScopeDispose,\n  provide,\n  reactive,\n  ref,\n  watchEffect,\n  type ComputedRef,\n  type InjectionKey,\n} from \"vue\";\nimport { optional } from \"@ecoma-io/loom-core\";\n\n/**\n * What a form-row wrapper (Field, Fieldset) knows about the control inside it.\n *\n * A wrapper renders a `<label for>` and a hint-or-error line, and it is the\n * only thing in the tree that knows the id it pointed that label at, the id of\n * the message, and whether the row is mandatory or in error. None of that can\n * reach a slotted control through props — the wrapper never rendered it — so\n * before this existed the caller copied three attributes by hand at every call\n * site, and forgetting one was a silent accessibility defect.\n *\n * Every member is a `ComputedRef` rather than a value. A row's `error` arrives\n * and clears while the control stays mounted, so the context has to move with\n * it; and a per-key ref is what lets one wrapper inherit a single key from\n * another (Field reads `readonly` off a Fieldset above it) without a hidden\n * whole-object merge.\n *\n * On the booleans, `undefined` means \"this wrapper has no opinion\" and never\n * \"false\". That is the whole precedence story — see `useFieldControl` — and it\n * is the same distinction `./props.ts` exists to explain, arriving from the\n * other side: there, a key is dropped so a child sees an absence; here, an\n * absence is a value a wrapper is allowed to hold.\n */\nexport interface FieldContext {\n  /** The id the primary control adopts, so the wrapper's `<label for>` names it. */\n  readonly controlId: ComputedRef<string | undefined>;\n  /** The id of the wrapper's `<label>`, for group controls to reference via `aria-labelledby`. */\n  readonly labelledBy: ComputedRef<string | undefined>;\n  /** The id of the hint-or-error line, and `undefined` while no message is rendered. */\n  readonly describedBy: ComputedRef<string | undefined>;\n  /** The form field name the control submits under. */\n  readonly name: ComputedRef<string | undefined>;\n  /** Whether the wrapper marks the row mandatory. Becomes `aria-required`. */\n  readonly required: ComputedRef<boolean | undefined>;\n  /** Whether the wrapper is showing an error, which is the same fact as the control being invalid. */\n  readonly invalid: ComputedRef<boolean | undefined>;\n  /** Whether the wrapper disables what is inside it. */\n  readonly disabled: ComputedRef<boolean | undefined>;\n  /** Whether the wrapper renders what is inside it read-only. */\n  readonly readonly: ComputedRef<boolean | undefined>;\n  /**\n   * Claims the row's single control id, and reports whether this control won it.\n   *\n   * `<Field><TextField /><TextField /></Field>` is a shape somebody will write,\n   * and without a claim both inputs adopt the same generated id — a duplicate\n   * id, and a `<label for>` that resolves to whichever the browser reaches\n   * first. The `axe` gate cannot be the backstop: `duplicate-id-active` is\n   * tagged `wcag2a-obsolete`/`deprecated` in axe-core, not `wcag2a`, so it is\n   * in neither runtime list and `e2e/accessibility.e2e.ts` never runs it.\n   *\n   * Reactive rather than a plain boolean because the claim can move: a `v-if`\n   * swapping the first control for the second must promote the second, or the\n   * label points at an id no longer in the document.\n   */\n  claimControlId(): ComputedRef<boolean>;\n}\n\n/**\n * What a wrapper hands `provideFieldContext`, as getters rather than values —\n * the wrapper writes plain expressions over its own props and this file does\n * the wrapping, so a wrapper never has to remember which of its answers are\n * derived.\n */\nexport interface FieldContextSource {\n  controlId: () => string | undefined;\n  labelledBy?: () => string | undefined;\n  describedBy: () => string | undefined;\n  name: () => string | undefined;\n  required: () => boolean | undefined;\n  invalid: () => boolean | undefined;\n  disabled: () => boolean | undefined;\n  readonly: () => boolean | undefined;\n}\n\n/**\n * The control's own side of the contract: what this control was told directly,\n * with `undefined` for everything the caller left unset.\n *\n * Each key is `?: T | undefined` rather than `?: T`. Under\n * `exactOptionalPropertyTypes` that is the form that accepts both an omitted\n * key and an explicit `undefined` — and an explicit `undefined` is exactly what\n * a control passes when its own prop is unset.\n */\nexport interface FieldControlProps {\n  /** The caller's `id`, which reaches a bare control as a fallthrough attr rather than a prop. */\n  readonly id?: string | undefined;\n  /** The caller's `aria-describedby`, likewise a fallthrough attr. */\n  readonly describedBy?: string | undefined;\n  /** The caller's `aria-labelledby`, for group controls that name themselves rather than being named by `label for`. */\n  readonly ariaLabelledby?: string | undefined;\n  readonly name?: string | undefined;\n  readonly required?: boolean | undefined;\n  readonly invalid?: boolean | undefined;\n  readonly disabled?: boolean | undefined;\n  readonly readonly?: boolean | undefined;\n}\n\n/**\n * The resolved attributes, ready to spread onto whichever node carries the\n * control's ARIA.\n *\n * A key whose value resolved to `undefined` is **absent**, not present-and-\n * undefined — `optional()` drops it. That is what makes the spread purely\n * additive: `v-bind=\"{ ...rest, ...field.attrs }\"` can never blank out an\n * attribute the caller passed through fallthrough, so a control renders exactly\n * what it renders today whenever there is no wrapper above it.\n *\n * `aria-required` and `aria-invalid` are omitted rather than set to `\"false\"`.\n * Both are legal and both say nothing, and the absent attribute already means\n * the same thing — the house `x || undefined` idiom, moved one layer in.\n */\nexport interface FieldControlAttrs {\n  readonly id?: string;\n  readonly name?: string;\n  readonly \"aria-describedby\"?: string;\n  // Narrowed to the literal rather than `string`: Vue types `aria-invalid` on a\n  // native element as `Booleanish | \"grammar\" | \"spelling\"`, so a widened\n  // `string` here fails to spread onto the very `<input>` this exists for.\n  readonly \"aria-required\"?: \"true\";\n  readonly \"aria-invalid\"?: \"true\";\n}\n\n/**\n * What `useFieldControl` resolved, after the control's own props won.\n *\n * Returned `reactive` rather than as a bag of refs, which is the one place in\n * `src/lib/` that does so. A template unwraps only a *top-level* ref, and a\n * control needs four of these at once under names — `disabled`, `invalid`,\n * `readonly`, `required` — that each shadow a prop of the same name. `reactive`\n * gives `field.invalid` in both the script and the template, and the shadowing\n * question never arises. Destructuring it does lose reactivity; read through\n * `field.` and there is nothing to get wrong.\n */\nexport interface FieldControl {\n  /** Spread onto the node that carries the control's ARIA, **after** the fallthrough attrs. */\n  readonly attrs: FieldControlAttrs;\n  readonly id: string | undefined;\n  readonly labelledBy: string | undefined;\n  readonly name: string | undefined;\n  readonly disabled: boolean;\n  readonly invalid: boolean;\n  readonly readonly: boolean;\n  readonly required: boolean;\n}\n\n/**\n * A `Symbol`, and not exported from `src/index.ts`: a consumer pinned to the\n * key is pinned to a shape that moves whenever a wrapper does. `useFieldControl`\n * is the supported way in.\n */\nconst FIELD_CONTEXT: InjectionKey<FieldContext> = Symbol(\"loom.field\");\n\n/**\n * The wrapper above this one, for a wrapper that composes over another.\n *\n * Only Field needs it, and only for `readonly`: Vue resolves `inject` to the\n * nearest provider **wholesale**, not per key, so a Field shadows the Fieldset\n * above it entirely. Any key both wrappers answer has to be merged by hand, and\n * reading the outer context here rather than merging inside\n * `provideFieldContext` keeps that decision visible in Field.vue, where the\n * reason for it lives.\n */\nexport function useOuterFieldContext(): FieldContext | undefined {\n  return inject(FIELD_CONTEXT, undefined);\n}\n\n/** Called by a wrapper — Field and Fieldset — from its own `setup`. */\nexport function provideFieldContext(source: FieldContextSource): void {\n  const claims = ref<symbol[]>([]);\n\n  provide(FIELD_CONTEXT, {\n    controlId: computed(source.controlId),\n    labelledBy: computed(source.labelledBy ?? (() => undefined)),\n    describedBy: computed(source.describedBy),\n    name: computed(source.name),\n    required: computed(source.required),\n    invalid: computed(source.invalid),\n    disabled: computed(source.disabled),\n    readonly: computed(source.readonly),\n    claimControlId() {\n      const token = Symbol(\"loom.field.control\");\n      claims.value = [...claims.value, token];\n      // The claiming scope is the control's, not the wrapper's, so this fires\n      // when that one control unmounts and the next in document order is\n      // promoted.\n      onScopeDispose(() => {\n        claims.value = claims.value.filter((held) => held !== token);\n      });\n      return computed(() => claims.value[0] === token);\n    },\n  });\n}\n\n/**\n * Opt a control into the wrapper around it. One call, one spread — see\n * `TextField.vue`, which is the worked example the rest of the family copies.\n *\n * **The rule is `own ?? wrapper ?? false`.** `??` and not `||`, so an explicit\n * `false` on the control beats a `true` from the wrapper: one control inside a\n * row that is showing an error can declare itself individually fine, and one\n * inside a clean row can declare itself individually invalid.\n *\n * That rule is worth nothing unless \"unset\" and \"set to `false`\" are still\n * different values by the time they arrive here, and by default they are not:\n * Vue resolves an absent `Boolean` prop with no declared default to `false`, so\n * `props.invalid ?? field` would short-circuit forever and the context would be\n * inert while looking perfectly wired. **Every participating prop must be\n * declared `boolean | undefined` with an explicit `undefined` default** — the\n * `| undefined` is what `exactOptionalPropertyTypes` needs to let `withDefaults`\n * take that default at all, and the default is what beats the Boolean cast.\n *\n * With no wrapper above, every chain falls through to the control's own props\n * and the `?? false` at the end is the same `false` the control's `withDefaults`\n * used to supply. Nothing about a control standing alone changes.\n *\n * The argument is a **getter**, not a props object, for the reason\n * `./attrs.ts` takes `useAttrs()` rather than a snapshot: a control feeds this a\n * mix of props and fallthrough attrs and both have to stay live.\n */\nexport function useFieldControl(own: () => FieldControlProps): FieldControl {\n  const field = inject(FIELD_CONTEXT, undefined);\n  const holdsControlId = field?.claimControlId();\n\n  const id = computed(\n    () => own().id ?? (holdsControlId?.value === true ? field?.controlId.value : undefined),\n  );\n  const name = computed(() => own().name ?? field?.name.value);\n  const labelledBy = computed(() => own().ariaLabelledby ?? field?.labelledBy.value);\n\n  // The one attribute whose rule is merge rather than replace, because\n  // `aria-describedby` is a token list: the row's message is additional to\n  // whatever else the caller pointed at, not an alternative to it. Replacing\n  // would silently drop the row's hint the moment a caller described their\n  // control for some other reason — which is the defect this file exists to\n  // remove, reintroduced from the other end. The control's own id reads first:\n  // a control that has something to say about itself is saying the more\n  // specific thing, and a screen reader reads the list in order.\n  const describedBy = computed(() => {\n    const ids = [own().describedBy, field?.describedBy.value].filter(\n      (candidate): candidate is string => candidate !== undefined && candidate.length > 0,\n    );\n    return ids.length > 0 ? ids.join(\" \") : undefined;\n  });\n\n  const required = computed(() => own().required ?? field?.required.value ?? false);\n  const invalid = computed(() => own().invalid ?? field?.invalid.value ?? false);\n  const disabled = computed(() => own().disabled ?? field?.disabled.value ?? false);\n  const readonly = computed(() => own().readonly ?? field?.readonly.value ?? false);\n\n  // A development-mode safety net for the one context key a control can\n  // deliberately decline. When a wrapper sets `readonly` but the control did\n  // not pass that key in its `FieldControlProps`, the wrapper's instruction is\n  // silently dropped — and without this warning the consumer has no signal\n  // that it was. The `\"readonly\" in own()` check distinguishes \"I defer to the\n  // wrapper\" (key present, value `undefined`) from \"I don't participate\" (key\n  // absent), which is the same distinction `exactOptionalPropertyTypes` makes\n  // at the type level.\n  if (import.meta.env.DEV && field) {\n    watchEffect(() => {\n      if (field.readonly.value && !(\"readonly\" in own())) {\n        console.warn(\"[Loom] readonly was set on the Field, but this control does not claim it.\");\n      }\n    });\n  }\n\n  const attrs = computed<FieldControlAttrs>(() =>\n    optional({\n      id: id.value,\n      name: name.value,\n      \"aria-describedby\": describedBy.value,\n      \"aria-required\": required.value ? (\"true\" as const) : undefined,\n      \"aria-invalid\": invalid.value ? (\"true\" as const) : undefined,\n    }),\n  );\n\n  return reactive({ attrs, id, labelledBy, name, disabled, invalid, readonly, required });\n}\n"],"mappings":";;;;;;;;;AAkKA,IAAM,gBAA4C,OAAO,YAAY;;;;;;;;;;;AAYrE,SAAgB,uBAAiD;CAC/D,OAAO,OAAO,eAAe,KAAA,CAAS;AACxC;;AAGA,SAAgB,oBAAoB,QAAkC;CACpE,MAAM,SAAS,IAAc,CAAC,CAAC;CAE/B,QAAQ,eAAe;EACrB,WAAW,SAAS,OAAO,SAAS;EACpC,YAAY,SAAS,OAAO,qBAAqB,KAAA,EAAU;EAC3D,aAAa,SAAS,OAAO,WAAW;EACxC,MAAM,SAAS,OAAO,IAAI;EAC1B,UAAU,SAAS,OAAO,QAAQ;EAClC,SAAS,SAAS,OAAO,OAAO;EAChC,UAAU,SAAS,OAAO,QAAQ;EAClC,UAAU,SAAS,OAAO,QAAQ;EAClC,iBAAiB;GACf,MAAM,QAAQ,OAAO,oBAAoB;GACzC,OAAO,QAAQ,CAAC,GAAG,OAAO,OAAO,KAAK;GAItC,qBAAqB;IACnB,OAAO,QAAQ,OAAO,MAAM,QAAQ,SAAS,SAAS,KAAK;GAC7D,CAAC;GACD,OAAO,eAAe,OAAO,MAAM,OAAO,KAAK;EACjD;CACF,CAAC;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,SAAgB,gBAAgB,KAA4C;CAC1E,MAAM,QAAQ,OAAO,eAAe,KAAA,CAAS;CAC7C,MAAM,iBAAiB,OAAO,eAAe;CAE7C,MAAM,KAAK,eACH,IAAI,CAAC,CAAC,OAAO,gBAAgB,UAAU,OAAO,OAAO,UAAU,QAAQ,KAAA,EAC/E;CACA,MAAM,OAAO,eAAe,IAAI,CAAC,CAAC,QAAQ,OAAO,KAAK,KAAK;CAC3D,MAAM,aAAa,eAAe,IAAI,CAAC,CAAC,kBAAkB,OAAO,WAAW,KAAK;CAUjF,MAAM,cAAc,eAAe;EACjC,MAAM,MAAM,CAAC,IAAI,CAAC,CAAC,aAAa,OAAO,YAAY,KAAK,CAAC,CAAC,QACvD,cAAmC,cAAc,KAAA,KAAa,UAAU,SAAS,CACpF;EACA,OAAO,IAAI,SAAS,IAAI,IAAI,KAAK,GAAG,IAAI,KAAA;CAC1C,CAAC;CAED,MAAM,WAAW,eAAe,IAAI,CAAC,CAAC,YAAY,OAAO,SAAS,SAAS,KAAK;CAChF,MAAM,UAAU,eAAe,IAAI,CAAC,CAAC,WAAW,OAAO,QAAQ,SAAS,KAAK;CAC7E,MAAM,WAAW,eAAe,IAAI,CAAC,CAAC,YAAY,OAAO,SAAS,SAAS,KAAK;CAChF,MAAM,WAAW,eAAe,IAAI,CAAC,CAAC,YAAY,OAAO,SAAS,SAAS,KAAK;CAkBhF,MAAM,QAAQ,eACZ,SAAS;EACP,IAAI,GAAG;EACP,MAAM,KAAK;EACX,oBAAoB,YAAY;EAChC,iBAAiB,SAAS,QAAS,SAAmB,KAAA;EACtD,gBAAgB,QAAQ,QAAS,SAAmB,KAAA;CACtD,CAAC,CACH;CAEA,OAAO,SAAS;EAAE;EAAO;EAAI;EAAY;EAAM;EAAU;EAAS;EAAU;CAAS,CAAC;AACxF"}

package/dist/packages/labels/src/index.d.ts

@@ -1,9 +1,9 @@
 export { provideLoomLabels, useLabels } from "./labels";
 export type { LabelOf, LabelOverrides, LoomLabelOverrides } from "./labels";
 export type { LoomLabels } from "./label-registry";
-export type { AlertLabels, AlertDialogLabels, CarouselLabels, AvatarGroupLabels, BreadcrumbLabels, ColorPickerLabels, ComboboxLabels, DateRangeLabels, DateTimeRangeLabels, DialogLabels, DrawerLabels, EditableLabels, FileUploadLabels, FileUploadRejectReason, FileUploadRejection, IndicatorLabels, NumberFieldLabels, OtpInputLabels, OtpInputType, PaginationLabels, ProgressLabels, RadialProgressLabels, RatingLabels, ScrollReelLabels, TableLabels, TimelineLabels, StepperLabels, TagsInputLabels, TagsInputRejectReason, TagsInputRejection, TextFieldLabels, TextareaLabels, ToastLabels, WindowControlsLabels, } from "./component-shapes";
-export { CALENDAR_PANEL_LABELS, DATE_SEGMENT_LABELS, RANGE_CELL_LABELS, TIME_SEGMENT_LABELS, emptySegmentValueText, isDateSegmentPart, isTimeSegmentPart, } from "./date-labels";
-export type { CalendarPanelLabels, DateSegmentLabels, DateSegmentName, RangeCellLabels, RangeCellPart, TimeSegmentLabels, TimeSegmentName, } from "./date-labels";
+export type { AlertLabels, AlertDialogLabels, AvatarGroupLabels, BreadcrumbLabels, CalendarLabels, CarouselLabels, CopyButtonLabels, ColorPickerLabels, ComboboxLabels, CommandLabels, DataGridLabels, DateRangeLabels, DateTimeRangeLabels, DialogLabels, DrawerLabels, EditableLabels, ErrorSummaryLabels, FileUploadLabels, FileUploadRejectReason, FileUploadRejection, IndicatorLabels, MeterLabels, NumberFieldLabels, OtpInputLabels, OtpInputType, PaginationLabels, ProgressLabels, RadialProgressLabels, RatingLabels, ScrollReelLabels, SkipLinkLabels, TableLabels, TimelineLabels, StepperLabels, TagsInputLabels, TagsInputRejectReason, TagsInputRejection, TextFieldLabels, TextareaLabels, ToastLabels, TreeViewLabels, WindowControlsLabels, } from "./component-shapes";
+export { CALENDAR_PANEL_LABELS, DATE_SEGMENT_LABELS, RANGE_CELL_LABELS, TIME_SEGMENT_LABELS, emptySegmentValueText, formatFullDay, isDateSegmentPart, isTimeSegmentPart, segmentAriaLabel, segmentAriaValueText, } from "./date-labels";
+export type { CalendarPanelLabels, DateSegmentLabels, DateSegmentName, RangeCellLabels, RangeCellPart, SegmentAriaValueTextArgs, SegmentVocabularies, TimeSegmentLabels, TimeSegmentName, } from "./date-labels";
 export { COUNT_LABELS, warningWindow } from "./count-labels";
 export type { CountBand, CountLabels } from "./count-labels";
 export { provideFieldContext, useFieldControl, useOuterFieldContext } from "./field-context";

package/dist/packages/labels/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../packages/labels/src/index.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACxD,YAAY,EAAE,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAG5E,YAAY,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAInD,YAAY,EACV,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,gBAAgB,EAChB,sBAAsB,EACtB,mBAAmB,EACnB,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,oBAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,aAAa,EACb,eAAe,EACf,qBAAqB,EACrB,kBAAkB,EAClB,eAAe,EACf,cAAc,EACd,WAAW,EACX,oBAAoB,GACrB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EACL,qBAAqB,EACrB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,aAAa,EACb,iBAAiB,EACjB,eAAe,GAChB,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC7D,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7D,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAC7F,YAAY,EACV,YAAY,EACZ,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../packages/labels/src/index.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACxD,YAAY,EAAE,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAG5E,YAAY,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAInD,YAAY,EACV,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,aAAa,EACb,cAAc,EACd,eAAe,EACf,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,kBAAkB,EAClB,gBAAgB,EAChB,sBAAsB,EACtB,mBAAmB,EACnB,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,oBAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,cAAc,EACd,aAAa,EACb,eAAe,EACf,qBAAqB,EACrB,kBAAkB,EAClB,eAAe,EACf,cAAc,EACd,WAAW,EACX,cAAc,EACd,oBAAoB,GACrB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EACL,qBAAqB,EACrB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,aAAa,EACb,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,oBAAoB,GACrB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,aAAa,EACb,wBAAwB,EACxB,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,GAChB,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC7D,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7D,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAC7F,YAAY,EACV,YAAY,EACZ,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/packages/labels/src/index.js

@@ -1,6 +1,6 @@
 import { provideLoomLabels, useLabels } from "./labels.js";
-import { CALENDAR_PANEL_LABELS, DATE_SEGMENT_LABELS, RANGE_CELL_LABELS, TIME_SEGMENT_LABELS, emptySegmentValueText, isDateSegmentPart, isTimeSegmentPart } from "./date-labels.js";
+import { CALENDAR_PANEL_LABELS, DATE_SEGMENT_LABELS, RANGE_CELL_LABELS, TIME_SEGMENT_LABELS, formatFullDay, segmentAriaLabel, segmentAriaValueText } from "./date-labels.js";
 import { COUNT_LABELS, warningWindow } from "./count-labels.js";
 import { provideFieldContext, useFieldControl, useOuterFieldContext } from "./field-context.js";
 import { useAncestorDisabled } from "./ancestor-disabled.js";
-export { CALENDAR_PANEL_LABELS, COUNT_LABELS, DATE_SEGMENT_LABELS, RANGE_CELL_LABELS, TIME_SEGMENT_LABELS, emptySegmentValueText, isDateSegmentPart, isTimeSegmentPart, provideFieldContext, provideLoomLabels, useAncestorDisabled, useFieldControl, useLabels, useOuterFieldContext, warningWindow };
+export { CALENDAR_PANEL_LABELS, COUNT_LABELS, DATE_SEGMENT_LABELS, RANGE_CELL_LABELS, TIME_SEGMENT_LABELS, formatFullDay, provideFieldContext, provideLoomLabels, segmentAriaLabel, segmentAriaValueText, useAncestorDisabled, useFieldControl, useLabels, useOuterFieldContext, warningWindow };

package/dist/packages/labels/src/label-registry.d.ts

@@ -1,5 +1,5 @@
 import type { CalendarPanelLabels, DateSegmentLabels, RangeCellLabels, TimeSegmentLabels } from "./date-labels";
-import type { AlertLabels, CarouselLabels, TableLabels, TimelineLabels, AlertDialogLabels, AvatarGroupLabels, BreadcrumbLabels, ColorPickerLabels, ComboboxLabels, DateRangeLabels, DateTimeRangeLabels, DialogLabels, DrawerLabels, EditableLabels, FileUploadLabels, IndicatorLabels, NumberFieldLabels, OtpInputLabels, PaginationLabels, ProgressLabels, RadialProgressLabels, RatingLabels, ScrollReelLabels, StepperLabels, TagsInputLabels, TextFieldLabels, TextareaLabels, ToastLabels, WindowControlsLabels } from "./component-shapes";
+import type { AlertLabels, CalendarLabels, CarouselLabels, CopyButtonLabels, TableLabels, TimelineLabels, AlertDialogLabels, AvatarGroupLabels, BreadcrumbLabels, ColorPickerLabels, ComboboxLabels, CommandLabels, DataGridLabels, DateRangeLabels, DateTimeRangeLabels, DialogLabels, DrawerLabels, ErrorSummaryLabels, EditableLabels, FileUploadLabels, IndicatorLabels, MeterLabels, NumberFieldLabels, OtpInputLabels, PaginationLabels, ProgressLabels, RadialProgressLabels, RatingLabels, ScrollReelLabels, SkipLinkLabels, StepperLabels, TagsInputLabels, TextFieldLabels, TextareaLabels, ToastLabels, TreeViewLabels, WindowControlsLabels } from "./component-shapes";
 /**
  * Every slot a host can localise, and nothing else. One line per component that
  * speaks; the keys themselves live with the component that says them.
@@ -26,25 +26,31 @@ import type { AlertLabels, CarouselLabels, TableLabels, TimelineLabels, AlertDia
 export interface LoomLabels {
     readonly alert: AlertLabels;
     readonly table: TableLabels;
+    readonly dataGrid: DataGridLabels;
     readonly timeline: TimelineLabels;
     readonly carousel: CarouselLabels;
     readonly pagination: PaginationLabels;
     readonly windowControls: WindowControlsLabels;
     readonly breadcrumb: BreadcrumbLabels;
     readonly scrollReel: ScrollReelLabels;
+    readonly skipLink: SkipLinkLabels;
+    readonly copyButton: CopyButtonLabels;
     readonly dateSegments: DateSegmentLabels;
     readonly timeSegments: TimeSegmentLabels;
     readonly calendarPanel: CalendarPanelLabels;
     readonly rangeCell: RangeCellLabels;
     readonly dateRange: DateRangeLabels;
     readonly dateTimeRange: DateTimeRangeLabels;
+    readonly calendar: CalendarLabels;
     readonly numberField: NumberFieldLabels;
     readonly combobox: ComboboxLabels;
+    readonly command: CommandLabels;
     readonly otpInput: OtpInputLabels;
     readonly fileUpload: FileUploadLabels;
     readonly rating: RatingLabels;
     readonly tagsInput: TagsInputLabels;
     readonly editable: EditableLabels;
+    readonly errorSummary: ErrorSummaryLabels;
     readonly textField: TextFieldLabels;
     readonly textarea: TextareaLabels;
     readonly dialog: DialogLabels;
@@ -56,6 +62,8 @@ export interface LoomLabels {
     readonly avatarGroup: AvatarGroupLabels;
     readonly progress: ProgressLabels;
     readonly radialProgress: RadialProgressLabels;
+    readonly meter: MeterLabels;
     readonly colorPicker: ColorPickerLabels;
+    readonly treeView: TreeViewLabels;
 }
 //# sourceMappingURL=label-registry.d.ts.map

package/dist/packages/labels/src/label-registry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"label-registry.d.ts","sourceRoot":"","sources":["../../../../packages/labels/src/label-registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,iBAAiB,EAClB,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,EACV,WAAW,EACX,cAAc,EACd,WAAW,EACX,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,oBAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,aAAa,EACb,eAAe,EACf,eAAe,EACf,cAAc,EACd,WAAW,EACX,oBAAoB,EACrB,MAAM,oBAAoB,CAAC;AAE5B;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAC5B,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,QAAQ,CAAC,cAAc,EAAE,oBAAoB,CAAC;IAC9C,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IAMtC,QAAQ,CAAC,YAAY,EAAE,iBAAiB,CAAC;IACzC,QAAQ,CAAC,YAAY,EAAE,iBAAiB,CAAC;IACzC,QAAQ,CAAC,aAAa,EAAE,mBAAmB,CAAC;IAC5C,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,aAAa,EAAE,mBAAmB,CAAC;IAI5C,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;IACxC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IAKpC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAIlC,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;IACxC,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAC;IAChC,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAM5B,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;IAIxC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,cAAc,EAAE,oBAAoB,CAAC;IAC9C,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;CACzC"}
+{"version":3,"file":"label-registry.d.ts","sourceRoot":"","sources":["../../../../packages/labels/src/label-registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,iBAAiB,EAClB,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,EACV,WAAW,EACX,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,aAAa,EACb,cAAc,EACd,eAAe,EACf,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,oBAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,eAAe,EACf,eAAe,EACf,cAAc,EACd,WAAW,EACX,cAAc,EACd,oBAAoB,EACrB,MAAM,oBAAoB,CAAC;AAE5B;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAC5B,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,QAAQ,CAAC,cAAc,EAAE,oBAAoB,CAAC;IAC9C,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IAMtC,QAAQ,CAAC,YAAY,EAAE,iBAAiB,CAAC;IACzC,QAAQ,CAAC,YAAY,EAAE,iBAAiB,CAAC;IACzC,QAAQ,CAAC,aAAa,EAAE,mBAAmB,CAAC;IAC5C,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,aAAa,EAAE,mBAAmB,CAAC;IAM5C,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAIlC,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;IACxC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,YAAY,EAAE,kBAAkB,CAAC;IAC1C,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IAKpC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAIlC,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;IACxC,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAC;IAChC,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAM5B,QAAQ,CAAC,SAAS,EAAE,eAAe,CAAC;IACpC,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;IAIxC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;IAClC,QAAQ,CAAC,cAAc,EAAE,oBAAoB,CAAC;IAC9C,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAC5B,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC;IAGxC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;CACnC"}

package/dist/packages/layouts/dashboard/src/Dashboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dashboard.js","names":[],"sources":["../../../../../packages/layouts/dashboard/src/Dashboard.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Dashboard — a dashboard shell: optional sidebar + auto-reflowing tile grid\n * for panels, with an optional aside for supplementary metrics on ultrawide\n * viewports.\n *\n * The layout composes three composition patterns into a single responsive\n * shell. The innermost is the auto-fit grid from DashboardGrid/Grid: the tile\n * column count derives from the container's own width, so the same grid\n * reflows inside a sidebar-narrowed workspace and full-bleed on an ultra-wide\n * monitor, with zero Tailwind breakpoints authored here or at the call site.\n *\n * The sidebar and aside use the Every Layout \"Sidebar\" flex-wrap technique:\n * each panel gets a fixed flex-basis and the grid area gets `flex-grow: 999`,\n * so when the container cannot fit the content's minimum, both panels wrap to\n * full-width and the sidebar or aside stacks above the grid instead of sitting\n * beside it. No media query, no JavaScript — the layout derives its own\n * breakpoints from the container's width.\n *\n * The `#aside` slot is gated behind a `2xl` breakpoint because supplementary\n * metrics are a luxury that only wide desktops can afford: the aside is hidden\n * below that width and the grid takes the full width, preventing a cramped\n * two-panel layout where neither panel has room to breathe.\n *\n * The header slot is full-width, above the sidebar+grid row, so a top\n * navigation bar or title row never competes for horizontal space with the\n * sidebar.\n */\nexport type DashboardMinTileWidth = string;\n\nconst gapClass: Record<string, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Narrowest a tile may get before the grid drops to fewer columns. */\n    minTileWidth?: DashboardMinTileWidth;\n    /** Grid gap step. Tightens one notch below sm. */\n    gap?: \"sm\" | \"md\" | \"lg\";\n  }>(),\n  { minTileWidth: \"16rem\", gap: \"md\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the sidebar+grid row, so a\n      navigation bar or title row never competes for horizontal space.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      The sidebar+grid row uses flex-wrap. The sidebar gets a fixed\n      flex-basis (~16rem) and the grid area gets `flex-grow: 999`, so\n      when the container is too narrow both panels wrap to full-width —\n      the sidebar stacks above the grid. No media query; the layout\n      derives its own breakpoint from the container's width.\n    -->\n    <div\n      :style=\"{ flexWrap: 'wrap' }\"\n      :class=\"cn('flex flex-1', $slots.sidebar ? 'flex-row' : undefined)\"\n    >\n      <!--\n        The sidebar panel. Fixed-basis, no growth — it recedes into the\n        sunken elevation layer when present, matching the AppShell pattern.\n      -->\n      <aside\n        v-if=\"$slots.sidebar\"\n        :style=\"{\n          flexBasis: '16rem',\n          flexGrow: 0,\n          flexShrink: 1,\n        }\"\n        :class=\"cn('bg-sunken w-full')\"\n      >\n        <slot name=\"sidebar\" />\n      </aside>\n\n      <!--\n        The main area: the auto-fit tile grid + an optional aside for\n        supplementary metrics on ultrawide viewports.\n\n        `flex-grow: 999` ensures this area takes all remaining space\n        when the container is wide enough. Its `min-width: 50%` triggers\n        wrapping below tablet-like widths, making the sidebar stack above.\n\n        Gutters widen at wider breakpoints so ultrawide viewports add\n        whitespace rails rather than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('flex min-w-0 flex-col')\"\n      >\n        <div\n          :class=\"\n            cn(\n              'flex-1 px-4 sm:px-6 3xl:px-8',\n              $slots.aside ? 'flex flex-row 2xl:flex-row max-2xl:flex-col' : undefined,\n            )\n          \"\n          :style=\"$slots.aside ? { flexWrap: 'wrap' } : undefined\"\n        >\n          <!--\n            The tile grid. `auto-fit` + `minmax` recomputes the column\n            count from the container's own width — it reflows inside a\n            sidebar-narrowed workspace and full-bleed on an ultra-wide\n            monitor, with zero Tailwind breakpoints authored here. The\n            `minmax` lower bound is wrapped in `min(100%, …)` so a tile\n            never forces horizontal overflow on a container narrower than\n            `minTileWidth` itself.\n          -->\n          <div\n            :class=\"\n              cn('grid', gapClass[gap], $slots.aside ? 'flex-grow-[999] flex-shrink-1' : undefined)\n            \"\n            :style=\"{\n              gridTemplateColumns: `repeat(auto-fit, minmax(min(100%, ${minTileWidth}), 1fr))`,\n              ...($slots.aside ? { flexBasis: 0, minWidth: '60%' } : {}),\n            }\"\n          >\n            <slot />\n          </div>\n\n          <!--\n            The aside slot: supplementary metrics/info panels visible only\n            on wide desktops (from `2xl` breakpoint). Uses the same\n            flex-wrap Sidebar pattern: the aside gets a fixed basis and\n            the grid area grows to fill the remaining space. Below `2xl`,\n            the aside is hidden entirely — metrics are a luxury that only\n            wide desktops can afford.\n          -->\n          <aside\n            v-if=\"$slots.aside\"\n            :style=\"{\n              flexBasis: '14rem',\n              flexGrow: 0,\n              flexShrink: 1,\n            }\"\n            :class=\"cn('hidden w-full 2xl:block')\"\n          >\n            <slot name=\"aside\" />\n          </aside>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Dashboard.js","names":[],"sources":["../../../../../packages/layouts/dashboard/src/Dashboard.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Dashboard — a dashboard shell: optional sidebar + auto-reflowing tile grid\n * for panels, with an optional aside for supplementary metrics on ultrawide\n * viewports.\n *\n * The layout composes three composition patterns into a single responsive\n * shell. The innermost is the auto-fit grid from DashboardGrid/Grid: the tile\n * column count derives from the container's own width, so the same grid\n * reflows inside a sidebar-narrowed workspace and full-bleed on an ultra-wide\n * monitor, with zero Tailwind breakpoints authored here or at the call site.\n *\n * The sidebar and aside use the Every Layout \"Sidebar\" flex-wrap technique:\n * each panel gets a fixed flex-basis and the grid area gets `flex-grow: 999`,\n * so when the container cannot fit the content's minimum, each panel takes\n * its own line at its declared width — the sidebar stacks above the grid, and\n * the aside below it. No media query, no JavaScript — the layout derives its\n * own breakpoints from the container's width.\n *\n * The `#aside` slot is gated behind a `2xl` breakpoint because supplementary\n * metrics are a luxury that only wide desktops can afford: the aside is hidden\n * below that width and the grid takes the full width, preventing a cramped\n * two-panel layout where neither panel has room to breathe.\n *\n * The header slot is full-width, above the sidebar+grid row, so a top\n * navigation bar or title row never competes for horizontal space with the\n * sidebar.\n */\nexport type DashboardMinTileWidth = string;\n\nconst gapClass: Record<string, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Narrowest a tile may get before the grid drops to fewer columns. */\n    minTileWidth?: DashboardMinTileWidth;\n    /** Grid gap step. Tightens one notch below sm. */\n    gap?: \"sm\" | \"md\" | \"lg\";\n  }>(),\n  { minTileWidth: \"16rem\", gap: \"md\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the sidebar+grid row, so a\n      navigation bar or title row never competes for horizontal space.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      The sidebar+grid row uses flex-wrap. The sidebar gets a fixed\n      flex-basis (~16rem) and the grid area gets `flex-grow: 999`, so\n      when the container is too narrow each panel takes its own line —\n      the sidebar keeps its declared width on the line above the grid.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :style=\"{ flexWrap: 'wrap' }\"\n      :class=\"cn('flex flex-1', $slots.sidebar ? 'flex-row' : undefined)\"\n    >\n      <!--\n        The sidebar panel. Fixed-basis, no growth — it recedes into the\n        sunken elevation layer when present, matching the AppShell pattern.\n      -->\n      <aside\n        v-if=\"$slots.sidebar\"\n        :style=\"{\n          flexBasis: '16rem',\n          flexGrow: 0,\n          flexShrink: 1,\n        }\"\n        :class=\"cn('bg-sunken w-full')\"\n      >\n        <slot name=\"sidebar\" />\n      </aside>\n\n      <!--\n        The main area: the auto-fit tile grid + an optional aside for\n        supplementary metrics on ultrawide viewports.\n\n        `flex-grow: 999` ensures this area takes all remaining space\n        when the container is wide enough. Its `min-width: 50%` triggers\n        wrapping below tablet-like widths, making the sidebar stack above.\n\n        Gutters widen at wider breakpoints so ultrawide viewports add\n        whitespace rails rather than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('flex min-w-0 flex-col')\"\n      >\n        <div\n          :class=\"\n            cn(\n              'flex-1 px-4 sm:px-6 3xl:px-8',\n              $slots.aside ? 'flex flex-row 2xl:flex-row max-2xl:flex-col' : undefined,\n            )\n          \"\n          :style=\"$slots.aside ? { flexWrap: 'wrap' } : undefined\"\n        >\n          <!--\n            The tile grid. `auto-fit` + `minmax` recomputes the column\n            count from the container's own width — it reflows inside a\n            sidebar-narrowed workspace and full-bleed on an ultra-wide\n            monitor, with zero Tailwind breakpoints authored here. The\n            `minmax` lower bound is wrapped in `min(100%, …)` so a tile\n            never forces horizontal overflow on a container narrower than\n            `minTileWidth` itself.\n          -->\n          <div\n            :class=\"\n              cn('grid', gapClass[gap], $slots.aside ? 'flex-grow-[999] flex-shrink-1' : undefined)\n            \"\n            :style=\"{\n              gridTemplateColumns: `repeat(auto-fit, minmax(min(100%, ${minTileWidth}), 1fr))`,\n              ...($slots.aside ? { flexBasis: 0, minWidth: '60%' } : {}),\n            }\"\n          >\n            <slot />\n          </div>\n\n          <!--\n            The aside slot: supplementary metrics/info panels visible only\n            on wide desktops (from `2xl` breakpoint). Uses the same\n            flex-wrap Sidebar pattern: the aside gets a fixed basis and\n            the grid area grows to fill the remaining space. Below `2xl`,\n            the aside is hidden entirely — metrics are a luxury that only\n            wide desktops can afford.\n          -->\n          <aside\n            v-if=\"$slots.aside\"\n            :style=\"{\n              flexBasis: '14rem',\n              flexGrow: 0,\n              flexShrink: 1,\n            }\"\n            :class=\"cn('hidden w-full 2xl:block')\"\n          >\n            <slot name=\"aside\" />\n          </aside>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/packages/layouts/dashboard/src/Dashboard.vue.d.ts

@@ -11,10 +11,10 @@
  *
  * The sidebar and aside use the Every Layout "Sidebar" flex-wrap technique:
  * each panel gets a fixed flex-basis and the grid area gets `flex-grow: 999`,
- * so when the container cannot fit the content's minimum, both panels wrap to
- * full-width and the sidebar or aside stacks above the grid instead of sitting
- * beside it. No media query, no JavaScript — the layout derives its own
- * breakpoints from the container's width.
+ * so when the container cannot fit the content's minimum, each panel takes
+ * its own line at its declared width — the sidebar stacks above the grid, and
+ * the aside below it. No media query, no JavaScript — the layout derives its
+ * own breakpoints from the container's width.
  *
  * The `#aside` slot is gated behind a `2xl` breakpoint because supplementary
  * metrics are a luxury that only wide desktops can afford: the aside is hidden

package/dist/packages/layouts/dashboard/src/Dashboard.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dashboard.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/dashboard/src/Dashboard.vue"],"names":[],"mappings":"AA0KA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC;AAE3C,QAAA,MAAM,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAI3B,CAAC;AAEX,OAAO,EAAE,QAAQ,EAAE,CAAC;wBACC,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,uEAAuE;mBACxD,qBAAqB;IACpC,kDAAkD;UAC5C,IAAI,GAAG,IAAI,GAAG,IAAI;;IAHxB,uEAAuE;mBACxD,qBAAqB;IACpC,kDAAkD;UAC5C,IAAI,GAAG,IAAI,GAAG,IAAI;;SAAlB,IAAI,GAAG,IAAI,GAAG,IAAI;kBAFT,qBAAqB;;aAiG3B,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC7B,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC9B,CAAC,KAAK,IAAgB,KAAK,GAAG;;YAChC,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUtC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"Dashboard.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/dashboard/src/Dashboard.vue"],"names":[],"mappings":"AA2KA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC;AAE3C,QAAA,MAAM,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAI3B,CAAC;AAEX,OAAO,EAAE,QAAQ,EAAE,CAAC;wBACC,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,uEAAuE;mBACxD,qBAAqB;IACpC,kDAAkD;UAC5C,IAAI,GAAG,IAAI,GAAG,IAAI;;IAHxB,uEAAuE;mBACxD,qBAAqB;IACpC,kDAAkD;UAC5C,IAAI,GAAG,IAAI,GAAG,IAAI;;SAAlB,IAAI,GAAG,IAAI,GAAG,IAAI;kBAFT,qBAAqB;;aAiG3B,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC7B,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC9B,CAAC,KAAK,IAAgB,KAAK,GAAG;;YAChC,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUtC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/packages/layouts/dashboard/src/Dashboard.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dashboard.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../../packages/layouts/dashboard/src/Dashboard.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Dashboard — a dashboard shell: optional sidebar + auto-reflowing tile grid\n * for panels, with an optional aside for supplementary metrics on ultrawide\n * viewports.\n *\n * The layout composes three composition patterns into a single responsive\n * shell. The innermost is the auto-fit grid from DashboardGrid/Grid: the tile\n * column count derives from the container's own width, so the same grid\n * reflows inside a sidebar-narrowed workspace and full-bleed on an ultra-wide\n * monitor, with zero Tailwind breakpoints authored here or at the call site.\n *\n * The sidebar and aside use the Every Layout \"Sidebar\" flex-wrap technique:\n * each panel gets a fixed flex-basis and the grid area gets `flex-grow: 999`,\n * so when the container cannot fit the content's minimum, both panels wrap to\n * full-width and the sidebar or aside stacks above the grid instead of sitting\n * beside it. No media query, no JavaScript — the layout derives its own\n * breakpoints from the container's width.\n *\n * The `#aside` slot is gated behind a `2xl` breakpoint because supplementary\n * metrics are a luxury that only wide desktops can afford: the aside is hidden\n * below that width and the grid takes the full width, preventing a cramped\n * two-panel layout where neither panel has room to breathe.\n *\n * The header slot is full-width, above the sidebar+grid row, so a top\n * navigation bar or title row never competes for horizontal space with the\n * sidebar.\n */\nexport type DashboardMinTileWidth = string;\n\nconst gapClass: Record<string, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Narrowest a tile may get before the grid drops to fewer columns. */\n    minTileWidth?: DashboardMinTileWidth;\n    /** Grid gap step. Tightens one notch below sm. */\n    gap?: \"sm\" | \"md\" | \"lg\";\n  }>(),\n  { minTileWidth: \"16rem\", gap: \"md\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the sidebar+grid row, so a\n      navigation bar or title row never competes for horizontal space.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      The sidebar+grid row uses flex-wrap. The sidebar gets a fixed\n      flex-basis (~16rem) and the grid area gets `flex-grow: 999`, so\n      when the container is too narrow both panels wrap to full-width —\n      the sidebar stacks above the grid. No media query; the layout\n      derives its own breakpoint from the container's width.\n    -->\n    <div\n      :style=\"{ flexWrap: 'wrap' }\"\n      :class=\"cn('flex flex-1', $slots.sidebar ? 'flex-row' : undefined)\"\n    >\n      <!--\n        The sidebar panel. Fixed-basis, no growth — it recedes into the\n        sunken elevation layer when present, matching the AppShell pattern.\n      -->\n      <aside\n        v-if=\"$slots.sidebar\"\n        :style=\"{\n          flexBasis: '16rem',\n          flexGrow: 0,\n          flexShrink: 1,\n        }\"\n        :class=\"cn('bg-sunken w-full')\"\n      >\n        <slot name=\"sidebar\" />\n      </aside>\n\n      <!--\n        The main area: the auto-fit tile grid + an optional aside for\n        supplementary metrics on ultrawide viewports.\n\n        `flex-grow: 999` ensures this area takes all remaining space\n        when the container is wide enough. Its `min-width: 50%` triggers\n        wrapping below tablet-like widths, making the sidebar stack above.\n\n        Gutters widen at wider breakpoints so ultrawide viewports add\n        whitespace rails rather than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('flex min-w-0 flex-col')\"\n      >\n        <div\n          :class=\"\n            cn(\n              'flex-1 px-4 sm:px-6 3xl:px-8',\n              $slots.aside ? 'flex flex-row 2xl:flex-row max-2xl:flex-col' : undefined,\n            )\n          \"\n          :style=\"$slots.aside ? { flexWrap: 'wrap' } : undefined\"\n        >\n          <!--\n            The tile grid. `auto-fit` + `minmax` recomputes the column\n            count from the container's own width — it reflows inside a\n            sidebar-narrowed workspace and full-bleed on an ultra-wide\n            monitor, with zero Tailwind breakpoints authored here. The\n            `minmax` lower bound is wrapped in `min(100%, …)` so a tile\n            never forces horizontal overflow on a container narrower than\n            `minTileWidth` itself.\n          -->\n          <div\n            :class=\"\n              cn('grid', gapClass[gap], $slots.aside ? 'flex-grow-[999] flex-shrink-1' : undefined)\n            \"\n            :style=\"{\n              gridTemplateColumns: `repeat(auto-fit, minmax(min(100%, ${minTileWidth}), 1fr))`,\n              ...($slots.aside ? { flexBasis: 0, minWidth: '60%' } : {}),\n            }\"\n          >\n            <slot />\n          </div>\n\n          <!--\n            The aside slot: supplementary metrics/info panels visible only\n            on wide desktops (from `2xl` breakpoint). Uses the same\n            flex-wrap Sidebar pattern: the aside gets a fixed basis and\n            the grid area grows to fill the remaining space. Below `2xl`,\n            the aside is hidden entirely — metrics are a luxury that only\n            wide desktops can afford.\n          -->\n          <aside\n            v-if=\"$slots.aside\"\n            :style=\"{\n              flexBasis: '14rem',\n              flexGrow: 0,\n              flexShrink: 1,\n            }\"\n            :class=\"cn('hidden w-full 2xl:block')\"\n          >\n            <slot name=\"aside\" />\n          </aside>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;AA8BA,IAAM,WAAmC;CACvC,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;GAoBE,OAAA,UAAA,GAAA,mBA4GM,OAAA,EA5GA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAKCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBA2FM,OAAA;IA1FH,OAAO,EAAA,UAAA,OAAA;IACP,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,eAAgBA,KAAAA,OAAO,UAAO,aAAgB,KAAA,CAAS,CAAA;GAOzDA,GAAAA,CAAAA,KAAAA,OAAO,WADf,UAAA,GAAA,mBAUQ,SAAA;;IARL,OAAO;;;;IAIP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,kBAAA,CAAA;GAEV,GAAA,CAAA,WAAuB,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAczB,mBA2DM,OAAA;IA1DH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,uBAAA,CAAA;GAEV,GAAA,CAAA,mBAiDM,OAAA;IAhDH,OAAK,eAAe,MAAA,EAAA,CAAE,CAAA,gCAA8DA,KAAAA,OAAO,QAAK,gDAAmD,KAAA,CAAA,CAAA;IAMnJ,OAAK,eAAEA,KAAAA,OAAO,QAAK,EAAA,UAAA,OAAA,IAA0B,KAAA,CAAS;GAWvD,GAAA,CAAA,mBAUM,OAAA;IATH,OAAK,eAAiB,MAAA,EAAA,CAAE,CAAA,QAAS,SAAS,QAAA,MAAMA,KAAAA,OAAO,QAAK,kCAAqC,KAAA,CAAS,CAAA;IAG1G,OAAK,eAAA;KAA4E,qBAAA,qCAAA,QAAA,aAAY;KAA8BA,GAAAA,KAAAA,OAAO,QAAK;MAAA,WAAA;MAAA,UAAA;KAAA,IAAA,CAAA;;GAKxI,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,GAYFA,KAAAA,OAAO,SADf,UAAA,GAAA,mBAUQ,SAAA;;IARL,OAAO;;;;IAIP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA;GAEV,GAAA,CAAA,WAAqB,KAAA,QAAA,OAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}
+{"version":3,"file":"Dashboard.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../../packages/layouts/dashboard/src/Dashboard.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Dashboard — a dashboard shell: optional sidebar + auto-reflowing tile grid\n * for panels, with an optional aside for supplementary metrics on ultrawide\n * viewports.\n *\n * The layout composes three composition patterns into a single responsive\n * shell. The innermost is the auto-fit grid from DashboardGrid/Grid: the tile\n * column count derives from the container's own width, so the same grid\n * reflows inside a sidebar-narrowed workspace and full-bleed on an ultra-wide\n * monitor, with zero Tailwind breakpoints authored here or at the call site.\n *\n * The sidebar and aside use the Every Layout \"Sidebar\" flex-wrap technique:\n * each panel gets a fixed flex-basis and the grid area gets `flex-grow: 999`,\n * so when the container cannot fit the content's minimum, each panel takes\n * its own line at its declared width — the sidebar stacks above the grid, and\n * the aside below it. No media query, no JavaScript — the layout derives its\n * own breakpoints from the container's width.\n *\n * The `#aside` slot is gated behind a `2xl` breakpoint because supplementary\n * metrics are a luxury that only wide desktops can afford: the aside is hidden\n * below that width and the grid takes the full width, preventing a cramped\n * two-panel layout where neither panel has room to breathe.\n *\n * The header slot is full-width, above the sidebar+grid row, so a top\n * navigation bar or title row never competes for horizontal space with the\n * sidebar.\n */\nexport type DashboardMinTileWidth = string;\n\nconst gapClass: Record<string, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Narrowest a tile may get before the grid drops to fewer columns. */\n    minTileWidth?: DashboardMinTileWidth;\n    /** Grid gap step. Tightens one notch below sm. */\n    gap?: \"sm\" | \"md\" | \"lg\";\n  }>(),\n  { minTileWidth: \"16rem\", gap: \"md\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the sidebar+grid row, so a\n      navigation bar or title row never competes for horizontal space.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      The sidebar+grid row uses flex-wrap. The sidebar gets a fixed\n      flex-basis (~16rem) and the grid area gets `flex-grow: 999`, so\n      when the container is too narrow each panel takes its own line —\n      the sidebar keeps its declared width on the line above the grid.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :style=\"{ flexWrap: 'wrap' }\"\n      :class=\"cn('flex flex-1', $slots.sidebar ? 'flex-row' : undefined)\"\n    >\n      <!--\n        The sidebar panel. Fixed-basis, no growth — it recedes into the\n        sunken elevation layer when present, matching the AppShell pattern.\n      -->\n      <aside\n        v-if=\"$slots.sidebar\"\n        :style=\"{\n          flexBasis: '16rem',\n          flexGrow: 0,\n          flexShrink: 1,\n        }\"\n        :class=\"cn('bg-sunken w-full')\"\n      >\n        <slot name=\"sidebar\" />\n      </aside>\n\n      <!--\n        The main area: the auto-fit tile grid + an optional aside for\n        supplementary metrics on ultrawide viewports.\n\n        `flex-grow: 999` ensures this area takes all remaining space\n        when the container is wide enough. Its `min-width: 50%` triggers\n        wrapping below tablet-like widths, making the sidebar stack above.\n\n        Gutters widen at wider breakpoints so ultrawide viewports add\n        whitespace rails rather than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('flex min-w-0 flex-col')\"\n      >\n        <div\n          :class=\"\n            cn(\n              'flex-1 px-4 sm:px-6 3xl:px-8',\n              $slots.aside ? 'flex flex-row 2xl:flex-row max-2xl:flex-col' : undefined,\n            )\n          \"\n          :style=\"$slots.aside ? { flexWrap: 'wrap' } : undefined\"\n        >\n          <!--\n            The tile grid. `auto-fit` + `minmax` recomputes the column\n            count from the container's own width — it reflows inside a\n            sidebar-narrowed workspace and full-bleed on an ultra-wide\n            monitor, with zero Tailwind breakpoints authored here. The\n            `minmax` lower bound is wrapped in `min(100%, …)` so a tile\n            never forces horizontal overflow on a container narrower than\n            `minTileWidth` itself.\n          -->\n          <div\n            :class=\"\n              cn('grid', gapClass[gap], $slots.aside ? 'flex-grow-[999] flex-shrink-1' : undefined)\n            \"\n            :style=\"{\n              gridTemplateColumns: `repeat(auto-fit, minmax(min(100%, ${minTileWidth}), 1fr))`,\n              ...($slots.aside ? { flexBasis: 0, minWidth: '60%' } : {}),\n            }\"\n          >\n            <slot />\n          </div>\n\n          <!--\n            The aside slot: supplementary metrics/info panels visible only\n            on wide desktops (from `2xl` breakpoint). Uses the same\n            flex-wrap Sidebar pattern: the aside gets a fixed basis and\n            the grid area grows to fill the remaining space. Below `2xl`,\n            the aside is hidden entirely — metrics are a luxury that only\n            wide desktops can afford.\n          -->\n          <aside\n            v-if=\"$slots.aside\"\n            :style=\"{\n              flexBasis: '14rem',\n              flexGrow: 0,\n              flexShrink: 1,\n            }\"\n            :class=\"cn('hidden w-full 2xl:block')\"\n          >\n            <slot name=\"aside\" />\n          </aside>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;AA8BA,IAAM,WAAmC;CACvC,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;GAoBE,OAAA,UAAA,GAAA,mBA6GM,OAAA,EA7GA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAKCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAWxB,mBA2FM,OAAA;IA1FH,OAAO,EAAA,UAAA,OAAA;IACP,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,eAAgBA,KAAAA,OAAO,UAAO,aAAgB,KAAA,CAAS,CAAA;GAOzDA,GAAAA,CAAAA,KAAAA,OAAO,WADf,UAAA,GAAA,mBAUQ,SAAA;;IARL,OAAO;;;;IAIP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,kBAAA,CAAA;GAEV,GAAA,CAAA,WAAuB,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAczB,mBA2DM,OAAA;IA1DH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,uBAAA,CAAA;GAEV,GAAA,CAAA,mBAiDM,OAAA;IAhDH,OAAK,eAAe,MAAA,EAAA,CAAE,CAAA,gCAA8DA,KAAAA,OAAO,QAAK,gDAAmD,KAAA,CAAA,CAAA;IAMnJ,OAAK,eAAEA,KAAAA,OAAO,QAAK,EAAA,UAAA,OAAA,IAA0B,KAAA,CAAS;GAWvD,GAAA,CAAA,mBAUM,OAAA;IATH,OAAK,eAAiB,MAAA,EAAA,CAAE,CAAA,QAAS,SAAS,QAAA,MAAMA,KAAAA,OAAO,QAAK,kCAAqC,KAAA,CAAS,CAAA;IAG1G,OAAK,eAAA;KAA4E,qBAAA,qCAAA,QAAA,aAAY;KAA8BA,GAAAA,KAAAA,OAAO,QAAK;MAAA,WAAA;MAAA,UAAA;KAAA,IAAA,CAAA;;GAKxI,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,GAYFA,KAAAA,OAAO,SADf,UAAA,GAAA,mBAUQ,SAAA;;IARL,OAAO;;;;IAIP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA;GAEV,GAAA,CAAA,WAAqB,KAAA,QAAA,OAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/packages/layouts/settings/src/Settings.js.map

@@ -1 +1 @@
-{"version":3,"file":"Settings.js","names":[],"sources":["../../../../../packages/layouts/settings/src/Settings.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Settings — a settings/preferences page layout: navigation sidebar + content\n * sections.\n *\n * The layout uses the same intrinsic flex-wrap collapse as the Sidebar\n * composition primitive. The nav panel gets a fixed flex-basis and the content\n * area gets `flex-grow: 999`, so when the container cannot fit the content's\n * `min-width: 50%`, both panels wrap to full-width — the nav stacks above the\n * content. No media query, no JavaScript — the layout derives its own\n * breakpoint from the container's width.\n *\n * The nav panel recedes into the sunken elevation layer so the content reads as\n * the work surface. The content area scrolls independently so long settings\n * pages stay navigable without the nav scrolling out of view.\n */\nexport type SettingsNavWidth = string;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Width for the navigation panel (e.g. \"12rem\"). */\n    navWidth?: SettingsNavWidth;\n  }>(),\n  { navWidth: \"12rem\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the nav+content row, so a title bar\n      or breadcrumb never competes for horizontal space with the nav panel.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel can't fit its `min-width: 50%`, both panels wrap to full-width —\n      the nav becomes a full-width section above the content. No media query;\n      the layout derives its own breakpoint from the container's width.\n    -->\n    <div :class=\"cn('flex flex-1 flex-row')\" :style=\"{ flexWrap: 'wrap' }\">\n      <!--\n        The nav panel: fixed-basis, no growth, no shrink. It does not yield\n        width to the content area — when the container is too narrow, it wraps\n        to full-width instead of compressing. Sunken elevation marks it as\n        chrome, not work surface.\n      -->\n      <nav\n        :style=\"{\n          flexBasis: navWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n        }\"\n        :class=\"cn('bg-sunken w-full p-2')\"\n      >\n        <slot name=\"nav\" />\n      </nav>\n\n      <!--\n        The content area takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long settings pages\n        stay navigable without the nav scrolling out of view. Gutters widen at\n        wider breakpoints so ultrawide viewports add whitespace rails rather\n        than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background min-w-0 flex-1 overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Settings.js","names":[],"sources":["../../../../../packages/layouts/settings/src/Settings.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Settings — a settings/preferences page layout: navigation sidebar + content\n * sections.\n *\n * The layout uses the same intrinsic flex-wrap collapse as the Sidebar\n * composition primitive. The nav panel gets a fixed flex-basis and the content\n * area gets `flex-grow: 999`, so when the container cannot fit the content's\n * `min-width: 50%`, the pair wraps onto separate lines — the nav keeps its\n * declared width on the line above the content. No media query, no JavaScript\n * — the layout derives its own breakpoint from the container's width.\n *\n * The nav panel recedes into the sunken elevation layer so the content reads as\n * the work surface. The content area scrolls independently so long settings\n * pages stay navigable without the nav scrolling out of view.\n */\nexport type SettingsNavWidth = string;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Width for the navigation panel (e.g. \"12rem\"). */\n    navWidth?: SettingsNavWidth;\n  }>(),\n  { navWidth: \"12rem\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the nav+content row, so a title bar\n      or breadcrumb never competes for horizontal space with the nav panel.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel can't fit its `min-width: 50%`, the pair wraps onto separate lines\n      — the nav keeps its declared `navWidth` on the line above the content,\n      and the content takes the whole next line. No media query; the layout\n      derives its own breakpoint from the container's width.\n    -->\n    <div :class=\"cn('flex flex-1 flex-row')\" :style=\"{ flexWrap: 'wrap' }\">\n      <!--\n        The nav panel: fixed-basis, no growth, no shrink. It does not yield\n        width to the content area and never compresses — when the container\n        is too narrow for both, it wraps to its own line at this declared\n        width rather than shrinking. Sunken elevation marks it as chrome,\n        not work surface.\n      -->\n      <nav\n        :style=\"{\n          flexBasis: navWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n        }\"\n        :class=\"cn('bg-sunken w-full p-2')\"\n      >\n        <slot name=\"nav\" />\n      </nav>\n\n      <!--\n        The content area takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long settings pages\n        stay navigable without the nav scrolling out of view. Gutters widen at\n        wider breakpoints so ultrawide viewports add whitespace rails rather\n        than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background min-w-0 flex-1 overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/packages/layouts/settings/src/Settings.vue.d.ts

@@ -5,9 +5,9 @@
  * The layout uses the same intrinsic flex-wrap collapse as the Sidebar
  * composition primitive. The nav panel gets a fixed flex-basis and the content
  * area gets `flex-grow: 999`, so when the container cannot fit the content's
- * `min-width: 50%`, both panels wrap to full-width — the nav stacks above the
- * content. No media query, no JavaScript — the layout derives its own
- * breakpoint from the container's width.
+ * `min-width: 50%`, the pair wraps onto separate lines — the nav keeps its
+ * declared width on the line above the content. No media query, no JavaScript
+ * — the layout derives its own breakpoint from the container's width.
  *
  * The nav panel recedes into the sunken elevation layer so the content reads as
  * the work surface. The content area scrolls independently so long settings

package/dist/packages/layouts/settings/src/Settings.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Settings.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/settings/src/Settings.vue"],"names":[],"mappings":"AA6FA;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAC;wBACjB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,qDAAqD;eAC1C,gBAAgB;;IAD3B,qDAAqD;eAC1C,gBAAgB;;cAAhB,gBAAgB;;aA8DlB,CAAC,KAAK,IAAgB,KAAK,GAAG;;UACjC,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC1B,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"Settings.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/settings/src/Settings.vue"],"names":[],"mappings":"AA+FA;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAC;wBACjB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,qDAAqD;eAC1C,gBAAgB;;IAD3B,qDAAqD;eAC1C,gBAAgB;;cAAhB,gBAAgB;;aA8DlB,CAAC,KAAK,IAAgB,KAAK,GAAG;;UACjC,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC1B,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/packages/layouts/settings/src/Settings.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"Settings.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../../packages/layouts/settings/src/Settings.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Settings — a settings/preferences page layout: navigation sidebar + content\n * sections.\n *\n * The layout uses the same intrinsic flex-wrap collapse as the Sidebar\n * composition primitive. The nav panel gets a fixed flex-basis and the content\n * area gets `flex-grow: 999`, so when the container cannot fit the content's\n * `min-width: 50%`, both panels wrap to full-width — the nav stacks above the\n * content. No media query, no JavaScript — the layout derives its own\n * breakpoint from the container's width.\n *\n * The nav panel recedes into the sunken elevation layer so the content reads as\n * the work surface. The content area scrolls independently so long settings\n * pages stay navigable without the nav scrolling out of view.\n */\nexport type SettingsNavWidth = string;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Width for the navigation panel (e.g. \"12rem\"). */\n    navWidth?: SettingsNavWidth;\n  }>(),\n  { navWidth: \"12rem\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the nav+content row, so a title bar\n      or breadcrumb never competes for horizontal space with the nav panel.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel can't fit its `min-width: 50%`, both panels wrap to full-width —\n      the nav becomes a full-width section above the content. No media query;\n      the layout derives its own breakpoint from the container's width.\n    -->\n    <div :class=\"cn('flex flex-1 flex-row')\" :style=\"{ flexWrap: 'wrap' }\">\n      <!--\n        The nav panel: fixed-basis, no growth, no shrink. It does not yield\n        width to the content area — when the container is too narrow, it wraps\n        to full-width instead of compressing. Sunken elevation marks it as\n        chrome, not work surface.\n      -->\n      <nav\n        :style=\"{\n          flexBasis: navWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n        }\"\n        :class=\"cn('bg-sunken w-full p-2')\"\n      >\n        <slot name=\"nav\" />\n      </nav>\n\n      <!--\n        The content area takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long settings pages\n        stay navigable without the nav scrolling out of view. Gutters widen at\n        wider breakpoints so ultrawide viewports add whitespace rails rather\n        than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background min-w-0 flex-1 overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;GAgCE,OAAA,UAAA,GAAA,mBAqDM,OAAA,EArDA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAKCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GASxB,mBAqCM,OAAA;IArCA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,sBAAA,CAAA;IAA2B,OAAO,EAAA,UAAA,OAAA;GAO/C,GAAA,CAAA,mBASM,OAAA;IARH,OAAK,eAAA;KAAyB,WAAA,QAAA;;;;IAK9B,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,sBAAA,CAAA;GAEV,GAAA,CAAA,WAAmB,KAAA,QAAA,KAAA,CAAA,GAAA,CAAA,GAWrB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,oEAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}
+{"version":3,"file":"Settings.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../../packages/layouts/settings/src/Settings.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Settings — a settings/preferences page layout: navigation sidebar + content\n * sections.\n *\n * The layout uses the same intrinsic flex-wrap collapse as the Sidebar\n * composition primitive. The nav panel gets a fixed flex-basis and the content\n * area gets `flex-grow: 999`, so when the container cannot fit the content's\n * `min-width: 50%`, the pair wraps onto separate lines — the nav keeps its\n * declared width on the line above the content. No media query, no JavaScript\n * — the layout derives its own breakpoint from the container's width.\n *\n * The nav panel recedes into the sunken elevation layer so the content reads as\n * the work surface. The content area scrolls independently so long settings\n * pages stay navigable without the nav scrolling out of view.\n */\nexport type SettingsNavWidth = string;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Width for the navigation panel (e.g. \"12rem\"). */\n    navWidth?: SettingsNavWidth;\n  }>(),\n  { navWidth: \"12rem\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the nav+content row, so a title bar\n      or breadcrumb never competes for horizontal space with the nav panel.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel can't fit its `min-width: 50%`, the pair wraps onto separate lines\n      — the nav keeps its declared `navWidth` on the line above the content,\n      and the content takes the whole next line. No media query; the layout\n      derives its own breakpoint from the container's width.\n    -->\n    <div :class=\"cn('flex flex-1 flex-row')\" :style=\"{ flexWrap: 'wrap' }\">\n      <!--\n        The nav panel: fixed-basis, no growth, no shrink. It does not yield\n        width to the content area and never compresses — when the container\n        is too narrow for both, it wraps to its own line at this declared\n        width rather than shrinking. Sunken elevation marks it as chrome,\n        not work surface.\n      -->\n      <nav\n        :style=\"{\n          flexBasis: navWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n        }\"\n        :class=\"cn('bg-sunken w-full p-2')\"\n      >\n        <slot name=\"nav\" />\n      </nav>\n\n      <!--\n        The content area takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long settings pages\n        stay navigable without the nav scrolling out of view. Gutters widen at\n        wider breakpoints so ultrawide viewports add whitespace rails rather\n        than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background min-w-0 flex-1 overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;GAgCE,OAAA,UAAA,GAAA,mBAuDM,OAAA,EAvDA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAKCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBAsCM,OAAA;IAtCA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,sBAAA,CAAA;IAA2B,OAAO,EAAA,UAAA,OAAA;GAQ/C,GAAA,CAAA,mBASM,OAAA;IARH,OAAK,eAAA;KAAyB,WAAA,QAAA;;;;IAK9B,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,sBAAA,CAAA;GAEV,GAAA,CAAA,WAAmB,KAAA,QAAA,KAAA,CAAA,GAAA,CAAA,GAWrB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,oEAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/packages/layouts/split-layout/src/SplitLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"SplitLayout.js","names":[],"sources":["../../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * SplitLayout — full-page two-panel layout with intrinsic collapse.\n *\n * A SplitLayout extends the Split composition primitive's intrinsic collapse\n * into a full-page application shell: a side panel and a main content area,\n * with an optional full-width header above. It is the layout a two-column\n * application reaches for — a settings page with a nav rail, a documentation\n * site with a sidebar, a chat interface with a contact list.\n *\n * The intrinsic collapse from the Split composition primitive is reused\n * directly — `flex-wrap` plus a `min-width: 50%` guard on the content panel —\n * so the layout derives its own breakpoint from the container's width rather\n * than a viewport media query. Below the collapse width the panels stack\n * vertically; the side panel sits above the content when `side` is `\"left\"`,\n * below it when `side` is `\"right\"`.\n *\n * The header slot spans the full width, above the split row, so an application\n * header bar stays visible regardless of collapse state. Both panels carry\n * gutters that widen at wider breakpoints, so ultrawide viewports add\n * whitespace rails rather than stretching lines of text.\n */\nexport type SplitLayoutCollapseAt = string;\n\nexport type SplitLayoutGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<SplitLayoutGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which side the primary panel sits on. Controls stacking order when collapsed: \"left\" stacks the side panel above, \"right\" stacks it below. */\n    side?: \"left\" | \"right\";\n    /** Below this CSS width the two panels stack vertically instead of sitting side by side. Default: `\"48rem\"`. */\n    collapseAt?: SplitLayoutCollapseAt;\n    /** Minimum width for the side panel (e.g. \"16rem\"). The content area takes the rest. */\n    minSideWidth?: string;\n    /** Gap between panels. Tightens one notch below sm (except \"none\"). */\n    gap?: SplitLayoutGap;\n  }>(),\n  { side: \"left\", collapseAt: \"48rem\", minSideWidth: \"16rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    The root is a full-height column so the header can span the top while the\n    split row fills the rest. `min-h-dvh` makes the layout at least one\n    viewport tall even when content is short, so the side panel background\n    fills the screen rather than stopping at the content's natural height.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header spans the full width, above the split row. It is not sticky\n      here — that is the host's decision, because whether an application\n      header pins depends on the content below it.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel cannot honour its `min-width: 50%`, both panels wrap to full-width\n      — the side panel stacks above or below the content depending on `side`.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :class=\"\n        cn(\n          'flex flex-1',\n          side === 'right' ? 'flex-row-reverse' : 'flex-row',\n          gap !== 'none' ? gapClass[gap] : undefined,\n        )\n      \"\n      :style=\"{ flexWrap: 'wrap' }\"\n    >\n      <!--\n        The side panel holds a fixed basis and does not grow. It sits on the\n        sunken elevation so the content area reads as the work surface lifted\n        above navigation chrome. Gutters widen at wider breakpoints.\n      -->\n      <div\n        :style=\"{\n          flexBasis: minSideWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n          minWidth: minSideWidth,\n        }\"\n        :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot name=\"side\" />\n      </div>\n\n      <!--\n        The content panel takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long content never\n        pushes the side panel off-screen. Gutters widen at wider breakpoints so\n        ultrawide viewports add whitespace rails rather than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SplitLayout.js","names":[],"sources":["../../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * SplitLayout — full-page two-panel layout with intrinsic collapse.\n *\n * A SplitLayout extends the Split composition primitive's intrinsic collapse\n * into a full-page application shell: a side panel and a main content area,\n * with an optional full-width header above. It is the layout a two-column\n * application reaches for — a settings page with a nav rail, a documentation\n * site with a sidebar, a chat interface with a contact list.\n *\n * The intrinsic collapse from the Split composition primitive is reused\n * directly — `flex-wrap` plus a `min-width: 50%` guard on the content panel —\n * so the layout derives its own breakpoint from the container's width rather\n * than a viewport media query. Below the collapse width the panels stack\n * vertically; the side panel sits above the content when `side` is `\"left\"`,\n * below it when `side` is `\"right\"`.\n *\n * The header slot spans the full width, above the split row, so an application\n * header bar stays visible regardless of collapse state. Both panels carry\n * gutters that widen at wider breakpoints, so ultrawide viewports add\n * whitespace rails rather than stretching lines of text.\n */\nexport type SplitLayoutGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<SplitLayoutGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which side the primary panel sits on. Controls stacking order when collapsed: \"left\" stacks the side panel above, \"right\" stacks it below. */\n    side?: \"left\" | \"right\";\n    /** Minimum width for the side panel (e.g. \"16rem\"). The content area takes the rest. */\n    minSideWidth?: string;\n    /** Gap between panels. Tightens one notch below sm (except \"none\"). */\n    gap?: SplitLayoutGap;\n  }>(),\n  { side: \"left\", minSideWidth: \"16rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    The root is a full-height column so the header can span the top while the\n    split row fills the rest. `min-h-dvh` makes the layout at least one\n    viewport tall even when content is short, so the side panel background\n    fills the screen rather than stopping at the content's natural height.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header spans the full width, above the split row. It is not sticky\n      here — that is the host's decision, because whether an application\n      header pins depends on the content below it.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel cannot honour its `min-width: 50%`, both panels wrap to full-width\n      — the side panel stacks above or below the content depending on `side`.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :class=\"cn('flex flex-1 flex-row', gap !== 'none' ? gapClass[gap] : undefined)\"\n      :style=\"{ flexWrap: 'wrap' }\"\n    >\n      <!--\n        Document order follows `side`, so screen-reader order matches the\n        visual one and the wrapped stack never contradicts the row: content\n        first when `side=\"right\"` (stack: content above, panel below), side\n        first when `side=\"left\"`. flex-row (never reverse) plus this ordering\n        is what makes the wrap produce content-above-panel for `side=\"right\"`.\n      -->\n      <template v-if=\"side === 'right'\">\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n      </template>\n      <template v-else>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n      </template>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/packages/layouts/split-layout/src/SplitLayout.vue.d.ts

@@ -19,7 +19,6 @@
  * gutters that widen at wider breakpoints, so ultrawide viewports add
  * whitespace rails rather than stretching lines of text.
  */
-export type SplitLayoutCollapseAt = string;
 export type SplitLayoutGap = "sm" | "md" | "lg" | "none";
 declare const gapClass: Record<Exclude<SplitLayoutGap, "none">, string>;
 export { gapClass };
@@ -28,8 +27,6 @@ export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     /** Which side the primary panel sits on. Controls stacking order when collapsed: "left" stacks the side panel above, "right" stacks it below. */
     side?: "left" | "right";
-    /** Below this CSS width the two panels stack vertically instead of sitting side by side. Default: `"48rem"`. */
-    collapseAt?: SplitLayoutCollapseAt;
     /** Minimum width for the side panel (e.g. "16rem"). The content area takes the rest. */
     minSideWidth?: string;
     /** Gap between panels. Tightens one notch below sm (except "none"). */
@@ -37,8 +34,6 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
     /** Which side the primary panel sits on. Controls stacking order when collapsed: "left" stacks the side panel above, "right" stacks it below. */
     side?: "left" | "right";
-    /** Below this CSS width the two panels stack vertically instead of sitting side by side. Default: `"48rem"`. */
-    collapseAt?: SplitLayoutCollapseAt;
     /** Minimum width for the side panel (e.g. "16rem"). The content area takes the rest. */
     minSideWidth?: string;
     /** Gap between panels. Tightens one notch below sm (except "none"). */
@@ -46,10 +41,13 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
 }> & Readonly<{}>, {
     gap: SplitLayoutGap;
     side: "left" | "right";
-    collapseAt: SplitLayoutCollapseAt;
     minSideWidth: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     header?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+} & {
+    side?: (props: {}) => any;
 } & {
     side?: (props: {}) => any;
 } & {

package/dist/packages/layouts/split-layout/src/SplitLayout.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SplitLayout.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"names":[],"mappings":"AAmIA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC;AAE3C,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEzD,QAAA,MAAM,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,cAAc,EAAE,MAAM,CAAC,EAAE,MAAM,CAIpD,CAAC;AAEX,OAAO,EAAE,QAAQ,EAAE,CAAC;wBACC,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,iJAAiJ;WAC1I,MAAM,GAAG,OAAO;IACvB,gHAAgH;iBACnG,qBAAqB;IAClC,wFAAwF;mBACzE,MAAM;IACrB,uEAAuE;UACjE,cAAc;;IAPpB,iJAAiJ;WAC1I,MAAM,GAAG,OAAO;IACvB,gHAAgH;iBACnG,qBAAqB;IAClC,wFAAwF;mBACzE,MAAM;IACrB,uEAAuE;UACjE,cAAc;;SAAd,cAAc;UANb,MAAM,GAAG,OAAO;gBAEV,qBAAqB;kBAEnB,MAAM;;aAwEZ,CAAC,KAAK,IAAgB,KAAK,GAAG;;WAChC,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC3B,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"SplitLayout.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"names":[],"mappings":"AAyJA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEzD,QAAA,MAAM,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,cAAc,EAAE,MAAM,CAAC,EAAE,MAAM,CAIpD,CAAC;AAEX,OAAO,EAAE,QAAQ,EAAE,CAAC;wBACC,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,iJAAiJ;WAC1I,MAAM,GAAG,OAAO;IACvB,wFAAwF;mBACzE,MAAM;IACrB,uEAAuE;UACjE,cAAc;;IALpB,iJAAiJ;WAC1I,MAAM,GAAG,OAAO;IACvB,wFAAwF;mBACzE,MAAM;IACrB,uEAAuE;UACjE,cAAc;;SAAd,cAAc;UAJb,MAAM,GAAG,OAAO;kBAER,MAAM;;aA4FZ,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC7B,CAAC,KAAK,IAAgB,KAAK,GAAG;;WACjC,CAAC,KAAK,IAAgB,KAAK,GAAG;;WAC9B,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC3B,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/packages/layouts/split-layout/src/SplitLayout.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,6 @@
 import { cn } from "../../../core/src/cn.js";
 import "../../../core/src/index.js";
-import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, renderSlot, unref } from "vue";
+import { Fragment, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, renderSlot, unref } from "vue";
 //#region packages/layouts/split-layout/src/SplitLayout.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { key: 0 };
 var gapClass = {
@@ -12,16 +12,31 @@ var SplitLayout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 	__name: "SplitLayout",
 	props: {
 		side: { default: "left" },
-		collapseAt: { default: "48rem" },
 		minSideWidth: { default: "16rem" },
 		gap: { default: "none" }
 	},
 	setup(__props) {
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(cn)("min-h-dvh flex flex-col")) }, [_ctx.$slots.header ? (openBlock(), createElementBlock("header", _hoisted_1, [renderSlot(_ctx.$slots, "header")])) : createCommentVNode("", true), createElementVNode("div", {
-				class: normalizeClass(unref(cn)("flex flex-1", __props.side === "right" ? "flex-row-reverse" : "flex-row", __props.gap !== "none" ? gapClass[__props.gap] : void 0)),
+				class: normalizeClass(unref(cn)("flex flex-1 flex-row", __props.gap !== "none" ? gapClass[__props.gap] : void 0)),
 				style: { flexWrap: "wrap" }
-			}, [createElementVNode("div", {
+			}, [__props.side === "right" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createElementVNode("div", {
+				style: {
+					flexBasis: 0,
+					flexGrow: 999,
+					flexShrink: 1,
+					minWidth: "50%"
+				},
+				class: normalizeClass(unref(cn)("bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8"))
+			}, [renderSlot(_ctx.$slots, "default")], 2), createElementVNode("div", {
+				style: normalizeStyle({
+					flexBasis: __props.minSideWidth,
+					flexGrow: 0,
+					flexShrink: 0,
+					minWidth: __props.minSideWidth
+				}),
+				class: normalizeClass(unref(cn)("bg-sunken w-full px-4 sm:px-6 3xl:px-8"))
+			}, [renderSlot(_ctx.$slots, "side")], 6)], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createElementVNode("div", {
 				style: normalizeStyle({
 					flexBasis: __props.minSideWidth,
 					flexGrow: 0,
@@ -37,7 +52,7 @@ var SplitLayout_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 					minWidth: "50%"
 				},
 				class: normalizeClass(unref(cn)("bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8"))
-			}, [renderSlot(_ctx.$slots, "default")], 2)], 2)], 2);
+			}, [renderSlot(_ctx.$slots, "default")], 2)], 64))], 2)], 2);
 		};
 	}
 });

package/dist/packages/layouts/split-layout/src/SplitLayout.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"SplitLayout.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * SplitLayout — full-page two-panel layout with intrinsic collapse.\n *\n * A SplitLayout extends the Split composition primitive's intrinsic collapse\n * into a full-page application shell: a side panel and a main content area,\n * with an optional full-width header above. It is the layout a two-column\n * application reaches for — a settings page with a nav rail, a documentation\n * site with a sidebar, a chat interface with a contact list.\n *\n * The intrinsic collapse from the Split composition primitive is reused\n * directly — `flex-wrap` plus a `min-width: 50%` guard on the content panel —\n * so the layout derives its own breakpoint from the container's width rather\n * than a viewport media query. Below the collapse width the panels stack\n * vertically; the side panel sits above the content when `side` is `\"left\"`,\n * below it when `side` is `\"right\"`.\n *\n * The header slot spans the full width, above the split row, so an application\n * header bar stays visible regardless of collapse state. Both panels carry\n * gutters that widen at wider breakpoints, so ultrawide viewports add\n * whitespace rails rather than stretching lines of text.\n */\nexport type SplitLayoutCollapseAt = string;\n\nexport type SplitLayoutGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<SplitLayoutGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which side the primary panel sits on. Controls stacking order when collapsed: \"left\" stacks the side panel above, \"right\" stacks it below. */\n    side?: \"left\" | \"right\";\n    /** Below this CSS width the two panels stack vertically instead of sitting side by side. Default: `\"48rem\"`. */\n    collapseAt?: SplitLayoutCollapseAt;\n    /** Minimum width for the side panel (e.g. \"16rem\"). The content area takes the rest. */\n    minSideWidth?: string;\n    /** Gap between panels. Tightens one notch below sm (except \"none\"). */\n    gap?: SplitLayoutGap;\n  }>(),\n  { side: \"left\", collapseAt: \"48rem\", minSideWidth: \"16rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    The root is a full-height column so the header can span the top while the\n    split row fills the rest. `min-h-dvh` makes the layout at least one\n    viewport tall even when content is short, so the side panel background\n    fills the screen rather than stopping at the content's natural height.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header spans the full width, above the split row. It is not sticky\n      here — that is the host's decision, because whether an application\n      header pins depends on the content below it.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel cannot honour its `min-width: 50%`, both panels wrap to full-width\n      — the side panel stacks above or below the content depending on `side`.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :class=\"\n        cn(\n          'flex flex-1',\n          side === 'right' ? 'flex-row-reverse' : 'flex-row',\n          gap !== 'none' ? gapClass[gap] : undefined,\n        )\n      \"\n      :style=\"{ flexWrap: 'wrap' }\"\n    >\n      <!--\n        The side panel holds a fixed basis and does not grow. It sits on the\n        sunken elevation so the content area reads as the work surface lifted\n        above navigation chrome. Gutters widen at wider breakpoints.\n      -->\n      <div\n        :style=\"{\n          flexBasis: minSideWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n          minWidth: minSideWidth,\n        }\"\n        :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot name=\"side\" />\n      </div>\n\n      <!--\n        The content panel takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long content never\n        pushes the side panel off-screen. Gutters widen at wider breakpoints so\n        ultrawide viewports add whitespace rails rather than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;AA0BA,IAAM,WAA4D;CAChE,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;;GA8BE,OAAA,UAAA,GAAA,mBA+DM,OAAA,EA/DA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAMCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBA6CM,OAAA;IA5CH,OAAK,eAAW,MAAA,EAAA,CAAE,CAAA,eAAqC,QAAA,SAAI,UAAA,qBAAA,YAA0D,QAAA,QAAG,SAAc,SAAS,QAAA,OAAO,KAAA,CAAA,CAAA;IAOtJ,OAAO,EAAA,UAAA,OAAA;GAOR,GAAA,CAAA,mBAUM,OAAA;IATH,OAAK,eAAA;KAAyB,WAAA,QAAA;;;KAAkF,UAAA,QAAA;;IAMhH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wCAAA,CAAA;GAEV,GAAA,CAAA,WAAoB,KAAA,QAAA,MAAA,CAAA,GAAA,CAAA,GAUtB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}
+{"version":3,"file":"SplitLayout.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * SplitLayout — full-page two-panel layout with intrinsic collapse.\n *\n * A SplitLayout extends the Split composition primitive's intrinsic collapse\n * into a full-page application shell: a side panel and a main content area,\n * with an optional full-width header above. It is the layout a two-column\n * application reaches for — a settings page with a nav rail, a documentation\n * site with a sidebar, a chat interface with a contact list.\n *\n * The intrinsic collapse from the Split composition primitive is reused\n * directly — `flex-wrap` plus a `min-width: 50%` guard on the content panel —\n * so the layout derives its own breakpoint from the container's width rather\n * than a viewport media query. Below the collapse width the panels stack\n * vertically; the side panel sits above the content when `side` is `\"left\"`,\n * below it when `side` is `\"right\"`.\n *\n * The header slot spans the full width, above the split row, so an application\n * header bar stays visible regardless of collapse state. Both panels carry\n * gutters that widen at wider breakpoints, so ultrawide viewports add\n * whitespace rails rather than stretching lines of text.\n */\nexport type SplitLayoutGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<SplitLayoutGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which side the primary panel sits on. Controls stacking order when collapsed: \"left\" stacks the side panel above, \"right\" stacks it below. */\n    side?: \"left\" | \"right\";\n    /** Minimum width for the side panel (e.g. \"16rem\"). The content area takes the rest. */\n    minSideWidth?: string;\n    /** Gap between panels. Tightens one notch below sm (except \"none\"). */\n    gap?: SplitLayoutGap;\n  }>(),\n  { side: \"left\", minSideWidth: \"16rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    The root is a full-height column so the header can span the top while the\n    split row fills the rest. `min-h-dvh` makes the layout at least one\n    viewport tall even when content is short, so the side panel background\n    fills the screen rather than stopping at the content's natural height.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header spans the full width, above the split row. It is not sticky\n      here — that is the host's decision, because whether an application\n      header pins depends on the content below it.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel cannot honour its `min-width: 50%`, both panels wrap to full-width\n      — the side panel stacks above or below the content depending on `side`.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :class=\"cn('flex flex-1 flex-row', gap !== 'none' ? gapClass[gap] : undefined)\"\n      :style=\"{ flexWrap: 'wrap' }\"\n    >\n      <!--\n        Document order follows `side`, so screen-reader order matches the\n        visual one and the wrapped stack never contradicts the row: content\n        first when `side=\"right\"` (stack: content above, panel below), side\n        first when `side=\"left\"`. flex-row (never reverse) plus this ordering\n        is what makes the wrap produce content-above-panel for `side=\"right\"`.\n      -->\n      <template v-if=\"side === 'right'\">\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n      </template>\n      <template v-else>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n      </template>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;AAwBA,IAAM,WAA4D;CAChE,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;GA4BE,OAAA,UAAA,GAAA,mBAyFM,OAAA,EAzFA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAMCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBAuEM,OAAA;IAtEH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wBAAyB,QAAA,QAAG,SAAc,SAAS,QAAA,OAAO,KAAA,CAAS,CAAA;IAC5E,OAAO,EAAA,UAAA,OAAA;GASQ,GAAA,CAAA,QAAA,SAAI,WAApB,UAAA,GAAA,mBA6BW,UAAA,EAAA,KAAA,EAAA,GAAA,CAzBT,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,GAKV,mBAUM,OAAA;IATH,OAAK,eAAA;KAA2B,WAAA,QAAA;;;KAAwF,UAAA,QAAA;;IAMxH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wCAAA,CAAA;GAEV,GAAA,CAAA,WAAoB,KAAA,QAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,MAGxB,UAAA,GAAA,mBA6BW,UAAA,EAAA,KAAA,EAAA,GAAA,CAzBT,mBAUM,OAAA;IATH,OAAK,eAAA;KAA2B,WAAA,QAAA;;;KAAwF,UAAA,QAAA;;IAMxH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wCAAA,CAAA;GAEV,GAAA,CAAA,WAAoB,KAAA,QAAA,MAAA,CAAA,GAAA,CAAA,GAKtB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/packages/layouts/split-layout/src/index.d.ts

@@ -1,3 +1,3 @@
 export { default } from "./SplitLayout.vue";
-export type { SplitLayoutCollapseAt, SplitLayoutGap } from "./SplitLayout.vue";
+export type { SplitLayoutGap } from "./SplitLayout.vue";
 //# sourceMappingURL=index.d.ts.map

package/dist/packages/layouts/split-layout/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/split-layout/src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,YAAY,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/layouts/split-layout/src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/packages/loom/src/a11y.d.ts

@@ -1,2 +1,2 @@
-export { WCAG_TAGS } from "../../core/src/index";
+export { WCAG_TAGS, BROWSERLESS_RULES, BROWSER_REQUIRED_RULES } from "../../core/src/index";
 //# sourceMappingURL=a11y.d.ts.map