@eos-ui/vue 0.0.0-stage → 0.1.1

package/dist/components/ErrorSummary/EErrorSummary.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EErrorSummary.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_unref","_createVNode","ENotice","_withCtx","_createElementVNode","_Fragment","_renderList","_toDisplayString","_createCommentVNode","_createTextVNode","ENotice_default","_hoisted_1","_hoisted_2","_hoisted_3","EErrorSummary_vue_vue_type_script_setup_true_lang_default","props","__props","t","useMessages","titleId","useUid","root","ref","focusSummary","onMounted","nextTick","watch","openBlock","createElementBlock","unref","createVNode","withCtx","createElementVNode","Fragment","renderList","i","error","toDisplayString","createCommentVNode","createTextVNode"],"sources":["../../../src/components/ErrorSummary/EErrorSummary.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ErrorSummaryItem {\n  /** The field's name, shown first in medium weight (\"Email: Enter an email address\"). Leave it out when the message already names the field. */\n  field?: string;\n  /** What is wrong and how to fix it, written the same way as the field's own error. */\n  message: string;\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { nextTick, onMounted, ref, watch } from \"vue\";\nimport ENotice from \"../Notice/ENotice.vue\";\nimport { useMessages } from \"../../config.js\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\n\nconst props = withDefaults(\n  defineProps<{\n    /** What went wrong. The summary shows nothing while the list is empty. */\n    errors: ErrorSummaryItem[];\n    /** The heading. Defaults to \"There is a problem\". */\n    title?: string;\n    /** The level of the heading element, 1 to 6. */\n    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;\n    /** Moves focus to the summary when errors appear, so keyboard and screen reader users land on it. */\n    autoFocus?: boolean;\n  }>(),\n  { headingLevel: 2, autoFocus: true },\n);\n\nconst t = useMessages();\nconst titleId = useUid();\nconst root = ref<HTMLElement>();\n\nfunction focusSummary() {\n  if (!props.errors.length || !props.autoFocus || !root.value) return;\n  root.value.focus();\n  root.value.scrollIntoView?.({ block: \"nearest\" });\n}\n\nonMounted(() => nextTick(focusSummary));\nwatch(\n  () => props.errors.length,\n  async () => {\n    await nextTick();\n    focusSummary();\n  },\n);\n</script>\n\n<template>\n  <div v-if=\"errors.length\" ref=\"root\" class=\"e-errsum\" role=\"alert\" tabindex=\"-1\" :aria-labelledby=\"titleId\">\n    <ENotice\n      tone=\"danger\"\n      :role=\"false\"\n      :heading-level=\"headingLevel\"\n      :title-id=\"titleId\"\n      :title=\"title ?? t('errorSummary')\"\n    >\n      <ul class=\"e-errsum-list\">\n        <li v-for=\"(error, i) in errors\" :key=\"`${i}-${error.message}`\">\n          <strong v-if=\"error.field\">{{ error.field }}</strong\n          >{{ error.field ? \": \" : \"\" }}{{ error.message }}\n        </li>\n      </ul>\n    </ENotice>\n  </div>\n</template>\n\n<style>\n@layer e.containers {\n  .e-errsum {\n    border-radius: var(--e-radius-md);\n  }\n\n  .e-errsum:focus-visible {\n    outline: var(--e-stroke-focus) solid var(--e-focus-ring);\n    outline-offset: var(--e-focus-gap);\n  }\n\n  .e-errsum-list {\n    display: grid;\n    gap: var(--e-space-1);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  .e-errsum-list li {\n    position: relative;\n    padding-inline-start: var(--e-space-4);\n  }\n\n  .e-errsum-list li::before {\n    content: \"\";\n    position: absolute;\n    inset-inline-start: 0;\n    top: 0.5em;\n    width: 7px;\n    height: 7px;\n    border-radius: calc(var(--e-radius-sm) / 2);\n    background: var(--e-danger);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAgBA,IAAMiB,IAAQC,GAcRC,IAAIC,EAAY,GAChBC,IAAUC,EAAO,GACjBC,IAAOC,EAAiB;EAE9B,SAASC,IAAe;GACtB,AAAKR,EAAM,OAAO,UAAWA,EAAM,aAAcM,EAAK,UACtDA,EAAK,MAAM,MAAM,GACjBA,EAAK,MAAM,iBAAiB,EAAE,OAAO,UAAU,CAAC;EAClD;E,OAEAG,QAAgBC,EAASF,CAAY,CAAC,GACtCG,QACQX,EAAM,OAAO,QACnB,YAAY;GAEV,AADA,MAAMU,EAAS,GACfF,EAAa;EACf,CACF,I,SAIaP,EAAA,OAAO,UAAlBlB,EAAA,GAAAC,EAeM,OAAA;;GAfwB,SAAA;GAAJ,KAAIsB;GAAO,OAAM;GAAW,MAAK;GAAQ,UAAS;GAAM,mBAAiBrB,EAAAmB,CAAA;E,IACjGlB,EAaUC,GAAA;GAZR,MAAK;GACJ,MAAM;GACN,iBAAec,EAAA;GACf,YAAUhB,EAAAmB,CAAA;GACV,OAAOH,EAAA,SAAShB,EAAAiB,CAAA,CAAC,CAAA,cAAA;;GAElB,SAAAd,QAKK,CALLC,EAKK,MALLQ,GAKK,EAJHd,EAAA,EAAA,GAAAC,EAGKM,GAAA,MAAAC,EAHoBU,EAAA,SAAb,GAAO,OAAnBlB,EAAA,GAAAC,EAGK,MAAA,EAH6B,KAAG,GAAKoC,EAAC,GAAIC,EAAM,U,IACrCA,EAAM,SAApBtC,EAAA,GAAAC,EACC,UAAAc,GAAAN,EAD6B6B,EAAM,KAAK,GAAA,CAAA,K,WACrC3B,EAAAF,EAAA6B,EAAM,QAAK,OAAA,EAAA,IAAA7B,EAAkB6B,EAAM,OAAO,GAAA,CAAA,C"}

package/dist/components/ErrorSummary/index.d.ts

@@ -0,0 +1,2 @@
+export { default as EErrorSummary } from './EErrorSummary.vue.js';
+export type { ErrorSummaryItem } from './EErrorSummary.vue.js';

package/dist/components/Field/EField.js

@@ -0,0 +1,8 @@
+import e from "./EField.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                       */
+//#region src/components/Field/EField.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=EField.js.map

