@astryx-vue/core 0.1.3 → 0.2.1

package/dist/Selector-DlZpQh42.js

@@ -1,325 +0,0 @@
-import { t as useCombobox } from "./useCombobox-CTo5C-gc.js";
-import { t as useDismiss } from "./useDismiss-CAiHU6QD.js";
-import { a as useAstryxMessages } from "./context-D6ECRdc5.js";
-import { t as usePositionedLayer } from "./usePositionedLayer-C1NBOsVT.js";
-import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onMounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useId, useSlots, useTemplateRef, vShow, watch, withDirectives, withKeys, withModifiers } from "vue";
-import "../styles/visually-hidden-utility.css";
-import "../styles/selector.css";
-//#region src/Selector/Selector.vue
-const _hoisted_1 = [
-	"disabled",
-	"aria-expanded",
-	"aria-label",
-	"aria-activedescendant",
-	"title"
-];
-const _hoisted_2 = ["aria-label"];
-const _hoisted_3 = ["data-placement"];
-const _hoisted_4 = {
-	key: 0,
-	class: "astryx-selector-search"
-};
-const _hoisted_5 = [
-	"id",
-	"aria-label",
-	"placeholder",
-	"value"
-];
-const _hoisted_6 = {
-	key: 1,
-	class: "astryx-selector-options"
-};
-const _hoisted_7 = [
-	"id",
-	"aria-selected",
-	"aria-disabled",
-	"onClick",
-	"onKeydown"
-];
-const _hoisted_8 = { class: "astryx-selector-option-label" };
-const _hoisted_9 = {
-	key: 0,
-	class: "astryx-selector-option-description"
-};
-const _hoisted_10 = {
-	key: 2,
-	class: "astryx-selector-empty"
-};
-const _hoisted_11 = [
-	"id",
-	"name",
-	"value",
-	"aria-label"
-];
-const _hoisted_12 = ["value"];
-const _sfc_main = /*@__PURE__*/ defineComponent({
-	name: "AstryxSelector",
-	inheritAttrs: false,
-	__name: "Selector",
-	props: {
-		modelValue: { default: null },
-		options: {},
-		placeholder: {},
-		disabled: {
-			type: Boolean,
-			default: false
-		},
-		disabledReason: {},
-		status: { default: "default" },
-		statusMessage: {},
-		size: { default: "md" },
-		searchable: {
-			type: Boolean,
-			default: false
-		},
-		searchPlaceholder: {},
-		clearable: {
-			type: Boolean,
-			default: false
-		},
-		clearLabel: {},
-		emptyText: {},
-		label: {},
-		name: {}
-	},
-	emits: [
-		"update:modelValue",
-		"change",
-		"search"
-	],
-	setup(__props, { emit: __emit }) {
-		const props = __props;
-		const emit = __emit;
-		const slots = useSlots();
-		const selectorId = `astryx-selector-${useId()}`;
-		const listboxId = `${selectorId}-listbox`;
-		const messages = useAstryxMessages();
-		const resolvedPlaceholder = computed(() => props.placeholder ?? messages.value.selector.placeholder);
-		const resolvedSearchPlaceholder = computed(() => props.searchPlaceholder ?? messages.value.selector.search);
-		const resolvedClearLabel = computed(() => props.clearLabel ?? messages.value.selector.clear);
-		const resolvedEmptyText = computed(() => props.emptyText ?? messages.value.selector.empty);
-		const fieldRef = useTemplateRef("fieldRef");
-		const listboxRef = useTemplateRef("listboxRef");
-		const searchInputRef = useTemplateRef("searchInputRef");
-		const isEnabled = computed(() => !props.disabled);
-		const isSearchable = computed(() => props.searchable);
-		const comboboxOptions = computed(() => props.options.map((opt) => ({
-			value: opt.value,
-			label: opt.label,
-			disabled: opt.disabled ?? false
-		})));
-		const modelValueRef = computed({
-			get: () => props.modelValue,
-			set: (value) => {
-				emit("update:modelValue", value);
-				emit("change", value);
-			}
-		});
-		const combobox = useCombobox({
-			options: comboboxOptions,
-			modelValue: modelValueRef,
-			isEnabled,
-			isSearchable,
-			onChange: (value) => {
-				modelValueRef.value = value;
-			},
-			onOpenChange: (isOpen) => {
-				if (isOpen && props.searchable) nextTick(() => {
-					searchInputRef.value?.focus();
-				});
-			}
-		});
-		const { position } = usePositionedLayer({
-			anchor: fieldRef,
-			layer: listboxRef,
-			isOpen: combobox.isOpen,
-			placement: computed(() => "below"),
-			alignment: computed(() => "start"),
-			gap: 4
-		});
-		useDismiss({
-			container: listboxRef,
-			trigger: fieldRef,
-			isEnabled: combobox.isOpen,
-			enableEscape: ref(true),
-			onDismiss: () => {
-				combobox.close();
-			}
-		});
-		const selectedOption = computed(() => {
-			if (props.modelValue == null) return null;
-			return props.options.find((opt) => opt.value === props.modelValue) ?? null;
-		});
-		const displayText = computed(() => {
-			return selectedOption.value?.label ?? resolvedPlaceholder.value;
-		});
-		const isEmpty = computed(() => {
-			return combobox.filteredOptions.value.length === 0;
-		});
-		function onTriggerClick() {
-			if (isEnabled.value) combobox.toggle();
-		}
-		function onTriggerKeyDown(event) {
-			combobox.onKeyDown(event);
-		}
-		function onOptionClick(option) {
-			if (!option.disabled) combobox.select(option.value);
-		}
-		function onClear(event) {
-			event.stopPropagation();
-			modelValueRef.value = null;
-			combobox.close();
-		}
-		function onSearchInput(event) {
-			const target = event.target;
-			combobox.setSearchQuery(target.value);
-			emit("search", target.value);
-		}
-		function getOptionId(index) {
-			return `${listboxId}-option-${index}`;
-		}
-		const anchorWidth = ref(0);
-		function syncAnchorWidth() {
-			anchorWidth.value = fieldRef.value?.getBoundingClientRect().width ?? 0;
-		}
-		const listboxStyle = computed(() => ({
-			top: `${position.value.top}px`,
-			left: `${position.value.left}px`,
-			minWidth: anchorWidth.value > 0 ? `${anchorWidth.value}px` : void 0
-		}));
-		watch(combobox.isOpen, (open) => {
-			if (open) syncAnchorWidth();
-		}, { flush: "pre" });
-		onMounted(syncAnchorWidth);
-		watch(() => combobox.activeIndex.value, (index) => {
-			if (index >= 0 && combobox.isOpen.value) nextTick(() => {
-				const listbox = listboxRef.value;
-				const optionEl = listbox?.querySelector(`#${getOptionId(index)}`);
-				if (!listbox || !optionEl) return;
-				const listboxRect = listbox.getBoundingClientRect();
-				const optionRect = optionEl.getBoundingClientRect();
-				if (optionRect.top < listboxRect.top) listbox.scrollTop -= listboxRect.top - optionRect.top;
-				else if (optionRect.bottom > listboxRect.bottom) listbox.scrollTop += optionRect.bottom - listboxRect.bottom;
-			});
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", { class: normalizeClass(["astryx-selector", [`size-${props.size}`, `status-${props.status}`]]) }, [
-				createElementVNode("div", {
-					ref_key: "fieldRef",
-					ref: fieldRef,
-					class: normalizeClass(["astryx-selector-field", {
-						"is-open": unref(combobox).isOpen.value,
-						"is-disabled": props.disabled
-					}])
-				}, [createElementVNode("button", {
-					id: selectorId,
-					type: "button",
-					class: normalizeClass(["astryx-selector-trigger", {
-						"is-open": unref(combobox).isOpen.value,
-						"is-disabled": props.disabled
-					}]),
-					disabled: props.disabled,
-					"aria-haspopup": "listbox",
-					"aria-expanded": unref(combobox).isOpen.value,
-					"aria-controls": listboxId,
-					"aria-label": props.label,
-					"aria-activedescendant": unref(combobox).activeIndex.value >= 0 ? getOptionId(unref(combobox).activeIndex.value) : void 0,
-					title: props.disabledReason,
-					onClick: onTriggerClick,
-					onKeydown: onTriggerKeyDown
-				}, [createElementVNode("span", { class: normalizeClass(["astryx-selector-value", { "is-placeholder": !selectedOption.value }]) }, [unref(slots).selected ? renderSlot(_ctx.$slots, "selected", { option: selectedOption.value }, void 0, void 0, 0) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(displayText.value), 1)], 64))], 2), _cache[0] || (_cache[0] = createElementVNode("span", {
-					class: "astryx-selector-icon",
-					"aria-hidden": "true"
-				}, [createElementVNode("svg", {
-					width: "16",
-					height: "16",
-					viewBox: "0 0 16 16",
-					fill: "none"
-				}, [createElementVNode("path", {
-					d: "M4 6L8 10L12 6",
-					stroke: "currentColor",
-					"stroke-width": "1.5",
-					"stroke-linecap": "round",
-					"stroke-linejoin": "round"
-				})])], -1))], 42, _hoisted_1), props.clearable && selectedOption.value ? (openBlock(), createElementBlock("button", {
-					key: 0,
-					type: "button",
-					class: "astryx-selector-clear",
-					"aria-label": resolvedClearLabel.value,
-					onClick: onClear
-				}, [..._cache[1] || (_cache[1] = [createElementVNode("svg", {
-					width: "16",
-					height: "16",
-					viewBox: "0 0 16 16",
-					fill: "none"
-				}, [createElementVNode("path", {
-					d: "M12 4L4 12M4 4L12 12",
-					stroke: "currentColor",
-					"stroke-width": "1.5",
-					"stroke-linecap": "round"
-				})], -1)])], 8, _hoisted_2)) : createCommentVNode("v-if", true)], 2),
-				(openBlock(), createBlock(Teleport, { to: "body" }, [withDirectives(createElementVNode("div", {
-					id: listboxId,
-					ref_key: "listboxRef",
-					ref: listboxRef,
-					role: "listbox",
-					class: "astryx-selector-listbox",
-					"data-placement": unref(position).placement,
-					style: normalizeStyle(listboxStyle.value),
-					tabindex: "-1"
-				}, [props.searchable ? (openBlock(), createElementBlock("div", _hoisted_4, [createElementVNode("input", {
-					id: `${selectorId}-search`,
-					ref_key: "searchInputRef",
-					ref: searchInputRef,
-					type: "text",
-					class: "astryx-selector-search-input",
-					"aria-label": resolvedSearchPlaceholder.value,
-					placeholder: resolvedSearchPlaceholder.value,
-					value: unref(combobox).searchQuery.value,
-					onInput: onSearchInput
-				}, null, 40, _hoisted_5)])) : createCommentVNode("v-if", true), !isEmpty.value ? (openBlock(), createElementBlock("div", _hoisted_6, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(combobox).filteredOptions.value, (option, index) => {
-					return openBlock(), createElementBlock("div", {
-						id: getOptionId(index),
-						key: option.value,
-						role: "option",
-						tabindex: "0",
-						class: normalizeClass(["astryx-selector-option", {
-							"is-active": index === unref(combobox).activeIndex.value,
-							"is-selected": option.value === props.modelValue,
-							"is-disabled": option.disabled
-						}]),
-						"aria-selected": option.value === props.modelValue,
-						"aria-disabled": option.disabled,
-						onClick: ($event) => onOptionClick(option),
-						onKeydown: [withKeys(($event) => onOptionClick(option), ["enter"]), withKeys(withModifiers(($event) => onOptionClick(option), ["prevent"]), ["space"])]
-					}, [unref(slots).option ? renderSlot(_ctx.$slots, "option", {
-						option,
-						isActive: index === unref(combobox).activeIndex.value,
-						isSelected: option.value === props.modelValue
-					}, void 0, void 0, 0) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createElementVNode("span", _hoisted_8, toDisplayString(option.label), 1), option.description ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(option.description), 1)) : createCommentVNode("v-if", true)], 64))], 42, _hoisted_7);
-				}), 128))])) : (openBlock(), createElementBlock("div", _hoisted_10, [unref(slots).empty ? renderSlot(_ctx.$slots, "empty", {}, void 0, void 0, 0) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(resolvedEmptyText.value), 1)], 64))]))], 12, _hoisted_3), [[vShow, unref(combobox).isOpen.value]])])),
-				props.name ? (openBlock(), createElementBlock("select", {
-					key: 0,
-					id: `${selectorId}-hidden-select`,
-					name: props.name,
-					value: props.modelValue ?? "",
-					"aria-label": props.label || resolvedPlaceholder.value,
-					tabindex: "-1",
-					style: {
-						"position": "absolute",
-						"left": "-9999px",
-						"width": "1px",
-						"height": "1px"
-					}
-				}, [_cache[2] || (_cache[2] = createElementVNode("option", { value: "" }, null, -1)), (openBlock(true), createElementBlock(Fragment, null, renderList(props.options, (option) => {
-					return openBlock(), createElementBlock("option", {
-						key: option.value,
-						value: option.value
-					}, toDisplayString(option.label), 9, _hoisted_12);
-				}), 128))], 8, _hoisted_11)) : createCommentVNode("v-if", true)
-			], 2);
-		};
-	}
-});
-//#endregion
-export { _sfc_main as t };

