npm - @eos-ui/vue - Versions diffs - 0.1.0 → 0.2.0 - Mend

@eos-ui/vue 0.1.0 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (409) hide show

package/dist/components/Calendar/ECalendar.vue.d.ts CHANGED Viewed

@@ -3,19 +3,19 @@ export interface CalendarRange {
     end: Date | null;
 }
 type __VLS_Props = {
-    /** `single` chooses one day (`v-model`); `range` chooses a span (`v-model:start` and `v-model:end`). */
+    /** `single` chooses one day (`v-model`); `range` chooses a span (`v-model:start` and `v-model:end`): the first click sets the start, the second the end, and a click before the start restarts. */
     mode?: "single" | "range";
-    /** Days that cannot be chosen or focused, such as days with nothing to book. */
+    /** Days that cannot be chosen or focused, such as days with nothing to book. Arrow keys skip them. */
     disabledDate?: (date: Date) => boolean;
     /** Days that get a dot: a list of dates or a function. Screen readers hear `markLabel`. */
     marked?: Date[] | ((date: Date) => boolean);
-    /** What screen readers hear on a marked day. Default "times available". */
+    /** What screen readers hear on a marked day. @default times available */
     markLabel?: string;
-    /** The earliest day that can be chosen. */
+    /** The earliest day that can be chosen. Earlier days cannot be focused or chosen; navigation stops there. */
     min?: Date;
-    /** The latest day that can be chosen. */
+    /** The latest day that can be chosen. Later days cannot be focused or chosen; navigation stops there. */
     max?: Date;
-    /** The month to open on, when nothing is chosen. */
+    /** The month to open on, when nothing is chosen. Changing it moves the view. */
     month?: Date;
     /** `false` hides the Today and Clear buttons. */
     footer?: boolean;
@@ -24,8 +24,11 @@ type __VLS_Props = {
 };
 type View = "days" | "months" | "years";
 type __VLS_ModelProps = {
+    /** The chosen day (`single` mode). */
     modelValue?: Date | null;
+    /** The first day of the span (`range` mode). */
     "start"?: Date | null;
+    /** The last day of the span (`range` mode). */
     "end"?: Date | null;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
@@ -34,19 +37,19 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {
     focusDay: () => void;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     clear: () => any;
-    "update:modelValue": (value: Date | null) => any;
     rangeChange: (range: CalendarRange) => any;
+    "update:modelValue": (value: Date | null) => any;
     "update:start": (value: Date | null) => any;
     "update:end": (value: Date | null) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     onClear?: (() => any) | undefined;
-    "onUpdate:modelValue"?: ((value: Date | null) => any) | undefined;
     onRangeChange?: ((range: CalendarRange) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: Date | null) => any) | undefined;
     "onUpdate:start"?: ((value: Date | null) => any) | undefined;
     "onUpdate:end"?: ((value: Date | null) => any) | undefined;
 }>, {
     footer: boolean;
-    mode: "range" | "single";
+    mode: "single" | "range";
     clearable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/components/Calendar/ECalendar.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ECalendar.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createElementBlock","_unref","_createElementVNode","_createBlock","EIconButton","_toDisplayString","_createTextVNode","_createVNode","EIcon","_Fragment","_renderList","_normalizeClass","_createCommentVNode","EActions","_withCtx","EButton","EActions_default","EIcon_default","EButton_default","EIconButton_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","_hoisted_15","_hoisted_16","_hoisted_17","ECalendar_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","\"start\"","\"startModifiers\"","\"end\"","\"endModifiers\"","__expose","__emit","props","__props","emit","value","useModel","start","end","t","useMessages","config","useConfig","loc","useLocale","uid","useUid","root","ref","range","computed","instance","getCurrentInstance","hasClear","today","startOfDay","focus","hover","view","pick","cy","cm","yearLow","yearHigh","years","i","off","compareDays","d","isMarked","m","sameDay","x","monthOff","y","yearOff","clamp","settle","addDays","step","withMonthYear","last","want","focusWanted","nextTick","el","focusId","id","dayId","dayKey","watch","chosen","weeks","first","from","w","columns","k","rangeEnd","isSelected","inRange","dayLabel","marked","pickDay","s","clickDay","openView","v","backToDays","back","chooseMonth","nd","chooseYear","addMonths","n","sign","onDayKey","f","dow","next","walk","target","onPickKey","months","lo","hi","onRootKey","goToday","tc","shortDate","help","picking","prevOff","nextOff","nowYear","nowMonth","openBlock","createElementBlock","unref","createElementVNode","createBlock","_cache","toDisplayString","createTextVNode","createVNode","Fragment","renderList","ix","row","normalizeClass","name","createCommentVNode","withCtx"],"sources":["../../../src/components/Calendar/ECalendar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, getCurrentInstance, nextTick, ref, watch } from \"vue\";\nimport EActions from \"../Actions/EActions.vue\";\nimport EButton from \"../Button/EButton.vue\";\nimport EIcon from \"../Icon/EIcon.vue\";\nimport EIconButton from \"../IconButton/EIconButton.vue\";\nimport { useConfig, useMessages } from \"../../config.js\";\nimport { useLocale } from \"../../composables/useLocale.js\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport { addDays, addMonths, compareDays, dayKey, sameDay, startOfDay } from \"./dates.js\";\nimport \"../../styles/base.css\";\n\nexport interface CalendarRange {\n start: Date \| null;\n end: Date \| null;\n}\n\nconst props = withDefaults(\n defineProps<{\n /** `single` chooses one day (`v-model`); `range` chooses a span (`v-model:start` and `v-model:end`). /\n mode?: \"single\" \| \"range\";\n /* Days that cannot be chosen or focused, such as days with nothing to book. /\n disabledDate?: (date: Date) => boolean;\n /* Days that get a dot: a list of dates or a function. Screen readers hear `markLabel`. /\n marked?: Date[] \| ((date: Date) => boolean);\n /* What screen readers hear on a marked day. Default \"times available\". /\n markLabel?: string;\n /* The earliest day that can be chosen. /\n min?: Date;\n /* The latest day that can be chosen. /\n max?: Date;\n /* The month to open on, when nothing is chosen. /\n month?: Date;\n /* `false` hides the Today and Clear buttons. /\n footer?: boolean;\n /* Forces the Clear button on or off. Left out, it shows when a `@clear` listener is attached. /\n clearable?: boolean;\n }>(),\n { mode: \"single\", footer: true, clearable: undefined },\n);\n\nconst emit = defineEmits<{\n /* In range mode, after every click that changes the span. /\n rangeChange: [range: CalendarRange];\n /* The Clear button. It is only shown when a `@clear` listener is attached. /\n clear: [];\n}>();\n\nconst value = defineModel<Date \| null>({ default: null });\nconst start = defineModel<Date \| null>(\"start\", { default: null });\nconst end = defineModel<Date \| null>(\"end\", { default: null });\n\ntype View = \"days\" \| \"months\" \| \"years\";\n\nconst t = useMessages();\nconst config = useConfig();\nconst loc = useLocale();\nconst uid = useUid();\nconst root = ref<HTMLElement \| null>(null);\nconst range = computed(() => props.mode === \"range\");\nconst instance = getCurrentInstance();\nconst hasClear = () => props.clearable ?? !!instance?.vnode.props?.onClear;\n\nconst today = startOfDay(new Date());\nconst focus = ref(startOfDay((range.value ? start.value : value.value) \|\| props.month \|\| new Date()));\nconst hover = ref<Date \| null>(null);\nconst view = ref<View>(\"days\");\nconst pick = ref(0);\n\nconst cy = computed(() => focus.value.getFullYear());\nconst cm = computed(() => focus.value.getMonth());\nconst yearLow = computed(() => Math.min(cy.value, props.min ? props.min.getFullYear() : today.getFullYear() - 120));\nconst yearHigh = computed(() => Math.max(cy.value, props.max ? props.max.getFullYear() : today.getFullYear() + 20));\nconst years = computed(() => Array.from({ length: yearHigh.value - yearLow.value + 1 }, (_, i) => yearLow.value + i));\n\nfunction off(d: Date): boolean {\n return (\n (!!props.min && compareDays(d, props.min) < 0) \|\|\n (!!props.max && compareDays(d, props.max) > 0) \|\|\n !!props.disabledDate?.(d)\n );\n}\nfunction isMarked(d: Date): boolean {\n const m = props.marked;\n if (!m) return false;\n return typeof m === \"function\" ? !!m(d) : m.some((x) => sameDay(x, d));\n}\nfunction monthOff(y: number, m: number): boolean {\n return (\n (!!props.min && compareDays(new Date(y, m + 1, 0, 12), props.min) < 0) \|\|\n (!!props.max && compareDays(new Date(y, m, 1, 12), props.max) > 0)\n );\n}\nconst yearOff = (y: number) =>\n (!!props.min && y < props.min.getFullYear()) \|\| (!!props.max && y > props.max.getFullYear());\nfunction clamp(d: Date): Date {\n if (props.min && compareDays(d, props.min) < 0) return startOfDay(props.min);\n if (props.max && compareDays(d, props.max) > 0) return startOfDay(props.max);\n return d;\n}\nfunction settle(d: Date, step: number): Date \| null {\n let n = d;\n for (let i = 0; i < 400 && off(n); i++) n = addDays(n, step);\n return off(n) ? null : n;\n}\nfunction withMonthYear(y: number, m: number): Date {\n const last = new Date(y, m + 1, 0, 12).getDate();\n return clamp(new Date(y, m, Math.min(focus.value.getDate(), last), 12));\n}\n\nif (off(focus.value)) focus.value = settle(focus.value, 1) ?? settle(focus.value, -1) ?? focus.value;\n\nlet want: string \| null = null;\nasync function focusWanted() {\n await nextTick();\n if (!want) return;\n const el = root.value?.querySelector<HTMLElement>(`[id=\"${want}\"]`);\n if (!el) return;\n el.focus();\n if (want.includes(\"-y-\")) el.scrollIntoView?.({ block: \"center\" });\n want = null;\n}\nfunction focusId(id: string) {\n want = id;\n void focusWanted();\n}\nconst dayId = (d: Date) => `${uid.value}-${dayKey(d)}`;\n\nwatch(\n () => props.month?.getTime(),\n () => {\n if (props.month) focus.value = clamp(startOfDay(props.month));\n },\n);\nwatch(\n () => (range.value ? start.value : value.value)?.getTime(),\n () => {\n const chosen = range.value ? start.value : value.value;\n if (chosen && !sameDay(chosen, focus.value)) focus.value = startOfDay(chosen);\n },\n);\n\nconst weeks = computed(() => {\n const first = new Date(cy.value, cm.value, 1, 12);\n const from = addDays(first, -((first.getDay() - loc.weekStart.value + 7) % 7));\n return Array.from({ length: 6 }, (_, w) => Array.from({ length: 7 }, (_, i) => addDays(from, w 7 + i)));\n});\nconst columns = computed(() => Array.from({ length: 7 }, (_, k) => (loc.weekStart.value + k) % 7));\nconst rangeEnd = computed(() => {\n if (!range.value) return null;\n return end.value \|\| (start.value && hover.value && compareDays(hover.value, start.value) >= 0 ? hover.value : null);\n});\n\nfunction isSelected(d: Date): boolean {\n return range.value ? sameDay(d, start.value) \|\| sameDay(d, end.value) : sameDay(d, value.value);\n}\nfunction inRange(d: Date): boolean {\n return !!(\n range.value &&\n start.value &&\n rangeEnd.value &&\n compareDays(d, start.value) > 0 &&\n compareDays(d, rangeEnd.value) < 0\n );\n}\nfunction dayLabel(d: Date, marked: boolean): string {\n return (\n loc.formatLong(d) +\n (sameDay(d, today) ? \", \" + t(\"todaySuffix\") : \"\") +\n (marked ? \", \" + (props.markLabel \|\| t(\"timesAvailable\")) : \"\")\n );\n}\n\nfunction pickDay(d: Date) {\n if (off(d)) return;\n if (!range.value) {\n value.value = d;\n return;\n }\n const s = start.value;\n if (!s \|\| end.value \|\| compareDays(d, s) < 0) {\n start.value = d;\n end.value = null;\n emit(\"rangeChange\", { start: d, end: null });\n } else {\n end.value = d;\n emit(\"rangeChange\", { start: s, end: d });\n }\n}\nfunction clickDay(d: Date) {\n focus.value = d;\n focusId(dayId(d));\n pickDay(d);\n}\n\nfunction openView(v: \"months\" \| \"years\") {\n view.value = v;\n if (v === \"months\") {\n pick.value = cm.value;\n focusId(`${uid.value}-m-${cm.value}`);\n } else {\n pick.value = cy.value;\n focusId(`${uid.value}-y-${cy.value}`);\n }\n}\nfunction backToDays() {\n view.value = \"days\";\n focusId(dayId(focus.value));\n}\nfunction back() {\n if (view.value === \"months\") openView(\"years\");\n else backToDays();\n}\nfunction chooseMonth(m: number) {\n if (monthOff(cy.value, m)) return;\n const nd = withMonthYear(cy.value, m);\n focus.value = nd;\n view.value = \"days\";\n focusId(dayId(nd));\n}\nfunction chooseYear(y: number) {\n if (yearOff(y)) return;\n const nd = withMonthYear(y, cm.value);\n focus.value = nd;\n view.value = \"months\";\n pick.value = nd.getMonth();\n focusId(`${uid.value}-m-${nd.getMonth()}`);\n}\nfunction step(n: number) {\n focus.value = clamp(addMonths(focus.value, n));\n}\n\nfunction sign(): number {\n if (config.dir) return config.dir === \"rtl\" ? -1 : 1;\n return root.value && getComputedStyle(root.value).direction === \"rtl\" ? -1 : 1;\n}\n\nfunction onDayKey(e: KeyboardEvent) {\n const f = focus.value;\n const dow = (f.getDay() - loc.weekStart.value + 7) % 7;\n const s = sign();\n let next: Date;\n let walk: number;\n switch (e.key) {\n case \"ArrowLeft\":\n walk = -s;\n next = addDays(f, walk);\n break;\n case \"ArrowRight\":\n walk = s;\n next = addDays(f, walk);\n break;\n case \"ArrowUp\":\n walk = -7;\n next = addDays(f, walk);\n break;\n case \"ArrowDown\":\n walk = 7;\n next = addDays(f, walk);\n break;\n case \"Home\":\n walk = 1;\n next = addDays(f, -dow);\n break;\n case \"End\":\n walk = -1;\n next = addDays(f, 6 - dow);\n break;\n case \"PageUp\":\n walk = -1;\n next = addMonths(f, e.shiftKey ? -12 : -1);\n break;\n case \"PageDown\":\n walk = 1;\n next = addMonths(f, e.shiftKey ? 12 : 1);\n break;\n default:\n return;\n }\n e.preventDefault();\n const target = settle(next, walk);\n if (!target) return;\n focus.value = target;\n focusId(dayId(target));\n if (range.value && start.value && !end.value) hover.value = target;\n}\n\nfunction onPickKey(e: KeyboardEvent) {\n const months = view.value === \"months\";\n const lo = months ? 0 : yearLow.value;\n const hi = months ? 11 : yearHigh.value;\n const s = sign();\n let next: number \| null = null;\n switch (e.key) {\n case \"ArrowLeft\":\n next = pick.value - s;\n break;\n case \"ArrowRight\":\n next = pick.value + s;\n break;\n case \"ArrowUp\":\n next = pick.value - 3;\n break;\n case \"ArrowDown\":\n next = pick.value + 3;\n break;\n case \"Home\":\n next = lo;\n break;\n case \"End\":\n next = hi;\n break;\n case \"PageUp\":\n if (!months) next = pick.value - 12;\n break;\n case \"PageDown\":\n if (!months) next = pick.value + 12;\n break;\n }\n if (next === null) return;\n e.preventDefault();\n next = Math.max(lo, Math.min(hi, next));\n pick.value = next;\n focusId(`${uid.value}-${months ? \"m\" : \"y\"}-${next}`);\n}\n\nfunction onRootKey(e: KeyboardEvent) {\n if (e.key !== \"Escape\" \|\| view.value === \"days\") return;\n e.preventDefault();\n e.stopPropagation();\n backToDays();\n}\n\nfunction goToday() {\n const tc = clamp(today);\n focus.value = tc;\n focusId(dayId(tc));\n if (!range.value && !off(today)) pickDay(today);\n}\n\nconst shortDate = (d: Date) => `${loc.monthsShort.value[d.getMonth()]} ${d.getDate()}`;\nconst help = computed(() => {\n if (!range.value \|\| view.value !== \"days\") return \"\";\n if (!start.value) return t(\"rangeStart\");\n if (!end.value) return t(\"rangeEnd\", { start: shortDate(start.value) });\n return t(\"rangeDone\", {\n start: shortDate(start.value),\n end: shortDate(end.value),\n days: Math.round(compareDays(end.value, start.value) / 864e5) + 1,\n });\n});\n\nconst picking = computed(() => view.value !== \"days\");\nconst prevOff = computed(() => !!props.min && compareDays(new Date(cy.value, cm.value, 0, 12), props.min) < 0);\nconst nextOff = computed(() => !!props.max && compareDays(new Date(cy.value, cm.value + 1, 1, 12), props.max) > 0);\nconst nowYear = today.getFullYear();\nconst nowMonth = today.getMonth();\n\ndefineExpose({\n view,\n focusDay: () => focusId(dayId(focus.value)),\n});\n</script>\n\n<template>\n <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n <div ref=\"root\" class=\"e-cal\" :dir=\"config.dir ?? undefined\" @keydown=\"onRootKey\">\n <div class=\"e-cal-head\">\n <EIconButton\n v-if=\"picking\"\n icon=\"chevron-left\"\n :label=\"t(view === 'months' ? 'backToYears' : 'backToDays')\"\n @click=\"back\"\n />\n <EIconButton v-else icon=\"chevron-left\" :label=\"t('prevMonth')\" :disabled=\"prevOff\" @click=\"step(-1)\" />\n <div class=\"e-cal-title\" aria-live=\"polite\">\n <span v-if=\"picking\" class=\"e-cal-range\">{{\n t(view === \"months\" ? \"chooseAMonth\" : \"chooseAYear\", { year: cy })\n }}</span>\n <button\n v-else\n type=\"button\"\n class=\"e-cal-pick\"\n aria-expanded=\"false\"\n :aria-label=\"t('chooseDateNow', { month: loc.months.value[cm] ?? '', year: cy })\"\n @click=\"openView('years')\"\n >\n {{ loc.months.value[cm] }} {{ cy }}\n <EIcon name=\"chevron-down\" small />\n </button>\n </div>\n <span v-if=\"picking\" class=\"e-cal-gap\" />\n <EIconButton v-else icon=\"chevron-right\" :label=\"t('nextMonth')\" :disabled=\"nextOff\" @click=\"step(1)\" />\n </div>\n\n <!-- eslint-disable-next-line vuejs-accessibility/interactive-supports-focus -- the day buttons carry the roving tabindex -->\n <table\n v-if=\"view === 'days'\"\n class=\"e-cal-grid\"\n role=\"grid\"\n :aria-label=\"`${loc.months.value[cm]} ${cy}`\"\n @keydown=\"onDayKey\"\n >\n <thead>\n <tr>\n <th v-for=\"ix in columns\" :key=\"ix\" scope=\"col\" :abbr=\"loc.weekdays.value[ix]\">\n {{ loc.weekdaysShort.value[ix] }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr v-for=\"(row, w) in weeks\" :key=\"w\">\n <td\n v-for=\"d in row\"\n :key=\"dayKey(d)\"\n role=\"gridcell\"\n :aria-selected=\"isSelected(d) \|\| inRange(d) ? 'true' : 'false'\"\n :class=\"inRange(d) && 'e-cal-in'\"\n >\n <button\n :id=\"dayId(d)\"\n type=\"button\"\n class=\"e-day\"\n :class=\"[\n d.getMonth() !== cm && 'e-day--out',\n sameDay(d, today) && 'e-day--today',\n isSelected(d) && 'e-day--sel',\n !off(d) && isMarked(d) && 'e-day--mark',\n ]\"\n :tabindex=\"sameDay(d, focus) ? 0 : -1\"\n :disabled=\"off(d)\"\n :aria-label=\"dayLabel(d, !off(d) && isMarked(d))\"\n @click=\"clickDay(d)\"\n @mouseenter=\"range && start && !end && (hover = d)\"\n @focus=\"range && start && !end && (hover = d)\"\n >\n {{ d.getDate() }}\n </button>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n <div\n v-else-if=\"view === 'months'\"\n class=\"e-cal-cells\"\n role=\"group\"\n :aria-label=\"t('monthsOf', { year: cy })\"\n @keydown=\"onPickKey\"\n >\n <button\n v-for=\"(name, m) in loc.months.value\"\n :id=\"`${uid}-m-${m}`\"\n :key=\"m\"\n type=\"button\"\n class=\"e-cal-cell\"\n :class=\"[m === cm && 'e-day--sel', cy === nowYear && m === nowMonth && 'e-day--today']\"\n :tabindex=\"m === pick ? 0 : -1\"\n :disabled=\"monthOff(cy, m)\"\n :aria-pressed=\"m === cm ? 'true' : 'false'\"\n :aria-current=\"cy === nowYear && m === nowMonth ? 'date' : undefined\"\n @click=\"chooseMonth(m)\"\n >\n <span aria-hidden=\"true\">{{ loc.monthsShort.value[m] }}</span>\n <span class=\"e-sr\">{{ name }} {{ cy }}</span>\n </button>\n </div>\n\n <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n <div\n v-else\n class=\"e-cal-cells e-cal-years\"\n role=\"group\"\n :aria-label=\"t('yearsRange', { from: yearLow, to: yearHigh })\"\n @keydown=\"onPickKey\"\n >\n <button\n v-for=\"y in years\"\n :id=\"`${uid}-y-${y}`\"\n :key=\"y\"\n type=\"button\"\n class=\"e-cal-cell\"\n :class=\"[y === cy && 'e-day--sel', y === nowYear && 'e-day--today']\"\n :tabindex=\"y === pick ? 0 : -1\"\n :disabled=\"yearOff(y)\"\n :aria-pressed=\"y === cy ? 'true' : 'false'\"\n :aria-current=\"y === nowYear ? 'date' : undefined\"\n @click=\"chooseYear(y)\"\n >\n {{ y }}\n </button>\n </div>\n\n <p v-if=\"range\" class=\"e-cal-help\" aria-live=\"polite\">{{ help }}</p>\n\n <EActions v-if=\"footer\" class=\"e-cal-foot\" :class=\"view !== 'days' && 'e-cal-foot--idle'\" :inert=\"view !== 'days'\">\n <EButton variant=\"quiet\" @click=\"goToday\">{{ t(\"today\") }}</EButton>\n <EButton v-if=\"hasClear()\" variant=\"quiet\" @click=\"emit('clear')\">{{ t(\"clear\") }}</EButton>\n </EActions>\n </div>\n</template>\n\n<style>\n@layer e.composites {\n .e-cal {\n width: 20.5rem;\n max-width: 100%;\n font-family: var(--e-font-sans);\n }\n\n .e-cal-head {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--e-space-2);\n margin-bottom: var(--e-space-2);\n padding-bottom: var(--e-space-2);\n border-bottom: var(--e-stroke-hair) solid var(--e-border);\n }\n\n .e-cal-title {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--e-space-1);\n flex: 1;\n min-width: 0;\n margin: 0;\n font: 600 var(--e-text-lg) / 1.2 var(--e-font-sans);\n text-align: center;\n }\n\n .e-cal-pick {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n height: var(--e-control-height);\n padding: 0 var(--e-space-2);\n border: var(--e-stroke-edge) solid transparent;\n border-radius: var(--e-radius-md);\n background: transparent;\n color: var(--e-ink);\n font: 600 var(--e-text-lg) / 1 var(--e-font-sans);\n cursor: pointer;\n transition: background-color var(--e-duration-tap) var(--e-easing-out);\n }\n\n .e-cal-pick:hover {\n background: var(--e-surface-tint);\n border-color: var(--e-border-strong);\n }\n\n .e-cal-pick:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: 1px;\n }\n\n .e-cal-pick .e-icon {\n transition: transform var(--e-duration-tap) var(--e-easing-out);\n }\n\n .e-cal-pick[aria-expanded=\"true\"] .e-icon {\n transform: rotate(180deg);\n }\n\n .e-cal-range {\n font: 600 var(--e-text-lg) / 1.2 var(--e-font-sans);\n font-variant-numeric: tabular-nums;\n }\n\n .e-cal-gap {\n display: block;\n width: 44px;\n height: 44px;\n }\n\n .e-cal-head .e-icon-btn:disabled {\n color: var(--e-muted);\n cursor: not-allowed;\n }\n\n .e-cal-head .e-icon-btn:disabled:hover {\n background: transparent;\n box-shadow: none;\n }\n\n .e-cal-grid {\n width: 100%;\n height: 312px;\n border-collapse: collapse;\n table-layout: fixed;\n }\n\n .e-cal-grid th {\n height: 32px;\n font: 600 var(--e-text-sm) / 1 var(--e-font-sans);\n color: var(--e-muted);\n text-align: center;\n }\n\n .e-cal-grid td {\n padding: 1px 3px;\n text-align: center;\n }\n\n .e-cal-in {\n background: var(--e-surface-tint);\n }\n\n .e-day {\n position: relative;\n width: 100%;\n height: 44px;\n padding: 0;\n border: var(--e-stroke-edge) solid transparent;\n border-radius: var(--e-radius-md);\n background: transparent;\n color: var(--e-ink);\n font: 500 var(--e-text-sm) / 1 var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n cursor: pointer;\n transition: background-color var(--e-duration-tap) var(--e-easing-out);\n }\n\n /* stylelint-disable-next-line selector-not-notation -- the selector stays in this form /\n .e-day:hover:not(:disabled):not(.e-day--sel) {\n background: var(--e-surface-tint);\n border-color: var(--e-border-strong);\n }\n\n .e-day:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n }\n\n .e-day--out {\n color: var(--e-muted);\n font-weight: 400;\n }\n\n .e-day--today {\n box-shadow: inset 0 0 0 1.5px var(--e-ink);\n }\n\n .e-day--sel {\n background: var(--e-primary);\n border-color: var(--e-primary);\n font-weight: 700;\n color: var(--e-on-primary);\n }\n\n .e-day:disabled {\n color: var(--e-border-strong);\n font-weight: 400;\n cursor: not-allowed;\n opacity: 1;\n }\n\n .e-day--mark::after {\n content: \"\";\n position: absolute;\n inset-inline-start: 50%;\n bottom: 5px;\n width: 5px;\n height: 5px;\n margin-inline-start: -2.5px;\n border-radius: 50%;\n background: var(--e-primary);\n }\n\n .e-day--sel.e-day--mark::after {\n background: var(--e-on-primary);\n }\n\n .e-cal-cells {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n grid-auto-rows: 1fr;\n gap: 6px;\n height: 312px;\n padding-top: 4px;\n }\n\n .e-cal-years {\n overflow-y: auto;\n grid-auto-rows: 44px;\n padding-inline-end: 2px;\n align-content: start;\n }\n\n .e-cal-cell {\n width: 100%;\n height: 100%;\n min-height: 44px;\n padding: 0;\n border: var(--e-stroke-edge) solid transparent;\n border-radius: var(--e-radius-md);\n background: transparent;\n color: var(--e-ink);\n font: 500 var(--e-text-md) / 1 var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n cursor: pointer;\n transition: background-color var(--e-duration-tap) var(--e-easing-out);\n }\n\n .e-cal-years .e-cal-cell {\n height: 44px;\n }\n\n /* stylelint-disable-next-line selector-not-notation -- the selector stays in this form /\n .e-cal-cell:hover:not(:disabled):not(.e-day--sel) {\n background: var(--e-surface-tint);\n border-color: var(--e-border-strong);\n }\n\n .e-cal-cell:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n }\n\n .e-cal-cell:disabled {\n color: var(--e-border-strong);\n font-weight: 400;\n cursor: not-allowed;\n }\n\n .e-cal-cell.e-day--sel {\n background: var(--e-primary);\n border-color: var(--e-primary);\n font-weight: 700;\n color: var(--e-on-primary);\n }\n\n .e-cal-help {\n min-height: calc(var(--e-text-sm) * 1.4);\n margin: var(--e-space-2) 0 0;\n font: 500 var(--e-text-sm) / 1.4 var(--e-font-sans);\n color: var(--e-muted);\n text-align: center;\n }\n\n .e-cal-foot {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: var(--e-space-2);\n margin-top: var(--e-space-2);\n padding-top: var(--e-space-2);\n border-top: var(--e-stroke-hair) solid var(--e-border);\n }\n\n .e-cal-foot--idle {\n visibility: hidden;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .e-day,\n .e-cal-pick,\n .e-cal-cell,\n .e-cal-pick .e-icon {\n transition: none;\n }\n }\n\n @media (forced-colors: active) {\n .e-day--sel,\n .e-cal-cell.e-day--sel {\n forced-color-adjust: none;\n background: Highlight;\n color: HighlightText;\n }\n\n .e-day--mark::after {\n background: CanvasText;\n }\n\n .e-day--sel.e-day--mark::after {\n background: HighlightText;\n }\n }\n}\n</style>\n"],"mappings":"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"}