package/dist/components/Field/EField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EField.js","names":["_sfc_main","EField_vue_vue_type_script_setup_true_lang_default","EField_default"],"sources":["../../../src/components/Field/EField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport EFieldFlag from \"./EFieldFlag.vue\";\nimport EFieldMessage from \"./EFieldMessage.vue\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n  /** The visible label, a small mono kicker above the control. */\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 control. */\n  hint?: string;\n  /** What to fix. Replaces the hint, turns the control 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  /** The id of the control; the label points at it. Generated when left out. */\n  id?: string;\n}>();\n\ndefineSlots<{\n  /** The control. Put `id`, `aria-invalid` and `aria-describedby` on it. */\n  default(props: { id: string; ariaInvalid: \"true\" | undefined; ariaDescribedby: string | undefined }): unknown;\n}>();\n\nconst id = useUid(() => props.id);\nconst hintId = computed(() => `${id.value}-hint`);\n</script>\n\n<template>\n  <div class=\"e-field\">\n    <label :id=\"`${id}-label`\" class=\"e-field-label e-kicker\" :class=\"{ 'e-sr': hideLabel }\" :for=\"id\">\n      {{ label }}\n      <EFieldFlag :required=\"required\" :optional=\"optional\" />\n    </label>\n    <slot :id=\"id\" :aria-invalid=\"error ? 'true' : undefined\" :aria-describedby=\"error || hint ? hintId : undefined\" />\n    <EFieldMessage :id=\"hintId\" :error=\"error\" :hint=\"hint\" />\n  </div>\n</template>\n\n<style>\n@layer e.controls {\n  .e-field {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr);\n    align-content: start;\n    gap: var(--e-space-2);\n    min-width: 0;\n  }\n\n  .e-field-label {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--e-space-3);\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/Field/EField.vue.d.ts

@@ -0,0 +1,33 @@
+type __VLS_Props = {
+    /** The visible label, a small mono kicker above the control. */
+    label: string;
+    /** Keep the label for screen readers and remove it from the page. */
+    hideLabel?: boolean;
+    /** Help that stays under the control. */
+    hint?: string;
+    /** What to fix. Replaces the hint, turns the control invalid and is announced. */
+    error?: string;
+    /** A word beside the label. */
+    required?: boolean;
+    /** A word beside the label. Flag whichever is rarer. */
+    optional?: boolean;
+    /** The id of the control; the label points at it. Generated when left out. */
+    id?: string;
+};
+type __VLS_Slots = {
+    /** The control. Put `id`, `aria-invalid` and `aria-describedby` on it. */
+    default(props: {
+        id: string;
+        ariaInvalid: "true" | undefined;
+        ariaDescribedby: string | undefined;
+    }): unknown;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Field/EField.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,49 @@
+/* empty css                */
+import { useUid as e } from "../../composables/useUid.js";
+import t from "./EFieldFlag.js";
+import n from "./EFieldMessage.js";
+import { computed as r, createElementBlock as i, createElementVNode as a, createTextVNode as o, createVNode as s, defineComponent as c, normalizeClass as l, openBlock as u, renderSlot as d, toDisplayString as f, unref as p } from "vue";
+//#region src/components/Field/EField.vue?vue&type=script&setup=true&lang.ts
+var m = { class: "e-field" }, h = ["id", "for"], g = /*@__PURE__*/ c({
+	__name: "EField",
+	props: {
+		label: {},
+		hideLabel: { type: Boolean },
+		hint: {},
+		error: {},
+		required: { type: Boolean },
+		optional: { type: Boolean },
+		id: {}
+	},
+	setup(c) {
+		let g = c, _ = e(() => g.id), v = r(() => `${_.value}-hint`);
+		return (e, r) => (u(), i("div", m, [
+			a("label", {
+				id: `${p(_)}-label`,
+				class: l(["e-field-label e-kicker", { "e-sr": c.hideLabel }]),
+				for: p(_)
+			}, [o(f(c.label) + " ", 1), s(t, {
+				required: c.required,
+				optional: c.optional
+			}, null, 8, ["required", "optional"])], 10, h),
+			d(e.$slots, "default", {
+				id: p(_),
+				ariaInvalid: c.error ? "true" : void 0,
+				ariaDescribedby: c.error || c.hint ? v.value : void 0
+			}),
+			s(n, {
+				id: v.value,
+				error: c.error,
+				hint: c.hint
+			}, null, 8, [
+				"id",
+				"error",
+				"hint"
+			])
+		]));
+	}
+});
+//#endregion
+export { g as default };
+
+//# sourceMappingURL=EField.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/Field/EField.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EField.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createElementVNode","_unref","_normalizeClass","_createTextVNode","_toDisplayString","_createVNode","EFieldFlag","_renderSlot","EFieldMessage","EFieldFlag_default","EFieldMessage_default","_hoisted_1","_hoisted_2","EField_vue_vue_type_script_setup_true_lang_default","props","__props","id","useUid","hintId","computed","openBlock","createElementBlock","createElementVNode","unref","normalizeClass","createTextVNode","toDisplayString","createVNode","renderSlot","_ctx"],"sources":["../../../src/components/Field/EField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport EFieldFlag from \"./EFieldFlag.vue\";\nimport EFieldMessage from \"./EFieldMessage.vue\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n  /** The visible label, a small mono kicker above the control. */\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 control. */\n  hint?: string;\n  /** What to fix. Replaces the hint, turns the control 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  /** The id of the control; the label points at it. Generated when left out. */\n  id?: string;\n}>();\n\ndefineSlots<{\n  /** The control. Put `id`, `aria-invalid` and `aria-describedby` on it. */\n  default(props: { id: string; ariaInvalid: \"true\" | undefined; ariaDescribedby: string | undefined }): unknown;\n}>();\n\nconst id = useUid(() => props.id);\nconst hintId = computed(() => `${id.value}-hint`);\n</script>\n\n<template>\n  <div class=\"e-field\">\n    <label :id=\"`${id}-label`\" class=\"e-field-label e-kicker\" :class=\"{ 'e-sr': hideLabel }\" :for=\"id\">\n      {{ label }}\n      <EFieldFlag :required=\"required\" :optional=\"optional\" />\n    </label>\n    <slot :id=\"id\" :aria-invalid=\"error ? 'true' : undefined\" :aria-describedby=\"error || hint ? hintId : undefined\" />\n    <EFieldMessage :id=\"hintId\" :error=\"error\" :hint=\"hint\" />\n  </div>\n</template>\n\n<style>\n@layer e.controls {\n  .e-field {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr);\n    align-content: start;\n    gap: var(--e-space-2);\n    min-width: 0;\n  }\n\n  .e-field-label {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--e-space-3);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAOA,IAAMgB,IAAQC,GAsBRC,IAAKC,QAAaH,EAAM,EAAE,GAC1BI,IAASC,QAAe,GAAGH,EAAG,MAAM,MAAM;E,kBAI9ClB,EAAA,GAAAC,EAOM,OAPNY,GAOM;GANJX,EAGQ,SAAA;IAHA,IAAE,GAAKC,EAAAe,CAAA,EAAE;IAAU,OAAKd,EAAA,CAAC,0BAAwB,EAAA,QAAmBa,EAAA,UAAS,CAAA,CAAA;IAAK,KAAKd,EAAAe,CAAA;G,IAC1Fb,EAAAC,EAAAW,EAAA,KAAK,IAAG,KACX,CAAA,GAAAV,EAAwDC,GAAA;IAA3C,UAAUS,EAAA;IAAW,UAAUA,EAAA;;GAE9CR,EAAmHsB,EAAA,QAAA,WAAA;IAA5G,IAAI5B,EAAAe,CAAA;IAAK,aAAcD,EAAA,QAAK,SAAY,KAAA;IAAY,iBAAkBA,EAAA,SAASA,EAAA,OAAOG,EAAA,QAAS,KAAA;;GACtGb,EAA0DG,GAAA;IAA1C,IAAIU,EAAA;IAAS,OAAOH,EAAA;IAAQ,MAAMA,EAAA"}

package/dist/components/Field/EFieldFlag.js

@@ -0,0 +1,8 @@
+import e from "./EFieldFlag.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                           */
+//#region src/components/Field/EFieldFlag.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=EFieldFlag.js.map

package/dist/components/Field/EFieldFlag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFieldFlag.js","names":["_sfc_main","EFieldFlag_vue_vue_type_script_setup_true_lang_default","EFieldFlag_default"],"sources":["../../../src/components/Field/EFieldFlag.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useMessages } from \"../../config.js\";\n\ndefineProps<{\n  /** Show the word \"Required\". */\n  required?: boolean;\n  /** Show the word \"Optional\". Flag whichever is rarer. */\n  optional?: boolean;\n}>();\n\nconst t = useMessages();\n</script>\n\n<template>\n  <span v-if=\"required || optional\" class=\"e-field-flag\">{{ required ? t(\"required\") : t(\"optional\") }}</span>\n</template>\n\n<style>\n@layer e.controls {\n  .e-field-flag {\n    font: 400 var(--e-text-sm)/1.2 var(--e-font-sans);\n    letter-spacing: 0;\n    text-transform: none;\n    color: var(--e-muted);\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/Field/EFieldFlag.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    /** Show the word "Required". */
+    required?: boolean;
+    /** Show the word "Optional". Flag whichever is rarer. */
+    optional?: boolean;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/Field/EFieldFlag.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,21 @@
+import { useMessages as e } from "../../config.js";
+import { createCommentVNode as t, createElementBlock as n, defineComponent as r, openBlock as i, toDisplayString as a, unref as o } from "vue";
+//#region src/components/Field/EFieldFlag.vue?vue&type=script&setup=true&lang.ts
+var s = {
+	key: 0,
+	class: "e-field-flag"
+}, c = /*@__PURE__*/ r({
+	__name: "EFieldFlag",
+	props: {
+		required: { type: Boolean },
+		optional: { type: Boolean }
+	},
+	setup(r) {
+		let c = e();
+		return (e, l) => r.required || r.optional ? (i(), n("span", s, a(r.required ? o(c)("required") : o(c)("optional")), 1)) : t("", !0);
+	}
+});
+//#endregion
+export { c as default };
+
+//# sourceMappingURL=EFieldFlag.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/Field/EFieldFlag.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFieldFlag.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_toDisplayString","_unref","_createCommentVNode","_hoisted_1","EFieldFlag_vue_vue_type_script_setup_true_lang_default","t","useMessages","__props","openBlock","createElementBlock","toDisplayString","unref","createCommentVNode"],"sources":["../../../src/components/Field/EFieldFlag.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useMessages } from \"../../config.js\";\n\ndefineProps<{\n  /** Show the word \"Required\". */\n  required?: boolean;\n  /** Show the word \"Optional\". Flag whichever is rarer. */\n  optional?: boolean;\n}>();\n\nconst t = useMessages();\n</script>\n\n<template>\n  <span v-if=\"required || optional\" class=\"e-field-flag\">{{ required ? t(\"required\") : t(\"optional\") }}</span>\n</template>\n\n<style>\n@layer e.controls {\n  .e-field-flag {\n    font: 400 var(--e-text-sm)/1.2 var(--e-font-sans);\n    letter-spacing: 0;\n    text-transform: none;\n    color: var(--e-muted);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;EAUA,IAAMO,IAAIC,EAAY;E,iBAIRC,EAAA,YAAYA,EAAA,YAAxBT,EAAA,GAAAC,EAA4G,QAA5GI,GAA4GH,EAAlDO,EAAA,WAAWN,EAAAI,CAAA,CAAC,CAAA,UAAA,IAAeJ,EAAAI,CAAA,CAAC,CAAA,UAAA,CAAA,GAAA,CAAA,K"}