package/dist/index-BzqRns96.d.ts

@@ -1,64 +0,0 @@
-//#region src/Text/types.d.ts
-type TextType = 'body' | 'large' | 'label' | 'supporting' | 'code' | 'display-1' | 'display-2' | 'display-3';
-type TextSize = 'sm' | 'md' | 'lg' | 'xl';
-type TextColor = 'primary' | 'secondary' | 'accent' | 'inherit';
-type TextWeight = 'regular' | 'medium' | 'semibold' | 'bold';
-type TextDisplay = 'block' | 'inline';
-type TextAs = 'span' | 'p' | 'div' | 'label';
-interface TextProps {
-  /**
-   * Semantic text type. Determines size, weight, and line-height.
-   * @default 'body'
-   */
-  type?: TextType;
-  /**
-   * Explicit font size override.
-   */
-  size?: TextSize;
-  /**
-   * Text color.
-   * @default 'primary'
-   */
-  color?: TextColor;
-  /**
-   * Font weight override.
-   */
-  weight?: TextWeight;
-  /**
-   * Display type.
-   * @default 'inline'
-   */
-  display?: TextDisplay;
-  /**
-   * HTML element to render.
-   * @default 'span'
-   */
-  as?: TextAs;
-  /**
-   * Maximum lines before truncation. 0 means no truncation.
-   * @default 0
-   */
-  maxLines?: number;
-}
-//#endregion
-//#region src/Text/Text.vue.d.ts
-declare var __VLS_7: {};
-type __VLS_Slots = {} & {
-  default?: (props: typeof __VLS_7) => any;
-};
-declare const __VLS_base: import("vue").DefineComponent<TextProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TextProps> & Readonly<{}>, {
-  type: TextType;
-  as: TextAs;
-  color: TextColor;
-  display: TextDisplay;
-  maxLines: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-type __VLS_WithSlots<T, S> = T & {
-  new (): {
-    $slots: S;
-  };
-};
-//#endregion
-export { TextProps as a, TextWeight as c, TextDisplay as i, TextAs as n, TextSize as o, TextColor as r, TextType as s, _default as t };

package/dist/index-ZJyk8RtQ.d.ts

@@ -1,68 +0,0 @@
-//#region src/DateInput/types.d.ts
-interface DateInputProps {
-  /** 输入框 id。不传时组件自己生成。 */
-  id?: string;
-  /** 额外的无障碍描述，接在字段说明后面。 */
-  describedBy?: string;
-  /** 当前选中的日期 */
-  modelValue?: Date | null;
-  /** 占位符文本 */
-  placeholder?: string;
-  /** 最小可选日期 */
-  min?: Date;
-  /** 最大可选日期 */
-  max?: Date;
-  /** 禁用的日期判断函数 */
-  isDateDisabled?: (date: Date) => boolean;
-  /** 表单字段名 */
-  name?: string;
-  /** 输入框标签 */
-  label?: string;
-  /** 是否禁用 */
-  disabled?: boolean;
-  /** 禁用原因 */
-  disabledReason?: string;
-  /** 是否可清除 */
-  clearable?: boolean;
-  /** 清除按钮标签 */
-  clearLabel?: string;
-  /** 尺寸 */
-  size?: 'sm' | 'md' | 'lg';
-  /** 状态 */
-  status?: 'default' | 'error' | 'warning' | 'success';
-}
-interface DateInputEmits {
-  (event: 'update:modelValue', value: Date | null): void;
-  (event: 'change', value: Date | null): void;
-}
-interface DateInputSlots {
-  /** 自定义前缀图标 */
-  prefix?: () => any;
-  /** 自定义后缀内容 */
-  suffix?: () => any;
-}
-//#endregion
-//#region src/DateInput/DateInput.vue.d.ts
-type __VLS_Slots = DateInputSlots;
-declare const __VLS_base: import("vue").DefineComponent<DateInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-  change: (value: Date | null) => any;
-  "update:modelValue": (value: Date | null) => any;
-}, string, import("vue").PublicProps, Readonly<DateInputProps> & Readonly<{
-  onChange?: ((value: Date | null) => any) | undefined;
-  "onUpdate:modelValue"?: ((value: Date | null) => any) | undefined;
-}>, {
-  size: "md" | "sm" | "lg";
-  status: "default" | "success" | "warning" | "error";
-  modelValue: Date | null;
-  disabled: boolean;
-  clearable: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-type __VLS_WithSlots<T, S> = T & {
-  new (): {
-    $slots: S;
-  };
-};
-//#endregion
-export { DateInputSlots as i, DateInputEmits as n, DateInputProps as r, _default as t };

package/dist/{CheckboxList-EsIEXjK_.js → CheckboxList-BbCPiend.js}

@@ -1,6 +1,6 @@
+import { r as useItemDescriptionId } from "./Item-C1z6gXn8.js";
 import { t as _sfc_main$2 } from "./CheckboxInput-CMsEE1_4.js";
 import { t as _sfc_main$3 } from "./Field-8zRxzDHE.js";
-import { r as useItemDescriptionId } from "./Item-C1z6gXn8.js";
 import { n as _sfc_main$4, t as _sfc_main$5 } from "./ListItem-pGxvn6QJ.js";
 import { computed, createBlock, createElementVNode, createSlots, createVNode, defineComponent, inject, mergeModels, openBlock, provide, renderSlot, toDisplayString, unref, useId, useModel, useTemplateRef, withCtx } from "vue";
 import "../styles/checkbox-list.css";

package/dist/{index-4FM5lQdV.d.ts → index-BUXNRekN.d.ts}

@@ -40,8 +40,8 @@ declare const __VLS_base: import("vue").DefineComponent<TokenProps, {}, {}, {},
 }>, {
   size: TokenSize;
   color: "default" | "blue" | "cyan" | "gray" | "green" | "orange" | "pink" | "purple" | "red" | "teal" | "yellow";
-  labelHidden: boolean;
   disabled: boolean;
+  labelHidden: boolean;
   removable: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;