1	+ {"version":3,"file":"ECalendar.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createElementBlock","_unref","_createElementVNode","_createBlock","EIconButton","_toDisplayString","_createTextVNode","_createVNode","EIcon","_Fragment","_renderList","_normalizeClass","_createCommentVNode","EActions","_withCtx","EButton","EActions_default","EIcon_default","EButton_default","EIconButton_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","_hoisted_15","_hoisted_16","_hoisted_17","ECalendar_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","\"start\"","\"startModifiers\"","\"end\"","\"endModifiers\"","__expose","__emit","props","__props","emit","value","useModel","start","end","t","useMessages","config","useConfig","loc","useLocale","uid","useUid","root","ref","range","computed","instance","getCurrentInstance","hasClear","today","startOfDay","focus","hover","view","pick","cy","cm","yearLow","yearHigh","years","i","off","compareDays","d","isMarked","m","sameDay","x","monthOff","y","yearOff","clamp","settle","addDays","step","withMonthYear","last","want","focusWanted","nextTick","el","focusId","id","dayId","dayKey","watch","chosen","weeks","first","from","w","columns","k","rangeEnd","isSelected","inRange","dayLabel","marked","pickDay","s","clickDay","openView","v","backToDays","back","chooseMonth","nd","chooseYear","addMonths","n","sign","onDayKey","f","dow","next","walk","target","onPickKey","months","lo","hi","onRootKey","goToday","tc","shortDate","help","picking","prevOff","nextOff","nowYear","nowMonth","openBlock","createElementBlock","unref","createElementVNode","createBlock","_cache","toDisplayString","createTextVNode","createVNode","Fragment","renderList","ix","row","normalizeClass","name","createCommentVNode","withCtx"],"sources":["../../../src/components/Calendar/ECalendar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, getCurrentInstance, nextTick, ref, watch } from \"vue\";\nimport EActions from \"../Actions/EActions.vue\";\nimport EButton from \"../Button/EButton.vue\";\nimport EIcon from \"../Icon/EIcon.vue\";\nimport EIconButton from \"../IconButton/EIconButton.vue\";\nimport { useConfig, useMessages } from \"../../config.js\";\nimport { useLocale } from \"../../composables/useLocale.js\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport { addDays, addMonths, compareDays, dayKey, sameDay, startOfDay } from \"./dates.js\";\nimport \"../../styles/base.css\";\n\nexport interface CalendarRange {\n start: Date \| null;\n end: Date \| null;\n}\n\nconst props = withDefaults(\n defineProps<{\n /** `single` chooses one day (`v-model`); `range` chooses a span (`v-model:start` and `v-model:end`): the first click sets the start, the second the end, and a click before the start restarts. /\n mode?: \"single\" \| \"range\";\n /* Days that cannot be chosen or focused, such as days with nothing to book. Arrow keys skip them. /\n disabledDate?: (date: Date) => boolean;\n /* Days that get a dot: a list of dates or a function. Screen readers hear `markLabel`. /\n marked?: Date[] \| ((date: Date) => boolean);\n /* What screen readers hear on a marked day. @default times available /\n markLabel?: string;\n /* The earliest day that can be chosen. Earlier days cannot be focused or chosen; navigation stops there. /\n min?: Date;\n /* The latest day that can be chosen. Later days cannot be focused or chosen; navigation stops there. /\n max?: Date;\n /* The month to open on, when nothing is chosen. Changing it moves the view. /\n month?: Date;\n /* `false` hides the Today and Clear buttons. /\n footer?: boolean;\n /* Forces the Clear button on or off. Left out, it shows when a `@clear` listener is attached. /\n clearable?: boolean;\n }>(),\n { mode: \"single\", footer: true, clearable: undefined },\n);\n\nconst emit = defineEmits<{\n /* In range mode, after every click that changes the span. /\n rangeChange: [range: CalendarRange];\n /* The Clear button. It is only shown when a `@clear` listener is attached. /\n clear: [];\n}>();\n\n/* The chosen day (`single` mode). /\nconst value = defineModel<Date \| null>({ default: null });\n/* The first day of the span (`range` mode). /\nconst start = defineModel<Date \| null>(\"start\", { default: null });\n/* The last day of the span (`range` mode). /\nconst end = defineModel<Date \| null>(\"end\", { default: null });\n\ntype View = \"days\" \| \"months\" \| \"years\";\n\nconst t = useMessages();\nconst config = useConfig();\nconst loc = useLocale();\nconst uid = useUid();\nconst root = ref<HTMLElement \| null>(null);\nconst range = computed(() => props.mode === \"range\");\nconst instance = getCurrentInstance();\nconst hasClear = () => props.clearable ?? !!instance?.vnode.props?.onClear;\n\nconst today = startOfDay(new Date());\nconst focus = ref(startOfDay((range.value ? start.value : value.value) \|\| props.month \|\| new Date()));\nconst hover = ref<Date \| null>(null);\nconst view = ref<View>(\"days\");\nconst pick = ref(0);\n\nconst cy = computed(() => focus.value.getFullYear());\nconst cm = computed(() => focus.value.getMonth());\nconst yearLow = computed(() => Math.min(cy.value, props.min ? props.min.getFullYear() : today.getFullYear() - 120));\nconst yearHigh = computed(() => Math.max(cy.value, props.max ? props.max.getFullYear() : today.getFullYear() + 20));\nconst years = computed(() => Array.from({ length: yearHigh.value - yearLow.value + 1 }, (_, i) => yearLow.value + i));\n\nfunction off(d: Date): boolean {\n return (\n (!!props.min && compareDays(d, props.min) < 0) \|\|\n (!!props.max && compareDays(d, props.max) > 0) \|\|\n !!props.disabledDate?.(d)\n );\n}\nfunction isMarked(d: Date): boolean {\n const m = props.marked;\n if (!m) return false;\n return typeof m === \"function\" ? !!m(d) : m.some((x) => sameDay(x, d));\n}\nfunction monthOff(y: number, m: number): boolean {\n return (\n (!!props.min && compareDays(new Date(y, m + 1, 0, 12), props.min) < 0) \|\|\n (!!props.max && compareDays(new Date(y, m, 1, 12), props.max) > 0)\n );\n}\nconst yearOff = (y: number) =>\n (!!props.min && y < props.min.getFullYear()) \|\| (!!props.max && y > props.max.getFullYear());\nfunction clamp(d: Date): Date {\n if (props.min && compareDays(d, props.min) < 0) return startOfDay(props.min);\n if (props.max && compareDays(d, props.max) > 0) return startOfDay(props.max);\n return d;\n}\nfunction settle(d: Date, step: number): Date \| null {\n let n = d;\n for (let i = 0; i < 400 && off(n); i++) n = addDays(n, step);\n return off(n) ? null : n;\n}\nfunction withMonthYear(y: number, m: number): Date {\n const last = new Date(y, m + 1, 0, 12).getDate();\n return clamp(new Date(y, m, Math.min(focus.value.getDate(), last), 12));\n}\n\nif (off(focus.value)) focus.value = settle(focus.value, 1) ?? settle(focus.value, -1) ?? focus.value;\n\nlet want: string \| null = null;\nasync function focusWanted() {\n await nextTick();\n if (!want) return;\n const el = root.value?.querySelector<HTMLElement>(`[id=\"${want}\"]`);\n if (!el) return;\n el.focus();\n if (want.includes(\"-y-\")) el.scrollIntoView?.({ block: \"center\" });\n want = null;\n}\nfunction focusId(id: string) {\n want = id;\n void focusWanted();\n}\nconst dayId = (d: Date) => `${uid.value}-${dayKey(d)}`;\n\nwatch(\n () => props.month?.getTime(),\n () => {\n if (props.month) focus.value = clamp(startOfDay(props.month));\n },\n);\nwatch(\n () => (range.value ? start.value : value.value)?.getTime(),\n () => {\n const chosen = range.value ? start.value : value.value;\n if (chosen && !sameDay(chosen, focus.value)) focus.value = startOfDay(chosen);\n },\n);\n\nconst weeks = computed(() => {\n const first = new Date(cy.value, cm.value, 1, 12);\n const from = addDays(first, -((first.getDay() - loc.weekStart.value + 7) % 7));\n return Array.from({ length: 6 }, (_, w) => Array.from({ length: 7 }, (_, i) => addDays(from, w 7 + i)));\n});\nconst columns = computed(() => Array.from({ length: 7 }, (_, k) => (loc.weekStart.value + k) % 7));\nconst rangeEnd = computed(() => {\n if (!range.value) return null;\n return end.value \|\| (start.value && hover.value && compareDays(hover.value, start.value) >= 0 ? hover.value : null);\n});\n\nfunction isSelected(d: Date): boolean {\n return range.value ? sameDay(d, start.value) \|\| sameDay(d, end.value) : sameDay(d, value.value);\n}\nfunction inRange(d: Date): boolean {\n return !!(\n range.value &&\n start.value &&\n rangeEnd.value &&\n compareDays(d, start.value) > 0 &&\n compareDays(d, rangeEnd.value) < 0\n );\n}\nfunction dayLabel(d: Date, marked: boolean): string {\n return (\n loc.formatLong(d) +\n (sameDay(d, today) ? \", \" + t(\"todaySuffix\") : \"\") +\n (marked ? \", \" + (props.markLabel \|\| t(\"timesAvailable\")) : \"\")\n );\n}\n\nfunction pickDay(d: Date) {\n if (off(d)) return;\n if (!range.value) {\n value.value = d;\n return;\n }\n const s = start.value;\n if (!s \|\| end.value \|\| compareDays(d, s) < 0) {\n start.value = d;\n end.value = null;\n emit(\"rangeChange\", { start: d, end: null });\n } else {\n end.value = d;\n emit(\"rangeChange\", { start: s, end: d });\n }\n}\nfunction clickDay(d: Date) {\n focus.value = d;\n focusId(dayId(d));\n pickDay(d);\n}\n\nfunction openView(v: \"months\" \| \"years\") {\n view.value = v;\n if (v === \"months\") {\n pick.value = cm.value;\n focusId(`${uid.value}-m-${cm.value}`);\n } else {\n pick.value = cy.value;\n focusId(`${uid.value}-y-${cy.value}`);\n }\n}\nfunction backToDays() {\n view.value = \"days\";\n focusId(dayId(focus.value));\n}\nfunction back() {\n if (view.value === \"months\") openView(\"years\");\n else backToDays();\n}\nfunction chooseMonth(m: number) {\n if (monthOff(cy.value, m)) return;\n const nd = withMonthYear(cy.value, m);\n focus.value = nd;\n view.value = \"days\";\n focusId(dayId(nd));\n}\nfunction chooseYear(y: number) {\n if (yearOff(y)) return;\n const nd = withMonthYear(y, cm.value);\n focus.value = nd;\n view.value = \"months\";\n pick.value = nd.getMonth();\n focusId(`${uid.value}-m-${nd.getMonth()}`);\n}\nfunction step(n: number) {\n focus.value = clamp(addMonths(focus.value, n));\n}\n\nfunction sign(): number {\n if (config.dir) return config.dir === \"rtl\" ? -1 : 1;\n return root.value && getComputedStyle(root.value).direction === \"rtl\" ? -1 : 1;\n}\n\nfunction onDayKey(e: KeyboardEvent) {\n const f = focus.value;\n const dow = (f.getDay() - loc.weekStart.value + 7) % 7;\n const s = sign();\n let next: Date;\n let walk: number;\n switch (e.key) {\n case \"ArrowLeft\":\n walk = -s;\n next = addDays(f, walk);\n break;\n case \"ArrowRight\":\n walk = s;\n next = addDays(f, walk);\n break;\n case \"ArrowUp\":\n walk = -7;\n next = addDays(f, walk);\n break;\n case \"ArrowDown\":\n walk = 7;\n next = addDays(f, walk);\n break;\n case \"Home\":\n walk = 1;\n next = addDays(f, -dow);\n break;\n case \"End\":\n walk = -1;\n next = addDays(f, 6 - dow);\n break;\n case \"PageUp\":\n walk = -1;\n next = addMonths(f, e.shiftKey ? -12 : -1);\n break;\n case \"PageDown\":\n walk = 1;\n next = addMonths(f, e.shiftKey ? 12 : 1);\n break;\n default:\n return;\n }\n e.preventDefault();\n const target = settle(next, walk);\n if (!target) return;\n focus.value = target;\n focusId(dayId(target));\n if (range.value && start.value && !end.value) hover.value = target;\n}\n\nfunction onPickKey(e: KeyboardEvent) {\n const months = view.value === \"months\";\n const lo = months ? 0 : yearLow.value;\n const hi = months ? 11 : yearHigh.value;\n const s = sign();\n let next: number \| null = null;\n switch (e.key) {\n case \"ArrowLeft\":\n next = pick.value - s;\n break;\n case \"ArrowRight\":\n next = pick.value + s;\n break;\n case \"ArrowUp\":\n next = pick.value - 3;\n break;\n case \"ArrowDown\":\n next = pick.value + 3;\n break;\n case \"Home\":\n next = lo;\n break;\n case \"End\":\n next = hi;\n break;\n case \"PageUp\":\n if (!months) next = pick.value - 12;\n break;\n case \"PageDown\":\n if (!months) next = pick.value + 12;\n break;\n }\n if (next === null) return;\n e.preventDefault();\n next = Math.max(lo, Math.min(hi, next));\n pick.value = next;\n focusId(`${uid.value}-${months ? \"m\" : \"y\"}-${next}`);\n}\n\nfunction onRootKey(e: KeyboardEvent) {\n if (e.key !== \"Escape\" \|\| view.value === \"days\") return;\n e.preventDefault();\n e.stopPropagation();\n backToDays();\n}\n\nfunction goToday() {\n const tc = clamp(today);\n focus.value = tc;\n focusId(dayId(tc));\n if (!range.value && !off(today)) pickDay(today);\n}\n\nconst shortDate = (d: Date) => `${loc.monthsShort.value[d.getMonth()]} ${d.getDate()}`;\nconst help = computed(() => {\n if (!range.value \|\| view.value !== \"days\") return \"\";\n if (!start.value) return t(\"rangeStart\");\n if (!end.value) return t(\"rangeEnd\", { start: shortDate(start.value) });\n return t(\"rangeDone\", {\n start: shortDate(start.value),\n end: shortDate(end.value),\n days: Math.round(compareDays(end.value, start.value) / 864e5) + 1,\n });\n});\n\nconst picking = computed(() => view.value !== \"days\");\nconst prevOff = computed(() => !!props.min && compareDays(new Date(cy.value, cm.value, 0, 12), props.min) < 0);\nconst nextOff = computed(() => !!props.max && compareDays(new Date(cy.value, cm.value + 1, 1, 12), props.max) > 0);\nconst nowYear = today.getFullYear();\nconst nowMonth = today.getMonth();\n\ndefineExpose({\n view,\n focusDay: () => focusId(dayId(focus.value)),\n});\n</script>\n\n<template>\n <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n <div ref=\"root\" class=\"e-cal\" :dir=\"config.dir ?? undefined\" @keydown=\"onRootKey\">\n <div class=\"e-cal-head\">\n <EIconButton\n v-if=\"picking\"\n icon=\"chevron-left\"\n :label=\"t(view === 'months' ? 'backToYears' : 'backToDays')\"\n @click=\"back\"\n />\n <EIconButton v-else icon=\"chevron-left\" :label=\"t('prevMonth')\" :disabled=\"prevOff\" @click=\"step(-1)\" />\n <div class=\"e-cal-title\" aria-live=\"polite\">\n <span v-if=\"picking\" class=\"e-cal-range\">{{\n t(view === \"months\" ? \"chooseAMonth\" : \"chooseAYear\", { year: cy })\n }}</span>\n <button\n v-else\n type=\"button\"\n class=\"e-cal-pick\"\n aria-expanded=\"false\"\n :aria-label=\"t('chooseDateNow', { month: loc.months.value[cm] ?? '', year: cy })\"\n @click=\"openView('years')\"\n >\n {{ loc.months.value[cm] }} {{ cy }}\n <EIcon name=\"chevron-down\" small />\n </button>\n </div>\n <span v-if=\"picking\" class=\"e-cal-gap\" />\n <EIconButton v-else icon=\"chevron-right\" :label=\"t('nextMonth')\" :disabled=\"nextOff\" @click=\"step(1)\" />\n </div>\n\n <!-- eslint-disable-next-line vuejs-accessibility/interactive-supports-focus -- the day buttons carry the roving tabindex -->\n <table\n v-if=\"view === 'days'\"\n class=\"e-cal-grid\"\n role=\"grid\"\n :aria-label=\"`${loc.months.value[cm]} ${cy}`\"\n @keydown=\"onDayKey\"\n >\n <thead>\n <tr>\n <th v-for=\"ix in columns\" :key=\"ix\" scope=\"col\" :abbr=\"loc.weekdays.value[ix]\">\n {{ loc.weekdaysShort.value[ix] }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr v-for=\"(row, w) in weeks\" :key=\"w\">\n <td\n v-for=\"d in row\"\n :key=\"dayKey(d)\"\n role=\"gridcell\"\n :aria-selected=\"isSelected(d) \|\| inRange(d) ? 'true' : 'false'\"\n :class=\"inRange(d) && 'e-cal-in'\"\n >\n <button\n :id=\"dayId(d)\"\n type=\"button\"\n class=\"e-day\"\n :class=\"[\n d.getMonth() !== cm && 'e-day--out',\n sameDay(d, today) && 'e-day--today',\n isSelected(d) && 'e-day--sel',\n !off(d) && isMarked(d) && 'e-day--mark',\n ]\"\n :tabindex=\"sameDay(d, focus) ? 0 : -1\"\n :disabled=\"off(d)\"\n :aria-label=\"dayLabel(d, !off(d) && isMarked(d))\"\n @click=\"clickDay(d)\"\n @mouseenter=\"range && start && !end && (hover = d)\"\n @focus=\"range && start && !end && (hover = d)\"\n >\n {{ d.getDate() }}\n </button>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n <div\n v-else-if=\"view === 'months'\"\n class=\"e-cal-cells\"\n role=\"group\"\n :aria-label=\"t('monthsOf', { year: cy })\"\n @keydown=\"onPickKey\"\n >\n <button\n v-for=\"(name, m) in loc.months.value\"\n :id=\"`${uid}-m-${m}`\"\n :key=\"m\"\n type=\"button\"\n class=\"e-cal-cell\"\n :class=\"[m === cm && 'e-day--sel', cy === nowYear && m === nowMonth && 'e-day--today']\"\n :tabindex=\"m === pick ? 0 : -1\"\n :disabled=\"monthOff(cy, m)\"\n :aria-pressed=\"m === cm ? 'true' : 'false'\"\n :aria-current=\"cy === nowYear && m === nowMonth ? 'date' : undefined\"\n @click=\"chooseMonth(m)\"\n >\n <span aria-hidden=\"true\">{{ loc.monthsShort.value[m] }}</span>\n <span class=\"e-sr\">{{ name }} {{ cy }}</span>\n </button>\n </div>\n\n <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n <div\n v-else\n class=\"e-cal-cells e-cal-years\"\n role=\"group\"\n :aria-label=\"t('yearsRange', { from: yearLow, to: yearHigh })\"\n @keydown=\"onPickKey\"\n >\n <button\n v-for=\"y in years\"\n :id=\"`${uid}-y-${y}`\"\n :key=\"y\"\n type=\"button\"\n class=\"e-cal-cell\"\n :class=\"[y === cy && 'e-day--sel', y === nowYear && 'e-day--today']\"\n :tabindex=\"y === pick ? 0 : -1\"\n :disabled=\"yearOff(y)\"\n :aria-pressed=\"y === cy ? 'true' : 'false'\"\n :aria-current=\"y === nowYear ? 'date' : undefined\"\n @click=\"chooseYear(y)\"\n >\n {{ y }}\n </button>\n </div>\n\n <p v-if=\"range\" class=\"e-cal-help\" aria-live=\"polite\">{{ help }}</p>\n\n <EActions v-if=\"footer\" class=\"e-cal-foot\" :class=\"view !== 'days' && 'e-cal-foot--idle'\" :inert=\"view !== 'days'\">\n <EButton variant=\"quiet\" @click=\"goToday\">{{ t(\"today\") }}</EButton>\n <EButton v-if=\"hasClear()\" variant=\"quiet\" @click=\"emit('clear')\">{{ t(\"clear\") }}</EButton>\n </EActions>\n </div>\n</template>\n\n<style>\n@layer e.composites {\n .e-cal {\n width: 20.5rem;\n max-width: 100%;\n font-family: var(--e-font-sans);\n }\n\n .e-cal-head {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--e-space-2);\n margin-bottom: var(--e-space-2);\n padding-bottom: var(--e-space-2);\n border-bottom: var(--e-stroke-hair) solid var(--e-border);\n }\n\n .e-cal-title {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--e-space-1);\n flex: 1;\n min-width: 0;\n margin: 0;\n font: 600 var(--e-text-lg) / 1.2 var(--e-font-sans);\n text-align: center;\n }\n\n .e-cal-pick {\n display: inline-flex;\n align-items: center;\n gap: var(--e-space-1);\n height: var(--e-control-height);\n padding: 0 var(--e-space-2);\n border: var(--e-stroke-edge) solid transparent;\n\n --e-bc: transparent;\n\n outline: var(--e-stroke-edge) solid var(--e-bc);\n outline-offset: calc(-1 * var(--e-stroke-edge));\n border-radius: var(--e-radius-md);\n background: transparent;\n color: var(--e-ink);\n font: 600 var(--e-text-lg) / 1 var(--e-font-sans);\n cursor: pointer;\n transition: background-color var(--e-duration-tap) var(--e-easing-out);\n }\n\n .e-cal-pick:hover {\n background: var(--e-surface-hover);\n border-color: var(--e-border-strong);\n\n --e-bc: var(--e-border-strong);\n }\n\n .e-cal-pick:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: var(--e-focus-gap);\n }\n\n .e-cal-pick .e-icon {\n transition: transform var(--e-duration-tap) var(--e-easing-out);\n }\n\n .e-cal-pick[aria-expanded=\"true\"] .e-icon {\n transform: rotate(180deg);\n }\n\n .e-cal-range {\n font: 600 var(--e-text-lg) / 1.2 var(--e-font-sans);\n font-variant-numeric: tabular-nums;\n }\n\n .e-cal-gap {\n display: block;\n width: var(--e-tap);\n height: var(--e-tap);\n }\n\n .e-cal-head .e-icon-btn:disabled {\n color: var(--e-muted);\n cursor: not-allowed;\n }\n\n .e-cal-head .e-icon-btn:disabled:hover {\n background: transparent;\n box-shadow: none;\n }\n\n .e-cal-grid {\n width: 100%;\n height: calc(6 * var(--e-tap) + var(--e-space-8) + var(--e-space-4));\n border-collapse: collapse;\n table-layout: fixed;\n }\n\n .e-cal-grid th {\n height: var(--e-space-8);\n font: 600 var(--e-text-sm) / 1 var(--e-font-sans);\n color: var(--e-muted);\n text-align: center;\n }\n\n .e-cal-grid td {\n padding: 1px 3px;\n text-align: center;\n }\n\n .e-cal-in {\n background: color-mix(in srgb, var(--e-primary) 12%, var(--e-surface));\n }\n\n .e-day {\n position: relative;\n width: 100%;\n height: var(--e-tap);\n padding: 0;\n border: var(--e-stroke-edge) solid transparent;\n\n --e-bc: transparent;\n\n outline: var(--e-stroke-edge) solid var(--e-bc);\n outline-offset: calc(-1 * var(--e-stroke-edge));\n border-radius: var(--e-radius-md);\n background: transparent;\n color: var(--e-ink);\n font: 500 var(--e-text-sm) / 1 var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n cursor: pointer;\n transition: background-color var(--e-duration-tap) var(--e-easing-out);\n }\n\n /* stylelint-disable-next-line selector-not-notation -- the selector stays in this form /\n .e-day:hover:not(:disabled):not(.e-day--sel) {\n background: var(--e-surface-hover);\n border-color: var(--e-border-strong);\n\n --e-bc: var(--e-border-strong);\n }\n\n .e-day:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n }\n\n .e-day--out {\n color: var(--e-muted);\n font-weight: 400;\n }\n\n .e-day--today {\n box-shadow: inset 0 0 0 var(--e-stroke-edge) var(--e-primary);\n }\n\n .e-day--sel {\n background: var(--e-primary);\n border-color: var(--e-primary);\n\n --e-bc: var(--e-primary);\n\n font-weight: 700;\n color: var(--e-on-primary);\n }\n\n .e-day:disabled {\n color: var(--e-border-strong);\n font-weight: 400;\n cursor: not-allowed;\n opacity: 1;\n }\n\n .e-day--mark::after {\n content: \"\";\n position: absolute;\n inset-inline-start: 50%;\n bottom: 5px;\n width: 5px;\n height: 5px;\n margin-inline-start: -2.5px;\n border-radius: 50%;\n background: var(--e-primary);\n }\n\n .e-day--sel.e-day--mark::after {\n background: var(--e-on-primary);\n }\n\n .e-cal-cells {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n grid-auto-rows: 1fr;\n gap: 6px;\n height: calc(6 * var(--e-tap) + var(--e-space-8) + var(--e-space-4));\n padding-top: var(--e-space-1);\n }\n\n .e-cal-years {\n overflow-y: auto;\n grid-auto-rows: var(--e-tap);\n padding-inline-end: 2px;\n align-content: start;\n }\n\n .e-cal-cell {\n width: 100%;\n height: 100%;\n min-height: var(--e-tap);\n padding: 0;\n border: var(--e-stroke-edge) solid transparent;\n\n --e-bc: transparent;\n\n outline: var(--e-stroke-edge) solid var(--e-bc);\n outline-offset: calc(-1 * var(--e-stroke-edge));\n border-radius: var(--e-radius-md);\n background: transparent;\n color: var(--e-ink);\n font: 500 var(--e-text-md) / 1 var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n cursor: pointer;\n transition: background-color var(--e-duration-tap) var(--e-easing-out);\n }\n\n .e-cal-years .e-cal-cell {\n height: var(--e-tap);\n }\n\n /* stylelint-disable-next-line selector-not-notation -- the selector stays in this form /\n .e-cal-cell:hover:not(:disabled):not(.e-day--sel) {\n background: var(--e-surface-hover);\n border-color: var(--e-border-strong);\n\n --e-bc: var(--e-border-strong);\n }\n\n .e-cal-cell:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n }\n\n .e-cal-cell:disabled {\n color: var(--e-border-strong);\n font-weight: 400;\n cursor: not-allowed;\n }\n\n .e-cal-cell.e-day--sel {\n background: var(--e-primary);\n border-color: var(--e-primary);\n\n --e-bc: var(--e-primary);\n\n font-weight: 700;\n color: var(--e-on-primary);\n }\n\n .e-cal-help {\n min-height: calc(var(--e-text-sm) * 1.4);\n margin: var(--e-space-2) 0 0;\n font: 500 var(--e-text-sm) / 1.4 var(--e-font-sans);\n color: var(--e-muted);\n text-align: center;\n }\n\n .e-cal-foot {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: var(--e-space-2);\n margin-top: var(--e-space-2);\n padding-top: var(--e-space-2);\n border-top: var(--e-stroke-hair) solid var(--e-border);\n }\n\n .e-cal-foot--idle {\n visibility: hidden;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .e-day,\n .e-cal-pick,\n .e-cal-cell,\n .e-cal-pick .e-icon {\n transition: none;\n }\n }\n\n @media (forced-colors: active) {\n .e-day--sel,\n .e-cal-cell.e-day--sel {\n forced-color-adjust: none;\n background: Highlight;\n color: HighlightText;\n }\n\n .e-day--mark::after {\n background: CanvasText;\n }\n\n .e-day--sel.e-day--mark::after {\n background: HighlightText;\n }\n }\n}\n</style>\n"],"mappings":"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"}

