@vunset/vue 0.0.0-stage → 1.0.0-rc.1

package/dist/components/chart/ChartTooltip.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,21 @@
+import { useChartPart } from "./ChartRoot.vue_vue_type_script_setup_true_lang.js";
+import { defineComponent, useAttrs, useSlots } from "vue";
+//#region src/components/chart/ChartTooltip.vue?vue&type=script&setup=true&lang.ts
+var ChartTooltip_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "ChartTooltip",
+	inheritAttrs: false,
+	__name: "ChartTooltip",
+	setup(__props) {
+		const slots = useSlots();
+		const attrs = useAttrs();
+		useChartPart("tooltip", () => ({
+			attrs,
+			slot: slots.default
+		}));
+		return (_ctx, _cache) => {
+			return null;
+		};
+	}
+});
+//#endregion
+export { ChartTooltip_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/chart/chart-scales.d.ts

@@ -0,0 +1,33 @@
+/**
+ * An evenly spaced few of a row axis' positions, for `numTicks`. The axis
+ * labels every row otherwise, leaving out the ones that would collide.
+ */
+export declare function rowTicks(length: number, count: number | undefined): number[] | undefined;
+/** TanStack's own tick label size, in px, until `--chart-tick-font-size` sets one. */
+export declare const TICK_FONT_SIZE = 11;
+/** An axis' tick labels at `size` px; TanStack lays the axis out for it. */
+export declare const tickLabels: (size: number | undefined) => {
+    tickLabels?: undefined;
+} | {
+    tickLabels: {
+        fontSize: number;
+    };
+};
+/** A row's `xKey` value as its axis label. */
+export declare function rowLabel(row: Record<string, any> | undefined, xKey: string, format?: (value: any) => string): string;
+/** A value axis label: the caller's formatter, or a grouped number. */
+export declare const valueLabel: (raw: number, format?: (value: any) => string) => string;
+/** A plotted value, or a gap where the row has none. */
+export declare const plotted: (raw: unknown) => number | undefined;
+/**
+ * Every series at the row under the pointer. The default only focuses a point
+ * within 48 pixels, which leaves dead zones between sparse rows.
+ */
+export declare const rowFocus: (horizontal?: boolean) => {
+    focus: "group-y" | "group-x";
+    maxFocusDistance: number;
+};
+/** A chart's accessible name: what it plots, in the reader's words. */
+export declare const chartName: (categories: string[], labelFormat: ((category: string) => string) | undefined, fallback: string) => string;
+/** A line's run between its points: bending through them, or straight. TanStack draws straight by default. */
+export declare const curveOf: (curve: "smooth" | "linear") => import("@tanstack/charts").ChartCurve | undefined;

package/dist/components/chart/chart-scales.js

@@ -0,0 +1,39 @@
+import { formatNumber } from "@vunset/utils";
+import { d3Curve } from "@tanstack/charts";
+import { curveMonotoneX } from "d3-shape";
+//#region src/components/chart/chart-scales.ts
+/**
+* An evenly spaced few of a row axis' positions, for `numTicks`. The axis
+* labels every row otherwise, leaving out the ones that would collide.
+*/
+function rowTicks(length, count) {
+	if (count === void 0) return void 0;
+	const step = Math.max(1, Math.ceil(length / Math.max(1, count)));
+	return Array.from({ length }, (_, index) => index).filter((index) => index % step === 0);
+}
+/** An axis' tick labels at `size` px; TanStack lays the axis out for it. */
+var tickLabels = (size) => size === void 0 ? {} : { tickLabels: { fontSize: size } };
+/** A row's `xKey` value as its axis label. */
+function rowLabel(row, xKey, format) {
+	const raw = row?.[xKey];
+	return raw === void 0 ? "" : format ? format(raw) : String(raw);
+}
+/** A value axis label: the caller's formatter, or a grouped number. */
+var valueLabel = (raw, format) => format ? format(raw) : formatNumber(raw);
+/** A plotted value, or a gap where the row has none. */
+var plotted = (raw) => typeof raw === "number" && Number.isFinite(raw) ? raw : void 0;
+/**
+* Every series at the row under the pointer. The default only focuses a point
+* within 48 pixels, which leaves dead zones between sparse rows.
+*/
+var rowFocus = (horizontal = false) => ({
+	focus: horizontal ? "group-y" : "group-x",
+	maxFocusDistance: Number.POSITIVE_INFINITY
+});
+/** A chart's accessible name: what it plots, in the reader's words. */
+var chartName = (categories, labelFormat, fallback) => categories.map((category) => labelFormat ? labelFormat(category) : category).join(", ") || fallback;
+var SMOOTH = d3Curve(curveMonotoneX);
+/** A line's run between its points: bending through them, or straight. TanStack draws straight by default. */
+var curveOf = (curve) => curve === "smooth" ? SMOOTH : void 0;
+//#endregion
+export { chartName, curveOf, plotted, rowFocus, rowLabel, rowTicks, tickLabels, valueLabel };

package/dist/components/chart/use-chart-series.d.ts

@@ -0,0 +1,49 @@
+import { type ComputedRef } from 'vue';
+/** One plotted key, with the color and position it keeps whatever is hidden. */
+export interface ChartSeries {
+    category: string;
+    /** Position in the full list, which is what the color is keyed on. */
+    index: number;
+    color: string;
+}
+export interface ChartContext {
+    categories: ComputedRef<string[]>;
+    colors: ComputedRef<string[]>;
+    /** What each category is called, where the chart names them. */
+    labels?: ComputedRef<string[]>;
+    /** The categories currently not drawn. */
+    hidden: ComputedRef<string[]>;
+    toggle: (category: string) => void;
+}
+/**
+ * Lets a `ChartLegend` nested in a chart drive it without being handed the
+ * categories twice. Optional at the reader: a legend placed beside a chart
+ * rather than inside one takes its own props instead.
+ */
+export declare const provideChartContext: (value: ChartContext) => ChartContext, useChartContext: () => ChartContext, useOptionalChartContext: () => ChartContext | null;
+export interface UseChartSeriesOptions {
+    categories: () => string[];
+    colors: () => string[] | undefined;
+    labels?: () => string[];
+    /** Supplying this makes the hidden list controlled. */
+    hidden: () => string[] | undefined;
+    /** The prop `hidden` comes from, controlled while bound even if `undefined`. */
+    prop?: string;
+    onHiddenChange: (hidden: string[]) => void;
+}
+export interface UseChartSeriesReturn {
+    colors: ComputedRef<string[]>;
+    hidden: ComputedRef<string[]>;
+    /** What to draw, in order, each keeping its original color. */
+    visible: ComputedRef<ChartSeries[]>;
+    toggle: (category: string) => void;
+}
+/**
+ * The categories a chart draws, and which of them are switched off.
+ *
+ * Hiding removes a series rather than zeroing it, so a hidden band leaves no
+ * flat line along the axis and the remaining ones keep the colors they had —
+ * the color is keyed on a category's position in the full list, not in what
+ * happens to be showing.
+ */
+export declare function useChartSeries(options: UseChartSeriesOptions): UseChartSeriesReturn;

package/dist/components/chart/use-chart-series.js

@@ -0,0 +1,53 @@
+import { useControlled } from "../../shared/use-controlled.js";
+import { createContext } from "../../shared/context.js";
+import { computed } from "vue";
+import { chartColors } from "@vunset/utils";
+//#region src/components/chart/use-chart-series.ts
+/**
+* Lets a `ChartLegend` nested in a chart drive it without being handed the
+* categories twice. Optional at the reader: a legend placed beside a chart
+* rather than inside one takes its own props instead.
+*/
+var { provideContext: provideChartContext, useContext: useChartContext, useOptionalContext: useOptionalChartContext } = createContext("Chart");
+/**
+* The categories a chart draws, and which of them are switched off.
+*
+* Hiding removes a series rather than zeroing it, so a hidden band leaves no
+* flat line along the axis and the remaining ones keep the colors they had —
+* the color is keyed on a category's position in the full list, not in what
+* happens to be showing.
+*/
+function useChartSeries(options) {
+	const colors = computed(() => options.colors() ?? chartColors(options.categories().length));
+	const hidden = useControlled({
+		value: options.hidden,
+		defaultValue: () => [],
+		prop: options.prop,
+		onChange: options.onHiddenChange,
+		name: "Chart",
+		label: "hidden"
+	});
+	const visible = computed(() => options.categories().map((category, index) => ({
+		category,
+		index,
+		color: colors.value[index] ?? ""
+	})).filter((series) => !hidden.value.includes(series.category)));
+	function toggle(category) {
+		hidden.value = hidden.value.includes(category) ? hidden.value.filter((entry) => entry !== category) : [...hidden.value, category];
+	}
+	provideChartContext({
+		categories: computed(() => options.categories()),
+		colors,
+		labels: options.labels && computed(options.labels),
+		hidden: computed(() => hidden.value),
+		toggle
+	});
+	return {
+		colors,
+		hidden: computed(() => hidden.value),
+		visible,
+		toggle
+	};
+}
+//#endregion
+export { provideChartContext, useChartSeries, useOptionalChartContext };

package/dist/components/checkbox/CheckboxGroup.js

@@ -0,0 +1,5 @@
+import CheckboxGroup_vue_vue_type_script_setup_true_lang_default, { provideCheckboxGroupContext, useOptionalCheckboxGroupContext } from "./CheckboxGroup.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/checkbox/CheckboxGroup.vue
+var CheckboxGroup_default = CheckboxGroup_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { CheckboxGroup_default as default, provideCheckboxGroupContext, useOptionalCheckboxGroupContext };

package/dist/components/checkbox/CheckboxGroup.vue.d.ts

@@ -0,0 +1,128 @@
+import { type ModelModifiers } from '../../shared/model-modifiers';
+import type { ComputedRef } from 'vue';
+import type { UseFieldReturn } from '../../shared/use-field';
+export type CheckboxGroupValue = string | number;
+export interface CheckboxGroupState {
+    /**
+     * The checked boxes' values.
+     * @attribute none
+     */
+    value: CheckboxGroupValue[];
+    /** Whether every box ignores interaction. */
+    disabled: boolean;
+    /** Whether the boxes can be focused but not changed. */
+    readOnly: boolean;
+    /** Whether at least one box must be checked before the form submits. */
+    required: boolean;
+    /** Whether the value is invalid. */
+    invalid: boolean;
+}
+interface CheckboxRegistration {
+    value: () => CheckboxGroupValue | undefined;
+    /** Whether this box, on its own or through the group, can't be toggled. */
+    locked: () => boolean;
+}
+export interface CheckboxGroupContext {
+    value: ComputedRef<CheckboxGroupValue[]>;
+    /** Adds or removes one value. */
+    toggle: (value: CheckboxGroupValue, on: boolean, event: Event) => void;
+    /** Checks or clears every box that isn't locked, for the parent box. */
+    toggleAll: (on: boolean, event: Event) => void;
+    /** Of the boxes that aren't locked: how many there are and how many are checked. */
+    counts: ComputedRef<{
+        total: number;
+        checked: number;
+    }>;
+    register: (entry: CheckboxRegistration) => () => void;
+    disabled: () => boolean;
+    readOnly: () => boolean;
+    invalid: () => boolean;
+    name: () => string | undefined;
+    form: () => string | undefined;
+    /** The field the group is the control of, which its boxes leave to it. */
+    field: UseFieldReturn | null;
+}
+export declare const provideCheckboxGroupContext: (value: CheckboxGroupContext) => CheckboxGroupContext, useOptionalCheckboxGroupContext: () => CheckboxGroupContext | null;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** The checked boxes' values, bound with `v-model`. */
+    modelValue?: CheckboxGroupValue[];
+    /** `v-model.optional` writes `undefined` once the value is emptied. */
+    modelModifiers?: ModelModifiers;
+    /** The values checked at first, when no `v-model` owns them. */
+    defaultValue?: CheckboxGroupValue[];
+    /** Disables every box, and the form leaves them out. */
+    disabled?: boolean;
+    /** Keeps the boxes focusable but unchangeable. */
+    readOnly?: boolean;
+    /** At least one box must be checked. Announced and styled, not enforced. */
+    required?: boolean;
+    /** Marks the value invalid, for styling through `data-invalid`. */
+    invalid?: boolean;
+    /** The form field name every box submits its value under. Inside a `FieldRoot`, the field's name. */
+    name?: string;
+    /** The id of a `<form>` to submit with, when the group sits outside it. */
+    form?: string;
+    /** Every enabled box's value, so a parent box can count them before they render, as on a server. */
+    allValues?: CheckboxGroupValue[];
+    /** Element or component to render. */
+    as?: string | object;
+}, {
+    value: ComputedRef<CheckboxGroupValue[]>;
+    state: ComputedRef<CheckboxGroupState>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (value: CheckboxGroupValue[], event: Event) => any;
+    "update:modelValue": (value: CheckboxGroupValue[] | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    /** The checked boxes' values, bound with `v-model`. */
+    modelValue?: CheckboxGroupValue[];
+    /** `v-model.optional` writes `undefined` once the value is emptied. */
+    modelModifiers?: ModelModifiers;
+    /** The values checked at first, when no `v-model` owns them. */
+    defaultValue?: CheckboxGroupValue[];
+    /** Disables every box, and the form leaves them out. */
+    disabled?: boolean;
+    /** Keeps the boxes focusable but unchangeable. */
+    readOnly?: boolean;
+    /** At least one box must be checked. Announced and styled, not enforced. */
+    required?: boolean;
+    /** Marks the value invalid, for styling through `data-invalid`. */
+    invalid?: boolean;
+    /** The form field name every box submits its value under. Inside a `FieldRoot`, the field's name. */
+    name?: string;
+    /** The id of a `<form>` to submit with, when the group sits outside it. */
+    form?: string;
+    /** Every enabled box's value, so a parent box can count them before they render, as on a server. */
+    allValues?: CheckboxGroupValue[];
+    /** Element or component to render. */
+    as?: string | object;
+}> & Readonly<{
+    onChange?: ((value: CheckboxGroupValue[], event: Event) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: CheckboxGroupValue[] | undefined) => any) | undefined;
+}>, {
+    defaultValue: CheckboxGroupValue[];
+    as: string | object;
+    modelValue: CheckboxGroupValue[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {
+        /**
+         * The checked boxes' values.
+         * @attribute none
+         */
+        value: CheckboxGroupValue[];
+        /** Whether every box ignores interaction. */
+        disabled: boolean;
+        /** Whether the boxes can be focused but not changed. */
+        readOnly: boolean;
+        /** Whether at least one box must be checked before the form submits. */
+        required: boolean;
+        /** Whether the value is invalid. */
+        invalid: boolean;
+    }) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/checkbox/CheckboxGroup.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,141 @@
+import { Part } from "../../shared/part.js";
+import { dataAttrs } from "../../shared/data-attrs.js";
+import { useControlled } from "../../shared/use-controlled.js";
+import { createContext } from "../../shared/context.js";
+import { useFieldValue, useOptionalFieldContext } from "../../shared/use-field.js";
+import { usePartProps } from "../../shared/use-part-props.js";
+import { applyModelModifiers } from "../../shared/model-modifiers.js";
+import { computed, createBlock, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, ref, renderSlot, shallowRef, unref, watch, withCtx } from "vue";
+//#region src/components/checkbox/CheckboxGroup.vue?vue&type=script&setup=true&lang.ts
+var { provideContext: provideCheckboxGroupContext, useOptionalContext: useOptionalCheckboxGroupContext } = createContext("CheckboxGroup");
+var CheckboxGroup_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "CheckboxGroup",
+	inheritAttrs: false,
+	__name: "CheckboxGroup",
+	props: {
+		modelValue: { default: void 0 },
+		modelModifiers: {},
+		defaultValue: { default: void 0 },
+		disabled: { type: Boolean },
+		readOnly: { type: Boolean },
+		required: { type: Boolean },
+		invalid: { type: Boolean },
+		name: {},
+		form: {},
+		allValues: {},
+		as: { default: "div" }
+	},
+	emits: ["update:modelValue", "change"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const field = useOptionalFieldContext();
+		const container = ref(null);
+		const registrations = shallowRef([]);
+		const disabled = () => (props.disabled ?? false) || (field?.state.value.disabled ?? false);
+		const readOnly = () => (props.readOnly ?? false) || (field?.state.value.readOnly ?? false);
+		const required = () => (props.required ?? false) || (field?.required() ?? false);
+		const invalid = () => (props.invalid ?? false) || (field?.state.value.invalid ?? false);
+		const controlled = useControlled({
+			value: () => props.modelValue,
+			defaultValue: () => props.defaultValue ?? [],
+			prop: "modelValue",
+			empty: () => [],
+			name: "CheckboxGroup",
+			label: "value"
+		});
+		const value = computed(() => controlled.value ?? []);
+		const state = computed(() => ({
+			value: value.value,
+			disabled: disabled(),
+			readOnly: readOnly(),
+			required: required(),
+			invalid: invalid()
+		}));
+		useFieldValue(field, () => value.value);
+		watch(() => value.value.length > 0, (filled) => field?.setFilled(filled), { immediate: true });
+		function ordered(checked) {
+			const known = registrations.value.map((entry) => entry.value()).filter((item) => item !== void 0);
+			const knownSet = new Set(known);
+			return [...[...checked].filter((item) => !knownSet.has(item)), ...known.filter((item) => checked.has(item))];
+		}
+		function commit(next, event) {
+			controlled.value = next;
+			emit("update:modelValue", applyModelModifiers(next, props.modelModifiers));
+			emit("change", next, event);
+		}
+		provideCheckboxGroupContext({
+			value,
+			toggle(item, on, event) {
+				if (disabled() || readOnly()) return;
+				const checked = new Set(value.value);
+				if (on) checked.add(item);
+				else checked.delete(item);
+				commit(ordered(checked), event);
+			},
+			toggleAll(on, event) {
+				if (disabled() || readOnly()) return;
+				const checked = new Set(value.value);
+				for (const entry of registrations.value) {
+					const item = entry.value();
+					if (item === void 0 || entry.locked()) continue;
+					if (on) checked.add(item);
+					else checked.delete(item);
+				}
+				commit(ordered(checked), event);
+			},
+			counts: computed(() => {
+				const open = registrations.value.length ? registrations.value.filter((entry) => entry.value() !== void 0 && !entry.locked()).map((entry) => entry.value()) : props.allValues ?? [];
+				return {
+					total: open.length,
+					checked: open.filter((item) => value.value.includes(item)).length
+				};
+			}),
+			register(entry) {
+				registrations.value = [...registrations.value, entry];
+				return () => {
+					registrations.value = registrations.value.filter((item) => item !== entry);
+				};
+			},
+			disabled,
+			readOnly,
+			invalid,
+			name: () => props.name ?? field?.name(),
+			form: () => props.form,
+			field
+		});
+		__expose({
+			value,
+			state
+		});
+		const merged = usePartProps(() => ({
+			...dataAttrs(state.value, { value: () => null }),
+			"data-part": "checkbox-group",
+			role: "group",
+			"aria-labelledby": field?.labelledBy.value,
+			"aria-describedby": field?.describedBy.value,
+			"aria-required": required() || void 0,
+			"aria-disabled": disabled() || void 0,
+			"aria-readonly": readOnly() || void 0,
+			"aria-invalid": invalid() || void 0,
+			ref: (el) => {
+				container.value = el ?? null;
+			},
+			onFocusin: () => field?.setFocused(true),
+			onFocusout(event) {
+				const next = event.relatedTarget;
+				if (next instanceof Node && container.value?.contains(next)) return;
+				field?.setFocused(false);
+				field?.setTouched(true);
+			}
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Part), mergeProps({ as: props.as }, unref(merged)), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(state.value)))]),
+				_: 3
+			}, 16, ["as"]);
+		};
+	}
+});
+//#endregion
+export { CheckboxGroup_vue_vue_type_script_setup_true_lang_default as default, provideCheckboxGroupContext, useOptionalCheckboxGroupContext };