package/dist/components/Field/EFieldMessage.js

@@ -0,0 +1,8 @@
+import e from "./EFieldMessage.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                              */
+//#region src/components/Field/EFieldMessage.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=EFieldMessage.js.map

package/dist/components/Field/EFieldMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFieldMessage.js","names":["_sfc_main","EFieldMessage_vue_vue_type_script_setup_true_lang_default","EFieldMessage_default"],"sources":["../../../src/components/Field/EFieldMessage.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport EIcon from \"../Icon/EIcon.vue\";\n\ndefineProps<{\n  /** The id that `aria-describedby` points at. */\n  id: string;\n  /** What to fix. Replaces the hint, is announced (`role=\"alert\"`) and carries an alert glyph. */\n  error?: string | undefined;\n  /** Help that stays under the control. */\n  hint?: string | undefined;\n}>();\n</script>\n\n<template>\n  <p v-if=\"error\" :id=\"id\" class=\"e-field-error\" role=\"alert\">\n    <EIcon name=\"alert\" />\n    {{ error }}\n  </p>\n  <p v-else-if=\"hint\" :id=\"id\" class=\"e-field-hint\">{{ hint }}</p>\n</template>\n\n<style>\n@layer e.controls {\n  .e-field-hint {\n    font: 400 var(--e-text-sm)/1.4 var(--e-font-sans);\n    color: var(--e-muted);\n    margin: 0;\n  }\n\n  .e-field-error {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--e-space-1);\n    font: 500 var(--e-text-sm)/1.4 var(--e-font-sans);\n    color: var(--e-danger);\n    margin: 0;\n  }\n\n  .e-field-error .e-icon {\n    width: 16px;\n    height: 16px;\n    margin-top: 2px;\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/Field/EFieldMessage.vue.d.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    /** The id that `aria-describedby` points at. */
+    id: string;
+    /** What to fix. Replaces the hint, is announced (`role="alert"`) and carries an alert glyph. */
+    error?: string | undefined;
+    /** Help that stays under the control. */
+    hint?: string | undefined;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/Field/EFieldMessage.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,27 @@
+import e from "../Icon/EIcon.js";
+import { createCommentVNode as t, createElementBlock as n, createTextVNode as r, createVNode as i, defineComponent as a, openBlock as o, toDisplayString as s } from "vue";
+//#region src/components/Field/EFieldMessage.vue?vue&type=script&setup=true&lang.ts
+var c = ["id"], l = ["id"], u = /*@__PURE__*/ a({
+	__name: "EFieldMessage",
+	props: {
+		id: {},
+		error: {},
+		hint: {}
+	},
+	setup(a) {
+		return (u, d) => a.error ? (o(), n("p", {
+			key: 0,
+			id: a.id,
+			class: "e-field-error",
+			role: "alert"
+		}, [i(e, { name: "alert" }), r(" " + s(a.error), 1)], 8, c)) : a.hint ? (o(), n("p", {
+			key: 1,
+			id: a.id,
+			class: "e-field-hint"
+		}, s(a.hint), 9, l)) : t("", !0);
+	}
+});
+//#endregion
+export { u as default };
+
+//# sourceMappingURL=EFieldMessage.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/Field/EFieldMessage.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFieldMessage.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createVNode","EIcon","_createTextVNode","_toDisplayString","_createCommentVNode","EIcon_default","_hoisted_1","_hoisted_2","EFieldMessage_vue_vue_type_script_setup_true_lang_default","__props","openBlock","createElementBlock","createVNode","createTextVNode","toDisplayString","createCommentVNode"],"sources":["../../../src/components/Field/EFieldMessage.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport EIcon from \"../Icon/EIcon.vue\";\n\ndefineProps<{\n  /** The id that `aria-describedby` points at. */\n  id: string;\n  /** What to fix. Replaces the hint, is announced (`role=\"alert\"`) and carries an alert glyph. */\n  error?: string | undefined;\n  /** Help that stays under the control. */\n  hint?: string | undefined;\n}>();\n</script>\n\n<template>\n  <p v-if=\"error\" :id=\"id\" class=\"e-field-error\" role=\"alert\">\n    <EIcon name=\"alert\" />\n    {{ error }}\n  </p>\n  <p v-else-if=\"hint\" :id=\"id\" class=\"e-field-hint\">{{ hint }}</p>\n</template>\n\n<style>\n@layer e.controls {\n  .e-field-hint {\n    font: 400 var(--e-text-sm)/1.4 var(--e-font-sans);\n    color: var(--e-muted);\n    margin: 0;\n  }\n\n  .e-field-error {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--e-space-1);\n    font: 500 var(--e-text-sm)/1.4 var(--e-font-sans);\n    color: var(--e-danger);\n    margin: 0;\n  }\n\n  .e-field-error .e-icon {\n    width: 16px;\n    height: 16px;\n    margin-top: 2px;\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;E,iBAcWW,EAAA,SAATX,EAAA,GAAAC,EAGI,KAAA;;GAHa,IAAIU,EAAA;GAAI,OAAM;GAAgB,MAAK;E,IAClDT,EAAsBC,GAAA,EAAf,MAAK,QAAO,CAAA,GAAGC,EAAA,MACtBC,EAAGM,EAAA,KAAK,GAAA,CAAA,C,YAEIA,EAAA,QAAdX,EAAA,GAAAC,EAAgE,KAAA;;GAA3C,IAAIU,EAAA;GAAI,OAAM;EAAkB,GAAAN,EAAAM,EAAA,IAAI,GAAA,GAAAF,CAAA,K"}