package/dist/components/Checkbox/ECheckbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ECheckbox.js","names":["_sfc_main","ECheckbox_vue_vue_type_script_setup_true_lang_default","ECheckbox_default"],"sources":["../../../src/components/Checkbox/ECheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EFieldMessage from \"../Field/EFieldMessage.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\nimport \"./choice.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** What the person agrees to or turns on. /\n label: string;\n /* A line of detail under the label. /\n description?: string;\n /* A mixed state, such as select-all with some rows chosen. /\n indeterminate?: boolean;\n /* Hide the label visually but keep it for screen readers, for a table cell. /\n bare?: boolean;\n disabled?: boolean;\n required?: boolean;\n /* What to fix. Shown under the row, ~~with~~ `aria-invalid`. /\n error?: string;\n /* The name submitted with a form. /\n name?: string;\n /* The value submitted with a form when checked. /\n value?: string;\n /* The id of the input; the label points at it. ~~Generated~~ ~~when~~ ~~left out.~~ */\n id?: string;\n}>();\n\nconst model = defineModel<boolean>({ default: false });\n\nconst id = useUid(() => props.id);\nconst errorId = computed(() => `${id.value}-hint`);\nconst wrapped = computed(() => !!props.error && !props.bare);\nconst input = ref<HTMLInputElement \| null>(null);\nconst attrs = useFieldAttrs();\n\nwatch(\n () => [props.indeterminate, input.value] as const,\n ([mixed, el]) => {\n if (el) el.indeterminate = !!mixed;\n },\n { flush: \"post\", immediate: true },\n);\n\nconst inputBind = () => ({\n id: id.value,\n type: \"checkbox\" as const,\n class: \"e-check\",\n checked: model.value,\n value: props.value,\n required: props.required,\n disabled: props.disabled,\n name: props.name,\n \"aria-invalid\": props.error ? (\"true\" as const) : undefined,\n ...attrs.input(wrapped.value ? errorId.value : undefined),\n});\nconst onChange = (e: Event) => (model.value = (e.target as HTMLInputElement).checked);\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <div v-if=\"wrapped\" class=\"e-choice-wrap\" :class=\"attrs.wrapper().class\" :style=\"attrs.wrapper().style\">\n <label class=\"e-choice\" :class=\"{ 'e-choice--disabled': disabled }\" :for=\"id\">\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n <EFieldMessage :id=\"errorId\" :error=\"error\" />\n </div>\n <label\n v-else\n class=\"e-choice\"\n :class=\"[{ 'e-choice--bare': bare, 'e-choice--disabled': disabled }, attrs.wrapper().class]\"\n :style=\"attrs.wrapper().style\"\n :for=\"id\"\n >\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span v-if=\"bare\" class=\"e-sr\">{{ label }}</span>\n <span v-else class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n</template>\n\n<style>\n@layer e.controls {\n .e-choice--bare {\n min-height: 0;\n padding: 0;\n gap: 0;\n justify-content: center;\n }\n\n .e-choice-wrap {\n display: grid;\n }\n\n .e-choice-wrap > .e-field-error {\n margin-top: -~~6px~~;\n }\n}\n</style>\n"],"mappings":""}
1	+ {"version":3,"file":"ECheckbox.js","names":["_sfc_main","ECheckbox_vue_vue_type_script_setup_true_lang_default","ECheckbox_default"],"sources":["../../../src/components/Checkbox/ECheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EFieldMessage from \"../Field/EFieldMessage.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\nimport \"./choice.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** What the person agrees to or turns on. /\n label: string;\n /* A line of detail under the label. /\n description?: string;\n /* A mixed state, such as select-all with some rows chosen. /\n indeterminate?: boolean;\n /* Hide the label visually but keep it for screen readers, for a table cell. No error text. /\n bare?: boolean;\n /* Disables the checkbox. /\n disabled?: boolean;\n /* The `required` attribute. /\n required?: boolean;\n /* What to fix. Shown under the row; sets `aria-invalid`. /\n error?: string;\n /* The name submitted with a form. /\n name?: string;\n /* The value submitted with a form when checked. /\n value?: string;\n /* The id of the input; the label points at it. @default generated /\n id?: string;\n}>();\n\n/* Whether it is checked. */\nconst model = defineModel<boolean>({ default: false });\n\nconst id = useUid(() => props.id);\nconst errorId = computed(() => `${id.value}-hint`);\nconst wrapped = computed(() => !!props.error && !props.bare);\nconst input = ref<HTMLInputElement \| null>(null);\nconst attrs = useFieldAttrs();\n\nwatch(\n () => [props.indeterminate, input.value] as const,\n ([mixed, el]) => {\n if (el) el.indeterminate = !!mixed;\n },\n { flush: \"post\", immediate: true },\n);\n\nconst inputBind = () => ({\n id: id.value,\n type: \"checkbox\" as const,\n class: \"e-check\",\n checked: model.value,\n value: props.value,\n required: props.required,\n disabled: props.disabled,\n name: props.name,\n \"aria-invalid\": props.error ? (\"true\" as const) : undefined,\n ...attrs.input(wrapped.value ? errorId.value : undefined),\n});\nconst onChange = (e: Event) => (model.value = (e.target as HTMLInputElement).checked);\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <div v-if=\"wrapped\" class=\"e-choice-wrap\" :class=\"attrs.wrapper().class\" :style=\"attrs.wrapper().style\">\n <label class=\"e-choice\" :class=\"{ 'e-choice--disabled': disabled }\" :for=\"id\">\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n <EFieldMessage :id=\"errorId\" :error=\"error\" />\n </div>\n <label\n v-else\n class=\"e-choice\"\n :class=\"[{ 'e-choice--bare': bare, 'e-choice--disabled': disabled }, attrs.wrapper().class]\"\n :style=\"attrs.wrapper().style\"\n :for=\"id\"\n >\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span v-if=\"bare\" class=\"e-sr\">{{ label }}</span>\n <span v-else class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n</template>\n\n<style>\n@layer e.controls {\n .e-choice--bare {\n min-height: 0;\n padding: 0;\n gap: 0;\n justify-content: center;\n }\n\n .e-choice-wrap {\n display: grid;\n }\n\n .e-choice-wrap > .e-field-error {\n margin-top: calc(var(--e-space-1) - var(--e-space-2) - var(--e-focus-gap));\n }\n}\n</style>\n"],"mappings":""}