package/dist/components/checkbox/CheckboxIndicator.js

@@ -0,0 +1,5 @@
+import CheckboxIndicator_vue_vue_type_script_setup_true_lang_default from "./CheckboxIndicator.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/checkbox/CheckboxIndicator.vue
+var CheckboxIndicator_default = CheckboxIndicator_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { CheckboxIndicator_default as default };

package/dist/components/checkbox/CheckboxIndicator.vue.d.ts

@@ -0,0 +1,29 @@
+type __VLS_Props = {
+    /** Stays in the DOM while unchecked, for styling both states yourself. */
+    keepMounted?: boolean;
+    /** Element or component to render. */
+    as?: string | object;
+};
+declare var __VLS_8: {
+    checked: boolean;
+    indeterminate: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    required: boolean;
+    invalid: boolean;
+    transitionStatus: import("../..").TransitionStatus;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    as: string | object;
+}, {}, {}, {}, 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/checkbox/CheckboxIndicator.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,30 @@
+import { Part } from "../../shared/part.js";
+import { usePartProps } from "../../shared/use-part-props.js";
+import { useToggleIndicator } from "../../shared/use-toggle-indicator.js";
+import { createBlock, createCommentVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+//#region src/components/checkbox/CheckboxIndicator.vue?vue&type=script&setup=true&lang.ts
+var CheckboxIndicator_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "CheckboxIndicator",
+	inheritAttrs: false,
+	__name: "CheckboxIndicator",
+	props: {
+		keepMounted: { type: Boolean },
+		as: { default: "span" }
+	},
+	setup(__props) {
+		const props = __props;
+		const { mounted, state, indicatorProps } = useToggleIndicator();
+		const merged = usePartProps(indicatorProps);
+		return (_ctx, _cache) => {
+			return unref(mounted) || props.keepMounted ? (openBlock(), createBlock(unref(Part), mergeProps({
+				key: 0,
+				as: props.as
+			}, unref(merged)), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(state))))]),
+				_: 3
+			}, 16, ["as"])) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+export { CheckboxIndicator_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/checkbox/CheckboxRoot.js

@@ -0,0 +1,5 @@
+import CheckboxRoot_vue_vue_type_script_setup_true_lang_default from "./CheckboxRoot.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/checkbox/CheckboxRoot.vue
+var CheckboxRoot_default = CheckboxRoot_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { CheckboxRoot_default as default };

package/dist/components/checkbox/CheckboxRoot.vue.d.ts

@@ -0,0 +1,93 @@
+export interface CheckboxState {
+    /**
+     * Whether the checkbox is checked.
+     * @attribute `data-checked` while checked, `data-unchecked` otherwise
+     */
+    checked: boolean;
+    /** Neither checked nor unchecked — a group whose members disagree. */
+    indeterminate: boolean;
+    /** Whether it ignores interaction. */
+    disabled: boolean;
+    /** Whether it can be focused but not changed. */
+    readOnly: boolean;
+    /** Whether it must be checked before its form submits. */
+    required: boolean;
+    /** Whether the value is invalid. */
+    invalid: boolean;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: <TValue extends string | number | boolean = boolean, TItem extends string | number = string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<{
+        /** Bound with `v-model`: `true-value`/`false-value`, or an array that holds `value` while checked. Ignored inside a `CheckboxGroup`. */
+        modelValue?: TValue | TItem[] | null;
+        /** The model value while checked. @default true */
+        trueValue?: TValue;
+        /** The model value while unchecked. @default false */
+        falseValue?: TValue;
+        /** Starts checked, when no `v-model` owns the state. A number counts as checked unless it is `0`. */
+        defaultChecked?: boolean | number;
+        /** Shows neither state, for a parent of checkboxes that disagree. Clicking still toggles `checked`. */
+        indeterminate?: boolean;
+        /** Ignores interaction, and the form leaves it out. */
+        disabled?: boolean;
+        /** Stays focusable but can't be changed. */
+        readOnly?: boolean;
+        /** Must be checked. Announced and styled, not enforced. */
+        required?: boolean;
+        /** Marks the value invalid, for styling through `data-invalid`. */
+        invalid?: boolean;
+        /** The root's id. Inside a `FieldRoot`, the field's control id. */
+        id?: string;
+        /** The form field name. Inside a `FieldRoot`, the field's name. */
+        name?: string;
+        /** Submitted while checked, and what an array `v-model` (or a `CheckboxGroup`) holds for this box. */
+        value?: TItem;
+        /** Inside a `CheckboxGroup`, checks or clears every other box, and shows indeterminate while they disagree. */
+        parent?: boolean;
+        /** The id of a `<form>` to submit with, when the checkbox sits outside it. */
+        form?: string;
+        /** Element or component to render. Anything but a `button` gets `tabindex` and Enter/Space keys, and a `<label>` no longer names it. */
+        as?: string | object;
+    } & {
+        onChange?: ((checked: boolean, event: Event) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: TValue | TItem[]) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: import("vue").ShallowUnwrapRef<{
+        checked: import("vue").WritableComputedRef<boolean, boolean>;
+        state: import("vue").ComputedRef<CheckboxState>;
+        rootProps: import("vue").ComputedRef<Record<string, unknown>>;
+        inputProps: import("vue").ComputedRef<Record<string, unknown>>;
+        toggle: (event?: Event) => void;
+    }>) => void;
+    attrs: any;
+    slots: {
+        default?: (props: {
+            /**
+             * Whether the checkbox is checked.
+             * @attribute `data-checked` while checked, `data-unchecked` otherwise
+             */
+            checked: boolean;
+            /** Neither checked nor unchecked — a group whose members disagree. */
+            indeterminate: boolean;
+            /** Whether it ignores interaction. */
+            disabled: boolean;
+            /** Whether it can be focused but not changed. */
+            readOnly: boolean;
+            /** Whether it must be checked before its form submits. */
+            required: boolean;
+            /** Whether the value is invalid. */
+            invalid: boolean;
+        }) => any;
+    };
+    emit: ((evt: "change", checked: boolean, event: Event) => void) & ((evt: "update:modelValue", value: TValue | TItem[]) => void);
+}>) => import("vue").VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};