package/dist/components/Field/index.d.ts

@@ -0,0 +1 @@
+export { default as EField } from './EField.vue.js';

package/dist/components/Field/labelProps.d.ts

@@ -0,0 +1,15 @@
+/** The label API shared by ESelect, ECombobox, EAutocomplete and EMultiSelect: a `label`, or `bare` with an accessible name. */
+export type ELabelProps = {
+    /** Keep the label for screen readers and remove it from the page. */
+    hideLabel?: boolean;
+    /** The accessible name when `bare`. */
+    ariaLabel?: string;
+} & ({
+    /** The visible label, a mono kicker above the control. It also names the list. Required unless `bare`. */
+    label: string;
+    /** Only the control, no label, hint or error. Give it `label` or `ariaLabel`. For dense places such as table filters. */
+    bare?: boolean;
+} | {
+    label?: string;
+    bare: true;
+});

package/dist/components/Fieldset/EFieldset.js

@@ -0,0 +1,8 @@
+import e from "./EFieldset.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                          */
+//#region src/components/Fieldset/EFieldset.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=EFieldset.js.map

package/dist/components/Fieldset/EFieldset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFieldset.js","names":["_sfc_main","EFieldset_vue_vue_type_script_setup_true_lang_default","EFieldset_default"],"sources":["../../../src/components/Fieldset/EFieldset.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport EFieldFlag from \"../Field/EFieldFlag.vue\";\nimport EFieldMessage from \"../Field/EFieldMessage.vue\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n  /** The question the controls answer. Names the group for screen readers. */\n  legend?: string;\n  /** No box: the legend becomes a small mono label above the controls (RadioGroup, SlotPicker). */\n  bare?: boolean;\n  /** Help that is announced with the group. */\n  hint?: string;\n  /** What to fix. Replaces the hint and is announced with the group. */\n  error?: string;\n  /** A word at the end of the legend. */\n  required?: boolean;\n  /** A word at the end of the legend. Flag whichever is rarer. */\n  optional?: boolean;\n  /** Disables every control inside. */\n  disabled?: boolean;\n  /** Extra classes for the legend. */\n  legendClass?: string;\n  /** Keep the legend for screen readers and remove it from the page. */\n  hideLegend?: boolean;\n  /** The id the hint and error ids are built from. Generated when left out. */\n  id?: string;\n}>();\n\ndefineSlots<{\n  /** The controls. */\n  default(): unknown;\n}>();\n\nconst id = useUid(() => props.id);\nconst hintId = computed(() => `${id.value}-hint`);\n</script>\n\n<template>\n  <fieldset\n    class=\"e-fieldset\"\n    :class=\"{ 'e-fieldset--box': !bare }\"\n    :disabled=\"disabled\"\n    :aria-describedby=\"error || hint ? hintId : undefined\"\n    :aria-invalid=\"error ? 'true' : undefined\"\n  >\n    <legend\n      v-if=\"legend\"\n      class=\"e-fieldset-legend\"\n      :class=\"[bare && 'e-kicker', hideLegend && 'e-fieldset-legend--hidden', legendClass]\"\n    >\n      <span class=\"e-fieldset-title\">{{ legend }}</span>\n      <span v-if=\"!bare\" class=\"e-fieldset-rule\" aria-hidden=\"true\" />\n      <EFieldFlag :required=\"required\" :optional=\"optional\" />\n    </legend>\n    <template v-if=\"bare\">\n      <slot />\n      <EFieldMessage :id=\"hintId\" :error=\"error\" :hint=\"hint\" />\n    </template>\n    <div v-else class=\"e-fieldset-body\">\n      <slot />\n      <EFieldMessage :id=\"hintId\" :error=\"error\" :hint=\"hint\" />\n    </div>\n  </fieldset>\n</template>\n\n<style>\n@layer e.controls {\n  .e-fieldset {\n    min-width: 0;\n    margin: 0;\n    padding: 0;\n    border: 0;\n  }\n\n  .e-fieldset-legend {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--e-space-3);\n    width: 100%;\n    padding: 0;\n  }\n\n  .e-fieldset-legend--hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    overflow: hidden;\n    clip-path: inset(50%);\n    white-space: nowrap;\n  }\n\n  .e-fieldset:not(.e-fieldset--box) > .e-fieldset-legend {\n    float: inline-start;\n    margin-bottom: var(--e-space-2);\n  }\n\n  .e-fieldset:not(.e-fieldset--box) > .e-fieldset-legend + * {\n    clear: both;\n  }\n\n  .e-fieldset--box {\n    padding: 0 var(--e-space-4) var(--e-space-4);\n    border: var(--e-stroke-hair) solid var(--e-border);\n    border-radius: var(--e-radius-md);\n    background: var(--e-surface);\n  }\n\n  .e-fieldset--box > .e-fieldset-legend {\n    align-items: center;\n    gap: 0;\n    font: 500 var(--e-text-md)/1.3 var(--e-font-sans);\n    letter-spacing: 0;\n    text-transform: none;\n    color: var(--e-ink);\n  }\n\n  .e-fieldset--box .e-fieldset-title,\n  .e-fieldset--box .e-field-flag {\n    padding-inline: var(--e-space-3);\n  }\n\n  .e-fieldset-rule {\n    flex: 1;\n    min-width: var(--e-space-4);\n    border-top: var(--e-stroke-hair) solid var(--e-border);\n  }\n\n  .e-fieldset-body {\n    display: grid;\n    gap: var(--e-space-4);\n    padding-top: var(--e-space-1);\n  }\n\n  .e-fieldset:not(.e-slots) > .e-field-hint,\n  .e-fieldset:not(.e-slots) > .e-field-error {\n    margin-top: -6px;\n  }\n\n  .e-fieldset-body > .e-field-hint,\n  .e-fieldset-body > .e-field-error {\n    margin-top: calc(var(--e-space-4) * -1 + var(--e-space-2));\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/Fieldset/EFieldset.vue.d.ts