package/dist/components/Checkbox/ECheckbox.vue.d.ts CHANGED Viewed

@@ -5,20 +5,23 @@ type __VLS_Props = {
     description?: string;
     /** A mixed state, such as select-all with some rows chosen. */
     indeterminate?: boolean;
-    /** Hide the label visually but keep it for screen readers, for a table cell. */
+    /** Hide the label visually but keep it for screen readers, for a table cell. No error text. */
     bare?: boolean;
+    /** Disables the checkbox. */
     disabled?: boolean;
+    /** The `required` attribute. */
     required?: boolean;
-    /** What to fix. Shown under the row, with `aria-invalid`. */
+    /** What to fix. Shown under the row; sets `aria-invalid`. */
     error?: string;
     /** The name submitted with a form. */
     name?: string;
     /** The value submitted with a form when checked. */
     value?: string;
-    /** The id of the input; the label points at it. Generated when left out. */
+    /** The id of the input; the label points at it. @default generated */
     id?: string;
 };
 type __VLS_ModelProps = {
+    /** Whether it is checked. */
     modelValue?: boolean;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;

package/dist/components/Checkbox/ECheckbox.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ECheckbox.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createElementBlock","_normalizeClass","_unref","_normalizeStyle","_createElementVNode","_mergeProps","_createTextVNode","_toDisplayString","_createCommentVNode","_createVNode","EFieldMessage","EFieldMessage_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","ECheckbox_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","__expose","props","__props","model","useModel","id","useUid","errorId","computed","wrapped","input","ref","attrs","useFieldAttrs","mixed","el","inputBind","onChange","openBlock","createElementBlock","normalizeClass","unref","normalizeStyle","createElementVNode","mergeProps","createTextVNode","toDisplayString","createCommentVNode","createVNode"],"sources":["../../../src/components/Checkbox/ECheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EFieldMessage from \"../Field/EFieldMessage.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\nimport \"./choice.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** What the person agrees to or turns on. /\n label: string;\n /* A line of detail under the label. /\n description?: string;\n /* A mixed state, such as select-all with some rows chosen. /\n indeterminate?: boolean;\n /* Hide the label visually but keep it for screen readers, for a table cell. /\n bare?: boolean;\n disabled?: boolean;\n required?: boolean;\n /* What to fix. Shown under the row, ~~with~~ `aria-invalid`. /\n error?: string;\n /* The name submitted with a form. /\n name?: string;\n /* The value submitted with a form when checked. /\n value?: string;\n /* The id of the input; the label points at it. ~~Generated~~ ~~when~~ ~~left out.~~ */\n id?: string;\n}>();\n\nconst model = defineModel<boolean>({ default: false });\n\nconst id = useUid(() => props.id);\nconst errorId = computed(() => `${id.value}-hint`);\nconst wrapped = computed(() => !!props.error && !props.bare);\nconst input = ref<HTMLInputElement \| null>(null);\nconst attrs = useFieldAttrs();\n\nwatch(\n () => [props.indeterminate, input.value] as const,\n ([mixed, el]) => {\n if (el) el.indeterminate = !!mixed;\n },\n { flush: \"post\", immediate: true },\n);\n\nconst inputBind = () => ({\n id: id.value,\n type: \"checkbox\" as const,\n class: \"e-check\",\n checked: model.value,\n value: props.value,\n required: props.required,\n disabled: props.disabled,\n name: props.name,\n \"aria-invalid\": props.error ? (\"true\" as const) : undefined,\n ...attrs.input(wrapped.value ? errorId.value : undefined),\n});\nconst onChange = (e: Event) => (model.value = (e.target as HTMLInputElement).checked);\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <div v-if=\"wrapped\" class=\"e-choice-wrap\" :class=\"attrs.wrapper().class\" :style=\"attrs.wrapper().style\">\n <label class=\"e-choice\" :class=\"{ 'e-choice--disabled': disabled }\" :for=\"id\">\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n <EFieldMessage :id=\"errorId\" :error=\"error\" />\n </div>\n <label\n v-else\n class=\"e-choice\"\n :class=\"[{ 'e-choice--bare': bare, 'e-choice--disabled': disabled }, attrs.wrapper().class]\"\n :style=\"attrs.wrapper().style\"\n :for=\"id\"\n >\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span v-if=\"bare\" class=\"e-sr\">{{ label }}</span>\n <span v-else class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n</template>\n\n<style>\n@layer e.controls {\n .e-choice--bare {\n min-height: 0;\n padding: 0;\n gap: 0;\n justify-content: center;\n }\n\n .e-choice-wrap {\n display: grid;\n }\n\n .e-choice-wrap > .e-field-error {\n margin-top: -~~6px~~;\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,IAAMyB,IAAQC,~~GAqBRC~~,IAAQ3B,EAAoB0B,GAAA,YAAmB,GAE/CG,IAAKC,QAAaL,EAAM,EAAE,GAC1BM,IAAUC,QAAe,GAAGH,EAAG,MAAM,MAAM,GAC3CI,IAAUD,QAAe,CAAC,CAACP,EAAM,SAAS,CAACA,EAAM,IAAI,GACrDS,IAAQC,EAA6B,IAAI,GACzCC,IAAQC,EAAc;EAE5B,QACQ,CAACZ,EAAM,eAAeS,EAAM,KAAK,IACtC,CAACI,GAAOC,OAAQ;GACf,AAAIA,MAAI,EAAG,gBAAgB,CAAC,CAACD;EAC/B,GACA;GAAE,OAAO;GAAQ,WAAW;EAAK,CACnC;EAEA,IAAME,WAAmB;GACvB,IAAIX,EAAG;GACP,MAAM;GACN,OAAO;GACP,SAASF,EAAM;GACf,OAAOF,EAAM;GACb,UAAUA,EAAM;GAChB,UAAUA,EAAM;GAChB,MAAMA,EAAM;GACZ,gBAAgBA,EAAM,QAAS,SAAmB,KAAA;GAClD,GAAGW,EAAM,MAAMH,EAAQ,QAAQF,EAAQ,QAAQ,KAAA,CAAS;EAC1D,IACMU,KAAY,MAAc,EAAM,QAAS,EAAE,OAA4B;E,OAE7EjB,EAAa;GACX;GACA,aAAaU,EAAM,OAAO,MAAM;EAClC,CAAC,I,SAIYD,EAAA,SAAXhC,EAAA,GAAAC,EASM,OAAA;;GATc,OAAKC,EAAA,CAAC,iBAAwBC,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK,CAAA;GAAG,OAAK/B,EAAED,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK;E,IACpG9B,EAMQ,SAAA;GAND,OAAKH,EAAA,CAAC,YAAU,EAAA,sBAAiCuB,EAAA,SAAQ,CAAA,CAAA;GAAK,KAAKtB,EAAAyB,CAAA;E,IACxEvB,EAA6D,SAA7DC,EAA6D;GAAlD,SAAA;GAAJ,KAAI2B;EAAgB,GAAAM,EAAS,GAAA,EAAa,YAAQ,CAAA,GAAA,MAAA,EAAA,GACzDlC,EAGO,QAHPS,GAGO,CAFFP,EAAAC,EAAAiB,EAAA,KAAK,IAAG,KACX,CAAA,GAAYA,EAAA,eAAZzB,EAAA,GAAAC,EAAuE,QAAvEc,GAAuEP,EAArBiB,EAAA,WAAW,GAAA,CAAA,K,sBAGjEf,EAA8CC,GAAA;GAA9B,IAAImB,EAAA;GAAU,OAAOL,EAAA;E,sCAEvCzB,EAAA,GAAAC,EAaQ,SAAA;;GAXN,OAAKC,EAAA,CAAC,YAAU,CAAA;IAAA,kBACauB,EAAA;IAAI,sBAAwBA,EAAA;GAAQ,GAAItB,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK,CAAA,CAAA;GACzF,OAAK/B,EAAED,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK;GAC5B,KAAKhC,EAAAyB,CAAA;E,IAENvB,EAA6D,SAA7DC,EAA6D;GAAlD,SAAA;GAAJ,KAAI2B;EAAgB,GAAAM,EAAS,GAAA,EAAa,YAAQ,CAAA,GAAA,MAAA,EAAA,GAC7Cd,EAAA,QAAZzB,EAAA,GAAAC,EAAiD,QAAjDgB,GAAiDT,EAAfiB,EAAA,KAAK,GAAA,CAAA,MACvCzB,EAAA,GAAAC,EAGO,QAHPiB,GAGO,CAFFX,EAAAC,EAAAiB,EAAA,KAAK,IAAG,KACX,CAAA,GAAYA,EAAA,eAAZzB,EAAA,GAAAC,EAAuE,QAAvEkB,GAAuEX,EAArBiB,EAAA,WAAW,GAAA,CAAA,K"}
1	+ {"version":3,"file":"ECheckbox.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createElementBlock","_normalizeClass","_unref","_normalizeStyle","_createElementVNode","_mergeProps","_createTextVNode","_toDisplayString","_createCommentVNode","_createVNode","EFieldMessage","EFieldMessage_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","ECheckbox_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","__expose","props","__props","model","useModel","id","useUid","errorId","computed","wrapped","input","ref","attrs","useFieldAttrs","mixed","el","inputBind","onChange","openBlock","createElementBlock","normalizeClass","unref","normalizeStyle","createElementVNode","mergeProps","createTextVNode","toDisplayString","createCommentVNode","createVNode"],"sources":["../../../src/components/Checkbox/ECheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EFieldMessage from \"../Field/EFieldMessage.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\nimport \"./choice.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** What the person agrees to or turns on. /\n label: string;\n /* A line of detail under the label. /\n description?: string;\n /* A mixed state, such as select-all with some rows chosen. /\n indeterminate?: boolean;\n /* Hide the label visually but keep it for screen readers, for a table cell. No error text. /\n bare?: boolean;\n /* Disables the checkbox. /\n disabled?: boolean;\n /* The `required` attribute. /\n required?: boolean;\n /* What to fix. Shown under the row; sets `aria-invalid`. /\n error?: string;\n /* The name submitted with a form. /\n name?: string;\n /* The value submitted with a form when checked. /\n value?: string;\n /* The id of the input; the label points at it. @default generated /\n id?: string;\n}>();\n\n/* Whether it is checked. */\nconst model = defineModel<boolean>({ default: false });\n\nconst id = useUid(() => props.id);\nconst errorId = computed(() => `${id.value}-hint`);\nconst wrapped = computed(() => !!props.error && !props.bare);\nconst input = ref<HTMLInputElement \| null>(null);\nconst attrs = useFieldAttrs();\n\nwatch(\n () => [props.indeterminate, input.value] as const,\n ([mixed, el]) => {\n if (el) el.indeterminate = !!mixed;\n },\n { flush: \"post\", immediate: true },\n);\n\nconst inputBind = () => ({\n id: id.value,\n type: \"checkbox\" as const,\n class: \"e-check\",\n checked: model.value,\n value: props.value,\n required: props.required,\n disabled: props.disabled,\n name: props.name,\n \"aria-invalid\": props.error ? (\"true\" as const) : undefined,\n ...attrs.input(wrapped.value ? errorId.value : undefined),\n});\nconst onChange = (e: Event) => (model.value = (e.target as HTMLInputElement).checked);\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <div v-if=\"wrapped\" class=\"e-choice-wrap\" :class=\"attrs.wrapper().class\" :style=\"attrs.wrapper().style\">\n <label class=\"e-choice\" :class=\"{ 'e-choice--disabled': disabled }\" :for=\"id\">\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n <EFieldMessage :id=\"errorId\" :error=\"error\" />\n </div>\n <label\n v-else\n class=\"e-choice\"\n :class=\"[{ 'e-choice--bare': bare, 'e-choice--disabled': disabled }, attrs.wrapper().class]\"\n :style=\"attrs.wrapper().style\"\n :for=\"id\"\n >\n <input ref=\"input\" v-bind=\"inputBind()\" @change=\"onChange\" />\n <span v-if=\"bare\" class=\"e-sr\">{{ label }}</span>\n <span v-else class=\"e-choice-text\">\n {{ label }}\n <span v-if=\"description\" class=\"e-choice-desc\">{{ description }}</span>\n </span>\n </label>\n</template>\n\n<style>\n@layer e.controls {\n .e-choice--bare {\n min-height: 0;\n padding: 0;\n gap: 0;\n justify-content: center;\n }\n\n .e-choice-wrap {\n display: grid;\n }\n\n .e-choice-wrap > .e-field-error {\n margin-top: calc(var(--e-space-1) - var(--e-space-2) - var(--e-focus-gap));\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,IAAMyB,IAAQC,GAwBRC,IAAQ3B,EAAoB0B,GAAA,YAAmB,GAE/CG,IAAKC,QAAaL,EAAM,EAAE,GAC1BM,IAAUC,QAAe,GAAGH,EAAG,MAAM,MAAM,GAC3CI,IAAUD,QAAe,CAAC,CAACP,EAAM,SAAS,CAACA,EAAM,IAAI,GACrDS,IAAQC,EAA6B,IAAI,GACzCC,IAAQC,EAAc;EAE5B,QACQ,CAACZ,EAAM,eAAeS,EAAM,KAAK,IACtC,CAACI,GAAOC,OAAQ;GACf,AAAIA,MAAI,EAAG,gBAAgB,CAAC,CAACD;EAC/B,GACA;GAAE,OAAO;GAAQ,WAAW;EAAK,CACnC;EAEA,IAAME,WAAmB;GACvB,IAAIX,EAAG;GACP,MAAM;GACN,OAAO;GACP,SAASF,EAAM;GACf,OAAOF,EAAM;GACb,UAAUA,EAAM;GAChB,UAAUA,EAAM;GAChB,MAAMA,EAAM;GACZ,gBAAgBA,EAAM,QAAS,SAAmB,KAAA;GAClD,GAAGW,EAAM,MAAMH,EAAQ,QAAQF,EAAQ,QAAQ,KAAA,CAAS;EAC1D,IACMU,KAAY,MAAc,EAAM,QAAS,EAAE,OAA4B;E,OAE7EjB,EAAa;GACX;GACA,aAAaU,EAAM,OAAO,MAAM;EAClC,CAAC,I,SAIYD,EAAA,SAAXhC,EAAA,GAAAC,EASM,OAAA;;GATc,OAAKC,EAAA,CAAC,iBAAwBC,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK,CAAA;GAAG,OAAK/B,EAAED,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK;E,IACpG9B,EAMQ,SAAA;GAND,OAAKH,EAAA,CAAC,YAAU,EAAA,sBAAiCuB,EAAA,SAAQ,CAAA,CAAA;GAAK,KAAKtB,EAAAyB,CAAA;E,IACxEvB,EAA6D,SAA7DC,EAA6D;GAAlD,SAAA;GAAJ,KAAI2B;EAAgB,GAAAM,EAAS,GAAA,EAAa,YAAQ,CAAA,GAAA,MAAA,EAAA,GACzDlC,EAGO,QAHPS,GAGO,CAFFP,EAAAC,EAAAiB,EAAA,KAAK,IAAG,KACX,CAAA,GAAYA,EAAA,eAAZzB,EAAA,GAAAC,EAAuE,QAAvEc,GAAuEP,EAArBiB,EAAA,WAAW,GAAA,CAAA,K,sBAGjEf,EAA8CC,GAAA;GAA9B,IAAImB,EAAA;GAAU,OAAOL,EAAA;E,sCAEvCzB,EAAA,GAAAC,EAaQ,SAAA;;GAXN,OAAKC,EAAA,CAAC,YAAU,CAAA;IAAA,kBACauB,EAAA;IAAI,sBAAwBA,EAAA;GAAQ,GAAItB,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK,CAAA,CAAA;GACzF,OAAK/B,EAAED,EAAAgC,CAAA,CAAK,CAAC,QAAO,CAAA,CAAG,KAAK;GAC5B,KAAKhC,EAAAyB,CAAA;E,IAENvB,EAA6D,SAA7DC,EAA6D;GAAlD,SAAA;GAAJ,KAAI2B;EAAgB,GAAAM,EAAS,GAAA,EAAa,YAAQ,CAAA,GAAA,MAAA,EAAA,GAC7Cd,EAAA,QAAZzB,EAAA,GAAAC,EAAiD,QAAjDgB,GAAiDT,EAAfiB,EAAA,KAAK,GAAA,CAAA,MACvCzB,EAAA,GAAAC,EAGO,QAHPiB,GAGO,CAFFX,EAAAC,EAAAiB,EAAA,KAAK,IAAG,KACX,CAAA,GAAYA,EAAA,eAAZzB,EAAA,GAAAC,EAAuE,QAAvEkB,GAAuEX,EAArBiB,EAAA,WAAW,GAAA,CAAA,K"}

package/dist/components/CodeBlock/ECodeBlock.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ECodeBlock.js","names":["_sfc_main","ECodeBlock_vue_vue_type_script_setup_true_lang_default","ECodeBlock_default"],"sources":["../../../src/components/CodeBlock/ECodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { h, ref } from \"vue\";\nimport EIconButton from \"../IconButton/EIconButton.vue\";\nimport EVisuallyHidden from \"../VisuallyHidden/EVisuallyHidden.vue\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n /** The text to show, as plain text. Leave it out to put your own highlighted markup ~~in the slot~~. /\n code?: string;\n /* The language, named for screen readers (the code's accessible name). /\n lang?: string;\n /* The copy button's name. ~~Default~~ ~~\"Copy code\". Say~~ what is copied when ~~there~~ ~~are~~ several ~~blocks:~~ \"Copy ~~CSS~~\". /\n copyLabel?: string;\n}>();\n\ndefineSlots<{\n /* Your own markup, usually a highlighted `<pre><code>`. The copy button copies the text of the first `<pre>`. /\n default?(): unknown;\n}>();\n\nconst t = useMessages();\n\nconst CopyIcon = () =>\n h(\n \"svg\",\n { viewBox: \"0 0 20 20\", fill: \"none\", stroke: \"currentColor\", \"stroke-width\": \"1.6\", \"aria-hidden\": \"true\" },\n [\n h(\"rect\", { x: \"7\", y: \"7\", width: \"9\", height: \"9\", rx: \"2\" }),\n h(\"path\", { d: \"M13 7V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2\" }),\n ],\n );\n\nconst root = ref<HTMLElement \| null>(null);\nconst copied = ref(false);\n\nasync function copy() {\n const text = props.code ?? root.value?.querySelector(\"pre\")?.textContent ?? \"\";\n try {\n await navigator.clipboard.writeText(text);\n copied.value = true;\n setTimeout(() => (copied.value = false), 2000);\n } catch {}\n}\n</script>\n\n<template>\n <div ref=\"root\" class=\"e-code\">\n <div class=\"e-code-body\">\n <slot>\n <pre tabindex=\"0\" :aria-label=\"lang\"><code>{{ code }}</code></pre>\n </slot>\n </div>\n <div class=\"e-code-side\">\n <EIconButton :icon=\"copied ? 'check' : CopyIcon\" :label=\"copyLabel \|\| t('copyCode')\" @click=\"copy\" />\n </div>\n <EVisuallyHidden role=\"status\">{{ copied ? t(\"codeCopied\") : \"\" }}</EVisuallyHidden>\n </div>\n</template>\n\n<style>\n@layer e.blocks {\n .e-code {\n display: flex;\n align-items: stretch;\n min-width: 0;\n overflow: hidden;\n border-radius: var(--e-radius-md);\n background: var(--e-surface);\n box-shadow: var(--e-edge);\n }\n\n .e-code-body {\n display: grid;\n flex: 1;\n align-content: center;\n min-width: 0;\n overflow-x: auto;\n }\n\n .e-code pre {\n margin: 0;\n padding: var(--e-space-3) var(--e-space-4);\n background: transparent;\n font: 400 var(--e-text-sm) / 1.6 var(--e-font-mono);\n color: var(--e-ink);\n }\n\n .e-code pre:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n border-radius: var(--e-radius-md);\n }\n\n .e-code code {\n display: block;\n width: fit-content;\n min-width: 100%;\n padding: 0;\n background: transparent;\n font: inherit;\n }\n\n .e-code-side {\n flex: none;\n align-self: flex-start;\n padding: var(--e-space-1);\n }\n\n @media print {\n .e-code-side {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":""}
1	+ {"version":3,"file":"ECodeBlock.js","names":["_sfc_main","ECodeBlock_vue_vue_type_script_setup_true_lang_default","ECodeBlock_default"],"sources":["../../../src/components/CodeBlock/ECodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { h, ref } from \"vue\";\nimport EIconButton from \"../IconButton/EIconButton.vue\";\nimport EVisuallyHidden from \"../VisuallyHidden/EVisuallyHidden.vue\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n /** The text to show, as plain text. Leave it out to use the slot and put your own highlighted markup there. /\n code?: string;\n /* The language, named for screen readers (the code's accessible name). /\n lang?: string;\n /* The copy button's name; say what is copied when a page has several. @default \"Copy code\" /\n copyLabel?: string;\n}>();\n\ndefineSlots<{\n /* Your own markup, usually a highlighted `<pre><code>`. The copy button copies the text of the first `<pre>`. /\n default?(): unknown;\n}>();\n\nconst t = useMessages();\n\nconst CopyIcon = () =>\n h(\n \"svg\",\n { viewBox: \"0 0 20 20\", fill: \"none\", stroke: \"currentColor\", \"stroke-width\": \"1.6\", \"aria-hidden\": \"true\" },\n [\n h(\"rect\", { x: \"7\", y: \"7\", width: \"9\", height: \"9\", rx: \"2\" }),\n h(\"path\", { d: \"M13 7V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2\" }),\n ],\n );\n\nconst root = ref<HTMLElement \| null>(null);\nconst copied = ref(false);\n\nasync function copy() {\n const text = props.code ?? root.value?.querySelector(\"pre\")?.textContent ?? \"\";\n try {\n await navigator.clipboard.writeText(text);\n copied.value = true;\n setTimeout(() => (copied.value = false), 2000);\n } catch {}\n}\n</script>\n\n<template>\n <div ref=\"root\" class=\"e-code\">\n <div class=\"e-code-body\">\n <slot>\n <pre tabindex=\"0\" :aria-label=\"lang\"><code>{{ code }}</code></pre>\n </slot>\n </div>\n <div class=\"e-code-side\">\n <EIconButton :icon=\"copied ? 'check' : CopyIcon\" :label=\"copyLabel \|\| t('copyCode')\" @click=\"copy\" />\n </div>\n <EVisuallyHidden role=\"status\">{{ copied ? t(\"codeCopied\") : \"\" }}</EVisuallyHidden>\n </div>\n</template>\n\n<style>\n@layer e.blocks {\n .e-code {\n / The colours a Shiki dual-theme (css-variables) highlighter reads for syntax tokens. /\n --shiki-foreground: var(--e-ink);\n --shiki-background: transparent;\n --shiki-token-comment: var(--e-muted);\n --shiki-token-keyword: var(--e-primary);\n --shiki-token-function: var(--e-primary);\n --shiki-token-string: var(--e-secondary);\n --shiki-token-string-expression: var(--e-secondary);\n --shiki-token-constant: var(--e-warning-strong);\n --shiki-token-parameter: var(--e-ink);\n --shiki-token-punctuation: var(--e-muted);\n --shiki-token-link: var(--e-primary);\n\n display: flex;\n align-items: stretch;\n min-width: 0;\n overflow: hidden;\n border-radius: var(--e-radius-md);\n background: var(--e-surface);\n box-shadow: var(--e-edge);\n outline: var(--e-stroke-card) solid var(--e-border);\n outline-offset: 0;\n }\n\n / Code blocks stacked back to back share one seam: the rings overlap into a single line. /\n .e-code:has(+ .e-code) {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n .e-code + .e-code {\n margin-top: max(var(--e-stroke-card), 1px);\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n .e-code-body {\n display: grid;\n flex: 1;\n align-content: center;\n min-width: 0;\n overflow-x: auto;\n }\n\n .e-code pre {\n margin: 0;\n padding: var(--e-space-3) var(--e-space-4);\n background: transparent;\n font: 400 var(--e-text-sm) / 1.6 var(--e-font-mono);\n color: var(--e-ink);\n }\n\n .e-code pre:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n border-radius: var(--e-radius-md);\n }\n\n .e-code code {\n display: block;\n width: fit-content;\n min-width: 100%;\n padding: 0;\n background: transparent;\n font: inherit;\n }\n\n .e-code-side {\n flex: none;\n align-self: flex-start;\n padding: var(--e-space-1);\n }\n\n @media print {\n .e-code-side {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":""}

package/dist/components/CodeBlock/ECodeBlock.vue.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
 type __VLS_Props = {
-    /** The text to show, as plain text. Leave it out to put your own highlighted markup in the slot. */
+    /** The text to show, as plain text. Leave it out to use the slot and put your own highlighted markup there. */
     code?: string;
     /** The language, named for screen readers (the code's accessible name). */
     lang?: string;
-    /** The copy button's name. Default "Copy code". Say what is copied when there are several blocks: "Copy CSS". */
+    /** The copy button's name; say what is copied when a page has several. @default "Copy code" */
     copyLabel?: string;
 };
 type __VLS_Slots = {

package/dist/components/CodeBlock/ECodeBlock.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ECodeBlock.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createElementVNode","_renderSlot","_toDisplayString","_createVNode","EIconButton","_unref","EVisuallyHidden","_withCtx","_createTextVNode","EIconButton_default","EVisuallyHidden_default","_hoisted_1","_hoisted_2","_hoisted_3","ECodeBlock_vue_vue_type_script_setup_true_lang_default","props","__props","t","useMessages","CopyIcon","h","root","ref","copied","copy","text","openBlock","createElementBlock","createElementVNode","renderSlot","_ctx","toDisplayString","createVNode","unref","withCtx","createTextVNode"],"sources":["../../../src/components/CodeBlock/ECodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { h, ref } from \"vue\";\nimport EIconButton from \"../IconButton/EIconButton.vue\";\nimport EVisuallyHidden from \"../VisuallyHidden/EVisuallyHidden.vue\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n /** The text to show, as plain text. Leave it out to put your own highlighted markup ~~in the slot~~. /\n code?: string;\n /* The language, named for screen readers (the code's accessible name). /\n lang?: string;\n /* The copy button's name. ~~Default~~ ~~\"Copy code\". Say~~ what is copied when ~~there~~ ~~are~~ several ~~blocks:~~ \"Copy ~~CSS~~\". /\n copyLabel?: string;\n}>();\n\ndefineSlots<{\n /* Your own markup, usually a highlighted `<pre><code>`. The copy button copies the text of the first `<pre>`. /\n default?(): unknown;\n}>();\n\nconst t = useMessages();\n\nconst CopyIcon = () =>\n h(\n \"svg\",\n { viewBox: \"0 0 20 20\", fill: \"none\", stroke: \"currentColor\", \"stroke-width\": \"1.6\", \"aria-hidden\": \"true\" },\n [\n h(\"rect\", { x: \"7\", y: \"7\", width: \"9\", height: \"9\", rx: \"2\" }),\n h(\"path\", { d: \"M13 7V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2\" }),\n ],\n );\n\nconst root = ref<HTMLElement \| null>(null);\nconst copied = ref(false);\n\nasync function copy() {\n const text = props.code ?? root.value?.querySelector(\"pre\")?.textContent ?? \"\";\n try {\n await navigator.clipboard.writeText(text);\n copied.value = true;\n setTimeout(() => (copied.value = false), 2000);\n } catch {}\n}\n</script>\n\n<template>\n <div ref=\"root\" class=\"e-code\">\n <div class=\"e-code-body\">\n <slot>\n <pre tabindex=\"0\" :aria-label=\"lang\"><code>{{ code }}</code></pre>\n </slot>\n </div>\n <div class=\"e-code-side\">\n <EIconButton :icon=\"copied ? 'check' : CopyIcon\" :label=\"copyLabel \|\| t('copyCode')\" @click=\"copy\" />\n </div>\n <EVisuallyHidden role=\"status\">{{ copied ? t(\"codeCopied\") : \"\" }}</EVisuallyHidden>\n </div>\n</template>\n\n<style>\n@layer e.blocks {\n .e-code {\n display: flex;\n align-items: stretch;\n min-width: 0;\n overflow: hidden;\n border-radius: var(--e-radius-md);\n background: var(--e-surface);\n box-shadow: var(--e-edge);\n }\n\n .e-code-body {\n display: grid;\n flex: 1;\n align-content: center;\n min-width: 0;\n overflow-x: auto;\n }\n\n .e-code pre {\n margin: 0;\n padding: var(--e-space-3) var(--e-space-4);\n background: transparent;\n font: 400 var(--e-text-sm) / 1.6 var(--e-font-mono);\n color: var(--e-ink);\n }\n\n .e-code pre:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n border-radius: var(--e-radius-md);\n }\n\n .e-code code {\n display: block;\n width: fit-content;\n min-width: 100%;\n padding: 0;\n background: transparent;\n font: inherit;\n }\n\n .e-code-side {\n flex: none;\n align-self: flex-start;\n padding: var(--e-space-1);\n }\n\n @media print {\n .e-code-side {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;EAOA,IAAMiB,IAAQC,GAcRC,IAAIC,EAAY,GAEhBC,UACJC,EACE,OACA;GAAE,SAAS;GAAa,MAAM;GAAQ,QAAQ;GAAgB,gBAAgB;GAAO,eAAe;EAAO,GAC3G,CACEA,EAAE,QAAQ;GAAE,GAAG;GAAK,GAAG;GAAK,OAAO;GAAK,QAAQ;GAAK,IAAI;EAAI,CAAC,GAC9DA,EAAE,QAAQ,EAAE,GAAG,0DAA0D,CAAC,CAC5E,CACF,GAEIC,IAAOC,EAAwB,IAAI,GACnCC,IAASD,EAAI,EAAK;EAExB,eAAeE,IAAO;GACpB,IAAMC,IAAOV,EAAM,QAAQM,EAAK,OAAO,cAAc,KAAK,CAAC,EAAE,eAAe;GAC5E,IAAI;IAGF,AAFA,MAAM,UAAU,UAAU,UAAUI,CAAI,GACxC,EAAO,QAAQ,IACf,iBAAkB,EAAO,QAAQ,IAAQ,GAAI;GAC/C,QAAQ,CAAC;EACX;E,kBAIE3B,EAAA,GAAAC,EAUM,OAAA;GAVG,SAAA;GAAJ,KAAIsB;GAAO,OAAM;;GACpBrB,EAIM,OAJNW,GAIM,CAHJV,EAEO6B,EAAA,QAAA,WAAA,CAAA,SAAA,CADL9B,EAAkE,OAAA;IAA7D,UAAS;IAAK,cAAYgB,EAAA;G,IAAMhB,EAAuB,QAAA,MAAAE,EAAdc,EAAA,IAAI,GAAA,CAAA,C;GAGtDhB,EAEM,OAFNa,GAEM,CADJV,EAAqGC,GAAA;IAAvF,MAAMmB,EAAA,QAAM,UAAaJ;IAAW,OAAOH,EAAA,aAAaX,EAAAY,CAAA,CAAC,CAAA,UAAA;IAAe,SAAOO;;GAE/FrB,EAAoFG,GAAA,EAAnE,MAAK,SAAQ,GAAA;IAAC,SAAAC,QAAmC,CAAhCC,EAAAN,EAAAqB,EAAA,QAASlB,EAAAY,CAAA,CAAC,CAAA,YAAA,IAAA,EAAA,GAAA,CAAA,C"}
1	+ {"version":3,"file":"ECodeBlock.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createElementVNode","_renderSlot","_toDisplayString","_createVNode","EIconButton","_unref","EVisuallyHidden","_withCtx","_createTextVNode","EIconButton_default","EVisuallyHidden_default","_hoisted_1","_hoisted_2","_hoisted_3","ECodeBlock_vue_vue_type_script_setup_true_lang_default","props","__props","t","useMessages","CopyIcon","h","root","ref","copied","copy","text","openBlock","createElementBlock","createElementVNode","renderSlot","_ctx","toDisplayString","createVNode","unref","withCtx","createTextVNode"],"sources":["../../../src/components/CodeBlock/ECodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { h, ref } from \"vue\";\nimport EIconButton from \"../IconButton/EIconButton.vue\";\nimport EVisuallyHidden from \"../VisuallyHidden/EVisuallyHidden.vue\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n /** The text to show, as plain text. Leave it out to use the slot and put your own highlighted markup there. /\n code?: string;\n /* The language, named for screen readers (the code's accessible name). /\n lang?: string;\n /* The copy button's name; say what is copied when a page has several. @default \"Copy code\" /\n copyLabel?: string;\n}>();\n\ndefineSlots<{\n /* Your own markup, usually a highlighted `<pre><code>`. The copy button copies the text of the first `<pre>`. /\n default?(): unknown;\n}>();\n\nconst t = useMessages();\n\nconst CopyIcon = () =>\n h(\n \"svg\",\n { viewBox: \"0 0 20 20\", fill: \"none\", stroke: \"currentColor\", \"stroke-width\": \"1.6\", \"aria-hidden\": \"true\" },\n [\n h(\"rect\", { x: \"7\", y: \"7\", width: \"9\", height: \"9\", rx: \"2\" }),\n h(\"path\", { d: \"M13 7V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2\" }),\n ],\n );\n\nconst root = ref<HTMLElement \| null>(null);\nconst copied = ref(false);\n\nasync function copy() {\n const text = props.code ?? root.value?.querySelector(\"pre\")?.textContent ?? \"\";\n try {\n await navigator.clipboard.writeText(text);\n copied.value = true;\n setTimeout(() => (copied.value = false), 2000);\n } catch {}\n}\n</script>\n\n<template>\n <div ref=\"root\" class=\"e-code\">\n <div class=\"e-code-body\">\n <slot>\n <pre tabindex=\"0\" :aria-label=\"lang\"><code>{{ code }}</code></pre>\n </slot>\n </div>\n <div class=\"e-code-side\">\n <EIconButton :icon=\"copied ? 'check' : CopyIcon\" :label=\"copyLabel \|\| t('copyCode')\" @click=\"copy\" />\n </div>\n <EVisuallyHidden role=\"status\">{{ copied ? t(\"codeCopied\") : \"\" }}</EVisuallyHidden>\n </div>\n</template>\n\n<style>\n@layer e.blocks {\n .e-code {\n / The colours a Shiki dual-theme (css-variables) highlighter reads for syntax tokens. /\n --shiki-foreground: var(--e-ink);\n --shiki-background: transparent;\n --shiki-token-comment: var(--e-muted);\n --shiki-token-keyword: var(--e-primary);\n --shiki-token-function: var(--e-primary);\n --shiki-token-string: var(--e-secondary);\n --shiki-token-string-expression: var(--e-secondary);\n --shiki-token-constant: var(--e-warning-strong);\n --shiki-token-parameter: var(--e-ink);\n --shiki-token-punctuation: var(--e-muted);\n --shiki-token-link: var(--e-primary);\n\n display: flex;\n align-items: stretch;\n min-width: 0;\n overflow: hidden;\n border-radius: var(--e-radius-md);\n background: var(--e-surface);\n box-shadow: var(--e-edge);\n outline: var(--e-stroke-card) solid var(--e-border);\n outline-offset: 0;\n }\n\n / Code blocks stacked back to back share one seam: the rings overlap into a single line. /\n .e-code:has(+ .e-code) {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n\n .e-code + .e-code {\n margin-top: max(var(--e-stroke-card), 1px);\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n .e-code-body {\n display: grid;\n flex: 1;\n align-content: center;\n min-width: 0;\n overflow-x: auto;\n }\n\n .e-code pre {\n margin: 0;\n padding: var(--e-space-3) var(--e-space-4);\n background: transparent;\n font: 400 var(--e-text-sm) / 1.6 var(--e-font-mono);\n color: var(--e-ink);\n }\n\n .e-code pre:focus-visible {\n outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n outline-offset: calc(-1 var(--e-stroke-focus));\n border-radius: var(--e-radius-md);\n }\n\n .e-code code {\n display: block;\n width: fit-content;\n min-width: 100%;\n padding: 0;\n background: transparent;\n font: inherit;\n }\n\n .e-code-side {\n flex: none;\n align-self: flex-start;\n padding: var(--e-space-1);\n }\n\n @media print {\n .e-code-side {\n display: none;\n }\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;EAOA,IAAMiB,IAAQC,GAcRC,IAAIC,EAAY,GAEhBC,UACJC,EACE,OACA;GAAE,SAAS;GAAa,MAAM;GAAQ,QAAQ;GAAgB,gBAAgB;GAAO,eAAe;EAAO,GAC3G,CACEA,EAAE,QAAQ;GAAE,GAAG;GAAK,GAAG;GAAK,OAAO;GAAK,QAAQ;GAAK,IAAI;EAAI,CAAC,GAC9DA,EAAE,QAAQ,EAAE,GAAG,0DAA0D,CAAC,CAC5E,CACF,GAEIC,IAAOC,EAAwB,IAAI,GACnCC,IAASD,EAAI,EAAK;EAExB,eAAeE,IAAO;GACpB,IAAMC,IAAOV,EAAM,QAAQM,EAAK,OAAO,cAAc,KAAK,CAAC,EAAE,eAAe;GAC5E,IAAI;IAGF,AAFA,MAAM,UAAU,UAAU,UAAUI,CAAI,GACxC,EAAO,QAAQ,IACf,iBAAkB,EAAO,QAAQ,IAAQ,GAAI;GAC/C,QAAQ,CAAC;EACX;E,kBAIE3B,EAAA,GAAAC,EAUM,OAAA;GAVG,SAAA;GAAJ,KAAIsB;GAAO,OAAM;;GACpBrB,EAIM,OAJNW,GAIM,CAHJV,EAEO6B,EAAA,QAAA,WAAA,CAAA,SAAA,CADL9B,EAAkE,OAAA;IAA7D,UAAS;IAAK,cAAYgB,EAAA;G,IAAMhB,EAAuB,QAAA,MAAAE,EAAdc,EAAA,IAAI,GAAA,CAAA,C;GAGtDhB,EAEM,OAFNa,GAEM,CADJV,EAAqGC,GAAA;IAAvF,MAAMmB,EAAA,QAAM,UAAaJ;IAAW,OAAOH,EAAA,aAAaX,EAAAY,CAAA,CAAC,CAAA,UAAA;IAAe,SAAOO;;GAE/FrB,EAAoFG,GAAA,EAAnE,MAAK,SAAQ,GAAA;IAAC,SAAAC,QAAmC,CAAhCC,EAAAN,EAAAqB,EAAA,QAASlB,EAAAY,CAAA,CAAC,CAAA,YAAA,IAAA,EAAA,GAAA,CAAA,C"}

package/dist/components/ColorField/EColorField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EColorField.js","names":["_sfc_main","EColorField_vue_vue_type_script_setup_true_lang_default","EColorField_default"],"sources":["../../../src/components/ColorField/EColorField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EField from \"../Field/EField.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\nimport \"../TextField/input.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** The visible label, a mono kicker above the input. /\n label: string;\n /* Keep the label for screen readers and remove it from the page. /\n hideLabel?: boolean;\n /* Help that stays under the input. /\n hint?: string;\n /* What to fix. Replaces the hint, marks the input invalid and is announced. /\n error?: string;\n /* A word beside the label. /\n required?: boolean;\n /* A word beside the label. Flag whichever is rarer. /\n optional?: boolean;\n disabled?: boolean;\n /* The id of the text input; the label points at it. ~~Generated~~ ~~when~~ ~~left out.~~ /\n id?: string;\n}>();\n\nconst model = defineModel<string>({ default: \"\" });\n\nconst t = useMessages();\nconst attrs = useFieldAttrs();\nconst input = ref<HTMLInputElement \| null>(null);\nconst swatchEl = ref<HTMLInputElement \| null>(null);\n\nfunction normalize(raw: string): string \| null {\n const m = /^#?([0-9a-f]{3}\|[0-9a-f]{6})$/i.exec(raw.trim());\n if (!m) return null;\n const hex = m[1]!.length === 3 ? [...m[1]!].map((c) => c + c).join(\"\") : m[1]!;\n return `#${hex.toLowerCase()}`;\n}\n\nconst text = ref(model.value);\nconst touched = ref(false);\nwatch(model, (v) => {\n if (normalize(text.value) !== v) text.value = v;\n});\n\nconst invalid = computed(() => touched.value && text.value.trim() !== \"\" && normalize(text.value) === null);\nconst shownError = computed(\n () => props.error \|\| (invalid.value ? t(\"colorInvalid\", { example: t(\"colorPlaceholder\") }) : undefined),\n);\nconst swatch = computed(() => normalize(model.value) ?? \"#000000\");\n\nfunction onText(e: Event) {\n text.value = (e.target as HTMLInputElement).value;\n const hex = normalize(text.value);\n if (hex) model.value = hex;\n}\n\nfunction onBlur() {\n touched.value = true;\n const hex = normalize(text.value);\n if (hex) text.value = hex;\n}\n\nfunction onWrapClick(e: MouseEvent) {\n if (e.target !== swatchEl.value && !props.disabled) input.value?.focus();\n}\n\nfunction onPick(e: Event) {\n model.value = (e.target as HTMLInputElement).value;\n text.value = model.value;\n}\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <EField\n v-bind=\"attrs.wrapper()\"\n :id=\"id\"\n :label=\"label\"\n :hide-label=\"hideLabel\"\n :hint=\"hint\"\n :error=\"shownError\"\n :required=\"required\"\n :optional=\"optional\"\n >\n <template #default=\"field\">\n <!-- eslint-disable-next-line vuejs-accessibility/click-events-have-key-events, vuejs-accessibility/no-static-element-interactions -->\n <div\n class=\"e-input-wrap e-colorfield\"\n :data-invalid=\"shownError ? '' : undefined\"\n :data-disabled=\"disabled ? '' : undefined\"\n @click=\"onWrapClick\"\n >\n <input\n ref=\"swatchEl\"\n class=\"e-color-swatch\"\n type=\"color\"\n :value=\"swatch\"\n :disabled=\"disabled\"\n :aria-label=\"t('pickColor')\"\n @input=\"onPick\"\n />\n <input\n :id=\"field.id\"\n ref=\"input\"\n class=\"e-input\"\n type=\"text\"\n spellcheck=\"false\"\n autocomplete=\"off\"\n maxlength=\"7\"\n :placeholder=\"t('colorPlaceholder')\"\n :value=\"text\"\n :disabled=\"disabled\"\n :required=\"required\"\n :aria-invalid=\"field.ariaInvalid\"\n v-bind=\"attrs.input(field.ariaDescribedby)\"\n @input=\"onText\"\n @blur=\"onBlur\"\n />\n </div>\n </template>\n </EField>\n</template>\n\n<style>\n@layer e.composites {\n .e-colorfield {\n align-items: center;\n gap: var(--e-space-2);\n padding-inline-start: var(--e-space-1);\n }\n\n .e-color-swatch {\n flex: none;\n width: calc(var(--e-control-height) - 2 (var(--e-stroke-edge) + var(--e-space-1)));\n height: calc(var(--e-control-height) - 2 * (var(--e-stroke-edge) + var(--e-space-1)));\n padding: 0;\n border: 0;\n border-radius: var(--e-radius-sm);\n background: none;\n cursor: pointer;\n }\n\n .e-color-swatch::-webkit-color-swatch-wrapper {\n padding: 0;\n }\n\n .e-color-swatch::-webkit-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) ~~rgb~~(~~0 0 0 / 0.22~~);\n }\n\n .e-color-swatch::-moz-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) ~~rgb~~(~~0 0 0 / 0.22~~);\n }\n\n .e-color-swatch:disabled {\n cursor: not-allowed;\n ~~opacity~~: ~~0.6~~;\n }\n\n .e-colorfield .e-input {\n font-family: var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n }\n}\n</style>\n"],"mappings":""}
1	+ {"version":3,"file":"EColorField.js","names":["_sfc_main","EColorField_vue_vue_type_script_setup_true_lang_default","EColorField_default"],"sources":["../../../src/components/ColorField/EColorField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EField from \"../Field/EField.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\nimport \"../TextField/input.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** The visible label, a mono kicker above the input. /\n label: string;\n /* Keep the label for screen readers and remove it from the page. /\n hideLabel?: boolean;\n /* Help that stays under the input. /\n hint?: string;\n /* What to fix. Replaces the hint, marks the input invalid and is announced. Invalid typed text shows \"Enter a colour like #2c95b4\" after blur. /\n error?: string;\n /* The `required` attribute and a word beside the label. /\n required?: boolean;\n /* A word beside the label. Flag whichever is rarer. /\n optional?: boolean;\n /* Disables the field. /\n disabled?: boolean;\n /* The id of the text input; the label points at it. @default generated /\n id?: string;\n}>();\n\n/* `#rrggbb`, lower case. Only complete, valid colours are written. `#abc` expands to `#aabbcc`. /\nconst model = defineModel<string>({ default: \"\" });\n\nconst t = useMessages();\nconst attrs = useFieldAttrs();\nconst input = ref<HTMLInputElement \| null>(null);\nconst swatchEl = ref<HTMLInputElement \| null>(null);\n\nfunction normalize(raw: string): string \| null {\n const m = /^#?([0-9a-f]{3}\|[0-9a-f]{6})$/i.exec(raw.trim());\n if (!m) return null;\n const hex = m[1]!.length === 3 ? [...m[1]!].map((c) => c + c).join(\"\") : m[1]!;\n return `#${hex.toLowerCase()}`;\n}\n\nconst text = ref(model.value);\nconst touched = ref(false);\nwatch(model, (v) => {\n if (normalize(text.value) !== v) text.value = v;\n});\n\nconst invalid = computed(() => touched.value && text.value.trim() !== \"\" && normalize(text.value) === null);\nconst shownError = computed(\n () => props.error \|\| (invalid.value ? t(\"colorInvalid\", { example: t(\"colorPlaceholder\") }) : undefined),\n);\nconst swatch = computed(() => normalize(model.value) ?? \"#000000\");\n\nfunction onText(e: Event) {\n text.value = (e.target as HTMLInputElement).value;\n const hex = normalize(text.value);\n if (hex) model.value = hex;\n}\n\nfunction onBlur() {\n touched.value = true;\n const hex = normalize(text.value);\n if (hex) text.value = hex;\n}\n\nfunction onWrapClick(e: MouseEvent) {\n if (e.target !== swatchEl.value && !props.disabled) input.value?.focus();\n}\n\nfunction onPick(e: Event) {\n model.value = (e.target as HTMLInputElement).value;\n text.value = model.value;\n}\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <EField\n v-bind=\"attrs.wrapper()\"\n :id=\"id\"\n :label=\"label\"\n :hide-label=\"hideLabel\"\n :hint=\"hint\"\n :error=\"shownError\"\n :required=\"required\"\n :optional=\"optional\"\n >\n <template #default=\"field\">\n <!-- eslint-disable-next-line vuejs-accessibility/click-events-have-key-events, vuejs-accessibility/no-static-element-interactions -->\n <div\n class=\"e-input-wrap e-colorfield\"\n :data-invalid=\"shownError ? '' : undefined\"\n :data-disabled=\"disabled ? '' : undefined\"\n @click=\"onWrapClick\"\n >\n <input\n ref=\"swatchEl\"\n class=\"e-color-swatch\"\n type=\"color\"\n :value=\"swatch\"\n :disabled=\"disabled\"\n :aria-label=\"t('pickColor')\"\n @input=\"onPick\"\n />\n <input\n :id=\"field.id\"\n ref=\"input\"\n class=\"e-input\"\n type=\"text\"\n spellcheck=\"false\"\n autocomplete=\"off\"\n maxlength=\"7\"\n :placeholder=\"t('colorPlaceholder')\"\n :value=\"text\"\n :disabled=\"disabled\"\n :required=\"required\"\n :aria-invalid=\"field.ariaInvalid\"\n v-bind=\"attrs.input(field.ariaDescribedby)\"\n @input=\"onText\"\n @blur=\"onBlur\"\n />\n </div>\n </template>\n </EField>\n</template>\n\n<style>\n@layer e.composites {\n .e-colorfield {\n align-items: center;\n gap: var(--e-space-2);\n padding-inline-start: var(--e-space-1);\n }\n\n .e-color-swatch {\n flex: none;\n width: calc(var(--e-control-height) - 2 (var(--e-stroke-edge) + var(--e-space-1)));\n height: calc(var(--e-control-height) - 2 * (var(--e-stroke-edge) + var(--e-space-1)));\n padding: 0;\n border: 0;\n border-radius: var(--e-radius-sm);\n background: none;\n cursor: pointer;\n }\n\n .e-color-swatch::-webkit-color-swatch-wrapper {\n padding: 0;\n }\n\n .e-color-swatch::-webkit-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) var(--e-border-strong);\n }\n\n .e-color-swatch::-moz-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) var(--e-border-strong);\n }\n\n .e-color-swatch:disabled {\n cursor: not-allowed;\n outline: var(--e-stroke-hair) dashed var(--e-muted);\n outline-offset: calc(-1 * var(--e-stroke-hair));\n }\n\n .e-colorfield .e-input {\n font-family: var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n }\n}\n</style>\n"],"mappings":""}