@@ -0,0 +1,35 @@
+type __VLS_Props = {
+    /** The question the controls answer. Names the group for screen readers. */
+    legend?: string;
+    /** No box: the legend becomes a small mono label above the controls (RadioGroup, SlotPicker). */
+    bare?: boolean;
+    /** Help that is announced with the group. */
+    hint?: string;
+    /** What to fix. Replaces the hint and is announced with the group. */
+    error?: string;
+    /** A word at the end of the legend. */
+    required?: boolean;
+    /** A word at the end of the legend. Flag whichever is rarer. */
+    optional?: boolean;
+    /** Disables every control inside. */
+    disabled?: boolean;
+    /** Extra classes for the legend. */
+    legendClass?: string;
+    /** Keep the legend for screen readers and remove it from the page. */
+    hideLegend?: boolean;
+    /** The id the hint and error ids are built from. Generated when left out. */
+    id?: string;
+};
+type __VLS_Slots = {
+    /** The controls. */
+    default(): unknown;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Fieldset/EFieldset.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,75 @@
+/* empty css                */
+import { useUid as e } from "../../composables/useUid.js";
+import t from "../Field/EFieldFlag.js";
+import n from "../Field/EFieldMessage.js";
+import { Fragment as r, computed as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createVNode as c, defineComponent as l, normalizeClass as u, openBlock as d, renderSlot as f, toDisplayString as p } from "vue";
+//#region src/components/Fieldset/EFieldset.vue?vue&type=script&setup=true&lang.ts
+var m = [
+	"disabled",
+	"aria-describedby",
+	"aria-invalid"
+], h = { class: "e-fieldset-title" }, g = {
+	key: 0,
+	class: "e-fieldset-rule",
+	"aria-hidden": "true"
+}, _ = {
+	key: 2,
+	class: "e-fieldset-body"
+}, v = /*@__PURE__*/ l({
+	__name: "EFieldset",
+	props: {
+		legend: {},
+		bare: { type: Boolean },
+		hint: {},
+		error: {},
+		required: { type: Boolean },
+		optional: { type: Boolean },
+		disabled: { type: Boolean },
+		legendClass: {},
+		hideLegend: { type: Boolean },
+		id: {}
+	},
+	setup(l) {
+		let v = l, y = e(() => v.id), b = i(() => `${y.value}-hint`);
+		return (e, i) => (d(), o("fieldset", {
+			class: u(["e-fieldset", { "e-fieldset--box": !l.bare }]),
+			disabled: l.disabled,
+			"aria-describedby": l.error || l.hint ? b.value : void 0,
+			"aria-invalid": l.error ? "true" : void 0
+		}, [l.legend ? (d(), o("legend", {
+			key: 0,
+			class: u(["e-fieldset-legend", [
+				l.bare && "e-kicker",
+				l.hideLegend && "e-fieldset-legend--hidden",
+				l.legendClass
+			]])
+		}, [
+			s("span", h, p(l.legend), 1),
+			l.bare ? a("", !0) : (d(), o("span", g)),
+			c(t, {
+				required: l.required,
+				optional: l.optional
+			}, null, 8, ["required", "optional"])
+		], 2)) : a("", !0), l.bare ? (d(), o(r, { key: 1 }, [f(e.$slots, "default"), c(n, {
+			id: b.value,
+			error: l.error,
+			hint: l.hint
+		}, null, 8, [
+			"id",
+			"error",
+			"hint"
+		])], 64)) : (d(), o("div", _, [f(e.$slots, "default"), c(n, {
+			id: b.value,
+			error: l.error,
+			hint: l.hint
+		}, null, 8, [
+			"id",
+			"error",
+			"hint"
+		])]))], 10, m));
+	}
+});
+//#endregion
+export { v as default };
+
+//# sourceMappingURL=EFieldset.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/Fieldset/EFieldset.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFieldset.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_toDisplayString","_createCommentVNode","_createVNode","EFieldFlag","_Fragment","_renderSlot","EFieldMessage","EFieldFlag_default","EFieldMessage_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","EFieldset_vue_vue_type_script_setup_true_lang_default","props","__props","id","useUid","hintId","computed","openBlock","createElementBlock","normalizeClass","createElementVNode","toDisplayString","createCommentVNode","createVNode","Fragment","renderSlot","_ctx"],"sources":["../../../src/components/Fieldset/EFieldset.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport EFieldFlag from \"../Field/EFieldFlag.vue\";\nimport EFieldMessage from \"../Field/EFieldMessage.vue\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\n\nconst props = defineProps<{\n  /** The question the controls answer. Names the group for screen readers. */\n  legend?: string;\n  /** No box: the legend becomes a small mono label above the controls (RadioGroup, SlotPicker). */\n  bare?: boolean;\n  /** Help that is announced with the group. */\n  hint?: string;\n  /** What to fix. Replaces the hint and is announced with the group. */\n  error?: string;\n  /** A word at the end of the legend. */\n  required?: boolean;\n  /** A word at the end of the legend. Flag whichever is rarer. */\n  optional?: boolean;\n  /** Disables every control inside. */\n  disabled?: boolean;\n  /** Extra classes for the legend. */\n  legendClass?: string;\n  /** Keep the legend for screen readers and remove it from the page. */\n  hideLegend?: boolean;\n  /** The id the hint and error ids are built from. Generated when left out. */\n  id?: string;\n}>();\n\ndefineSlots<{\n  /** The controls. */\n  default(): unknown;\n}>();\n\nconst id = useUid(() => props.id);\nconst hintId = computed(() => `${id.value}-hint`);\n</script>\n\n<template>\n  <fieldset\n    class=\"e-fieldset\"\n    :class=\"{ 'e-fieldset--box': !bare }\"\n    :disabled=\"disabled\"\n    :aria-describedby=\"error || hint ? hintId : undefined\"\n    :aria-invalid=\"error ? 'true' : undefined\"\n  >\n    <legend\n      v-if=\"legend\"\n      class=\"e-fieldset-legend\"\n      :class=\"[bare && 'e-kicker', hideLegend && 'e-fieldset-legend--hidden', legendClass]\"\n    >\n      <span class=\"e-fieldset-title\">{{ legend }}</span>\n      <span v-if=\"!bare\" class=\"e-fieldset-rule\" aria-hidden=\"true\" />\n      <EFieldFlag :required=\"required\" :optional=\"optional\" />\n    </legend>\n    <template v-if=\"bare\">\n      <slot />\n      <EFieldMessage :id=\"hintId\" :error=\"error\" :hint=\"hint\" />\n    </template>\n    <div v-else class=\"e-fieldset-body\">\n      <slot />\n      <EFieldMessage :id=\"hintId\" :error=\"error\" :hint=\"hint\" />\n    </div>\n  </fieldset>\n</template>\n\n<style>\n@layer e.controls {\n  .e-fieldset {\n    min-width: 0;\n    margin: 0;\n    padding: 0;\n    border: 0;\n  }\n\n  .e-fieldset-legend {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--e-space-3);\n    width: 100%;\n    padding: 0;\n  }\n\n  .e-fieldset-legend--hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    overflow: hidden;\n    clip-path: inset(50%);\n    white-space: nowrap;\n  }\n\n  .e-fieldset:not(.e-fieldset--box) > .e-fieldset-legend {\n    float: inline-start;\n    margin-bottom: var(--e-space-2);\n  }\n\n  .e-fieldset:not(.e-fieldset--box) > .e-fieldset-legend + * {\n    clear: both;\n  }\n\n  .e-fieldset--box {\n    padding: 0 var(--e-space-4) var(--e-space-4);\n    border: var(--e-stroke-hair) solid var(--e-border);\n    border-radius: var(--e-radius-md);\n    background: var(--e-surface);\n  }\n\n  .e-fieldset--box > .e-fieldset-legend {\n    align-items: center;\n    gap: 0;\n    font: 500 var(--e-text-md)/1.3 var(--e-font-sans);\n    letter-spacing: 0;\n    text-transform: none;\n    color: var(--e-ink);\n  }\n\n  .e-fieldset--box .e-fieldset-title,\n  .e-fieldset--box .e-field-flag {\n    padding-inline: var(--e-space-3);\n  }\n\n  .e-fieldset-rule {\n    flex: 1;\n    min-width: var(--e-space-4);\n    border-top: var(--e-stroke-hair) solid var(--e-border);\n  }\n\n  .e-fieldset-body {\n    display: grid;\n    gap: var(--e-space-4);\n    padding-top: var(--e-space-1);\n  }\n\n  .e-fieldset:not(.e-slots) > .e-field-hint,\n  .e-fieldset:not(.e-slots) > .e-field-error {\n    margin-top: -6px;\n  }\n\n  .e-fieldset-body > .e-field-hint,\n  .e-fieldset-body > .e-field-error {\n    margin-top: calc(var(--e-space-4) * -1 + var(--e-space-2));\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOA,IAAMkB,IAAQC,GA4BRC,IAAKC,QAAaH,EAAM,EAAE,GAC1BI,IAASC,QAAe,GAAGH,EAAG,MAAM,MAAM;E,kBAI9CpB,EAAA,GAAAC,EAwBW,YAAA;GAvBT,OAAKC,EAAA,CAAC,cAAY,EAAA,mBAAA,CACYiB,EAAA,KAAI,CAAA,CAAA;GACjC,UAAUA,EAAA;GACV,oBAAkBA,EAAA,SAASA,EAAA,OAAOG,EAAA,QAAS,KAAA;GAC3C,gBAAcH,EAAA,QAAK,SAAY,KAAA;E,IAGxBA,EAAA,UADRnB,EAAA,GAAAC,EAQS,UAAA;;GANP,OAAKC,EAAA,CAAC,qBAAmB;IAChBiB,EAAA,QAAI;IAAgBA,EAAA,cAAU;IAAiCA,EAAA;GAAW,CAAA,CAAA;;GAEnFhB,EAAkD,QAAlDW,GAAkDV,EAAhBe,EAAA,MAAM,GAAA,CAAA;GAC3BA,EAAA,O,aAAbnB,EAAA,GAAAC,EAAgE,QAAhEc,CAAgE;GAChET,EAAwDC,GAAA;IAA3C,UAAUY,EAAA;IAAW,UAAUA,EAAA;;E,oBAE9BA,EAAA,QAAhBnB,EAAA,GAAAC,EAGWO,GAAA,EAAA,KAAA,EAAA,GAAA,CAFTC,EAAQwB,EAAA,QAAA,SAAA,GACR3B,EAA0DI,GAAA;GAA1C,IAAIY,EAAA;GAAS,OAAOH,EAAA;GAAQ,MAAMA,EAAA;;;;;E,aAEpDnB,EAAA,GAAAC,EAGM,OAHNe,GAGM,CAFJP,EAAQwB,EAAA,QAAA,SAAA,GACR3B,EAA0DI,GAAA;GAA1C,IAAIY,EAAA;GAAS,OAAOH,EAAA;GAAQ,MAAMA,EAAA"}

package/dist/components/Fieldset/index.d.ts

@@ -0,0 +1 @@
+export { default as EFieldset } from './EFieldset.vue.js';

package/dist/components/FormSection/EFormSection.js

@@ -0,0 +1,8 @@
+import e from "./EFormSection.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                             */
+//#region src/components/FormSection/EFormSection.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=EFormSection.js.map

package/dist/components/FormSection/EFormSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFormSection.js","names":["_sfc_main","EFormSection_vue_vue_type_script_setup_true_lang_default","EFormSection_default"],"sources":["../../../src/components/FormSection/EFormSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport EStack from \"../Stack/EStack.vue\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\n\nconst props = withDefaults(\n  defineProps<{\n    /** The question the section answers, such as \"Your details\". */\n    title: string;\n    /** A short line under the title. */\n    description?: string;\n    /** The heading element, 1 to 4. */\n    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;\n    /** Space between the fields: a space token number (1, 2, 3, 4, 6, 8) or any CSS length. */\n    gap?: number | string;\n    /** The id of the heading; the section is labelled by it. Generated when left out. */\n    id?: string;\n  }>(),\n  { headingLevel: 2, gap: 4 },\n);\n\ndefineSlots<{\n  /** The fields, spaced evenly. */\n  default(): unknown;\n}>();\n\nconst id = useUid(() => props.id);\n</script>\n\n<template>\n  <section class=\"e-formsection\" :aria-labelledby=\"id\">\n    <div class=\"e-formsection-head\">\n      <component :is=\"`h${headingLevel}`\" :id=\"id\" class=\"e-formsection-title\">{{ title }}</component>\n      <p v-if=\"description\" class=\"e-formsection-desc\">{{ description }}</p>\n    </div>\n    <EStack :gap=\"gap\"><slot /></EStack>\n  </section>\n</template>\n\n<style>\n@layer e.composites {\n  .e-formsection {\n    display: grid;\n    gap: var(--e-space-4);\n    padding-top: var(--e-space-6);\n    border-top: var(--e-stroke-hair) solid var(--e-border);\n  }\n\n  .e-formsection:first-child {\n    padding-top: 0;\n    border-top: 0;\n  }\n\n  .e-formsection-title {\n    margin: 0;\n    font: 500 var(--e-text-xl)/1.25 var(--e-font-sans);\n  }\n\n  .e-formsection-desc {\n    margin: var(--e-space-1) 0 0;\n    max-width: var(--e-measure);\n    font: 400 var(--e-text-md)/1.45 var(--e-font-sans);\n    color: var(--e-muted);\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/FormSection/EFormSection.vue.d.ts

@@ -0,0 +1,28 @@
+type __VLS_Props = {
+    /** The question the section answers, such as "Your details". */
+    title: string;
+    /** A short line under the title. */
+    description?: string;
+    /** The heading element, 1 to 4. */
+    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+    /** Space between the fields: a space token number (1, 2, 3, 4, 6, 8) or any CSS length. */
+    gap?: number | string;
+    /** The id of the heading; the section is labelled by it. Generated when left out. */
+    id?: string;
+};
+type __VLS_Slots = {
+    /** The fields, spaced evenly. */
+    default(): unknown;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    headingLevel: 1 | 2 | 3 | 4 | 5 | 6;
+    gap: string | number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/FormSection/EFormSection.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,38 @@
+/* empty css                */
+import { useUid as e } from "../../composables/useUid.js";
+import t from "../Stack/EStack.js";
+import { createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createTextVNode as o, createVNode as s, defineComponent as c, openBlock as l, renderSlot as u, resolveDynamicComponent as d, toDisplayString as f, unref as p, withCtx as m } from "vue";
+//#region src/components/FormSection/EFormSection.vue?vue&type=script&setup=true&lang.ts
+var h = ["aria-labelledby"], g = { class: "e-formsection-head" }, _ = {
+	key: 0,
+	class: "e-formsection-desc"
+}, v = /*@__PURE__*/ c({
+	__name: "EFormSection",
+	props: {
+		title: {},
+		description: {},
+		headingLevel: { default: 2 },
+		gap: { default: 4 },
+		id: {}
+	},
+	setup(c) {
+		let v = c, y = e(() => v.id);
+		return (e, v) => (l(), i("section", {
+			class: "e-formsection",
+			"aria-labelledby": p(y)
+		}, [a("div", g, [(l(), n(d(`h${c.headingLevel}`), {
+			id: p(y),
+			class: "e-formsection-title"
+		}, {
+			default: m(() => [o(f(c.title), 1)]),
+			_: 1
+		}, 8, ["id"])), c.description ? (l(), i("p", _, f(c.description), 1)) : r("", !0)]), s(t, { gap: c.gap }, {
+			default: m(() => [u(e.$slots, "default")]),
+			_: 3
+		}, 8, ["gap"])], 8, h));
+	}
+});
+//#endregion
+export { v as default };
+
+//# sourceMappingURL=EFormSection.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/FormSection/EFormSection.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EFormSection.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_unref","_createElementVNode","_createBlock","_resolveDynamicComponent","_withCtx","_createTextVNode","_toDisplayString","_createCommentVNode","_createVNode","EStack","_renderSlot","EStack_default","_hoisted_1","_hoisted_2","_hoisted_3","EFormSection_vue_vue_type_script_setup_true_lang_default","props","__props","id","useUid","openBlock","createElementBlock","unref","createElementVNode","createBlock","resolveDynamicComponent","withCtx","createTextVNode","toDisplayString","createCommentVNode","createVNode","renderSlot","_ctx"],"sources":["../../../src/components/FormSection/EFormSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport EStack from \"../Stack/EStack.vue\";\nimport { useUid } from \"../../composables/useUid.js\";\nimport \"../../styles/base.css\";\n\nconst props = withDefaults(\n  defineProps<{\n    /** The question the section answers, such as \"Your details\". */\n    title: string;\n    /** A short line under the title. */\n    description?: string;\n    /** The heading element, 1 to 4. */\n    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;\n    /** Space between the fields: a space token number (1, 2, 3, 4, 6, 8) or any CSS length. */\n    gap?: number | string;\n    /** The id of the heading; the section is labelled by it. Generated when left out. */\n    id?: string;\n  }>(),\n  { headingLevel: 2, gap: 4 },\n);\n\ndefineSlots<{\n  /** The fields, spaced evenly. */\n  default(): unknown;\n}>();\n\nconst id = useUid(() => props.id);\n</script>\n\n<template>\n  <section class=\"e-formsection\" :aria-labelledby=\"id\">\n    <div class=\"e-formsection-head\">\n      <component :is=\"`h${headingLevel}`\" :id=\"id\" class=\"e-formsection-title\">{{ title }}</component>\n      <p v-if=\"description\" class=\"e-formsection-desc\">{{ description }}</p>\n    </div>\n    <EStack :gap=\"gap\"><slot /></EStack>\n  </section>\n</template>\n\n<style>\n@layer e.composites {\n  .e-formsection {\n    display: grid;\n    gap: var(--e-space-4);\n    padding-top: var(--e-space-6);\n    border-top: var(--e-stroke-hair) solid var(--e-border);\n  }\n\n  .e-formsection:first-child {\n    padding-top: 0;\n    border-top: 0;\n  }\n\n  .e-formsection-title {\n    margin: 0;\n    font: 500 var(--e-text-xl)/1.25 var(--e-font-sans);\n  }\n\n  .e-formsection-desc {\n    margin: var(--e-space-1) 0 0;\n    max-width: var(--e-measure);\n    font: 400 var(--e-text-md)/1.45 var(--e-font-sans);\n    color: var(--e-muted);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAKA,IAAMkB,IAAQC,GAqBRC,IAAKC,QAAaH,EAAM,EAAE;E,kBAI9BlB,EAAA,GAAAC,EAMU,WAAA;GAND,OAAM;GAAiB,mBAAiBC,EAAAkB,CAAA;E,IAC/CjB,EAGM,OAHNY,GAGM,EAFJf,EAAA,GAAAI,EAAgGC,EAAA,IAA5Ec,EAAA,cAAY,GAAA;GAAK,IAAIjB,EAAAkB,CAAA;GAAI,OAAM;;GAAsB,SAAAd,QAAW,CAARC,EAAAC,EAAAW,EAAA,KAAK,GAAA,CAAA,C;;E,gBACxEA,EAAA,eAATnB,EAAA,GAAAC,EAAsE,KAAtEe,GAAsER,EAAlBW,EAAA,WAAW,GAAA,CAAA,K,aAEjET,EAAoCC,GAAA,EAA3B,KAAKQ,EAAA,IAAG,GAAA;GAAE,SAAAb,QAAQ,CAARM,EAAQsB,EAAA,QAAA,SAAA,C"}

package/dist/components/FormSection/index.d.ts

@@ -0,0 +1 @@
+export { default as EFormSection } from './EFormSection.vue.js';

package/dist/components/Grid/EGrid.js

@@ -0,0 +1,8 @@
+import e from "./EGrid.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                      */
+//#region src/components/Grid/EGrid.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=EGrid.js.map

package/dist/components/Grid/EGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EGrid.js","names":["_sfc_main","EGrid_vue_vue_type_script_setup_true_lang_default","EGrid_default"],"sources":["../../../src/components/Grid/EGrid.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport \"../../styles/base.css\";\n\nconst props = withDefaults(\n  defineProps<{\n    /** The element to render, `div` by default. */\n    as?: string;\n    /** The narrowest a column may be, as a CSS length. One column below that. */\n    min?: string;\n    /** A space token number (1, 2, 3, 4, 6, 8), or any CSS length as a string. */\n    gap?: number | string;\n  }>(),\n  { as: \"div\", min: \"16rem\", gap: 4 },\n);\n\ndefineSlots<{\n  /** The cards. Items stretch to the tallest in their row. */\n  default(): unknown;\n}>();\n\nconst gapValue = computed(() => (typeof props.gap === \"number\" ? `var(--e-space-${props.gap})` : props.gap));\n</script>\n\n<template>\n  <component :is=\"as\" class=\"e-grid-layout\" :style=\"{ '--e-gap': gapValue, '--e-min': min }\">\n    <slot />\n  </component>\n</template>\n\n<style>\n@layer e.blocks {\n  .e-grid-layout {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--e-min, 16rem)), 1fr));\n    gap: var(--e-gap, var(--e-space-4));\n    align-items: stretch;\n  }\n\n  .e-grid-layout > * {\n    min-width: 0;\n  }\n}\n</style>\n"],"mappings":""}