package/dist/components/ColorField/EColorField.vue.d.ts CHANGED Viewed

@@ -5,17 +5,19 @@ type __VLS_Props = {
     hideLabel?: boolean;
     /** Help that stays under the input. */
     hint?: string;
-    /** What to fix. Replaces the hint, marks the input invalid and is announced. */
+    /** What to fix. Replaces the hint, marks the input invalid and is announced. Invalid typed text shows "Enter a colour like #2c95b4" after blur. */
     error?: string;
-    /** A word beside the label. */
+    /** The `required` attribute and a word beside the label. */
     required?: boolean;
     /** A word beside the label. Flag whichever is rarer. */
     optional?: boolean;
+    /** Disables the field. */
     disabled?: boolean;
-    /** The id of the text input; the label points at it. Generated when left out. */
+    /** The id of the text input; the label points at it. @default generated */
     id?: string;
 };
 type __VLS_ModelProps = {
+    /** `#rrggbb`, lower case. Only complete, valid colours are written. `#abc` expands to `#aabbcc`. */
     modelValue?: string;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;

package/dist/components/ColorField/EColorField.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EColorField.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createBlock","EField","_mergeProps","_unref","_withCtx","_createElementVNode","EField_default","_hoisted_1","_hoisted_2","_hoisted_3","EColorField_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","__expose","props","__props","model","useModel","t","useMessages","attrs","useFieldAttrs","input","ref","swatchEl","normalize","m","raw","c","text","touched","v","invalid","computed","shownError","swatch","onText","hex","onBlur","onWrapClick","onPick","openBlock","createBlock","mergeProps","unref","withCtx","createElementVNode","field"],"sources":["../../../src/components/ColorField/EColorField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EField from \"../Field/EField.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\nimport \"../TextField/input.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** The visible label, a mono kicker above the input. /\n label: string;\n /* Keep the label for screen readers and remove it from the page. /\n hideLabel?: boolean;\n /* Help that stays under the input. /\n hint?: string;\n /* What to fix. Replaces the hint, marks the input invalid and is announced. /\n error?: string;\n /* A word beside the label. /\n required?: boolean;\n /* A word beside the label. Flag whichever is rarer. /\n optional?: boolean;\n disabled?: boolean;\n /* The id of the text input; the label points at it. ~~Generated~~ ~~when~~ ~~left out.~~ /\n id?: string;\n}>();\n\nconst model = defineModel<string>({ default: \"\" });\n\nconst t = useMessages();\nconst attrs = useFieldAttrs();\nconst input = ref<HTMLInputElement \| null>(null);\nconst swatchEl = ref<HTMLInputElement \| null>(null);\n\nfunction normalize(raw: string): string \| null {\n const m = /^#?([0-9a-f]{3}\|[0-9a-f]{6})$/i.exec(raw.trim());\n if (!m) return null;\n const hex = m[1]!.length === 3 ? [...m[1]!].map((c) => c + c).join(\"\") : m[1]!;\n return `#${hex.toLowerCase()}`;\n}\n\nconst text = ref(model.value);\nconst touched = ref(false);\nwatch(model, (v) => {\n if (normalize(text.value) !== v) text.value = v;\n});\n\nconst invalid = computed(() => touched.value && text.value.trim() !== \"\" && normalize(text.value) === null);\nconst shownError = computed(\n () => props.error \|\| (invalid.value ? t(\"colorInvalid\", { example: t(\"colorPlaceholder\") }) : undefined),\n);\nconst swatch = computed(() => normalize(model.value) ?? \"#000000\");\n\nfunction onText(e: Event) {\n text.value = (e.target as HTMLInputElement).value;\n const hex = normalize(text.value);\n if (hex) model.value = hex;\n}\n\nfunction onBlur() {\n touched.value = true;\n const hex = normalize(text.value);\n if (hex) text.value = hex;\n}\n\nfunction onWrapClick(e: MouseEvent) {\n if (e.target !== swatchEl.value && !props.disabled) input.value?.focus();\n}\n\nfunction onPick(e: Event) {\n model.value = (e.target as HTMLInputElement).value;\n text.value = model.value;\n}\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <EField\n v-bind=\"attrs.wrapper()\"\n :id=\"id\"\n :label=\"label\"\n :hide-label=\"hideLabel\"\n :hint=\"hint\"\n :error=\"shownError\"\n :required=\"required\"\n :optional=\"optional\"\n >\n <template #default=\"field\">\n <!-- eslint-disable-next-line vuejs-accessibility/click-events-have-key-events, vuejs-accessibility/no-static-element-interactions -->\n <div\n class=\"e-input-wrap e-colorfield\"\n :data-invalid=\"shownError ? '' : undefined\"\n :data-disabled=\"disabled ? '' : undefined\"\n @click=\"onWrapClick\"\n >\n <input\n ref=\"swatchEl\"\n class=\"e-color-swatch\"\n type=\"color\"\n :value=\"swatch\"\n :disabled=\"disabled\"\n :aria-label=\"t('pickColor')\"\n @input=\"onPick\"\n />\n <input\n :id=\"field.id\"\n ref=\"input\"\n class=\"e-input\"\n type=\"text\"\n spellcheck=\"false\"\n autocomplete=\"off\"\n maxlength=\"7\"\n :placeholder=\"t('colorPlaceholder')\"\n :value=\"text\"\n :disabled=\"disabled\"\n :required=\"required\"\n :aria-invalid=\"field.ariaInvalid\"\n v-bind=\"attrs.input(field.ariaDescribedby)\"\n @input=\"onText\"\n @blur=\"onBlur\"\n />\n </div>\n </template>\n </EField>\n</template>\n\n<style>\n@layer e.composites {\n .e-colorfield {\n align-items: center;\n gap: var(--e-space-2);\n padding-inline-start: var(--e-space-1);\n }\n\n .e-color-swatch {\n flex: none;\n width: calc(var(--e-control-height) - 2 (var(--e-stroke-edge) + var(--e-space-1)));\n height: calc(var(--e-control-height) - 2 * (var(--e-stroke-edge) + var(--e-space-1)));\n padding: 0;\n border: 0;\n border-radius: var(--e-radius-sm);\n background: none;\n cursor: pointer;\n }\n\n .e-color-swatch::-webkit-color-swatch-wrapper {\n padding: 0;\n }\n\n .e-color-swatch::-webkit-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) ~~rgb~~(~~0 0 0 / 0.22~~);\n }\n\n .e-color-swatch::-moz-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) ~~rgb~~(~~0 0 0 / 0.22~~);\n }\n\n .e-color-swatch:disabled {\n cursor: not-allowed;\n ~~opacity~~: ~~0.6~~;\n }\n\n .e-colorfield .e-input {\n font-family: var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,IAAMgB,IAAQC,~~GAkBRC~~,IAAQlB,EAAmBiB,GAAA,YAAgB,GAE3CG,IAAIC,EAAY,GAChBC,IAAQC,EAAc,GACtBC,IAAQC,EAA6B,IAAI,GACzCC,IAAWD,EAA6B,IAAI;EAElD,SAASE,EAAU,GAA4B;GAC7C,IAAMC,IAAI,iCAAiC,KAAKC,EAAI,KAAK,CAAC;GAG1D,OAFKD,IAEE,KADKA,EAAE,EAAE,CAAE,WAAW,IAAI,CAAC,GAAGA,EAAE,EAAG,CAAC,CAAC,KAAK,MAAME,IAAIA,CAAC,CAAC,CAAC,KAAK,EAAE,IAAIF,EAAE,GAAA,CAC5D,YAAY,MAFZ;EAGjB;EAEA,IAAMG,IAAON,EAAIP,EAAM,KAAK,GACtBc,IAAUP,EAAI,EAAK;EACzB,EAAMP,IAAQ,MAAM;GAClB,AAAIS,EAAUI,EAAK,KAAK,MAAME,MAAG,EAAK,QAAQA;EAChD,CAAC;EAED,IAAMC,IAAUC,QAAeH,EAAQ,SAASD,EAAK,MAAM,KAAK,MAAM,MAAMJ,EAAUI,EAAK,KAAK,MAAM,IAAI,GACpGK,IAAaD,QACXnB,EAAM,UAAUkB,EAAQ,QAAQd,EAAE,gBAAgB,EAAE,SAASA,EAAE,kBAAkB,EAAE,CAAC,IAAI,KAAA,EAChG,GACMiB,IAASF,QAAeR,EAAUT,EAAM,KAAK,KAAK,SAAS;EAEjE,SAASoB,EAAO,GAAU;GACxB,EAAK,QAAS,EAAE,OAA4B;GAC5C,IAAMC,IAAMZ,EAAUI,EAAK,KAAK;GAChC,AAAIQ,MAAK,EAAM,QAAQA;EACzB;EAEA,SAASC,IAAS;GAChB,EAAQ,QAAQ;GAChB,IAAMD,IAAMZ,EAAUI,EAAK,KAAK;GAChC,AAAIQ,MAAK,EAAK,QAAQA;EACxB;EAEA,SAASE,EAAY,GAAe;GAClC,AAAI,EAAE,WAAWf,EAAS,SAAS,CAACV,EAAM,YAAUQ,EAAM,OAAO,MAAM;EACzE;EAEA,SAASkB,EAAO,GAAU;GAExB,AADA,EAAM,QAAS,EAAE,OAA4B,OAC7C,EAAK,QAAQxB,EAAM;EACrB;E,OAEAH,EAAa;GACX;GACA,aAAaS,EAAM,OAAO,MAAM;EAClC,CAAC,I,UAICvB,EAAA,GAAAC,EA8CSC,GA9CTC,EACUC,EA6CDiB,CAAA,CA7CM,CAAC,QAAO,GAAA;GACpB,IAAIL,EAAA;GACJ,OAAOA,EAAA;GACP,cAAYA,EAAA;GACZ,MAAMA,EAAA;GACN,OAAOmB,EAAA;GACP,UAAUnB,EAAA;GACV,UAAUA,EAAA;;GAEA,SAAOX,GAAE,MAAK,CAEvBC,EAgCM,OAAA;IA/BJ,OAAM;IACL,gBAAc6B,EAAA,QAAU,KAAQ,KAAA;IAChC,iBAAenB,EAAA,WAAQ,KAAQ,KAAA;IAC/B,SAAOwB;G,IAERlC,EAQE,SAAA;IAPI,SAAA;IAAJ,KAAImB;IACJ,OAAM;IACN,MAAK;IACJ,OAAOW,EAAA;IACP,UAAUpB,EAAA;IACV,cAAYZ,EAAAe,CAAA,CAAC,CAAA,WAAA;IACb,SAAOsB;G,iBAEVnC,EAgBE,SAhBFH,EAgBE;IAfC,IAAI6C,EAAM;IACP,SAAA;IAAJ,KAAIzB;IACJ,OAAM;IACN,MAAK;IACL,YAAW;IACX,cAAa;IACb,WAAU;IACT,aAAanB,EAAAe,CAAA,CAAC,CAAA,kBAAA;IACd,OAAOW,EAAA;IACP,UAAUd,EAAA;IACV,UAAUA,EAAA;IACV,gBAAcgC,EAAM;GACb,GAAA5C,EAAAiB,CAAA,CAAK,CAAC,MAAM2B,EAAM,eAAe,GAAA;IACxC,SAAOX;IACD"}
1	+ {"version":3,"file":"EColorField.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createBlock","EField","_mergeProps","_unref","_withCtx","_createElementVNode","EField_default","_hoisted_1","_hoisted_2","_hoisted_3","EColorField_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","__expose","props","__props","model","useModel","t","useMessages","attrs","useFieldAttrs","input","ref","swatchEl","normalize","m","raw","c","text","touched","v","invalid","computed","shownError","swatch","onText","hex","onBlur","onWrapClick","onPick","openBlock","createBlock","mergeProps","unref","withCtx","createElementVNode","field"],"sources":["../../../src/components/ColorField/EColorField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport EField from \"../Field/EField.vue\";\nimport { useFieldAttrs } from \"../../composables/useFieldAttrs.js\";\nimport { useMessages } from \"../../config.js\";\nimport \"../../styles/base.css\";\nimport \"../TextField/input.css\";\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = defineProps<{\n /** The visible label, a mono kicker above the input. /\n label: string;\n /* Keep the label for screen readers and remove it from the page. /\n hideLabel?: boolean;\n /* Help that stays under the input. /\n hint?: string;\n /* What to fix. Replaces the hint, marks the input invalid and is announced. Invalid typed text shows \"Enter a colour like #2c95b4\" after blur. /\n error?: string;\n /* The `required` attribute and a word beside the label. /\n required?: boolean;\n /* A word beside the label. Flag whichever is rarer. /\n optional?: boolean;\n /* Disables the field. /\n disabled?: boolean;\n /* The id of the text input; the label points at it. @default generated /\n id?: string;\n}>();\n\n/* `#rrggbb`, lower case. Only complete, valid colours are written. `#abc` expands to `#aabbcc`. /\nconst model = defineModel<string>({ default: \"\" });\n\nconst t = useMessages();\nconst attrs = useFieldAttrs();\nconst input = ref<HTMLInputElement \| null>(null);\nconst swatchEl = ref<HTMLInputElement \| null>(null);\n\nfunction normalize(raw: string): string \| null {\n const m = /^#?([0-9a-f]{3}\|[0-9a-f]{6})$/i.exec(raw.trim());\n if (!m) return null;\n const hex = m[1]!.length === 3 ? [...m[1]!].map((c) => c + c).join(\"\") : m[1]!;\n return `#${hex.toLowerCase()}`;\n}\n\nconst text = ref(model.value);\nconst touched = ref(false);\nwatch(model, (v) => {\n if (normalize(text.value) !== v) text.value = v;\n});\n\nconst invalid = computed(() => touched.value && text.value.trim() !== \"\" && normalize(text.value) === null);\nconst shownError = computed(\n () => props.error \|\| (invalid.value ? t(\"colorInvalid\", { example: t(\"colorPlaceholder\") }) : undefined),\n);\nconst swatch = computed(() => normalize(model.value) ?? \"#000000\");\n\nfunction onText(e: Event) {\n text.value = (e.target as HTMLInputElement).value;\n const hex = normalize(text.value);\n if (hex) model.value = hex;\n}\n\nfunction onBlur() {\n touched.value = true;\n const hex = normalize(text.value);\n if (hex) text.value = hex;\n}\n\nfunction onWrapClick(e: MouseEvent) {\n if (e.target !== swatchEl.value && !props.disabled) input.value?.focus();\n}\n\nfunction onPick(e: Event) {\n model.value = (e.target as HTMLInputElement).value;\n text.value = model.value;\n}\n\ndefineExpose({\n input,\n focus: () => input.value?.focus(),\n});\n</script>\n\n<template>\n <EField\n v-bind=\"attrs.wrapper()\"\n :id=\"id\"\n :label=\"label\"\n :hide-label=\"hideLabel\"\n :hint=\"hint\"\n :error=\"shownError\"\n :required=\"required\"\n :optional=\"optional\"\n >\n <template #default=\"field\">\n <!-- eslint-disable-next-line vuejs-accessibility/click-events-have-key-events, vuejs-accessibility/no-static-element-interactions -->\n <div\n class=\"e-input-wrap e-colorfield\"\n :data-invalid=\"shownError ? '' : undefined\"\n :data-disabled=\"disabled ? '' : undefined\"\n @click=\"onWrapClick\"\n >\n <input\n ref=\"swatchEl\"\n class=\"e-color-swatch\"\n type=\"color\"\n :value=\"swatch\"\n :disabled=\"disabled\"\n :aria-label=\"t('pickColor')\"\n @input=\"onPick\"\n />\n <input\n :id=\"field.id\"\n ref=\"input\"\n class=\"e-input\"\n type=\"text\"\n spellcheck=\"false\"\n autocomplete=\"off\"\n maxlength=\"7\"\n :placeholder=\"t('colorPlaceholder')\"\n :value=\"text\"\n :disabled=\"disabled\"\n :required=\"required\"\n :aria-invalid=\"field.ariaInvalid\"\n v-bind=\"attrs.input(field.ariaDescribedby)\"\n @input=\"onText\"\n @blur=\"onBlur\"\n />\n </div>\n </template>\n </EField>\n</template>\n\n<style>\n@layer e.composites {\n .e-colorfield {\n align-items: center;\n gap: var(--e-space-2);\n padding-inline-start: var(--e-space-1);\n }\n\n .e-color-swatch {\n flex: none;\n width: calc(var(--e-control-height) - 2 (var(--e-stroke-edge) + var(--e-space-1)));\n height: calc(var(--e-control-height) - 2 * (var(--e-stroke-edge) + var(--e-space-1)));\n padding: 0;\n border: 0;\n border-radius: var(--e-radius-sm);\n background: none;\n cursor: pointer;\n }\n\n .e-color-swatch::-webkit-color-swatch-wrapper {\n padding: 0;\n }\n\n .e-color-swatch::-webkit-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) var(--e-border-strong);\n }\n\n .e-color-swatch::-moz-color-swatch {\n border: 0;\n border-radius: var(--e-radius-sm);\n box-shadow: inset 0 0 0 var(--e-stroke-hair) var(--e-border-strong);\n }\n\n .e-color-swatch:disabled {\n cursor: not-allowed;\n outline: var(--e-stroke-hair) dashed var(--e-muted);\n outline-offset: calc(-1 * var(--e-stroke-hair));\n }\n\n .e-colorfield .e-input {\n font-family: var(--e-font-mono);\n font-variant-numeric: tabular-nums;\n }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,IAAMgB,IAAQC,GAoBRC,IAAQlB,EAAmBiB,GAAA,YAAgB,GAE3CG,IAAIC,EAAY,GAChBC,IAAQC,EAAc,GACtBC,IAAQC,EAA6B,IAAI,GACzCC,IAAWD,EAA6B,IAAI;EAElD,SAASE,EAAU,GAA4B;GAC7C,IAAMC,IAAI,iCAAiC,KAAKC,EAAI,KAAK,CAAC;GAG1D,OAFKD,IAEE,KADKA,EAAE,EAAE,CAAE,WAAW,IAAI,CAAC,GAAGA,EAAE,EAAG,CAAC,CAAC,KAAK,MAAME,IAAIA,CAAC,CAAC,CAAC,KAAK,EAAE,IAAIF,EAAE,GAAA,CAC5D,YAAY,MAFZ;EAGjB;EAEA,IAAMG,IAAON,EAAIP,EAAM,KAAK,GACtBc,IAAUP,EAAI,EAAK;EACzB,EAAMP,IAAQ,MAAM;GAClB,AAAIS,EAAUI,EAAK,KAAK,MAAME,MAAG,EAAK,QAAQA;EAChD,CAAC;EAED,IAAMC,IAAUC,QAAeH,EAAQ,SAASD,EAAK,MAAM,KAAK,MAAM,MAAMJ,EAAUI,EAAK,KAAK,MAAM,IAAI,GACpGK,IAAaD,QACXnB,EAAM,UAAUkB,EAAQ,QAAQd,EAAE,gBAAgB,EAAE,SAASA,EAAE,kBAAkB,EAAE,CAAC,IAAI,KAAA,EAChG,GACMiB,IAASF,QAAeR,EAAUT,EAAM,KAAK,KAAK,SAAS;EAEjE,SAASoB,EAAO,GAAU;GACxB,EAAK,QAAS,EAAE,OAA4B;GAC5C,IAAMC,IAAMZ,EAAUI,EAAK,KAAK;GAChC,AAAIQ,MAAK,EAAM,QAAQA;EACzB;EAEA,SAASC,IAAS;GAChB,EAAQ,QAAQ;GAChB,IAAMD,IAAMZ,EAAUI,EAAK,KAAK;GAChC,AAAIQ,MAAK,EAAK,QAAQA;EACxB;EAEA,SAASE,EAAY,GAAe;GAClC,AAAI,EAAE,WAAWf,EAAS,SAAS,CAACV,EAAM,YAAUQ,EAAM,OAAO,MAAM;EACzE;EAEA,SAASkB,EAAO,GAAU;GAExB,AADA,EAAM,QAAS,EAAE,OAA4B,OAC7C,EAAK,QAAQxB,EAAM;EACrB;E,OAEAH,EAAa;GACX;GACA,aAAaS,EAAM,OAAO,MAAM;EAClC,CAAC,I,UAICvB,EAAA,GAAAC,EA8CSC,GA9CTC,EACUC,EA6CDiB,CAAA,CA7CM,CAAC,QAAO,GAAA;GACpB,IAAIL,EAAA;GACJ,OAAOA,EAAA;GACP,cAAYA,EAAA;GACZ,MAAMA,EAAA;GACN,OAAOmB,EAAA;GACP,UAAUnB,EAAA;GACV,UAAUA,EAAA;;GAEA,SAAOX,GAAE,MAAK,CAEvBC,EAgCM,OAAA;IA/BJ,OAAM;IACL,gBAAc6B,EAAA,QAAU,KAAQ,KAAA;IAChC,iBAAenB,EAAA,WAAQ,KAAQ,KAAA;IAC/B,SAAOwB;G,IAERlC,EAQE,SAAA;IAPI,SAAA;IAAJ,KAAImB;IACJ,OAAM;IACN,MAAK;IACJ,OAAOW,EAAA;IACP,UAAUpB,EAAA;IACV,cAAYZ,EAAAe,CAAA,CAAC,CAAA,WAAA;IACb,SAAOsB;G,iBAEVnC,EAgBE,SAhBFH,EAgBE;IAfC,IAAI6C,EAAM;IACP,SAAA;IAAJ,KAAIzB;IACJ,OAAM;IACN,MAAK;IACL,YAAW;IACX,cAAa;IACb,WAAU;IACT,aAAanB,EAAAe,CAAA,CAAC,CAAA,kBAAA;IACd,OAAOW,EAAA;IACP,UAAUd,EAAA;IACV,UAAUA,EAAA;IACV,gBAAcgC,EAAM;GACb,GAAA5C,EAAAiB,CAAA,CAAK,CAAC,MAAM2B,EAAM,eAAe,GAAA;IACxC,SAAOX;IACD"}