package/dist/components/Grid/EGrid.vue.d.ts

@@ -0,0 +1,25 @@
+type __VLS_Props = {
+    /** The element to render, `div` by default. */
+    as?: string;
+    /** The narrowest a column may be, as a CSS length. One column below that. */
+    min?: string;
+    /** A space token number (1, 2, 3, 4, 6, 8), or any CSS length as a string. */
+    gap?: number | string;
+};
+type __VLS_Slots = {
+    /** The cards. Items stretch to the tallest in their row. */
+    default(): unknown;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    min: string;
+    as: string;
+    gap: string | number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Grid/EGrid.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,28 @@
+/* empty css                */
+import { computed as e, createBlock as t, defineComponent as n, normalizeStyle as r, openBlock as i, renderSlot as a, resolveDynamicComponent as o, withCtx as s } from "vue";
+//#region src/components/Grid/EGrid.vue?vue&type=script&setup=true&lang.ts
+var c = /*@__PURE__*/ n({
+	__name: "EGrid",
+	props: {
+		as: { default: "div" },
+		min: { default: "16rem" },
+		gap: { default: 4 }
+	},
+	setup(n) {
+		let c = n, l = e(() => typeof c.gap == "number" ? `var(--e-space-${c.gap})` : c.gap);
+		return (e, c) => (i(), t(o(n.as), {
+			class: "e-grid-layout",
+			style: r({
+				"--e-gap": l.value,
+				"--e-min": n.min
+			})
+		}, {
+			default: s(() => [a(e.$slots, "default")]),
+			_: 3
+		}, 8, ["style"]));
+	}
+});
+//#endregion
+export { c as default };
+
+//# sourceMappingURL=EGrid.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/Grid/EGrid.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EGrid.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_resolveDynamicComponent","_normalizeStyle","_withCtx","_renderSlot","EGrid_vue_vue_type_script_setup_true_lang_default","props","__props","gapValue","computed","openBlock","createBlock","resolveDynamicComponent","normalizeStyle","withCtx","renderSlot","_ctx"],"sources":["../../../src/components/Grid/EGrid.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport \"../../styles/base.css\";\n\nconst props = withDefaults(\n  defineProps<{\n    /** The element to render, `div` by default. */\n    as?: string;\n    /** The narrowest a column may be, as a CSS length. One column below that. */\n    min?: string;\n    /** A space token number (1, 2, 3, 4, 6, 8), or any CSS length as a string. */\n    gap?: number | string;\n  }>(),\n  { as: \"div\", min: \"16rem\", gap: 4 },\n);\n\ndefineSlots<{\n  /** The cards. Items stretch to the tallest in their row. */\n  default(): unknown;\n}>();\n\nconst gapValue = computed(() => (typeof props.gap === \"number\" ? `var(--e-space-${props.gap})` : props.gap));\n</script>\n\n<template>\n  <component :is=\"as\" class=\"e-grid-layout\" :style=\"{ '--e-gap': gapValue, '--e-min': min }\">\n    <slot />\n  </component>\n</template>\n\n<style>\n@layer e.blocks {\n  .e-grid-layout {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--e-min, 16rem)), 1fr));\n    gap: var(--e-gap, var(--e-space-4));\n    align-items: stretch;\n  }\n\n  .e-grid-layout > * {\n    min-width: 0;\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;EAIA,IAAMO,IAAQC,GAiBRC,IAAWC,QAAgB,OAAOH,EAAM,OAAQ,WAAW,iBAAiBA,EAAM,IAAI,KAAKA,EAAM,GAAI;E,kBAIzGP,EAAA,GAAAC,EAEYC,EAFIM,EAAA,EAAE,GAAA;GAAE,OAAM;GAAiB,OAAKL,EAAA;IAAA,WAAeM,EAAA;IAAQ,WAAaD,EAAA;GAAG,CAAA;;GACrF,SAAAJ,QAAQ,CAARC,EAAQY,EAAA,QAAA,SAAA,C"}

package/dist/components/Grid/index.d.ts

@@ -0,0 +1 @@
+export { default as EGrid } from './EGrid.vue.js';

package/dist/components/Heading/EHeading.js

@@ -0,0 +1,8 @@
+import e from "./EHeading.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                         */
+//#region src/components/Heading/EHeading.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=EHeading.js.map