package/dist/components/Combobox/ECombobox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ECombobox.js","names":["_sfc_main","ECombobox_vue_vue_type_script_setup_true_lang_default","ECombobox_default"],"sources":["../../../src/components/Combobox/ECombobox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport EComboboxBase from \"./EComboboxBase.vue\";\nimport type { EComboboxProps } from \"./types.js\";\n\nconst props = withDefaults(defineProps<EComboboxProps>(), { clearable: true });\n\ndefineEmits<{\n /** The text in the input changed, by typing or by choosing. Use it to fetch options from a server. */\n inputChange: [text: string];\n}>();\n\~~nconst~~ ~~model~~ = ~~defineModel<string>~~({ default: \"\" });\n\nconst open = defineModel<boolean>(\"open\", { default: false });\n\nconst base = ref<InstanceType<typeof EComboboxBase> \| null>(null);\ndefineExpose({\n input: () => base.value?.input ?? null,\n focus: () => base.value?.focus(),\n});\n</script>\n\n<template>\n <EComboboxBase\n ref=\"base\"\n v-bind=\"props\"\n v-model=\"model\"\n v-model:open=\"open\"\n ~~mode=\"single\"\n~~ @input-change=\"(text: string) => $emit('inputChange', text)\"\n />\n</template>\n"],"mappings":""}
1	+ {"version":3,"file":"ECombobox.js","names":["_sfc_main","ECombobox_vue_vue_type_script_setup_true_lang_default","ECombobox_default"],"sources":["../../../src/components/Combobox/ECombobox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport EComboboxBase from \"./EComboboxBase.vue\";\nimport type { EComboboxProps } from \"./types.js\";\n\nconst props = withDefaults(defineProps<EComboboxProps>(), { clearable: true });\n\ndefineEmits<{\n /** The text in the input changed, by typing or by choosing. Use it to fetch options from a server. /\n inputChange: [text: string];\n}>();\n\n/* The `value` of the chosen option, empty for nothing; with `multiple` the chosen values in the order chosen (replaced, not mutated); with `freeform` the typed text, updated on every key. @default \"\" or [] /\nconst model = defineModel<string \| string[]>();\n\n/* Whether the list is open. Setting it moves no focus; a disabled field never opens. */\nconst open = defineModel<boolean>(\"open\", { default: false });\n\nconst base = ref<InstanceType<typeof EComboboxBase> \| null>(null);\ndefineExpose({\n input: () => base.value?.input ?? null,\n focus: () => base.value?.focus(),\n});\n</script>\n\n<template>\n <EComboboxBase\n ref=\"base\"\n v-bind=\"props\"\n v-model=\"model\"\n v-model:open=\"open\"\n @input-change=\"(text: string) => $emit('inputChange', text)\"\n />\n</template>\n"],"mappings":""}

package/dist/components/Combobox/ECombobox.vue.d.ts CHANGED Viewed

@@ -1,5 +1,7 @@
 type __VLS_ModelProps = {
-    modelValue?: string;
+    /** The `value` of the chosen option, empty for nothing; with `multiple` the chosen values in the order chosen (replaced, not mutated); with `freeform` the typed text, updated on every key. @default "" or [] */
+    modelValue?: string | string[];
+    /** Whether the list is open. Setting it moves no focus; a disabled field never opens. */
     "open"?: boolean;
 };
 declare const __VLS_export: import('vue').DefineComponent<({
@@ -18,9 +20,9 @@ declare const __VLS_export: import('vue').DefineComponent<({
     input: () => HTMLInputElement | null;
     focus: () => void | undefined;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:open": (value: boolean) => any;
-    "update:modelValue": (value: string) => any;
+    "update:modelValue": (value: string | string[] | undefined) => any;
     inputChange: (text: string) => any;
+    "update:open": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<({
     hideLabel?: boolean;
     ariaLabel?: string;
@@ -34,9 +36,9 @@ declare const __VLS_export: import('vue').DefineComponent<({
     label?: string;
     bare: true;
 } & import('./types.js').EComboboxFields & __VLS_ModelProps)> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string | string[] | undefined) => any) | undefined;
     onInputChange?: ((text: string) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
     clearable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;