@kazee-ds/vue 0.0.0-stage → 0.4.0

package/dist/index.js

@@ -0,0 +1,4882 @@
+import { Fragment, cloneVNode, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, getCurrentInstance, guardReactiveProps, h, inject, mergeModels, mergeProps, normalizeClass, normalizeProps, onBeforeUnmount, onMounted, openBlock, provide, ref, renderList, renderSlot, resolveComponent, resolveDynamicComponent, shallowRef, toDisplayString, unref, useModel, watch, withCtx, withModifiers } from "vue";
+import { CheckboxRoot, ComboboxAnchor, ComboboxContent, ComboboxInput, ComboboxItem, ComboboxPortal, ComboboxRoot, ComboboxTrigger, ComboboxViewport, DialogClose, DialogContent, DialogDescription, DialogOverlay, DialogPortal, DialogRoot, DialogTitle, DialogTrigger, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Label, ListboxContent, ListboxItem, ListboxRoot, NumberFieldDecrement, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, PopoverClose, PopoverContent, PopoverPortal, PopoverRoot, PopoverTrigger, RadioGroupItem, RadioGroupRoot, RangeCalendarCell, RangeCalendarCellTrigger, RangeCalendarGrid, RangeCalendarGridBody, RangeCalendarGridHead, RangeCalendarGridRow, RangeCalendarHeadCell, RangeCalendarNext, RangeCalendarPrev, RangeCalendarRoot, SelectContent, SelectItem, SelectItemText, SelectPortal, SelectRoot, SelectTrigger, SelectValue, SelectViewport, SwitchRoot, TabsContent, TabsList, TabsRoot, TabsTrigger, Toggle, ToggleGroupItem, ToggleGroupRoot, TooltipContent, TooltipPortal, TooltipProvider, TooltipRoot, TooltipTrigger, useId } from "reka-ui";
+import { endOfMonth, getLocalTimeZone, parseDate, startOfMonth, startOfWeek, today } from "@internationalized/date";
+//#region src/Button.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$38 = [
+	"aria-label",
+	"aria-labelledby",
+	"type",
+	"disabled",
+	"aria-disabled",
+	"data-pending"
+];
+//#endregion
+//#region src/Button.vue
+var Button_default = /* @__PURE__ */ defineComponent({
+	__name: "Button",
+	props: {
+		variant: { default: "primary" },
+		ariaLabel: { default: void 0 },
+		ariaLabelledby: { default: void 0 },
+		size: { default: "md" },
+		fullWidth: {
+			type: Boolean,
+			default: false
+		},
+		type: { default: "button" },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		iconOnly: {
+			type: Boolean,
+			default: false
+		},
+		pending: {
+			type: Boolean,
+			default: false
+		}
+	},
+	emits: ["press"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const hovered = ref(false), pressed = ref(false), focused = ref(false), focusVisible = ref(false);
+		watch(() => [props.disabled, props.pending], ([disabled, pending]) => {
+			if (disabled || pending) {
+				hovered.value = false;
+				pressed.value = false;
+			}
+			if (props.disabled) {
+				focused.value = false;
+				focusVisible.value = false;
+			}
+		});
+		function hover(event) {
+			if (!props.disabled && !props.pending && event.pointerType !== "touch") hovered.value = true;
+		}
+		function pointerdown(event) {
+			focusVisible.value = false;
+			if (!props.disabled && !props.pending && event.button === 0) pressed.value = true;
+		}
+		function leave() {
+			hovered.value = false;
+			pressed.value = false;
+		}
+		function focus(event) {
+			focused.value = true;
+			focusVisible.value = event.target.matches(":focus-visible");
+		}
+		function blur() {
+			focused.value = false;
+			focusVisible.value = false;
+			pressed.value = false;
+		}
+		const emit = __emit;
+		const classes = computed(() => [
+			"button",
+			`button--${props.variant}`,
+			props.size !== "md" && `button--${props.size}`,
+			props.iconOnly && "button--icon-only",
+			props.fullWidth && !props.iconOnly && "button--full-width"
+		]);
+		function press(event) {
+			if (props.disabled || props.pending) {
+				event.preventDefault();
+				event.stopImmediatePropagation();
+				return;
+			}
+			emit("press", event);
+		}
+		function keydown(event) {
+			if (focused.value) focusVisible.value = true;
+			if (props.pending && (event.key === "Enter" || event.key === " ")) {
+				event.preventDefault();
+				event.stopImmediatePropagation();
+				return;
+			}
+			if (!props.disabled && (event.key === "Enter" || event.key === " ")) pressed.value = true;
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("button", {
+				class: normalizeClass(classes.value),
+				"aria-label": __props.ariaLabel,
+				"aria-labelledby": __props.ariaLabelledby,
+				type: __props.pending ? "button" : __props.type,
+				disabled: __props.disabled,
+				"aria-disabled": __props.pending || void 0,
+				"data-pending": __props.pending || void 0,
+				onClick: press,
+				onKeydown: keydown,
+				onKeyup: _cache[0] || (_cache[0] = ($event) => pressed.value = false),
+				onPointerenter: hover,
+				onPointerleave: leave,
+				onPointerdown: pointerdown,
+				onPointerup: _cache[1] || (_cache[1] = ($event) => pressed.value = false),
+				onPointercancel: _cache[2] || (_cache[2] = ($event) => pressed.value = false),
+				onFocus: focus,
+				onBlur: blur
+			}, [renderSlot(_ctx.$slots, "default", {
+				pending: __props.pending,
+				disabled: __props.disabled,
+				hovered: hovered.value,
+				pressed: pressed.value,
+				focused: focused.value,
+				focusVisible: focusVisible.value
+			})], 42, _hoisted_1$38);
+		};
+	}
+});
+//#endregion
+//#region src/ButtonGroup.ts
+var ButtonGroup_default = /* @__PURE__ */ defineComponent({
+	name: "ButtonGroup",
+	inheritAttrs: false,
+	props: {
+		label: {
+			type: String,
+			required: true
+		},
+		variant: {
+			type: String,
+			default: void 0
+		},
+		size: {
+			type: String,
+			default: void 0
+		},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		fullWidth: Boolean,
+		orientation: {
+			type: String,
+			default: "horizontal"
+		},
+		dir: {
+			type: String,
+			default: void 0
+		}
+	},
+	setup(props, { slots, attrs }) {
+		function defaults(nodes) {
+			return nodes.map((child) => {
+				if (child.type === Fragment && Array.isArray(child.children)) {
+					const fragment = cloneVNode(child);
+					fragment.children = defaults(child.children);
+					return fragment;
+				}
+				if (child.type !== Button_default) return child;
+				return cloneVNode(child, {
+					variant: child.props?.variant ?? props.variant,
+					size: child.props?.size ?? props.size,
+					disabled: child.props?.disabled ?? props.disabled
+				});
+			});
+		}
+		return () => h("div", {
+			...attrs,
+			role: "group",
+			"aria-label": props.label,
+			dir: props.dir,
+			"data-orientation": props.orientation,
+			class: ["button-group", props.fullWidth && "button-group--full-width"]
+		}, defaults(slots.default?.() ?? []));
+	}
+});
+//#endregion
+//#region src/ButtonGroupSeparator.ts
+var ButtonGroupSeparator_default = /* @__PURE__ */ defineComponent({
+	name: "ButtonGroupSeparator",
+	setup: () => () => h("span", {
+		class: "button-group__separator",
+		"aria-hidden": "true"
+	})
+});
+//#endregion
+//#region src/button-family-context.ts
+var toggleButtonGroupKey = Symbol("KazeeToggleButtonGroup");
+//#endregion
+//#region src/ToggleButton.vue
+var ToggleButton_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "ToggleButton",
+	props: {
+		id: { default: void 0 },
+		variant: { default: "default" },
+		size: { default: void 0 },
+		iconOnly: { type: Boolean },
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultSelected: { type: Boolean },
+		disabled: { type: Boolean }
+	},
+	emits: ["update:modelValue", "press"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const group = inject(toggleButtonGroupKey, void 0);
+		if (group && !props.id) throw new Error("A grouped ToggleButton requires a unique nonempty id.");
+		const instance = getCurrentInstance();
+		const local = ref(props.defaultSelected ?? false);
+		const controlled = () => Object.prototype.hasOwnProperty.call(instance?.vnode.props ?? {}, "modelValue");
+		const selected = computed(() => controlled() ? !!props.modelValue : local.value);
+		const classes = computed(() => {
+			const size = props.size ?? group?.value.size ?? "md";
+			return [
+				"button",
+				"toggle-button",
+				`toggle-button--${props.variant}`,
+				size !== "md" && `button--${size}`,
+				props.iconOnly && "button--icon-only"
+			];
+		});
+		function update(value) {
+			if (props.disabled) return;
+			if (!controlled()) local.value = value;
+			emit("update:modelValue", value);
+		}
+		function press(event) {
+			if (!props.disabled && !group?.value.disabled) emit("press", event);
+		}
+		return (_ctx, _cache) => {
+			return unref(group) ? (openBlock(), createBlock(unref(ToggleGroupItem), mergeProps({ key: 0 }, _ctx.$attrs, {
+				id: __props.id,
+				value: __props.id ?? "",
+				class: classes.value,
+				disabled: __props.disabled,
+				role: unref(group).radio ? "radio" : void 0,
+				"aria-checked": unref(group).radio ? unref(group).selectedIds.includes(__props.id ?? "") : void 0,
+				"aria-pressed": unref(group).radio ? void 0 : unref(group).selectedIds.includes(__props.id ?? ""),
+				onClick: press
+			}), {
+				default: withCtx((state) => [renderSlot(_ctx.$slots, "default", {
+					selected: !!state.modelValue,
+					disabled: state.disabled
+				})]),
+				_: 3
+			}, 16, [
+				"id",
+				"value",
+				"class",
+				"disabled",
+				"role",
+				"aria-checked",
+				"aria-pressed"
+			])) : (openBlock(), createBlock(unref(Toggle), mergeProps({ key: 1 }, _ctx.$attrs, {
+				id: __props.id,
+				class: classes.value,
+				"model-value": selected.value,
+				disabled: __props.disabled,
+				"onUpdate:modelValue": update,
+				onClick: press
+			}), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {
+					selected: selected.value,
+					disabled: !!__props.disabled
+				})]),
+				_: 3
+			}, 16, [
+				"id",
+				"class",
+				"model-value",
+				"disabled"
+			]));
+		};
+	}
+});
+//#endregion
+//#region src/ToggleButtonGroup.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$37 = ["role"];
+//#endregion
+//#region src/ToggleButtonGroup.vue
+var ToggleButtonGroup_default = /* @__PURE__ */ defineComponent({
+	__name: "ToggleButtonGroup",
+	props: {
+		label: {},
+		selectionMode: {},
+		modelValue: {},
+		defaultValue: {},
+		disabled: { type: Boolean },
+		detached: { type: Boolean },
+		fullWidth: { type: Boolean },
+		size: {},
+		orientation: {},
+		dir: {},
+		disallowEmptySelection: { type: Boolean }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const instance = getCurrentInstance();
+		const controlled = () => Object.prototype.hasOwnProperty.call(instance?.vnode.props ?? {}, "modelValue");
+		const local = ref(props.defaultValue);
+		const multiple = computed(() => props.selectionMode === "multiple");
+		const ids = computed(() => {
+			const value = controlled() ? props.modelValue : local.value;
+			return Array.isArray(value) ? value : typeof value === "string" && value ? [value] : [];
+		});
+		function update(value) {
+			if (props.disabled) return;
+			const next = Array.isArray(value) ? value : typeof value === "string" && value ? [value] : [];
+			if (next.length === ids.value.length && next.every((id, index) => id === ids.value[index])) return;
+			if (props.disallowEmptySelection && ids.value.length && !next.length) return;
+			const result = multiple.value ? next : next[0] ?? null;
+			if (!controlled()) local.value = result;
+			emit("update:modelValue", result);
+		}
+		const radio = computed(() => !multiple.value);
+		provide(toggleButtonGroupKey, computed(() => ({
+			size: props.size ?? "md",
+			radio: radio.value,
+			selectedIds: ids.value,
+			disabled: !!props.disabled
+		})));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ToggleGroupRoot), {
+				"as-child": "",
+				class: normalizeClass(["button-group toggle-button-group", {
+					"button-group--detached": __props.detached,
+					"button-group--full-width": __props.fullWidth
+				}]),
+				"aria-label": __props.label,
+				"aria-orientation": __props.orientation ?? "horizontal",
+				"aria-disabled": __props.disabled || void 0,
+				type: multiple.value ? "multiple" : "single",
+				"model-value": multiple.value ? ids.value : ids.value[0] ?? "",
+				disabled: __props.disabled,
+				orientation: __props.orientation ?? "horizontal",
+				"data-orientation": __props.orientation ?? "horizontal",
+				dir: __props.dir,
+				"onUpdate:modelValue": update
+			}, {
+				default: withCtx(() => [createElementVNode("div", { role: radio.value ? "radiogroup" : "toolbar" }, [renderSlot(_ctx.$slots, "default")], 8, _hoisted_1$37)]),
+				_: 3
+			}, 8, [
+				"class",
+				"aria-label",
+				"aria-orientation",
+				"aria-disabled",
+				"type",
+				"model-value",
+				"disabled",
+				"orientation",
+				"data-orientation",
+				"dir"
+			]);
+		};
+	}
+});
+//#endregion
+//#region \0plugin-vue:export-helper
+var _plugin_vue_export_helper_default = (sfc, props) => {
+	const target = sfc.__vccOpts || sfc;
+	for (const [key, val] of props) target[key] = val;
+	return target;
+};
+//#endregion
+//#region src/CheckIcon.vue
+var _sfc_main$2 = {};
+var _hoisted_1$36 = {
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "1.5",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round",
+	"aria-hidden": "true"
+};
+function _sfc_render$2(_ctx, _cache) {
+	return openBlock(), createElementBlock("svg", _hoisted_1$36, [..._cache[0] || (_cache[0] = [createElementVNode("path", { d: "M3.5 8.5l3 3 6-6.5" }, null, -1)])]);
+}
+var CheckIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(_sfc_main$2, [["render", _sfc_render$2]]);
+//#endregion
+//#region src/ChevronIcon.vue
+var _sfc_main$1 = {};
+var _hoisted_1$35 = {
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "1.5",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round",
+	"aria-hidden": "true"
+};
+function _sfc_render$1(_ctx, _cache) {
+	return openBlock(), createElementBlock("svg", _hoisted_1$35, [..._cache[0] || (_cache[0] = [createElementVNode("path", { d: "M4 6l4 4 4-4" }, null, -1)])]);
+}
+var ChevronIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(_sfc_main$1, [["render", _sfc_render$1]]);
+//#endregion
+//#region src/CloseIcon.vue
+var _sfc_main = {};
+var _hoisted_1$34 = {
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "1.5",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round",
+	"aria-hidden": "true"
+};
+function _sfc_render(_ctx, _cache) {
+	return openBlock(), createElementBlock("svg", _hoisted_1$34, [..._cache[0] || (_cache[0] = [createElementVNode("path", { d: "M4 4l8 8M12 4l-8 8" }, null, -1)])]);
+}
+var CloseIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]);
+//#endregion
+//#region src/FieldFeedback.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$33 = {
+	key: 0,
+	class: "field-feedback"
+};
+var _hoisted_2$27 = ["id"];
+var _hoisted_3$23 = ["id"];
+//#endregion
+//#region src/FieldFeedback.vue
+var FieldFeedback_default = /* @__PURE__ */ defineComponent({
+	__name: "FieldFeedback",
+	props: {
+		controlId: {},
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		showError: { type: Boolean }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return __props.description || __props.showError ? (openBlock(), createElementBlock("div", _hoisted_1$33, [__props.description ? (openBlock(), createElementBlock("span", {
+				key: 0,
+				id: `${__props.controlId}-description`,
+				class: "input__description"
+			}, toDisplayString(__props.description), 9, _hoisted_2$27)) : createCommentVNode("", true), __props.showError ? (openBlock(), createElementBlock("span", {
+				key: 1,
+				id: `${__props.controlId}-error`,
+				class: "input__error"
+			}, toDisplayString(__props.errorMessage), 9, _hoisted_3$23)) : createCommentVNode("", true)])) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+//#region src/SelectionValidation.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$32 = [
+	"required",
+	"disabled",
+	"value"
+];
+//#endregion
+//#region src/SelectionValidation.vue
+var SelectionValidation_default = /* @__PURE__ */ defineComponent({
+	__name: "SelectionValidation",
+	props: {
+		hasValue: { type: Boolean },
+		required: { type: Boolean },
+		disabled: { type: Boolean }
+	},
+	emits: ["invalid", "reset"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const input = ref();
+		let form;
+		const reset = (event) => setTimeout(() => emit("reset", event.defaultPrevented), 0);
+		onMounted(() => {
+			form = input.value?.form;
+			form?.addEventListener("reset", reset);
+		});
+		onBeforeUnmount(() => form?.removeEventListener("reset", reset));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("input", {
+				ref_key: "input",
+				ref: input,
+				class: "selection__validation",
+				type: "text",
+				tabindex: "-1",
+				"aria-hidden": "true",
+				autocomplete: "off",
+				required: __props.required,
+				disabled: __props.disabled,
+				value: __props.hasValue ? "selected" : "",
+				onInvalid: _cache[0] || (_cache[0] = withModifiers(($event) => emit("invalid"), ["prevent"]))
+			}, null, 40, _hoisted_1$32);
+		};
+	}
+});
+//#endregion
+//#region src/useFeedback.ts
+function useFeedback(props) {
+	const generated = useId();
+	const controlId = computed(() => props.id ?? generated);
+	const showError = computed(() => !!(props.invalid && props.errorMessage));
+	return {
+		controlId,
+		showError,
+		describedBy: computed(() => [props.description && `${controlId.value}-description`, showError.value && `${controlId.value}-error`].filter(Boolean).join(" ") || void 0)
+	};
+}
+//#endregion
+//#region src/selection-options.ts
+function selectionIds(value, options, multiple) {
+	const requested = new Set(Array.isArray(value) ? value : typeof value === "string" ? [value] : []);
+	const ids = [...new Set(options.filter((o) => o.id !== "" && requested.has(o.id)).map((o) => o.id))];
+	return multiple ? ids : ids.slice(0, 1);
+}
+function filterOptions(options, query) {
+	const fold = (text) => text.normalize("NFD").replace(/\p{M}/gu, "").toLowerCase();
+	const search = fold(query.trim());
+	return options.filter((o) => fold(`${o.label} ${o.description ?? ""}`).includes(search));
+}
+//#endregion
+//#region src/Select.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$31 = ["data-multiple", "dir"];
+var _hoisted_2$26 = ["for"];
+var _hoisted_3$22 = {
+	key: 0,
+	class: "selection__required",
+	"aria-hidden": "true"
+};
+var _hoisted_4$18 = ["data-clearable"];
+var _hoisted_5$12 = {
+	key: 0,
+	class: "selection__leading",
+	"aria-hidden": "true"
+};
+var _hoisted_6$9 = [
+	"data-empty",
+	"aria-hidden",
+	"tabindex",
+	"aria-label",
+	"disabled"
+];
+var _hoisted_7$8 = {
+	key: 0,
+	class: "selection__description"
+};
+var _hoisted_8$8 = [
+	"name",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/Select.vue
+var Select_default = /* @__PURE__ */ defineComponent({
+	__name: "Select",
+	props: {
+		label: {},
+		options: {},
+		size: { default: "md" },
+		variant: { default: "primary" },
+		hideLabel: { type: Boolean },
+		fullWidth: {
+			type: Boolean,
+			default: true
+		},
+		placeholder: { default: void 0 },
+		selectionMode: { default: void 0 },
+		modelValue: { default: void 0 },
+		defaultValue: { default: void 0 },
+		disabled: { type: Boolean },
+		required: { type: Boolean },
+		invalid: { type: Boolean },
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		requiredMessage: { default: void 0 },
+		name: { default: void 0 },
+		dir: { default: void 0 },
+		clearable: { type: Boolean },
+		clearLabel: { default: void 0 }
+	},
+	emits: [
+		"update:modelValue",
+		"clear",
+		"close"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		function afterClose() {
+			queueMicrotask(() => emit("close"));
+		}
+		const instance = getCurrentInstance();
+		const controlled = () => Object.prototype.hasOwnProperty.call(instance?.vnode.props ?? {}, "modelValue");
+		const local = ref(props.defaultValue);
+		const tried = ref(false);
+		const wrapper = ref();
+		const multiple = computed(() => props.selectionMode === "multiple");
+		const ids = computed(() => selectionIds(controlled() ? props.modelValue : local.value, props.options, multiple.value));
+		const selected = computed(() => props.options.filter((o) => ids.value.includes(o.id)));
+		const invalid = computed(() => props.invalid || tried.value && props.required && ids.value.length === 0);
+		const error = computed(() => props.errorMessage ?? (props.required && ids.value.length === 0 ? props.requiredMessage ?? "Pilihan wajib diisi." : void 0));
+		const { controlId, describedBy, showError } = useFeedback({
+			get description() {
+				return props.description;
+			},
+			get invalid() {
+				return invalid.value;
+			},
+			get errorMessage() {
+				return error.value;
+			}
+		});
+		function focus() {
+			wrapper.value?.querySelector(".select__trigger")?.focus();
+		}
+		function update(value) {
+			if (props.disabled) return;
+			const next = selectionIds(value, props.options, multiple.value);
+			const result = multiple.value ? next : next[0];
+			local.value = result;
+			emit("update:modelValue", result);
+		}
+		function clear() {
+			update(multiple.value ? [] : void 0);
+			emit("clear");
+			focus();
+		}
+		function reset(cancelled) {
+			if (!cancelled) {
+				tried.value = false;
+				if (!controlled()) local.value = props.defaultValue;
+			}
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "wrapper",
+				ref: wrapper,
+				class: normalizeClass([
+					"select",
+					`select--${__props.size ?? "md"}`,
+					`select--${__props.variant ?? "primary"}`,
+					__props.hideLabel && "select--label-hidden",
+					__props.fullWidth === false && "select--fit"
+				]),
+				"data-multiple": multiple.value || void 0,
+				dir: __props.dir
+			}, [
+				createElementVNode("label", {
+					class: "select__label",
+					for: unref(controlId)
+				}, [createTextVNode(toDisplayString(__props.label), 1), __props.required ? (openBlock(), createElementBlock("span", _hoisted_3$22, " *")) : createCommentVNode("", true)], 8, _hoisted_2$26),
+				createVNode(unref(SelectRoot), {
+					"model-value": multiple.value ? ids.value : ids.value[0] ?? "",
+					multiple: multiple.value,
+					disabled: __props.disabled,
+					dir: __props.dir,
+					"onUpdate:modelValue": update
+				}, {
+					default: withCtx(() => [createElementVNode("div", {
+						class: "select__control",
+						"data-clearable": __props.clearable || void 0
+					}, [createVNode(unref(SelectTrigger), {
+						id: unref(controlId),
+						class: "select__trigger",
+						"aria-required": __props.required || void 0,
+						"aria-invalid": invalid.value || void 0,
+						"aria-describedby": unref(describedBy)
+					}, {
+						default: withCtx(() => [
+							_ctx.$slots.start ? (openBlock(), createElementBlock("span", _hoisted_5$12, [renderSlot(_ctx.$slots, "start")])) : createCommentVNode("", true),
+							createVNode(unref(SelectValue), {
+								class: "select__value",
+								placeholder: __props.placeholder
+							}, {
+								default: withCtx(() => [selected.value.length ? renderSlot(_ctx.$slots, "value", { selected: selected.value }, () => [createTextVNode(toDisplayString(selected.value.map((o) => o.label).join(", ")), 1)], void 0, 0) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(__props.placeholder), 1)], 64))]),
+								_: 3
+							}, 8, ["placeholder"]),
+							createVNode(ChevronIcon_default, { class: "select__icon" })
+						]),
+						_: 3
+					}, 8, [
+						"id",
+						"aria-required",
+						"aria-invalid",
+						"aria-describedby"
+					]), __props.clearable ? (openBlock(), createElementBlock("button", {
+						key: 0,
+						type: "button",
+						class: "selection__clear",
+						"data-empty": ids.value.length === 0 || void 0,
+						"aria-hidden": ids.value.length === 0 || void 0,
+						tabindex: ids.value.length === 0 ? -1 : void 0,
+						"aria-label": __props.clearLabel ?? "Hapus pilihan",
+						disabled: __props.disabled || ids.value.length === 0,
+						onClick: clear
+					}, [createVNode(CloseIcon_default, { class: "selection__close-icon" })], 8, _hoisted_6$9)) : createCommentVNode("", true)], 8, _hoisted_4$18), createVNode(unref(SelectPortal), null, {
+						default: withCtx(() => [createVNode(unref(SelectContent), {
+							class: "select__popover",
+							position: "popper",
+							"side-offset": 4,
+							onCloseAutoFocus: afterClose
+						}, {
+							default: withCtx(() => [createVNode(unref(SelectViewport), { class: "select__list" }, {
+								default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option) => {
+									return openBlock(), createBlock(unref(SelectItem), {
+										key: option.id,
+										value: option.id,
+										"text-value": option.label,
+										disabled: option.isDisabled,
+										class: "select__item"
+									}, {
+										default: withCtx(() => [createVNode(unref(SelectItemText), { class: "select__item-label" }, {
+											default: withCtx(() => [renderSlot(_ctx.$slots, "option", { option }, () => [createTextVNode(toDisplayString(option.label), 1), option.description ? (openBlock(), createElementBlock("span", _hoisted_7$8, toDisplayString(option.description), 1)) : createCommentVNode("", true)])]),
+											_: 2
+										}, 1024), createVNode(CheckIcon_default, { class: "select__check" })]),
+										_: 2
+									}, 1032, [
+										"value",
+										"text-value",
+										"disabled"
+									]);
+								}), 128))]),
+								_: 3
+							})]),
+							_: 3
+						})]),
+						_: 3
+					})]),
+					_: 3
+				}, 8, [
+					"model-value",
+					"multiple",
+					"disabled",
+					"dir"
+				]),
+				createVNode(FieldFeedback_default, {
+					"control-id": unref(controlId),
+					description: __props.description,
+					"error-message": error.value,
+					"show-error": unref(showError)
+				}, null, 8, [
+					"control-id",
+					"description",
+					"error-message",
+					"show-error"
+				]),
+				__props.name ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(multiple.value ? ids.value : [ids.value[0] ?? ""], (id, i) => {
+					return openBlock(), createElementBlock("input", {
+						key: i,
+						type: "hidden",
+						name: __props.name,
+						value: id,
+						disabled: __props.disabled
+					}, null, 8, _hoisted_8$8);
+				}), 128)) : createCommentVNode("", true),
+				createVNode(SelectionValidation_default, {
+					"has-value": ids.value.length > 0,
+					required: __props.required,
+					disabled: __props.disabled,
+					onInvalid: _cache[0] || (_cache[0] = ($event) => {
+						tried.value = true;
+						focus();
+					}),
+					onReset: reset
+				}, null, 8, [
+					"has-value",
+					"required",
+					"disabled"
+				])
+			], 10, _hoisted_1$31);
+		};
+	}
+});
+//#endregion
+//#region src/SelectGroup.ts
+var SelectGroup_default = /* @__PURE__ */ defineComponent({
+	name: "SelectGroup",
+	inheritAttrs: false,
+	props: {
+		label: {
+			type: String,
+			required: true
+		},
+		size: {
+			type: String,
+			default: void 0
+		},
+		variant: {
+			type: String,
+			default: void 0
+		},
+		fullWidth: {
+			type: Boolean,
+			default: true
+		},
+		disabled: Boolean,
+		dir: {
+			type: String,
+			default: void 0
+		}
+	},
+	setup(props, { slots }) {
+		function defaults(nodes) {
+			return nodes.map((child) => {
+				if (child.type === Fragment && Array.isArray(child.children)) {
+					const fragment = cloneVNode(child);
+					fragment.children = defaults(child.children);
+					return fragment;
+				}
+				if (child.type !== Select_default) return child;
+				return cloneVNode(child, {
+					size: child.props?.size ?? props.size,
+					variant: child.props?.variant ?? props.variant,
+					hideLabel: child.props?.hideLabel ?? child.props?.["hide-label"] ?? true,
+					fullWidth: child.props?.fullWidth ?? child.props?.["full-width"] ?? props.fullWidth,
+					disabled: props.disabled || child.props?.disabled,
+					dir: child.props?.dir ?? props.dir
+				});
+			});
+		}
+		return () => h("fieldset", {
+			class: ["select-group", !props.fullWidth && "select-group--fit"],
+			disabled: props.disabled,
+			dir: props.dir
+		}, [h("legend", { class: "select-group__legend" }, props.label), h("div", { class: "select-group__controls" }, defaults(slots.default?.() ?? []))]);
+	}
+});
+//#endregion
+//#region src/Input.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$30 = ["dir"];
+var _hoisted_2$25 = ["disabled"];
+var _hoisted_3$21 = ["data-invalid", "data-readonly"];
+var _hoisted_4$17 = {
+	key: 0,
+	class: "input__prefix"
+};
+var _hoisted_5$11 = [
+	"id",
+	"type",
+	"name",
+	"value",
+	"placeholder",
+	"disabled",
+	"readonly",
+	"required",
+	"aria-required",
+	"aria-invalid",
+	"aria-describedby",
+	"autocomplete",
+	"maxlength",
+	"minlength",
+	"pattern",
+	"inputmode",
+	"enterkeyhint",
+	"autofocus",
+	"spellcheck",
+	"form"
+];
+var _hoisted_6$8 = {
+	key: 1,
+	class: "input__suffix"
+};
+var _hoisted_7$7 = ["id"];
+var _hoisted_8$7 = ["id"];
+//#endregion
+//#region src/Input.vue
+var Input_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Input",
+	props: /*@__PURE__*/ mergeModels({
+		label: {},
+		defaultValue: { default: "" },
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		placeholder: { default: void 0 },
+		type: { default: "text" },
+		size: { default: "md" },
+		variant: { default: "primary" },
+		fullWidth: {
+			type: Boolean,
+			default: true
+		},
+		name: { default: void 0 },
+		id: { default: void 0 },
+		autoComplete: { default: void 0 },
+		maxLength: { default: void 0 },
+		minLength: { default: void 0 },
+		pattern: { default: void 0 },
+		inputMode: { default: void 0 },
+		enterKeyHint: { default: void 0 },
+		autoFocus: { type: Boolean },
+		spellCheck: {
+			type: Boolean,
+			default: void 0
+		},
+		form: { default: void 0 },
+		dir: { default: void 0 }
+	}, {
+		"modelValue": {},
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels([
+		"focus",
+		"blur",
+		"keydown",
+		"keyup"
+	], ["update:modelValue"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const control = ref();
+		function focus() {
+			if (!props.disabled) control.value?.focus();
+		}
+		function select() {
+			if (!props.disabled) control.value?.select();
+		}
+		__expose({
+			focus,
+			select,
+			element: control
+		});
+		onMounted(() => {
+			if (props.autoFocus) focus();
+		});
+		function pointerdown(event) {
+			if (!props.disabled && !event.target.closest("input,button,a,select,textarea,[tabindex],[contenteditable]")) {
+				event.preventDefault();
+				focus();
+			}
+		}
+		/** Controlled v-model values are strings; clear with an empty string. */
+		const model = useModel(__props, "modelValue");
+		const local = ref(props.defaultValue ?? "");
+		const value = computed(() => model.value ?? local.value);
+		const generatedId = useId();
+		const controlId = computed(() => props.id ?? generatedId);
+		const showError = computed(() => props.invalid && !!props.errorMessage);
+		const describedBy = computed(() => [props.description && `${controlId.value}-description`, showError.value && `${controlId.value}-error`].filter(Boolean).join(" ") || void 0);
+		function onInput(event) {
+			if (props.disabled || props.readonly) return;
+			const next = event.target.value;
+			local.value = next;
+			model.value = next;
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: normalizeClass([
+					"input",
+					`input--${__props.size}`,
+					`input--${__props.variant}`,
+					!__props.fullWidth && "input--fit"
+				]),
+				dir: __props.dir
+			}, [
+				createVNode(unref(Label), {
+					class: "input__label",
+					for: controlId.value
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.label), 1)]),
+					_: 1
+				}, 8, ["for"]),
+				createElementVNode("fieldset", {
+					class: "input__boundary",
+					role: "presentation",
+					disabled: __props.disabled
+				}, [createElementVNode("div", {
+					class: normalizeClass(_ctx.$slots.prefix || _ctx.$slots.suffix ? "input__group" : "input__plain"),
+					"data-invalid": __props.invalid || void 0,
+					"data-readonly": __props.readonly || void 0,
+					onPointerdown: pointerdown
+				}, [
+					_ctx.$slots.prefix ? (openBlock(), createElementBlock("span", _hoisted_4$17, [renderSlot(_ctx.$slots, "prefix")])) : createCommentVNode("", true),
+					createElementVNode("input", {
+						id: controlId.value,
+						ref_key: "control",
+						ref: control,
+						class: "input__control",
+						type: __props.type,
+						name: __props.name,
+						value: value.value,
+						placeholder: __props.placeholder,
+						disabled: __props.disabled,
+						readonly: __props.readonly,
+						required: __props.required,
+						"aria-required": __props.required || void 0,
+						"aria-invalid": __props.invalid || void 0,
+						"aria-describedby": describedBy.value,
+						autocomplete: __props.autoComplete,
+						maxlength: __props.maxLength,
+						minlength: __props.minLength,
+						pattern: __props.pattern,
+						inputmode: __props.inputMode,
+						enterkeyhint: __props.enterKeyHint,
+						autofocus: __props.autoFocus,
+						spellcheck: __props.spellCheck,
+						form: __props.form,
+						onInput,
+						onFocus: _cache[0] || (_cache[0] = ($event) => emit("focus", $event)),
+						onBlur: _cache[1] || (_cache[1] = ($event) => emit("blur", $event)),
+						onKeydown: _cache[2] || (_cache[2] = ($event) => emit("keydown", $event)),
+						onKeyup: _cache[3] || (_cache[3] = ($event) => emit("keyup", $event))
+					}, null, 40, _hoisted_5$11),
+					_ctx.$slots.suffix ? (openBlock(), createElementBlock("span", _hoisted_6$8, [renderSlot(_ctx.$slots, "suffix")])) : createCommentVNode("", true)
+				], 42, _hoisted_3$21)], 8, _hoisted_2$25),
+				__props.description ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					id: `${controlId.value}-description`,
+					class: "input__description"
+				}, toDisplayString(__props.description), 9, _hoisted_7$7)) : createCommentVNode("", true),
+				showError.value ? (openBlock(), createElementBlock("div", {
+					key: 1,
+					id: `${controlId.value}-error`,
+					class: "input__error"
+				}, toDisplayString(__props.errorMessage), 9, _hoisted_8$7)) : createCommentVNode("", true)
+			], 10, _hoisted_1$30);
+		};
+	}
+});
+//#endregion
+//#region src/Textarea.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$29 = ["data-resize", "dir"];
+var _hoisted_2$24 = [
+	"id",
+	"rows",
+	"name",
+	"value",
+	"placeholder",
+	"disabled",
+	"readonly",
+	"required",
+	"aria-required",
+	"aria-invalid",
+	"aria-describedby",
+	"autocomplete",
+	"maxlength"
+];
+var _hoisted_3$20 = ["id"];
+var _hoisted_4$16 = ["id"];
+//#endregion
+//#region src/Textarea.vue
+var Textarea_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Textarea",
+	props: /*@__PURE__*/ mergeModels({
+		label: {},
+		defaultValue: { default: "" },
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		placeholder: { default: void 0 },
+		rows: { default: 3 },
+		resize: { default: "vertical" },
+		name: { default: void 0 },
+		id: { default: void 0 },
+		autoComplete: { default: void 0 },
+		maxLength: { default: void 0 },
+		dir: { default: void 0 }
+	}, {
+		"modelValue": {},
+		"modelModifiers": {}
+	}),
+	emits: ["update:modelValue"],
+	setup(__props) {
+		const props = __props;
+		/** Controlled v-model values are strings; clear with an empty string. */
+		const model = useModel(__props, "modelValue");
+		const local = ref(props.defaultValue ?? "");
+		const value = computed(() => model.value ?? local.value);
+		const generatedId = useId();
+		const controlId = computed(() => props.id ?? generatedId);
+		const showError = computed(() => props.invalid && !!props.errorMessage);
+		const describedBy = computed(() => [props.description && `${controlId.value}-description`, showError.value && `${controlId.value}-error`].filter(Boolean).join(" ") || void 0);
+		function onInput(event) {
+			if (props.disabled || props.readonly) return;
+			const next = event.target.value;
+			local.value = next;
+			model.value = next;
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "input textarea",
+				"data-resize": __props.resize,
+				dir: __props.dir
+			}, [
+				createVNode(unref(Label), {
+					class: "input__label",
+					for: controlId.value
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.label), 1)]),
+					_: 1
+				}, 8, ["for"]),
+				createElementVNode("textarea", {
+					id: controlId.value,
+					class: "input__control textarea__control",
+					rows: __props.rows,
+					name: __props.name,
+					value: value.value,
+					placeholder: __props.placeholder,
+					disabled: __props.disabled,
+					readonly: __props.readonly,
+					required: __props.required,
+					"aria-required": __props.required || void 0,
+					"aria-invalid": __props.invalid || void 0,
+					"aria-describedby": describedBy.value,
+					autocomplete: __props.autoComplete,
+					maxlength: __props.maxLength,
+					onInput
+				}, null, 40, _hoisted_2$24),
+				__props.description ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					id: `${controlId.value}-description`,
+					class: "input__description"
+				}, toDisplayString(__props.description), 9, _hoisted_3$20)) : createCommentVNode("", true),
+				showError.value ? (openBlock(), createElementBlock("div", {
+					key: 1,
+					id: `${controlId.value}-error`,
+					class: "input__error"
+				}, toDisplayString(__props.errorMessage), 9, _hoisted_4$16)) : createCommentVNode("", true)
+			], 8, _hoisted_1$29);
+		};
+	}
+});
+//#endregion
+//#region src/Label.vue
+var Label_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Label",
+	props: {
+		for: { default: void 0 },
+		id: { default: void 0 }
+	},
+	setup(__props) {
+		const props = __props;
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Label), {
+				id: __props.id,
+				class: "label",
+				for: props.for
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 8, ["id", "for"]);
+		};
+	}
+});
+//#endregion
+//#region src/Checkbox.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$28 = ["dir"];
+var _hoisted_2$23 = ["data-disabled"];
+var _hoisted_3$19 = ["name", "value"];
+//#endregion
+//#region src/Checkbox.vue
+var Checkbox_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Checkbox",
+	props: {
+		label: {},
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultValue: {
+			type: Boolean,
+			default: false
+		},
+		indeterminate: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		name: { default: void 0 },
+		value: { default: "on" },
+		id: { default: void 0 },
+		dir: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const local = ref(props.defaultValue);
+		const selected = computed(() => props.modelValue ?? local.value);
+		const state = computed(() => props.indeterminate ? "indeterminate" : selected.value);
+		const { controlId, showError, describedBy } = useFeedback(props);
+		function update(value) {
+			if (props.disabled) return;
+			const next = props.indeterminate ? !selected.value : value === true;
+			local.value = next;
+			emit("update:modelValue", next);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "input",
+				dir: __props.dir
+			}, [
+				createElementVNode("div", {
+					class: "choice",
+					"data-disabled": __props.disabled || void 0
+				}, [createVNode(unref(CheckboxRoot), {
+					id: unref(controlId),
+					class: "checkbox__control",
+					"model-value": state.value,
+					disabled: __props.disabled,
+					required: __props.required,
+					name: __props.indeterminate ? void 0 : __props.name,
+					value: __props.value,
+					"aria-describedby": unref(describedBy),
+					"aria-invalid": __props.invalid || void 0,
+					"data-invalid": __props.invalid || void 0,
+					"onUpdate:modelValue": update
+				}, {
+					default: withCtx(() => [createVNode(CheckIcon_default, { class: "checkbox__check" }), _cache[0] || (_cache[0] = createElementVNode("span", { class: "checkbox__dash" }, null, -1))]),
+					_: 1
+				}, 8, [
+					"id",
+					"model-value",
+					"disabled",
+					"required",
+					"name",
+					"value",
+					"aria-describedby",
+					"aria-invalid",
+					"data-invalid"
+				]), createVNode(unref(Label), {
+					class: "choice__label",
+					for: unref(controlId)
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.label), 1)]),
+					_: 1
+				}, 8, ["for"])], 8, _hoisted_2$23),
+				__props.indeterminate && selected.value && __props.name && !__props.disabled ? (openBlock(), createElementBlock("input", {
+					key: 0,
+					type: "hidden",
+					name: __props.name,
+					value: __props.value
+				}, null, 8, _hoisted_3$19)) : createCommentVNode("", true),
+				createVNode(FieldFeedback_default, {
+					"control-id": unref(controlId),
+					description: __props.description,
+					"error-message": __props.errorMessage,
+					"show-error": unref(showError)
+				}, null, 8, [
+					"control-id",
+					"description",
+					"error-message",
+					"show-error"
+				])
+			], 8, _hoisted_1$28);
+		};
+	}
+});
+//#endregion
+//#region src/RadioGroup.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$27 = ["id"];
+var _hoisted_2$22 = ["data-orientation"];
+var _hoisted_3$18 = ["data-disabled"];
+//#endregion
+//#region src/RadioGroup.vue
+var RadioGroup_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "RadioGroup",
+	props: /*@__PURE__*/ mergeModels({
+		label: {},
+		options: {},
+		defaultValue: { default: "" },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		name: { default: void 0 },
+		id: { default: void 0 },
+		orientation: { default: "vertical" },
+		dir: { default: void 0 }
+	}, {
+		"modelValue": {},
+		"modelModifiers": {}
+	}),
+	emits: ["update:modelValue"],
+	setup(__props) {
+		const props = __props;
+		const model = useModel(__props, "modelValue");
+		const local = ref(props.defaultValue);
+		const value = computed(() => model.value ?? local.value);
+		const { controlId, describedBy, showError } = useFeedback(props);
+		function update(next) {
+			if (props.disabled || typeof next !== "string") return;
+			local.value = next;
+			model.value = next;
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(RadioGroupRoot), {
+				id: unref(controlId),
+				class: "input radio-group",
+				"model-value": value.value,
+				disabled: __props.disabled,
+				required: __props.required,
+				name: __props.name,
+				orientation: __props.orientation,
+				dir: __props.dir,
+				"aria-labelledby": `${unref(controlId)}-label`,
+				"aria-describedby": unref(describedBy),
+				"aria-invalid": __props.invalid || void 0,
+				"onUpdate:modelValue": update
+			}, {
+				default: withCtx(() => [
+					createElementVNode("span", {
+						id: `${unref(controlId)}-label`,
+						class: "label"
+					}, toDisplayString(__props.label), 9, _hoisted_1$27),
+					createElementVNode("div", {
+						class: "radio-group__items",
+						"data-orientation": __props.orientation
+					}, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option, index) => {
+						return openBlock(), createElementBlock("div", {
+							key: option.id,
+							class: "choice",
+							"data-disabled": __props.disabled || option.isDisabled || void 0
+						}, [createVNode(unref(RadioGroupItem), {
+							id: `${unref(controlId)}-option-${index}`,
+							class: "radio__control",
+							value: option.id,
+							disabled: option.isDisabled,
+							"data-invalid": __props.invalid || void 0
+						}, {
+							default: withCtx(() => [..._cache[0] || (_cache[0] = [createElementVNode("span", { class: "radio__dot" }, null, -1)])]),
+							_: 1
+						}, 8, [
+							"id",
+							"value",
+							"disabled",
+							"data-invalid"
+						]), createVNode(unref(Label), {
+							class: "choice__label",
+							for: `${unref(controlId)}-option-${index}`
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(option.label), 1)]),
+							_: 2
+						}, 1032, ["for"])], 8, _hoisted_3$18);
+					}), 128))], 8, _hoisted_2$22),
+					createVNode(FieldFeedback_default, {
+						"control-id": unref(controlId),
+						description: __props.description,
+						"error-message": __props.errorMessage,
+						"show-error": unref(showError)
+					}, null, 8, [
+						"control-id",
+						"description",
+						"error-message",
+						"show-error"
+					])
+				]),
+				_: 1
+			}, 8, [
+				"id",
+				"model-value",
+				"disabled",
+				"required",
+				"name",
+				"orientation",
+				"dir",
+				"aria-labelledby",
+				"aria-describedby",
+				"aria-invalid"
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/Switch.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$26 = ["dir"];
+var _hoisted_2$21 = ["data-disabled"];
+//#endregion
+//#region src/Switch.vue
+var Switch_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Switch",
+	props: {
+		label: {},
+		modelValue: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultValue: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		name: { default: void 0 },
+		value: { default: "on" },
+		id: { default: void 0 },
+		dir: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const local = ref(props.defaultValue);
+		const selected = computed(() => props.modelValue ?? local.value);
+		const state = computed(() => selected.value);
+		const { controlId, showError, describedBy } = useFeedback(props);
+		function update(value) {
+			if (props.disabled) return;
+			const next = value;
+			local.value = next;
+			emit("update:modelValue", next);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "input",
+				dir: __props.dir
+			}, [createElementVNode("div", {
+				class: "choice",
+				"data-disabled": __props.disabled || void 0
+			}, [createVNode(unref(SwitchRoot), {
+				id: unref(controlId),
+				class: "switch__control",
+				"model-value": state.value,
+				disabled: __props.disabled,
+				name: __props.name,
+				value: __props.value,
+				"aria-describedby": unref(describedBy),
+				"aria-invalid": __props.invalid || void 0,
+				"data-invalid": __props.invalid || void 0,
+				"onUpdate:modelValue": update
+			}, {
+				default: withCtx(() => [..._cache[0] || (_cache[0] = [createElementVNode("span", { class: "switch__thumb" }, null, -1)])]),
+				_: 1
+			}, 8, [
+				"id",
+				"model-value",
+				"disabled",
+				"name",
+				"value",
+				"aria-describedby",
+				"aria-invalid",
+				"data-invalid"
+			]), createVNode(unref(Label), {
+				class: "choice__label",
+				for: unref(controlId)
+			}, {
+				default: withCtx(() => [createTextVNode(toDisplayString(__props.label), 1)]),
+				_: 1
+			}, 8, ["for"])], 8, _hoisted_2$21), createVNode(FieldFeedback_default, {
+				"control-id": unref(controlId),
+				description: __props.description,
+				"error-message": __props.errorMessage,
+				"show-error": unref(showError)
+			}, null, 8, [
+				"control-id",
+				"description",
+				"error-message",
+				"show-error"
+			])], 8, _hoisted_1$26);
+		};
+	}
+});
+//#endregion
+//#region src/form-context.ts
+var formErrorsKey = /* @__PURE__ */ Symbol("KazeeFormErrors");
+//#endregion
+//#region src/Field.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$25 = ["dir"];
+//#endregion
+//#region src/Field.vue
+var Field_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Field",
+	props: {
+		label: {},
+		name: {},
+		id: { default: void 0 },
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		dir: { default: void 0 }
+	},
+	setup(__props) {
+		const props = __props;
+		const errors = inject(formErrorsKey, computed(() => ({})));
+		const error = computed(() => {
+			const map = errors.value;
+			return Object.hasOwn(map, props.name) && typeof map[props.name] === "string" ? map[props.name] || void 0 : void 0;
+		});
+		const invalidState = computed(() => props.invalid || !!error.value);
+		const message = computed(() => props.invalid && props.errorMessage || error.value || void 0);
+		const { controlId, showError, describedBy } = useFeedback({
+			get id() {
+				return props.id;
+			},
+			get description() {
+				return props.description;
+			},
+			get invalid() {
+				return invalidState.value;
+			},
+			get errorMessage() {
+				return message.value;
+			}
+		});
+		const controlProps = computed(() => ({
+			id: controlId.value,
+			name: props.name,
+			class: "input__control field__control",
+			disabled: props.disabled,
+			readonly: props.readonly,
+			required: props.required,
+			"aria-required": props.required || void 0,
+			"aria-invalid": invalidState.value || void 0,
+			"aria-describedby": describedBy.value
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "input field",
+				dir: __props.dir
+			}, [
+				createVNode(unref(Label), {
+					class: "label",
+					for: unref(controlId)
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.label), 1)]),
+					_: 1
+				}, 8, ["for"]),
+				renderSlot(_ctx.$slots, "default", {
+					controlProps: controlProps.value,
+					invalid: invalidState.value,
+					errorMessage: message.value
+				}),
+				createVNode(FieldFeedback_default, {
+					"control-id": unref(controlId),
+					description: __props.description,
+					"error-message": message.value,
+					"show-error": unref(showError)
+				}, null, 8, [
+					"control-id",
+					"description",
+					"error-message",
+					"show-error"
+				])
+			], 8, _hoisted_1$25);
+		};
+	}
+});
+//#endregion
+//#region src/Form.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$24 = [
+	"id",
+	"dir",
+	"aria-label",
+	"aria-labelledby",
+	"novalidate"
+];
+//#endregion
+//#region src/Form.vue
+var Form_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Form",
+	props: {
+		validationErrors: { default: () => ({}) },
+		noValidate: {
+			type: Boolean,
+			default: false
+		},
+		id: { default: void 0 },
+		ariaLabel: { default: void 0 },
+		ariaLabelledby: { default: void 0 },
+		dir: { default: void 0 }
+	},
+	emits: ["submit", "reset"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		provide(formErrorsKey, computed(() => props.validationErrors));
+		function submit(event) {
+			event.preventDefault();
+			const form = event.currentTarget;
+			if (!props.noValidate && !form.checkValidity()) {
+				form.reportValidity();
+				return;
+			}
+			for (const element of form.querySelectorAll("[aria-invalid=\"true\"]")) {
+				const selector = "input:not([type=\"hidden\"]), textarea, select, button, [role=\"listbox\"]";
+				const invalid = (element.matches(selector) ? [element] : [...element.querySelectorAll(selector)]).find((control) => !control.matches(":disabled, [aria-disabled=\"true\"]"));
+				if (invalid) {
+					invalid.focus();
+					return;
+				}
+			}
+			emit("submit", new FormData(form, event.submitter), event);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("form", {
+				id: __props.id,
+				class: "form",
+				dir: __props.dir,
+				"aria-label": __props.ariaLabel,
+				"aria-labelledby": __props.ariaLabelledby,
+				novalidate: __props.noValidate,
+				onSubmit: submit,
+				onReset: _cache[0] || (_cache[0] = ($event) => emit("reset", $event))
+			}, [renderSlot(_ctx.$slots, "default")], 40, _hoisted_1$24);
+		};
+	}
+});
+//#endregion
+//#region src/listbox-selection.ts
+/** Stable option order, unique enabled IDs, and at most one ID in single mode. */
+function listboxSelection(value, options, mode) {
+	const requested = new Set(value);
+	const seen = /* @__PURE__ */ new Set();
+	const result = [];
+	for (const option of options) if (option.id && !option.isDisabled && requested.has(option.id) && !seen.has(option.id)) {
+		seen.add(option.id);
+		result.push(option.id);
+		if (mode === "single") break;
+	}
+	return result;
+}
+//#endregion
+//#region src/Listbox.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$23 = ["dir"];
+var _hoisted_2$20 = ["id"];
+var _hoisted_3$17 = { class: "listbox__text" };
+var _hoisted_4$15 = {
+	key: 0,
+	class: "listbox__empty",
+	role: "option",
+	"aria-disabled": "true",
+	"aria-selected": "false"
+};
+var _hoisted_5$10 = [
+	"name",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/Listbox.vue
+var Listbox_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Listbox",
+	props: {
+		label: {},
+		options: {},
+		modelValue: { default: void 0 },
+		defaultValue: { default: () => [] },
+		selectionMode: { default: "single" },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		name: { default: void 0 },
+		id: { default: void 0 },
+		dir: { default: void 0 },
+		emptyMessage: { default: "Tidak ada pilihan." }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const local = ref(props.defaultValue);
+		const selected = computed(() => listboxSelection(props.modelValue ?? local.value, props.options, props.selectionMode));
+		const model = computed(() => props.selectionMode === "multiple" ? selected.value : selected.value[0] ?? null);
+		const generated = useId();
+		const labelId = computed(() => `${props.id ?? generated}-label`);
+		const { controlId, showError, describedBy } = useFeedback(props);
+		function update(value) {
+			if (props.disabled) return;
+			const next = listboxSelection(Array.isArray(value) ? value.filter((id) => typeof id === "string") : typeof value === "string" ? [value] : [], props.options, props.selectionMode);
+			if (next.length === selected.value.length && next.every((key, index) => key === selected.value[index])) return;
+			local.value = next;
+			emit("update:modelValue", next);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "input listbox",
+				dir: __props.dir
+			}, [
+				createElementVNode("span", {
+					id: labelId.value,
+					class: "label"
+				}, toDisplayString(__props.label), 9, _hoisted_2$20),
+				createVNode(unref(ListboxRoot), {
+					"model-value": model.value,
+					multiple: __props.selectionMode === "multiple",
+					disabled: __props.disabled,
+					dir: __props.dir,
+					"selection-behavior": __props.selectionMode === "single" ? "replace" : "toggle",
+					"highlight-on-hover": "",
+					"onUpdate:modelValue": update
+				}, {
+					default: withCtx(() => [createVNode(unref(ListboxContent), {
+						id: __props.id,
+						class: "listbox__list",
+						"aria-labelledby": labelId.value,
+						"aria-describedby": unref(describedBy),
+						"aria-invalid": __props.invalid || void 0,
+						"aria-disabled": __props.disabled || void 0,
+						tabindex: __props.disabled ? -1 : void 0
+					}, {
+						default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option) => {
+							return openBlock(), createBlock(unref(ListboxItem), {
+								key: option.id,
+								value: option.id,
+								disabled: __props.disabled || option.isDisabled,
+								"aria-disabled": __props.disabled || option.isDisabled || void 0,
+								class: "listbox__item"
+							}, {
+								default: withCtx(() => [createElementVNode("span", _hoisted_3$17, toDisplayString(option.label), 1), createVNode(CheckIcon_default, { class: "listbox__check" })]),
+								_: 2
+							}, 1032, [
+								"value",
+								"disabled",
+								"aria-disabled"
+							]);
+						}), 128)), !__props.options.length ? (openBlock(), createElementBlock("span", _hoisted_4$15, toDisplayString(__props.emptyMessage), 1)) : createCommentVNode("", true)]),
+						_: 1
+					}, 8, [
+						"id",
+						"aria-labelledby",
+						"aria-describedby",
+						"aria-invalid",
+						"aria-disabled",
+						"tabindex"
+					])]),
+					_: 1
+				}, 8, [
+					"model-value",
+					"multiple",
+					"disabled",
+					"dir",
+					"selection-behavior"
+				]),
+				createVNode(FieldFeedback_default, {
+					"control-id": unref(controlId),
+					description: __props.description,
+					"error-message": __props.errorMessage,
+					"show-error": unref(showError)
+				}, null, 8, [
+					"control-id",
+					"description",
+					"error-message",
+					"show-error"
+				]),
+				__props.name ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(selected.value, (key) => {
+					return openBlock(), createElementBlock("input", {
+						key,
+						type: "hidden",
+						name: __props.name,
+						value: key,
+						disabled: __props.disabled
+					}, null, 8, _hoisted_5$10);
+				}), 128)) : createCommentVNode("", true)
+			], 8, _hoisted_1$23);
+		};
+	}
+});
+//#endregion
+//#region src/NumberField.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$22 = ["dir"];
+var _hoisted_2$19 = { class: "number-field__group" };
+var _hoisted_3$16 = [
+	"name",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/NumberField.vue
+var NumberField_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "NumberField",
+	props: {
+		label: {},
+		modelValue: { default: void 0 },
+		defaultValue: { default: null },
+		min: { default: void 0 },
+		max: { default: void 0 },
+		step: { default: 1 },
+		locale: { default: "id-ID" },
+		formatOptions: { default: void 0 },
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		invalid: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		name: { default: void 0 },
+		id: { default: void 0 },
+		dir: { default: void 0 },
+		incrementLabel: { default: void 0 },
+		decrementLabel: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		function finite(value) {
+			return typeof value === "number" && Number.isFinite(value) ? value : null;
+		}
+		const local = ref(finite(props.defaultValue));
+		const selected = computed(() => finite(props.modelValue === void 0 ? local.value : props.modelValue));
+		const { controlId, showError, describedBy } = useFeedback(props);
+		function update(value) {
+			if (props.disabled || props.readonly) return;
+			const next = finite(value);
+			local.value = next;
+			emit("update:modelValue", next);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "input number-field",
+				dir: __props.dir
+			}, [
+				createVNode(unref(Label), {
+					class: "label",
+					for: unref(controlId)
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.label), 1)]),
+					_: 1
+				}, 8, ["for"]),
+				createVNode(unref(NumberFieldRoot), {
+					id: unref(controlId),
+					"model-value": selected.value,
+					min: __props.min,
+					max: __props.max,
+					step: __props.step,
+					locale: __props.locale,
+					"format-options": __props.formatOptions,
+					disabled: __props.disabled,
+					readonly: __props.readonly,
+					required: __props.required,
+					"disable-wheel-change": "",
+					"onUpdate:modelValue": update
+				}, {
+					default: withCtx(() => [createElementVNode("div", _hoisted_2$19, [
+						createVNode(unref(NumberFieldDecrement), {
+							class: "number-field__step",
+							"aria-label": __props.decrementLabel ?? `Kurangi ${__props.label}`
+						}, {
+							default: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode("−", -1)])]),
+							_: 1
+						}, 8, ["aria-label"]),
+						createVNode(unref(NumberFieldInput), {
+							class: "number-field__control",
+							required: __props.required,
+							"aria-required": __props.required || void 0,
+							"aria-invalid": __props.invalid || void 0,
+							"aria-describedby": unref(describedBy)
+						}, null, 8, [
+							"required",
+							"aria-required",
+							"aria-invalid",
+							"aria-describedby"
+						]),
+						createVNode(unref(NumberFieldIncrement), {
+							class: "number-field__step",
+							"aria-label": __props.incrementLabel ?? `Tambah ${__props.label}`
+						}, {
+							default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode("+", -1)])]),
+							_: 1
+						}, 8, ["aria-label"])
+					])]),
+					_: 1
+				}, 8, [
+					"id",
+					"model-value",
+					"min",
+					"max",
+					"step",
+					"locale",
+					"format-options",
+					"disabled",
+					"readonly",
+					"required"
+				]),
+				createVNode(FieldFeedback_default, {
+					"control-id": unref(controlId),
+					description: __props.description,
+					"error-message": __props.errorMessage,
+					"show-error": unref(showError)
+				}, null, 8, [
+					"control-id",
+					"description",
+					"error-message",
+					"show-error"
+				]),
+				__props.name ? (openBlock(), createElementBlock("input", {
+					key: 0,
+					type: "hidden",
+					name: __props.name,
+					value: selected.value === null ? "" : String(selected.value),
+					disabled: __props.disabled
+				}, null, 8, _hoisted_3$16)) : createCommentVNode("", true)
+			], 8, _hoisted_1$22);
+		};
+	}
+});
+//#endregion
+//#region src/Card.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$21 = { class: "card" };
+var _hoisted_2$18 = {
+	key: 0,
+	class: "card__header"
+};
+var _hoisted_3$15 = {
+	key: 0,
+	class: "card__heading"
+};
+var _hoisted_4$14 = {
+	key: 0,
+	class: "card__title-row"
+};
+var _hoisted_5$9 = {
+	key: 2,
+	class: "card__description"
+};
+var _hoisted_6$7 = {
+	key: 1,
+	class: "card__actions"
+};
+var _hoisted_7$6 = { class: "card__content" };
+var _hoisted_8$6 = {
+	key: 1,
+	class: "card__footer"
+};
+//#endregion
+//#region src/Card.vue
+var Card_default = /* @__PURE__ */ defineComponent({
+	__name: "Card",
+	props: {
+		title: { default: void 0 },
+		description: { default: void 0 },
+		headingLevel: { default: 3 }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1$21, [
+				__props.title || __props.description || _ctx.$slots.actions || _ctx.$slots.header || _ctx.$slots["title-extras"] ? (openBlock(), createElementBlock("div", _hoisted_2$18, [__props.title || __props.description || _ctx.$slots.header || _ctx.$slots["title-extras"] ? (openBlock(), createElementBlock("div", _hoisted_3$15, [renderSlot(_ctx.$slots, "header", {}, () => [_ctx.$slots["title-extras"] ? (openBlock(), createElementBlock("div", _hoisted_4$14, [__props.title ? (openBlock(), createBlock(resolveDynamicComponent(`h${__props.headingLevel}`), {
+					key: 0,
+					class: "card__title"
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.title), 1)]),
+					_: 1
+				})) : createCommentVNode("", true), renderSlot(_ctx.$slots, "title-extras")])) : __props.title ? (openBlock(), createBlock(resolveDynamicComponent(`h${__props.headingLevel}`), {
+					key: 1,
+					class: "card__title"
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.title), 1)]),
+					_: 1
+				})) : createCommentVNode("", true), __props.description ? (openBlock(), createElementBlock("p", _hoisted_5$9, toDisplayString(__props.description), 1)) : createCommentVNode("", true)])])) : createCommentVNode("", true), _ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_6$7, [renderSlot(_ctx.$slots, "actions")])) : createCommentVNode("", true)])) : createCommentVNode("", true),
+				createElementVNode("div", _hoisted_7$6, [renderSlot(_ctx.$slots, "default")]),
+				_ctx.$slots.footer ? (openBlock(), createElementBlock("div", _hoisted_8$6, [renderSlot(_ctx.$slots, "footer")])) : createCommentVNode("", true)
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/Badge.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$20 = ["data-tone"];
+//#endregion
+//#region src/Badge.vue
+var Badge_default = /* @__PURE__ */ defineComponent({
+	__name: "Badge",
+	props: { tone: { default: "neutral" } },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", {
+				class: "badge",
+				"data-tone": __props.tone
+			}, [renderSlot(_ctx.$slots, "default")], 8, _hoisted_1$20);
+		};
+	}
+});
+//#endregion
+//#region src/Skeleton.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$19 = ["data-shape", "data-animated"];
+//#endregion
+//#region src/Skeleton.vue
+var Skeleton_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Skeleton",
+	props: {
+		shape: { default: "rectangle" },
+		animated: {
+			type: Boolean,
+			default: true
+		}
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", mergeProps(_ctx.$attrs, {
+				class: "skeleton",
+				"data-shape": __props.shape,
+				"data-animated": __props.animated ? "true" : void 0,
+				"aria-hidden": "true"
+			}), null, 16, _hoisted_1$19);
+		};
+	}
+});
+//#endregion
+//#region src/Separator.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$18 = [
+	"data-orientation",
+	"role",
+	"aria-hidden",
+	"aria-orientation"
+];
+//#endregion
+//#region src/Separator.vue
+var Separator_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Separator",
+	props: {
+		orientation: { default: "horizontal" },
+		decorative: {
+			type: Boolean,
+			default: true
+		}
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps(_ctx.$attrs, {
+				class: "separator",
+				"data-orientation": __props.orientation,
+				role: __props.decorative ? "presentation" : "separator",
+				"aria-hidden": __props.decorative ? "true" : void 0,
+				"aria-orientation": __props.decorative ? void 0 : __props.orientation
+			}), null, 16, _hoisted_1$18);
+		};
+	}
+});
+//#endregion
+//#region src/tabs-indicator.ts
+function mountTabsIndicator(container) {
+	const list = container.querySelector("[role=\"tablist\"]");
+	if (!list) return () => {};
+	let frame = 0, disposed = false, previous = null, armed = false;
+	const prev = container.querySelector("[data-tabs-scroll=\"prev\"]");
+	const next = container.querySelector("[data-tabs-scroll=\"next\"]");
+	const vertical = () => list.getAttribute("aria-orientation") === "vertical";
+	const reduced = () => window.matchMedia?.("(prefers-reduced-motion: reduce)").matches ?? false;
+	function measure() {
+		if (disposed) return;
+		const selected = list.querySelector("[role=\"tab\"][aria-selected=\"true\"]");
+		const rect = list.getBoundingClientRect();
+		if (selected && rect.width > 0 && rect.height > 0) {
+			const tab = selected.getBoundingClientRect();
+			const border = getComputedStyle(list);
+			list.style.setProperty("--tabs-indicator-x", `${tab.left - rect.left + list.scrollLeft - (parseFloat(border.borderLeftWidth) || 0)}px`);
+			list.style.setProperty("--tabs-indicator-y", `${tab.top - rect.top + list.scrollTop - (parseFloat(border.borderTopWidth) || 0)}px`);
+			list.style.setProperty("--tabs-indicator-width", `${tab.width}px`);
+			list.style.setProperty("--tabs-indicator-height", `${tab.height}px`);
+			list.dataset.indicatorReady = "true";
+			if (!armed) {
+				armed = true;
+				requestAnimationFrame(() => {
+					if (!disposed) list.dataset.indicatorAnimated = "true";
+				});
+			}
+			if (selected !== previous && previous && typeof list.scrollBy === "function") {
+				const delta = vertical() ? tab.top < rect.top ? tab.top - rect.top : tab.bottom > rect.bottom ? tab.bottom - rect.bottom : 0 : tab.left < rect.left ? tab.left - rect.left : tab.right > rect.right ? tab.right - rect.right : 0;
+				if (delta) list.scrollBy({
+					[vertical() ? "top" : "left"]: delta,
+					behavior: reduced() ? "instant" : "smooth"
+				});
+			}
+		} else list.dataset.indicatorReady = "false";
+		previous = selected;
+		const max = vertical() ? list.scrollHeight - list.clientHeight : list.scrollWidth - list.clientWidth;
+		const position = Math.abs(vertical() ? list.scrollTop : list.scrollLeft);
+		list.dataset.overflow = String(max > 1);
+		if (prev) {
+			prev.hidden = max <= 1;
+			prev.disabled = position <= 1;
+		}
+		if (next) {
+			next.hidden = max <= 1;
+			next.disabled = position >= max - 1;
+		}
+	}
+	function schedule() {
+		if (disposed) return;
+		cancelAnimationFrame(frame);
+		frame = requestAnimationFrame(measure);
+	}
+	function scroll(direction) {
+		if (typeof list.scrollBy !== "function") return;
+		const rtl = !vertical() && getComputedStyle(list).direction === "rtl";
+		const amount = (vertical() ? list.clientHeight : list.clientWidth) * .7 * direction * (rtl ? -1 : 1);
+		list.scrollBy({
+			[vertical() ? "top" : "left"]: amount,
+			behavior: reduced() ? "instant" : "smooth"
+		});
+	}
+	const backward = () => scroll(-1), forward = () => scroll(1);
+	prev?.addEventListener("click", backward);
+	next?.addEventListener("click", forward);
+	list.addEventListener("scroll", schedule, { passive: true });
+	window.addEventListener("resize", schedule);
+	const observer = new MutationObserver(schedule);
+	observer.observe(list, {
+		subtree: true,
+		childList: true,
+		characterData: true,
+		attributes: true,
+		attributeFilter: [
+			"aria-selected",
+			"aria-orientation",
+			"aria-disabled",
+			"disabled"
+		]
+	});
+	const resize = typeof ResizeObserver === "undefined" ? void 0 : new ResizeObserver(schedule);
+	resize?.observe(list);
+	for (const tab of list.querySelectorAll("[role=\"tab\"]")) resize?.observe(tab);
+	document.fonts?.ready.then(schedule);
+	schedule();
+	return () => {
+		disposed = true;
+		cancelAnimationFrame(frame);
+		observer.disconnect();
+		resize?.disconnect();
+		prev?.removeEventListener("click", backward);
+		next?.removeEventListener("click", forward);
+		list.removeEventListener("scroll", schedule);
+		window.removeEventListener("resize", schedule);
+	};
+}
+//#endregion
+//#region src/TabsListView.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$17 = ["aria-label"];
+var _hoisted_2$17 = {
+	key: 0,
+	class: "tabs__separator",
+	"aria-hidden": "true"
+};
+var _hoisted_3$14 = {
+	key: 1,
+	class: "tabs__icon",
+	"aria-hidden": "true"
+};
+var _hoisted_4$13 = { class: "tabs__label" };
+var _hoisted_5$8 = ["aria-label"];
+//#endregion
+//#region src/TabsListView.vue
+var TabsListView_default = /* @__PURE__ */ defineComponent({
+	__name: "TabsListView",
+	props: {
+		label: {},
+		items: {},
+		showSeparators: { type: Boolean },
+		previousLabel: {},
+		nextLabel: {}
+	},
+	setup(__props) {
+		const container = ref();
+		let cleanup;
+		onMounted(() => {
+			if (container.value) cleanup = mountTabsIndicator(container.value);
+		});
+		onBeforeUnmount(() => cleanup?.());
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "container",
+				ref: container,
+				class: "tabs__list-container"
+			}, [
+				createElementVNode("button", {
+					type: "button",
+					class: "tabs__scroll-button tabs__scroll-button--prev",
+					"data-tabs-scroll": "prev",
+					hidden: "",
+					"aria-label": __props.previousLabel
+				}, [..._cache[0] || (_cache[0] = [createElementVNode("svg", {
+					viewBox: "0 0 24 24",
+					"aria-hidden": "true"
+				}, [createElementVNode("path", { d: "m14 6-6 6 6 6" })], -1)])], 8, _hoisted_1$17),
+				createVNode(unref(TabsList), {
+					class: "tabs__list",
+					"aria-label": __props.label
+				}, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item, index) => {
+						return openBlock(), createBlock(unref(TabsTrigger), {
+							key: item.id,
+							class: "tabs__trigger",
+							value: item.id,
+							disabled: item.isDisabled
+						}, {
+							default: withCtx(() => [
+								__props.showSeparators && index > 0 ? (openBlock(), createElementBlock("span", _hoisted_2$17)) : createCommentVNode("", true),
+								_ctx.$slots.icon ? (openBlock(), createElementBlock("span", _hoisted_3$14, [renderSlot(_ctx.$slots, "icon", { item })])) : createCommentVNode("", true),
+								createElementVNode("span", _hoisted_4$13, toDisplayString(item.label), 1)
+							]),
+							_: 2
+						}, 1032, ["value", "disabled"]);
+					}), 128))]),
+					_: 3
+				}, 8, ["aria-label"]),
+				createElementVNode("button", {
+					type: "button",
+					class: "tabs__scroll-button tabs__scroll-button--next",
+					"data-tabs-scroll": "next",
+					hidden: "",
+					"aria-label": __props.nextLabel
+				}, [..._cache[1] || (_cache[1] = [createElementVNode("svg", {
+					viewBox: "0 0 24 24",
+					"aria-hidden": "true"
+				}, [createElementVNode("path", { d: "m10 6 6 6-6 6" })], -1)])], 8, _hoisted_5$8)
+			], 512);
+		};
+	}
+});
+//#endregion
+//#region src/Tabs.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$16 = {
+	key: 0,
+	class: "tabs__toolbar"
+};
+var _hoisted_2$16 = { class: "tabs__navigation" };
+var _hoisted_3$13 = {
+	key: 1,
+	class: "tabs__extras"
+};
+var _hoisted_4$12 = {
+	key: 0,
+	class: "tabs__actions"
+};
+//#endregion
+//#region src/Tabs.vue
+var Tabs_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Tabs",
+	props: {
+		label: {},
+		variant: { default: "primary" },
+		size: { default: "md" },
+		orientation: { default: "horizontal" },
+		align: { default: "center" },
+		fullWidth: {
+			type: Boolean,
+			default: false
+		},
+		inset: { default: "default" },
+		showSeparators: {
+			type: Boolean,
+			default: false
+		},
+		previousLabel: { default: "Tab sebelumnya / Previous tabs" },
+		nextLabel: { default: "Tab berikutnya / Next tabs" },
+		items: {},
+		modelValue: { default: void 0 },
+		defaultValue: { default: void 0 },
+		activationMode: { default: "manual" },
+		dir: { default: void 0 },
+		id: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const local = ref(props.defaultValue);
+		const selected = computed(() => props.items.find((item) => item.id === (props.modelValue ?? local.value) && !item.isDisabled)?.id ?? props.items.find((item) => !item.isDisabled)?.id);
+		function update(value) {
+			const next = String(value);
+			if (next !== selected.value && props.items.some((item) => item.id === next && !item.isDisabled)) {
+				local.value = next;
+				emit("update:modelValue", next);
+			}
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(TabsRoot), {
+				id: __props.id,
+				class: normalizeClass([
+					"tabs",
+					`tabs--${__props.variant === "default" ? "primary" : __props.variant}`,
+					`tabs--align-${__props.align}`,
+					__props.fullWidth && "tabs--full-width",
+					__props.inset === "none" && "tabs--flush",
+					__props.size !== "md" && `tabs--${__props.size}`
+				]),
+				"model-value": selected.value ?? "",
+				"activation-mode": __props.activationMode,
+				dir: __props.dir,
+				orientation: __props.orientation,
+				"data-orientation": __props.orientation,
+				"onUpdate:modelValue": update
+			}, {
+				default: withCtx(() => [_ctx.$slots.extras || _ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_1$16, [createElementVNode("div", _hoisted_2$16, [__props.items.length ? (openBlock(), createBlock(TabsListView_default, {
+					key: 0,
+					label: __props.label,
+					items: __props.items,
+					"show-separators": __props.showSeparators,
+					"previous-label": __props.previousLabel,
+					"next-label": __props.nextLabel
+				}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+					name: "icon",
+					fn: withCtx(({ item }) => [renderSlot(_ctx.$slots, "icon", { item })]),
+					key: "0"
+				} : void 0]), 1032, [
+					"label",
+					"items",
+					"show-separators",
+					"previous-label",
+					"next-label"
+				])) : createCommentVNode("", true), _ctx.$slots.extras ? (openBlock(), createElementBlock("div", _hoisted_3$13, [renderSlot(_ctx.$slots, "extras")])) : createCommentVNode("", true)]), _ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_4$12, [renderSlot(_ctx.$slots, "actions")])) : createCommentVNode("", true)])) : __props.items.length ? (openBlock(), createBlock(TabsListView_default, {
+					key: 1,
+					label: __props.label,
+					items: __props.items,
+					"show-separators": __props.showSeparators,
+					"previous-label": __props.previousLabel,
+					"next-label": __props.nextLabel
+				}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+					name: "icon",
+					fn: withCtx(({ item }) => [renderSlot(_ctx.$slots, "icon", { item })]),
+					key: "0"
+				} : void 0]), 1032, [
+					"label",
+					"items",
+					"show-separators",
+					"previous-label",
+					"next-label"
+				])) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item) => {
+					return openBlock(), createBlock(unref(TabsContent), {
+						key: item.id,
+						class: "tabs__panel",
+						value: item.id
+					}, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "default", { item })]),
+						_: 2
+					}, 1032, ["value"]);
+				}), 128))]),
+				_: 3
+			}, 8, [
+				"id",
+				"class",
+				"model-value",
+				"activation-mode",
+				"dir",
+				"orientation",
+				"data-orientation"
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/pagination-model.ts
+function paginationModel(totalItems, pageSize, value, siblingCount = 1) {
+	const count = Math.max(1, Math.ceil((Number.isFinite(totalItems) ? Math.min(Number.MAX_SAFE_INTEGER, Math.max(0, Math.floor(totalItems))) : 0) / (Number.isFinite(pageSize) ? Math.max(1, Math.floor(pageSize)) : 10)));
+	const current = Math.min(count, Math.max(1, Number.isFinite(value) ? Math.floor(value) : 1));
+	const siblings = Number.isFinite(siblingCount) ? Math.min(2, Math.max(0, Math.floor(siblingCount))) : 1;
+	const pages = /* @__PURE__ */ new Set([
+		1,
+		count,
+		current
+	]);
+	for (let offset = 1; offset <= siblings; offset++) {
+		if (current - offset > 1) pages.add(current - offset);
+		if (current + offset < count) pages.add(current + offset);
+	}
+	const ordered = [...pages].sort((a, b) => a - b);
+	const entries = [];
+	ordered.forEach((page, index) => {
+		if (index && page - ordered[index - 1] > 1) entries.push(`gap-${page}`);
+		entries.push(page);
+	});
+	return {
+		current,
+		count,
+		entries
+	};
+}
+//#endregion
+//#region src/Pagination.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$15 = [
+	"id",
+	"aria-label",
+	"dir"
+];
+var _hoisted_2$15 = ["disabled"];
+var _hoisted_3$12 = {
+	key: 0,
+	class: "pagination__gap",
+	"aria-hidden": "true"
+};
+var _hoisted_4$11 = [
+	"aria-label",
+	"aria-current",
+	"disabled",
+	"onClick"
+];
+var _hoisted_5$7 = ["disabled"];
+var _hoisted_6$6 = {
+	class: "pagination__summary",
+	"aria-live": "polite"
+};
+//#endregion
+//#region src/Pagination.vue
+var Pagination_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Pagination",
+	props: {
+		totalItems: {},
+		pageSize: { default: 10 },
+		modelValue: { default: void 0 },
+		defaultValue: { default: 1 },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		siblingCount: { default: 1 },
+		label: { default: "Navigasi halaman" },
+		previousLabel: { default: "Sebelumnya" },
+		nextLabel: { default: "Berikutnya" },
+		pageLabel: { default: "Halaman" },
+		dir: { default: void 0 },
+		id: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const local = ref(props.defaultValue);
+		const model = computed(() => paginationModel(props.totalItems, props.pageSize, props.modelValue ?? local.value, props.siblingCount));
+		function change(next) {
+			if (props.disabled || next === model.value.current || next < 1 || next > model.value.count) return;
+			local.value = next;
+			emit("update:modelValue", next);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("nav", {
+				id: __props.id,
+				class: "pagination",
+				"aria-label": __props.label,
+				dir: __props.dir
+			}, [
+				createElementVNode("button", {
+					type: "button",
+					class: "pagination__button",
+					disabled: __props.disabled || model.value.current === 1,
+					onClick: _cache[0] || (_cache[0] = ($event) => change(model.value.current - 1))
+				}, toDisplayString(__props.previousLabel), 9, _hoisted_2$15),
+				(openBlock(true), createElementBlock(Fragment, null, renderList(model.value.entries, (entry) => {
+					return openBlock(), createElementBlock(Fragment, { key: entry }, [typeof entry === "string" ? (openBlock(), createElementBlock("span", _hoisted_3$12, "...")) : (openBlock(), createElementBlock("button", {
+						key: 1,
+						type: "button",
+						class: "pagination__button",
+						"aria-label": `${__props.pageLabel} ${entry}`,
+						"aria-current": entry === model.value.current ? "page" : void 0,
+						disabled: __props.disabled,
+						onClick: ($event) => change(entry)
+					}, toDisplayString(entry), 9, _hoisted_4$11))], 64);
+				}), 128)),
+				createElementVNode("button", {
+					type: "button",
+					class: "pagination__button",
+					disabled: __props.disabled || model.value.current === model.value.count,
+					onClick: _cache[1] || (_cache[1] = ($event) => change(model.value.current + 1))
+				}, toDisplayString(__props.nextLabel), 9, _hoisted_5$7),
+				createElementVNode("span", _hoisted_6$6, toDisplayString(model.value.current) + " / " + toDisplayString(model.value.count), 1)
+			], 8, _hoisted_1$15);
+		};
+	}
+});
+//#endregion
+//#region src/Table.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$14 = ["aria-label"];
+var _hoisted_2$14 = { class: "table__caption" };
+//#endregion
+//#region src/Table.vue
+var Table_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Table",
+	props: { caption: {} },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "table__scroll",
+				role: "region",
+				"aria-label": __props.caption,
+				tabindex: "0"
+			}, [createElementVNode("table", mergeProps(_ctx.$attrs, { class: "table" }), [createElementVNode("caption", _hoisted_2$14, toDisplayString(__props.caption), 1), renderSlot(_ctx.$slots, "default")], 16)], 8, _hoisted_1$14);
+		};
+	}
+});
+//#endregion
+//#region src/DataTable.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$13 = ["id", "dir"];
+var _hoisted_2$13 = ["aria-sort"];
+var _hoisted_3$11 = ["disabled", "onClick"];
+var _hoisted_4$10 = { "aria-hidden": "true" };
+var _hoisted_5$6 = { key: 0 };
+var _hoisted_6$5 = ["colspan"];
+var _hoisted_7$5 = {
+	key: 0,
+	class: "data-table__status",
+	role: "status"
+};
+var _hoisted_8$5 = {
+	key: 1,
+	class: "input__error",
+	role: "alert"
+};
+//#endregion
+//#region src/DataTable.vue
+var DataTable_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "DataTable",
+	props: {
+		caption: {},
+		columns: {},
+		rows: {},
+		sort: { default: null },
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		emptyMessage: { default: "Tidak ada data." },
+		loadingMessage: { default: "Memuat data..." },
+		errorMessage: { default: void 0 },
+		dir: { default: void 0 },
+		id: { default: void 0 }
+	},
+	emits: ["update:sort"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		function requestSort(column) {
+			if (props.loading || props.disabled || !column.sortable) return;
+			emit("update:sort", {
+				columnId: column.id,
+				direction: props.sort?.columnId === column.id && props.sort.direction === "ascending" ? "descending" : "ascending"
+			});
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: __props.id,
+				class: "data-table",
+				dir: __props.dir
+			}, [
+				createVNode(Table_default, {
+					caption: __props.caption,
+					"aria-busy": __props.loading || void 0
+				}, {
+					default: withCtx(() => [createElementVNode("thead", null, [createElementVNode("tr", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.columns, (column) => {
+						return openBlock(), createElementBlock("th", {
+							key: column.id,
+							scope: "col",
+							"aria-sort": column.sortable ? __props.sort?.columnId === column.id ? __props.sort.direction : "none" : void 0
+						}, [column.sortable ? (openBlock(), createElementBlock("button", {
+							key: 0,
+							type: "button",
+							class: "table__sort",
+							disabled: __props.loading || __props.disabled,
+							onClick: ($event) => requestSort(column)
+						}, [createTextVNode(toDisplayString(column.label), 1), createElementVNode("span", _hoisted_4$10, toDisplayString(__props.sort?.columnId === column.id ? __props.sort.direction === "ascending" ? "↑" : "↓" : "↕"), 1)], 8, _hoisted_3$11)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(column.label), 1)], 64))], 8, _hoisted_2$13);
+					}), 128))])]), createElementVNode("tbody", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.rows, (row) => {
+						return openBlock(), createElementBlock("tr", { key: row.id }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.columns, (column) => {
+							return openBlock(), createElementBlock("td", { key: column.id }, [renderSlot(_ctx.$slots, "cell", {
+								row,
+								column,
+								value: row.cells[column.id]
+							}, () => [createTextVNode(toDisplayString(row.cells[column.id] ?? ""), 1)])]);
+						}), 128))]);
+					}), 128)), !__props.rows.length ? (openBlock(), createElementBlock("tr", _hoisted_5$6, [createElementVNode("td", {
+						colspan: Math.max(1, __props.columns.length),
+						class: "table__empty"
+					}, toDisplayString(__props.loading ? __props.loadingMessage : __props.errorMessage || __props.emptyMessage), 9, _hoisted_6$5)])) : createCommentVNode("", true)])]),
+					_: 3
+				}, 8, ["caption", "aria-busy"]),
+				__props.loading ? (openBlock(), createElementBlock("p", _hoisted_7$5, toDisplayString(__props.loadingMessage), 1)) : createCommentVNode("", true),
+				__props.errorMessage && !__props.loading ? (openBlock(), createElementBlock("p", _hoisted_8$5, toDisplayString(__props.errorMessage), 1)) : createCommentVNode("", true)
+			], 8, _hoisted_1$13);
+		};
+	}
+});
+//#endregion
+//#region src/Alert.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$12 = [
+	"id",
+	"data-tone",
+	"role"
+];
+var _hoisted_2$12 = { class: "alert__title" };
+var _hoisted_3$10 = {
+	key: 0,
+	class: "alert__description"
+};
+var _hoisted_4$9 = {
+	key: 1,
+	class: "alert__actions"
+};
+//#endregion
+//#region src/Alert.vue
+var Alert_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Alert",
+	props: {
+		title: {},
+		description: { default: void 0 },
+		tone: { default: "info" },
+		announcement: { default: "off" },
+		id: { default: void 0 }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: __props.id,
+				class: "alert",
+				"data-tone": __props.tone,
+				role: __props.announcement === "polite" ? "status" : __props.announcement === "assertive" ? "alert" : void 0
+			}, [
+				createElementVNode("p", _hoisted_2$12, toDisplayString(__props.title), 1),
+				__props.description ? (openBlock(), createElementBlock("p", _hoisted_3$10, toDisplayString(__props.description), 1)) : createCommentVNode("", true),
+				renderSlot(_ctx.$slots, "default"),
+				_ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_4$9, [renderSlot(_ctx.$slots, "actions")])) : createCommentVNode("", true)
+			], 8, _hoisted_1$12);
+		};
+	}
+});
+//#endregion
+//#region src/Empty.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$11 = ["id"];
+var _hoisted_2$11 = {
+	key: 0,
+	class: "empty__description"
+};
+var _hoisted_3$9 = {
+	key: 1,
+	class: "empty__actions"
+};
+//#endregion
+//#region src/Empty.vue
+var Empty_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Empty",
+	props: {
+		title: {},
+		description: { default: void 0 },
+		headingLevel: { default: 3 },
+		id: { default: void 0 }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: __props.id,
+				class: "empty"
+			}, [
+				(openBlock(), createBlock(resolveDynamicComponent(`h${__props.headingLevel}`), { class: "empty__title" }, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.title), 1)]),
+					_: 1
+				})),
+				__props.description ? (openBlock(), createElementBlock("p", _hoisted_2$11, toDisplayString(__props.description), 1)) : createCommentVNode("", true),
+				renderSlot(_ctx.$slots, "default"),
+				_ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_3$9, [renderSlot(_ctx.$slots, "actions")])) : createCommentVNode("", true)
+			], 8, _hoisted_1$11);
+		};
+	}
+});
+//#endregion
+//#region src/Breadcrumb.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$10 = [
+	"id",
+	"aria-label",
+	"dir"
+];
+var _hoisted_2$10 = {
+	key: 0,
+	class: "breadcrumb__separator",
+	"aria-hidden": "true"
+};
+var _hoisted_3$8 = {
+	key: 1,
+	"aria-current": "page"
+};
+var _hoisted_4$8 = ["href"];
+var _hoisted_5$5 = { key: 3 };
+//#endregion
+//#region src/Breadcrumb.vue
+var Breadcrumb_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Breadcrumb",
+	props: {
+		items: {},
+		label: { default: "Jejak halaman" },
+		dir: { default: void 0 },
+		id: { default: void 0 }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("nav", {
+				id: __props.id,
+				class: "breadcrumb",
+				"aria-label": __props.label,
+				dir: __props.dir
+			}, [createElementVNode("ol", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item, index) => {
+				return openBlock(), createElementBlock("li", { key: index }, [index > 0 ? (openBlock(), createElementBlock("span", _hoisted_2$10, "/")) : createCommentVNode("", true), index === __props.items.length - 1 ? (openBlock(), createElementBlock("span", _hoisted_3$8, toDisplayString(item.label), 1)) : item.href ? (openBlock(), createElementBlock("a", {
+					key: 2,
+					href: item.href
+				}, toDisplayString(item.label), 9, _hoisted_4$8)) : (openBlock(), createElementBlock("span", _hoisted_5$5, toDisplayString(item.label), 1))]);
+			}), 128))])], 8, _hoisted_1$10);
+		};
+	}
+});
+//#endregion
+//#region src/useDisclosure.ts
+function useDisclosure(props, emit) {
+	const local = ref(props.defaultOpen ?? false);
+	const visible = computed(() => props.open ?? local.value);
+	function change(next) {
+		if (next === visible.value) return;
+		local.value = next;
+		emit(next);
+	}
+	return {
+		visible,
+		change
+	};
+}
+//#endregion
+//#region src/Sidebar.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$9 = ["id", "dir"];
+var _hoisted_2$9 = { class: "sidebar__header" };
+var _hoisted_3$7 = { class: "sidebar__title" };
+var _hoisted_4$7 = [
+	"aria-label",
+	"aria-expanded",
+	"aria-controls"
+];
+var _hoisted_5$4 = { "aria-hidden": "true" };
+var _hoisted_6$4 = [
+	"id",
+	"aria-label",
+	"hidden"
+];
+var _hoisted_7$4 = {
+	key: 0,
+	class: "sidebar__link",
+	"aria-disabled": "true"
+};
+var _hoisted_8$4 = ["href", "aria-current"];
+//#endregion
+//#region src/Sidebar.vue
+var Sidebar_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Sidebar",
+	props: {
+		label: {},
+		items: {},
+		currentId: { default: void 0 },
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: true
+		},
+		toggleLabel: { default: "Menu navigasi" },
+		dir: { default: void 0 },
+		id: { default: void 0 }
+	},
+	emits: ["update:open"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { visible, change } = useDisclosure(props, (next) => emit("update:open", next));
+		const generated = useId(), navId = computed(() => `${props.id ?? generated}-nav`);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("aside", {
+				id: __props.id,
+				class: "sidebar",
+				dir: __props.dir
+			}, [createElementVNode("div", _hoisted_2$9, [createElementVNode("span", _hoisted_3$7, toDisplayString(__props.label), 1), createElementVNode("button", {
+				type: "button",
+				class: "sidebar__toggle",
+				"aria-label": __props.toggleLabel,
+				"aria-expanded": unref(visible),
+				"aria-controls": navId.value,
+				onClick: _cache[0] || (_cache[0] = ($event) => unref(change)(!unref(visible)))
+			}, [createElementVNode("span", _hoisted_5$4, toDisplayString(unref(visible) ? "−" : "+"), 1)], 8, _hoisted_4$7)]), createElementVNode("nav", {
+				id: navId.value,
+				"aria-label": __props.label,
+				hidden: !unref(visible)
+			}, [createElementVNode("ul", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item) => {
+				return openBlock(), createElementBlock("li", { key: item.id }, [item.isDisabled ? (openBlock(), createElementBlock("span", _hoisted_7$4, toDisplayString(item.label), 1)) : (openBlock(), createElementBlock("a", {
+					key: 1,
+					class: "sidebar__link",
+					href: item.href,
+					"aria-current": item.id === __props.currentId ? "page" : void 0
+				}, toDisplayString(item.label), 9, _hoisted_8$4))]);
+			}), 128))])], 8, _hoisted_6$4)], 8, _hoisted_1$9);
+		};
+	}
+});
+//#endregion
+//#region src/chart-model.ts
+function chartModel(data) {
+	const valid = data.filter((item) => Number.isFinite(item.value));
+	const scale = valid.reduce((max, item) => Math.max(max, Math.abs(item.value)), 1);
+	const min = valid.reduce((min, item) => Math.min(min, item.value / scale), 0);
+	const span = valid.reduce((max, item) => Math.max(max, item.value / scale), 0) - min || 1, step = 560 / Math.max(1, valid.length);
+	const y = (value) => 180 - (value / scale - min) / span * 160;
+	return {
+		items: valid.map((item, index) => ({
+			...item,
+			x: 20 + step * (index + .5),
+			y: y(item.value)
+		})),
+		baseline: y(0),
+		barWidth: Math.min(40, step * .7)
+	};
+}
+//#endregion
+//#region src/Chart.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$8 = [
+	"id",
+	"dir",
+	"aria-labelledby"
+];
+var _hoisted_2$8 = ["id"];
+var _hoisted_3$6 = {
+	key: 0,
+	class: "chart__description"
+};
+var _hoisted_4$6 = {
+	class: "chart__plot",
+	viewBox: "0 0 600 210",
+	"aria-hidden": "true",
+	focusable: "false"
+};
+var _hoisted_5$3 = ["y1", "y2"];
+var _hoisted_6$3 = ["points"];
+var _hoisted_7$3 = [
+	"x",
+	"y",
+	"width",
+	"height"
+];
+var _hoisted_8$3 = ["cx", "cy"];
+var _hoisted_9$3 = ["x"];
+var _hoisted_10$2 = { scope: "col" };
+var _hoisted_11$1 = { scope: "col" };
+var _hoisted_12$1 = { scope: "row" };
+//#endregion
+//#region src/Chart.vue
+var Chart_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Chart",
+	props: {
+		label: {},
+		data: {},
+		type: { default: "bar" },
+		description: { default: void 0 },
+		locale: { default: "id-ID" },
+		formatOptions: { default: void 0 },
+		categoryLabel: { default: "Kategori" },
+		valueLabel: { default: "Nilai" },
+		emptyMessage: { default: "Belum ada data grafik." },
+		id: { default: void 0 },
+		dir: { default: void 0 }
+	},
+	setup(__props) {
+		const props = __props;
+		const generated = useId(), labelId = computed(() => `${props.id ?? generated}-label`), model = computed(() => chartModel(props.data)), format = computed(() => new Intl.NumberFormat(props.locale, props.formatOptions));
+		const points = computed(() => model.value.items.map((item) => `${item.x},${item.y}`).join(" "));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("figure", {
+				id: __props.id,
+				class: "chart",
+				dir: __props.dir,
+				"aria-labelledby": labelId.value
+			}, [
+				createElementVNode("figcaption", {
+					id: labelId.value,
+					class: "chart__title"
+				}, toDisplayString(__props.label), 9, _hoisted_2$8),
+				__props.description ? (openBlock(), createElementBlock("p", _hoisted_3$6, toDisplayString(__props.description), 1)) : createCommentVNode("", true),
+				model.value.items.length ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [(openBlock(), createElementBlock("svg", _hoisted_4$6, [
+					createElementVNode("line", {
+						class: "chart__axis",
+						x1: "20",
+						x2: "580",
+						y1: model.value.baseline,
+						y2: model.value.baseline
+					}, null, 8, _hoisted_5$3),
+					__props.type === "line" ? (openBlock(), createElementBlock("polyline", {
+						key: 0,
+						class: "chart__line",
+						points: points.value
+					}, null, 8, _hoisted_6$3)) : createCommentVNode("", true),
+					(openBlock(true), createElementBlock(Fragment, null, renderList(model.value.items, (item) => {
+						return openBlock(), createElementBlock("g", { key: item.id }, [__props.type === "bar" ? (openBlock(), createElementBlock("rect", {
+							key: 0,
+							class: "chart__bar",
+							x: item.x - model.value.barWidth / 2,
+							y: Math.min(item.y, model.value.baseline),
+							width: model.value.barWidth,
+							height: Math.abs(item.y - model.value.baseline)
+						}, null, 8, _hoisted_7$3)) : (openBlock(), createElementBlock("circle", {
+							key: 1,
+							class: "chart__bar",
+							cx: item.x,
+							cy: item.y,
+							r: "4"
+						}, null, 8, _hoisted_8$3)), model.value.items.length <= 12 ? (openBlock(), createElementBlock("text", {
+							key: 2,
+							class: "chart__label",
+							x: item.x,
+							y: "202",
+							"text-anchor": "middle"
+						}, toDisplayString(item.label.slice(0, 12)), 9, _hoisted_9$3)) : createCommentVNode("", true)]);
+					}), 128))
+				])), createVNode(Table_default, { caption: __props.label }, {
+					default: withCtx(() => [createElementVNode("thead", null, [createElementVNode("tr", null, [createElementVNode("th", _hoisted_10$2, toDisplayString(__props.categoryLabel), 1), createElementVNode("th", _hoisted_11$1, toDisplayString(__props.valueLabel), 1)])]), createElementVNode("tbody", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(model.value.items, (item) => {
+						return openBlock(), createElementBlock("tr", { key: item.id }, [createElementVNode("th", _hoisted_12$1, toDisplayString(item.label), 1), createElementVNode("td", null, toDisplayString(format.value.format(item.value)), 1)]);
+					}), 128))])]),
+					_: 1
+				}, 8, ["caption"])], 64)) : (openBlock(), createBlock(Empty_default, {
+					key: 2,
+					title: __props.emptyMessage
+				}, null, 8, ["title"]))
+			], 8, _hoisted_1$8);
+		};
+	}
+});
+//#endregion
+//#region src/Dialog.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$7 = { class: "dialog__content" };
+var _hoisted_2$7 = ["data-close-button"];
+var _hoisted_3$5 = { class: "overlay__body" };
+var _hoisted_4$5 = {
+	key: 0,
+	class: "overlay__footer"
+};
+//#endregion
+//#region src/Dialog.vue
+var Dialog_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Dialog",
+	props: {
+		triggerLabel: {},
+		title: {},
+		description: { default: void 0 },
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		closeLabel: { default: "Tutup" },
+		dir: { default: void 0 },
+		triggerIconOnly: { type: Boolean },
+		triggerVariant: { default: "secondary" },
+		size: { default: "md" },
+		placement: { default: "center" },
+		scroll: { default: "outside" },
+		backdrop: { default: "opaque" },
+		dismissable: {
+			type: Boolean,
+			default: true
+		},
+		keyboardDismissDisabled: {
+			type: Boolean,
+			default: false
+		},
+		showCloseButton: {
+			type: Boolean,
+			default: true
+		},
+		showFooterClose: {
+			type: Boolean,
+			default: true
+		},
+		closeIconLabel: { default: void 0 }
+	},
+	emits: ["update:open"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { visible, change } = useDisclosure(props, (next) => emit("update:open", next));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(DialogRoot), {
+				open: unref(visible),
+				"onUpdate:open": unref(change)
+			}, {
+				default: withCtx(() => [createVNode(unref(DialogTrigger), {
+					class: normalizeClass([
+						"button",
+						`button--${__props.triggerVariant}`,
+						__props.triggerIconOnly && "button--icon-only"
+					]),
+					"aria-label": __props.triggerLabel,
+					disabled: __props.disabled
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "trigger", {}, () => [createTextVNode(toDisplayString(__props.triggerLabel), 1)])]),
+					_: 3
+				}, 8, [
+					"class",
+					"aria-label",
+					"disabled"
+				]), createVNode(unref(DialogPortal), null, {
+					default: withCtx(() => [createVNode(unref(DialogOverlay), {
+						class: "dialog__backdrop dialog__viewport",
+						"data-size": __props.size,
+						"data-placement": __props.placement,
+						"data-scroll": __props.scroll,
+						"data-backdrop": __props.backdrop
+					}, {
+						default: withCtx(() => [createVNode(unref(DialogContent), mergeProps({
+							class: "dialog__panel",
+							dir: __props.dir
+						}, __props.description ? {} : { "aria-describedby": void 0 }, {
+							onEscapeKeyDown: _cache[0] || (_cache[0] = (event) => {
+								if (__props.keyboardDismissDisabled) event.preventDefault();
+							}),
+							onInteractOutside: _cache[1] || (_cache[1] = (event) => {
+								if (!__props.dismissable) event.preventDefault();
+							})
+						}), {
+							default: withCtx(() => [createElementVNode("div", _hoisted_1$7, [
+								createElementVNode("div", {
+									class: "overlay__header",
+									"data-close-button": __props.showCloseButton || void 0
+								}, [
+									createVNode(unref(DialogTitle), { class: "overlay__title" }, {
+										default: withCtx(() => [createTextVNode(toDisplayString(__props.title), 1)]),
+										_: 1
+									}),
+									__props.description ? (openBlock(), createBlock(unref(DialogDescription), {
+										key: 0,
+										class: "overlay__description"
+									}, {
+										default: withCtx(() => [createTextVNode(toDisplayString(__props.description), 1)]),
+										_: 1
+									})) : createCommentVNode("", true),
+									__props.showCloseButton ? (openBlock(), createBlock(unref(DialogClose), {
+										key: 1,
+										class: "dialog__close",
+										"aria-label": __props.closeIconLabel ?? `${__props.closeLabel} dialog`
+									}, {
+										default: withCtx(() => [createVNode(CloseIcon_default)]),
+										_: 1
+									}, 8, ["aria-label"])) : createCommentVNode("", true)
+								], 8, _hoisted_2$7),
+								createElementVNode("div", _hoisted_3$5, [renderSlot(_ctx.$slots, "default")]),
+								_ctx.$slots.footer || __props.showFooterClose ? (openBlock(), createElementBlock("div", _hoisted_4$5, [renderSlot(_ctx.$slots, "footer"), __props.showFooterClose ? (openBlock(), createBlock(unref(DialogClose), {
+									key: 0,
+									class: "button button--secondary"
+								}, {
+									default: withCtx(() => [createTextVNode(toDisplayString(__props.closeLabel), 1)]),
+									_: 1
+								})) : createCommentVNode("", true)])) : createCommentVNode("", true)
+							])]),
+							_: 3
+						}, 16, ["dir"])]),
+						_: 3
+					}, 8, [
+						"data-size",
+						"data-placement",
+						"data-scroll",
+						"data-backdrop"
+					])]),
+					_: 3
+				})]),
+				_: 3
+			}, 8, ["open", "onUpdate:open"]);
+		};
+	}
+});
+//#endregion
+//#region src/MenuItemContent.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$6 = {
+	key: 1,
+	class: "menu__icon",
+	"aria-hidden": "true"
+};
+var _hoisted_2$6 = { class: "menu__text" };
+var _hoisted_3$4 = {
+	key: 0,
+	class: "menu__description"
+};
+var _hoisted_4$4 = {
+	key: 2,
+	class: "menu__shortcut",
+	"aria-hidden": "true"
+};
+//#endregion
+//#region src/MenuItemContent.vue
+var MenuItemContent_default = /* @__PURE__ */ defineComponent({
+	__name: "MenuItemContent",
+	props: {
+		item: {},
+		selectable: { type: Boolean }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [
+				__props.selectable && !__props.item.children?.length ? (openBlock(), createBlock(CheckIcon_default, {
+					key: 0,
+					class: "menu__check"
+				})) : createCommentVNode("", true),
+				_ctx.$slots.icon ? (openBlock(), createElementBlock("span", _hoisted_1$6, [renderSlot(_ctx.$slots, "icon", { item: __props.item })])) : createCommentVNode("", true),
+				createElementVNode("span", _hoisted_2$6, [createElementVNode("span", null, toDisplayString(__props.item.label), 1), __props.item.description ? (openBlock(), createElementBlock("span", _hoisted_3$4, toDisplayString(__props.item.description), 1)) : createCommentVNode("", true)]),
+				__props.item.shortcut ? (openBlock(), createElementBlock("kbd", _hoisted_4$4, toDisplayString(__props.item.shortcut), 1)) : createCommentVNode("", true),
+				__props.item.children?.length ? (openBlock(), createBlock(ChevronIcon_default, {
+					key: 3,
+					class: "menu__arrow"
+				})) : createCommentVNode("", true)
+			], 64);
+		};
+	}
+});
+//#endregion
+//#region src/overlay-model.ts
+function menuGroups(items) {
+	const groups = [];
+	for (const item of items) {
+		const previous = groups.at(-1);
+		if (!previous || previous.label !== item.section || item.separatorBefore) groups.push({
+			key: item.id,
+			label: item.section,
+			items: [item]
+		});
+		else previous.items.push(item);
+	}
+	return groups;
+}
+function menuLeaves(items, disabled = false) {
+	return items.flatMap((item) => item.children?.length ? menuLeaves(item.children, disabled || !!item.isDisabled) : [{
+		...item,
+		isDisabled: disabled || item.isDisabled
+	}]);
+}
+function menuSelection(keys, items, mode) {
+	const wanted = new Set(keys);
+	const result = menuLeaves(items).filter((item) => wanted.has(item.id)).map((item) => item.id);
+	return mode === "none" ? [] : mode === "single" ? result.slice(0, 1) : result;
+}
+//#endregion
+//#region src/DropdownMenuBranch.vue
+var DropdownMenuBranch_default = /* @__PURE__ */ defineComponent({
+	__name: "DropdownMenuBranch",
+	props: {
+		items: {},
+		selectedKeys: {},
+		selectionMode: {},
+		closeOnSelect: { type: Boolean },
+		disabled: { type: Boolean },
+		dir: {}
+	},
+	emits: ["action", "selection"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const groups = computed(() => menuGroups(props.items));
+		function keepParentMenuFocus(event) {
+			if (event.target instanceof HTMLElement && event.target.getAttribute("role") === "menu") event.preventDefault();
+		}
+		function action(event, item) {
+			if (props.disabled || item.isDisabled) {
+				event.preventDefault();
+				return;
+			}
+			if (!props.closeOnSelect) event.preventDefault();
+			emit("action", item.id);
+		}
+		return (_ctx, _cache) => {
+			const _component_DropdownMenuBranch = resolveComponent("DropdownMenuBranch", true);
+			return openBlock(), createBlock(unref(DropdownMenuRadioGroup), {
+				"model-value": __props.selectedKeys[0] ?? "",
+				"onUpdate:modelValue": _cache[2] || (_cache[2] = (value) => {
+					if (__props.selectionMode === "single" && typeof value === "string") emit("selection", value, true);
+				})
+			}, {
+				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(groups.value, (group, index) => {
+					return openBlock(), createElementBlock(Fragment, { key: group.key }, [index > 0 ? (openBlock(), createBlock(unref(DropdownMenuSeparator), {
+						key: 0,
+						class: "menu__separator"
+					})) : createCommentVNode("", true), createVNode(unref(DropdownMenuGroup), { "aria-label": group.label }, {
+						default: withCtx(() => [group.label ? (openBlock(), createBlock(unref(DropdownMenuLabel), {
+							key: 0,
+							class: "menu__heading"
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(group.label), 1)]),
+							_: 2
+						}, 1024)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(group.items, (item) => {
+							return openBlock(), createElementBlock(Fragment, { key: item.id }, [item.children?.length ? (openBlock(), createBlock(unref(DropdownMenuSub), { key: 0 }, {
+								default: withCtx(() => [createVNode(unref(DropdownMenuSubTrigger), {
+									class: "menu__item",
+									disabled: __props.disabled || item.isDisabled,
+									"text-value": item.label,
+									"data-tone": item.tone ?? "default"
+								}, {
+									default: withCtx(() => [createVNode(MenuItemContent_default, {
+										item,
+										selectable: false
+									}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+										name: "icon",
+										fn: withCtx((slot) => [renderSlot(_ctx.$slots, "icon", mergeProps({ ref_for: true }, slot))]),
+										key: "0"
+									} : void 0]), 1032, ["item"])]),
+									_: 2
+								}, 1032, [
+									"disabled",
+									"text-value",
+									"data-tone"
+								]), createVNode(unref(DropdownMenuPortal), null, {
+									default: withCtx(() => [createVNode(unref(DropdownMenuSubContent), {
+										class: "menu__panel menu__list",
+										"aria-label": item.label,
+										"side-offset": 4,
+										"collision-padding": 16,
+										dir: __props.dir,
+										onFocusOutside: keepParentMenuFocus
+									}, {
+										default: withCtx(() => [createVNode(_component_DropdownMenuBranch, {
+											items: item.children,
+											"selected-keys": __props.selectedKeys,
+											"selection-mode": __props.selectionMode,
+											"close-on-select": __props.closeOnSelect,
+											disabled: __props.disabled || item.isDisabled,
+											dir: __props.dir,
+											onAction: _cache[0] || (_cache[0] = (id) => emit("action", id)),
+											onSelection: _cache[1] || (_cache[1] = (id, checked) => emit("selection", id, checked))
+										}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+											name: "icon",
+											fn: withCtx((slot) => [renderSlot(_ctx.$slots, "icon", mergeProps({ ref_for: true }, slot))]),
+											key: "0"
+										} : void 0]), 1032, [
+											"items",
+											"selected-keys",
+											"selection-mode",
+											"close-on-select",
+											"disabled",
+											"dir"
+										])]),
+										_: 2
+									}, 1032, ["aria-label", "dir"])]),
+									_: 2
+								}, 1024)]),
+								_: 2
+							}, 1024)) : __props.selectionMode === "single" ? (openBlock(), createBlock(unref(DropdownMenuRadioItem), {
+								key: 1,
+								value: item.id,
+								disabled: __props.disabled || item.isDisabled,
+								"text-value": item.label,
+								class: "menu__item",
+								"data-tone": item.tone ?? "default",
+								onSelect: (event) => action(event, item)
+							}, {
+								default: withCtx(() => [createVNode(MenuItemContent_default, {
+									item,
+									selectable: ""
+								}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+									name: "icon",
+									fn: withCtx((slot) => [renderSlot(_ctx.$slots, "icon", mergeProps({ ref_for: true }, slot))]),
+									key: "0"
+								} : void 0]), 1032, ["item"])]),
+								_: 2
+							}, 1032, [
+								"value",
+								"disabled",
+								"text-value",
+								"data-tone",
+								"onSelect"
+							])) : __props.selectionMode === "multiple" ? (openBlock(), createBlock(unref(DropdownMenuCheckboxItem), {
+								key: 2,
+								"model-value": __props.selectedKeys.includes(item.id),
+								disabled: __props.disabled || item.isDisabled,
+								"text-value": item.label,
+								class: "menu__item",
+								"data-tone": item.tone ?? "default",
+								"onUpdate:modelValue": (checked) => {
+									if (!__props.disabled && !item.isDisabled) emit("selection", item.id, checked === true);
+								},
+								onSelect: (event) => action(event, item)
+							}, {
+								default: withCtx(() => [createVNode(MenuItemContent_default, {
+									item,
+									selectable: ""
+								}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+									name: "icon",
+									fn: withCtx((slot) => [renderSlot(_ctx.$slots, "icon", mergeProps({ ref_for: true }, slot))]),
+									key: "0"
+								} : void 0]), 1032, ["item"])]),
+								_: 2
+							}, 1032, [
+								"model-value",
+								"disabled",
+								"text-value",
+								"data-tone",
+								"onUpdate:modelValue",
+								"onSelect"
+							])) : (openBlock(), createBlock(unref(DropdownMenuItem), {
+								key: 3,
+								disabled: __props.disabled || item.isDisabled,
+								"text-value": item.label,
+								class: "menu__item",
+								"data-tone": item.tone ?? "default",
+								onSelect: (event) => action(event, item)
+							}, {
+								default: withCtx(() => [createVNode(MenuItemContent_default, {
+									item,
+									selectable: false
+								}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+									name: "icon",
+									fn: withCtx((slot) => [renderSlot(_ctx.$slots, "icon", mergeProps({ ref_for: true }, slot))]),
+									key: "0"
+								} : void 0]), 1032, ["item"])]),
+								_: 2
+							}, 1032, [
+								"disabled",
+								"text-value",
+								"data-tone",
+								"onSelect"
+							]))], 64);
+						}), 128))]),
+						_: 2
+					}, 1032, ["aria-label"])], 64);
+				}), 128))]),
+				_: 3
+			}, 8, ["model-value"]);
+		};
+	}
+});
+//#endregion
+//#region src/DropdownMenu.vue
+var DropdownMenu_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "DropdownMenu",
+	props: {
+		triggerLabel: {},
+		items: {},
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		dir: { default: void 0 },
+		triggerIconOnly: { type: Boolean },
+		triggerVariant: { default: "secondary" },
+		selectionMode: { default: "none" },
+		selectedKeys: { default: void 0 },
+		defaultSelectedKeys: { default: void 0 },
+		closeOnSelect: {
+			type: Boolean,
+			default: void 0
+		},
+		placement: { default: "bottom-start" }
+	},
+	emits: [
+		"update:open",
+		"action",
+		"update:selectedKeys"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { visible, change } = useDisclosure(props, (next) => emit("update:open", next));
+		const local = ref(props.defaultSelectedKeys ?? []);
+		const selected = computed(() => menuSelection(props.selectedKeys ?? local.value, props.items, props.selectionMode));
+		const side = computed(() => props.placement.split("-")[0]);
+		const align = computed(() => props.placement.split("-")[1]);
+		function select(id, checked) {
+			const item = menuLeaves(props.items, props.disabled).find((item) => item.id === id);
+			if (!item || item.isDisabled || props.selectionMode === "none") return;
+			const next = menuSelection(props.selectionMode === "single" ? [id] : checked ? [...selected.value, id] : selected.value.filter((key) => key !== id), props.items, props.selectionMode);
+			local.value = next;
+			emit("update:selectedKeys", next);
+		}
+		function action(id) {
+			const item = menuLeaves(props.items, props.disabled).find((item) => item.id === id);
+			if (item && !item.isDisabled) emit("action", id);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(DropdownMenuRoot), {
+				open: unref(visible),
+				dir: __props.dir,
+				"onUpdate:open": unref(change)
+			}, {
+				default: withCtx(() => [createVNode(unref(DropdownMenuTrigger), {
+					class: normalizeClass([
+						"button",
+						`button--${__props.triggerVariant}`,
+						__props.triggerIconOnly && "button--icon-only"
+					]),
+					"aria-label": __props.triggerLabel,
+					disabled: __props.disabled || !__props.items.length
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "trigger", {}, () => [createTextVNode(toDisplayString(__props.triggerLabel), 1)])]),
+					_: 3
+				}, 8, [
+					"class",
+					"aria-label",
+					"disabled"
+				]), createVNode(unref(DropdownMenuPortal), null, {
+					default: withCtx(() => [createVNode(unref(DropdownMenuContent), {
+						class: "menu__panel menu__list",
+						"aria-label": __props.triggerLabel,
+						side: side.value,
+						align: align.value,
+						"side-offset": 8,
+						"collision-padding": 16,
+						dir: __props.dir
+					}, {
+						default: withCtx(() => [createVNode(DropdownMenuBranch_default, {
+							items: __props.items,
+							"selected-keys": selected.value,
+							"selection-mode": __props.selectionMode,
+							"close-on-select": __props.closeOnSelect ?? __props.selectionMode !== "multiple",
+							disabled: __props.disabled,
+							dir: __props.dir,
+							onAction: action,
+							onSelection: select
+						}, createSlots({ _: 2 }, [_ctx.$slots.icon ? {
+							name: "icon",
+							fn: withCtx((slot) => [renderSlot(_ctx.$slots, "icon", normalizeProps(guardReactiveProps(slot)))]),
+							key: "0"
+						} : void 0]), 1032, [
+							"items",
+							"selected-keys",
+							"selection-mode",
+							"close-on-select",
+							"disabled",
+							"dir"
+						])]),
+						_: 3
+					}, 8, [
+						"aria-label",
+						"side",
+						"align",
+						"dir"
+					])]),
+					_: 3
+				})]),
+				_: 3
+			}, 8, [
+				"open",
+				"dir",
+				"onUpdate:open"
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/Popover.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$5 = ["dir", "aria-describedby"];
+var _hoisted_2$5 = ["id"];
+var _hoisted_3$3 = { class: "overlay__body" };
+var _hoisted_4$3 = { class: "overlay__footer" };
+//#endregion
+//#region src/Popover.vue
+var Popover_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Popover",
+	props: {
+		triggerLabel: {},
+		title: {},
+		description: { default: void 0 },
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		closeLabel: { default: "Tutup" },
+		dir: { default: void 0 }
+	},
+	emits: ["update:open"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { visible, change } = useDisclosure(props, (next) => emit("update:open", next));
+		const generated = useId(), titleId = `${generated}-title`, descriptionId = computed(() => props.description ? `${generated}-description` : void 0);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(PopoverRoot), {
+				open: unref(visible),
+				"onUpdate:open": unref(change)
+			}, {
+				default: withCtx(() => [createVNode(unref(PopoverTrigger), {
+					class: "button button--secondary",
+					disabled: __props.disabled
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.triggerLabel), 1)]),
+					_: 1
+				}, 8, ["disabled"]), createVNode(unref(PopoverPortal), null, {
+					default: withCtx(() => [createVNode(unref(PopoverContent), {
+						"as-child": "",
+						side: "bottom",
+						align: "start",
+						"side-offset": 8,
+						"collision-padding": 16
+					}, {
+						default: withCtx(() => [createElementVNode("div", {
+							class: "popover__panel popover__content",
+							dir: __props.dir,
+							"aria-labelledby": titleId,
+							"aria-describedby": descriptionId.value
+						}, [
+							createElementVNode("h2", {
+								id: titleId,
+								class: "overlay__title"
+							}, toDisplayString(__props.title), 1),
+							__props.description ? (openBlock(), createElementBlock("p", {
+								key: 0,
+								id: descriptionId.value,
+								class: "overlay__description"
+							}, toDisplayString(__props.description), 9, _hoisted_2$5)) : createCommentVNode("", true),
+							createElementVNode("div", _hoisted_3$3, [renderSlot(_ctx.$slots, "default")]),
+							createElementVNode("div", _hoisted_4$3, [createVNode(unref(PopoverClose), { class: "button button--secondary" }, {
+								default: withCtx(() => [createTextVNode(toDisplayString(__props.closeLabel), 1)]),
+								_: 1
+							})])
+						], 8, _hoisted_1$5)]),
+						_: 3
+					})]),
+					_: 3
+				})]),
+				_: 3
+			}, 8, ["open", "onUpdate:open"]);
+		};
+	}
+});
+//#endregion
+//#region src/Tooltip.vue
+var Tooltip_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Tooltip",
+	props: {
+		triggerLabel: {},
+		text: {},
+		triggerIconOnly: {
+			type: Boolean,
+			default: false
+		},
+		triggerVariant: { default: "secondary" },
+		triggerSize: { default: "md" },
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		dir: { default: void 0 }
+	},
+	emits: ["update:open"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { visible, change } = useDisclosure(props, (next) => emit("update:open", next));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(TooltipProvider), {
+				"delay-duration": 300,
+				"skip-delay-duration": 0,
+				"disable-hoverable-content": true
+			}, {
+				default: withCtx(() => [createVNode(unref(TooltipRoot), {
+					open: unref(visible),
+					"onUpdate:open": unref(change)
+				}, {
+					default: withCtx(() => [createVNode(unref(TooltipTrigger), {
+						class: normalizeClass([
+							"button",
+							`button--${__props.triggerVariant}`,
+							__props.triggerSize !== "md" && `button--${__props.triggerSize}`,
+							__props.triggerIconOnly && "button--icon-only"
+						]),
+						"aria-label": __props.triggerLabel,
+						disabled: __props.disabled
+					}, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "trigger", {}, () => [createTextVNode(toDisplayString(__props.triggerLabel), 1)])]),
+						_: 3
+					}, 8, [
+						"class",
+						"aria-label",
+						"disabled"
+					]), createVNode(unref(TooltipPortal), null, {
+						default: withCtx(() => [createVNode(unref(TooltipContent), {
+							class: "tooltip__panel",
+							side: "top",
+							"side-offset": 8,
+							"collision-padding": 16,
+							dir: __props.dir
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(__props.text), 1)]),
+							_: 1
+						}, 8, ["dir"])]),
+						_: 1
+					})]),
+					_: 3
+				}, 8, ["open", "onUpdate:open"])]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+//#region src/Spinner.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$4 = [
+	"id",
+	"data-color",
+	"role",
+	"aria-label",
+	"aria-hidden"
+];
+var _hoisted_2$4 = {
+	key: 0,
+	class: "spinner__label"
+};
+//#endregion
+//#region src/Spinner.vue
+var Spinner_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Spinner",
+	props: {
+		size: { default: "md" },
+		color: { default: "current" },
+		label: { default: void 0 },
+		id: { default: void 0 }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", {
+				id: __props.id,
+				class: normalizeClass(["spinner", `spinner--${__props.size}`]),
+				"data-color": __props.color,
+				role: __props.label ? "status" : void 0,
+				"aria-label": __props.label || void 0,
+				"aria-hidden": !__props.label || void 0
+			}, [_cache[0] || (_cache[0] = createElementVNode("svg", {
+				viewBox: "0 0 20 20",
+				fill: "none",
+				"aria-hidden": "true",
+				focusable: "false"
+			}, [createElementVNode("circle", {
+				class: "spinner__track",
+				cx: "10",
+				cy: "10",
+				r: "8"
+			}), createElementVNode("circle", {
+				class: "spinner__arc",
+				cx: "10",
+				cy: "10",
+				r: "8",
+				pathLength: "100",
+				"stroke-dasharray": "36 64"
+			})], -1)), __props.label ? (openBlock(), createElementBlock("span", _hoisted_2$4, toDisplayString(__props.label), 1)) : createCommentVNode("", true)], 10, _hoisted_1$4);
+		};
+	}
+});
+//#endregion
+//#region src/Combobox.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$3 = ["dir"];
+var _hoisted_2$3 = ["for"];
+var _hoisted_3$2 = {
+	key: 0,
+	class: "selection__required",
+	"aria-hidden": "true"
+};
+var _hoisted_4$2 = {
+	key: 0,
+	class: "selection__leading",
+	"aria-hidden": "true"
+};
+var _hoisted_5$2 = [
+	"data-empty",
+	"aria-hidden",
+	"tabindex",
+	"disabled",
+	"aria-label"
+];
+var _hoisted_6$2 = { class: "select__item-label" };
+var _hoisted_7$2 = {
+	key: 0,
+	class: "selection__description"
+};
+var _hoisted_8$2 = {
+	key: 0,
+	class: "selection__empty",
+	role: "status"
+};
+var _hoisted_9$2 = [
+	"name",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/Combobox.vue
+var Combobox_default = /* @__PURE__ */ defineComponent({
+	__name: "Combobox",
+	props: {
+		label: {},
+		options: {},
+		modelValue: {},
+		defaultValue: {},
+		placeholder: {},
+		name: {},
+		disabled: { type: Boolean },
+		required: { type: Boolean },
+		invalid: { type: Boolean },
+		description: {},
+		errorMessage: {},
+		requiredMessage: {},
+		clearable: { type: Boolean },
+		clearLabel: {},
+		toggleLabel: {},
+		emptyMessage: {},
+		dir: {}
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const instance = getCurrentInstance();
+		const controlled = () => Object.prototype.hasOwnProperty.call(instance?.vnode.props ?? {}, "modelValue");
+		const local = ref(props.defaultValue);
+		const draft = ref(null);
+		const tried = ref(false);
+		const wrapper = ref();
+		const id = computed(() => selectionIds(controlled() ? props.modelValue : local.value, props.options, false)[0]);
+		const selected = computed(() => props.options.find((o) => o.id === id.value));
+		watch(() => selected.value?.id, () => {
+			draft.value = null;
+		});
+		const text = computed(() => draft.value ?? selected.value?.label ?? "");
+		const filtered = computed(() => draft.value === null ? props.options : filterOptions(props.options, draft.value));
+		const invalid = computed(() => props.invalid || tried.value && props.required && !id.value);
+		const error = computed(() => props.errorMessage ?? (props.required && !id.value ? props.requiredMessage ?? "Pilihan wajib diisi." : void 0));
+		const { controlId, describedBy, showError } = useFeedback({
+			get description() {
+				return props.description;
+			},
+			get invalid() {
+				return invalid.value;
+			},
+			get errorMessage() {
+				return error.value;
+			}
+		});
+		function focus() {
+			wrapper.value?.querySelector(".combobox__input")?.focus();
+		}
+		function change(value) {
+			if (props.disabled) return;
+			const next = selectionIds(value, props.options, false)[0];
+			local.value = next;
+			emit("update:modelValue", next);
+			draft.value = null;
+		}
+		function search(value) {
+			if (props.disabled) return;
+			draft.value = value;
+			if (value === "" && id.value) {
+				local.value = void 0;
+				emit("update:modelValue", void 0);
+			}
+		}
+		function reset(cancelled) {
+			if (!cancelled) {
+				tried.value = false;
+				draft.value = null;
+				if (!controlled()) local.value = props.defaultValue;
+			}
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "wrapper",
+				ref: wrapper,
+				class: "select combobox",
+				dir: __props.dir
+			}, [
+				createElementVNode("label", {
+					class: "select__label",
+					for: unref(controlId)
+				}, [createTextVNode(toDisplayString(__props.label), 1), __props.required ? (openBlock(), createElementBlock("span", _hoisted_3$2, " *")) : createCommentVNode("", true)], 8, _hoisted_2$3),
+				createVNode(unref(ComboboxRoot), {
+					"model-value": id.value ?? null,
+					disabled: __props.disabled,
+					dir: __props.dir,
+					"ignore-filter": "",
+					"reset-search-term-on-blur": false,
+					"reset-search-term-on-select": false,
+					"onUpdate:modelValue": change,
+					"onUpdate:open": _cache[1] || (_cache[1] = (open) => {
+						if (!open) draft.value = null;
+					})
+				}, {
+					default: withCtx(() => [createVNode(unref(ComboboxAnchor), {
+						class: "combobox__control",
+						"data-invalid": invalid.value || void 0,
+						"data-disabled": __props.disabled || void 0
+					}, {
+						default: withCtx(() => [
+							_ctx.$slots.start ? (openBlock(), createElementBlock("span", _hoisted_4$2, [renderSlot(_ctx.$slots, "start")])) : createCommentVNode("", true),
+							createVNode(unref(ComboboxInput), {
+								id: unref(controlId),
+								"model-value": text.value,
+								"display-value": () => selected.value?.label ?? "",
+								class: "combobox__input",
+								placeholder: __props.placeholder,
+								"aria-required": __props.required || void 0,
+								"aria-invalid": invalid.value || void 0,
+								"aria-describedby": unref(describedBy),
+								"onUpdate:modelValue": search
+							}, null, 8, [
+								"id",
+								"model-value",
+								"display-value",
+								"placeholder",
+								"aria-required",
+								"aria-invalid",
+								"aria-describedby"
+							]),
+							__props.clearable ? (openBlock(), createElementBlock("button", {
+								key: 1,
+								type: "button",
+								class: "combobox__clear",
+								"data-empty": !id.value && !text.value || void 0,
+								"aria-hidden": !id.value && !text.value || void 0,
+								tabindex: !id.value && !text.value ? -1 : void 0,
+								disabled: __props.disabled || !id.value && !text.value,
+								"aria-label": __props.clearLabel ?? "Hapus pilihan",
+								onClick: _cache[0] || (_cache[0] = ($event) => {
+									change(void 0);
+									focus();
+								})
+							}, [createVNode(CloseIcon_default, { class: "selection__close-icon" })], 8, _hoisted_5$2)) : createCommentVNode("", true),
+							createVNode(unref(ComboboxTrigger), {
+								class: "combobox__toggle",
+								"aria-label": __props.toggleLabel ?? "Buka pilihan"
+							}, {
+								default: withCtx(() => [createVNode(ChevronIcon_default, { class: "select__icon" })]),
+								_: 1
+							}, 8, ["aria-label"])
+						]),
+						_: 3
+					}, 8, ["data-invalid", "data-disabled"]), createVNode(unref(ComboboxPortal), null, {
+						default: withCtx(() => [createVNode(unref(ComboboxContent), {
+							class: "select__popover combobox__popover",
+							position: "popper",
+							"side-offset": 4
+						}, {
+							default: withCtx(() => [createVNode(unref(ComboboxViewport), { class: "select__list" }, {
+								default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(filtered.value, (option) => {
+									return openBlock(), createBlock(unref(ComboboxItem), {
+										key: option.id,
+										value: option.id,
+										"text-value": option.label,
+										disabled: option.isDisabled,
+										class: "select__item"
+									}, {
+										default: withCtx(() => [createElementVNode("span", _hoisted_6$2, [renderSlot(_ctx.$slots, "option", { option }, () => [createTextVNode(toDisplayString(option.label), 1), option.description ? (openBlock(), createElementBlock("span", _hoisted_7$2, toDisplayString(option.description), 1)) : createCommentVNode("", true)])]), createVNode(CheckIcon_default, { class: "select__check" })]),
+										_: 2
+									}, 1032, [
+										"value",
+										"text-value",
+										"disabled"
+									]);
+								}), 128)), !filtered.value.length ? (openBlock(), createElementBlock("span", _hoisted_8$2, toDisplayString(__props.emptyMessage ?? "Tidak ada pilihan."), 1)) : createCommentVNode("", true)]),
+								_: 3
+							})]),
+							_: 3
+						})]),
+						_: 3
+					})]),
+					_: 3
+				}, 8, [
+					"model-value",
+					"disabled",
+					"dir"
+				]),
+				createVNode(FieldFeedback_default, {
+					"control-id": unref(controlId),
+					description: __props.description,
+					"error-message": error.value,
+					"show-error": unref(showError)
+				}, null, 8, [
+					"control-id",
+					"description",
+					"error-message",
+					"show-error"
+				]),
+				__props.name ? (openBlock(), createElementBlock("input", {
+					key: 0,
+					type: "hidden",
+					name: __props.name,
+					value: id.value ?? "",
+					disabled: __props.disabled
+				}, null, 8, _hoisted_9$2)) : createCommentVNode("", true),
+				createVNode(SelectionValidation_default, {
+					"has-value": !!id.value,
+					required: __props.required,
+					disabled: __props.disabled,
+					onInvalid: _cache[2] || (_cache[2] = ($event) => {
+						tried.value = true;
+						focus();
+					}),
+					onReset: reset
+				}, null, 8, [
+					"has-value",
+					"required",
+					"disabled"
+				])
+			], 8, _hoisted_1$3);
+		};
+	}
+});
+//#endregion
+//#region src/toggle-group-model.ts
+/** Normalize IDs without discarding existing disabled selections. */
+function toggleIds(value, items, multiple) {
+	const wanted = new Set(Array.isArray(value) ? value : typeof value === "string" ? [value] : []);
+	const result = [...new Set(items.filter((item) => item.id !== "" && wanted.has(item.id)).map((item) => item.id))];
+	return multiple ? result : result.slice(0, 1);
+}
+//#endregion
+//#region src/ToggleGroup.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$2 = {
+	key: 0,
+	class: "toggle-group__icon",
+	"aria-hidden": "true"
+};
+var _hoisted_2$2 = { key: 1 };
+//#endregion
+//#region src/ToggleGroup.vue
+var ToggleGroup_default = /* @__PURE__ */ defineComponent({
+	__name: "ToggleGroup",
+	props: {
+		label: {},
+		items: {},
+		selectionMode: {},
+		modelValue: {},
+		defaultValue: {},
+		disabled: { type: Boolean },
+		iconOnly: { type: Boolean },
+		disallowEmptySelection: { type: Boolean },
+		variant: {},
+		size: {},
+		orientation: {},
+		dir: {}
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const instance = getCurrentInstance();
+		const controlled = () => Object.prototype.hasOwnProperty.call(instance?.vnode.props ?? {}, "modelValue");
+		const local = ref(props.defaultValue);
+		const multiple = computed(() => props.selectionMode === "multiple");
+		const ids = computed(() => toggleIds(controlled() ? props.modelValue : local.value, props.items, multiple.value));
+		function update(value) {
+			if (props.disabled) return;
+			const requested = new Set(toggleIds(value, props.items, true));
+			for (const item of props.items.filter((item) => item.isDisabled)) if (multiple.value && ids.value.includes(item.id)) requested.add(item.id);
+			else if (!ids.value.includes(item.id)) requested.delete(item.id);
+			const next = toggleIds([...requested], props.items, multiple.value);
+			if (next.length === ids.value.length && next.every((id, index) => id === ids.value[index])) return;
+			if (props.disallowEmptySelection && ids.value.length && !next.length) return;
+			const result = multiple.value ? next : next[0] ?? null;
+			local.value = result;
+			emit("update:modelValue", result);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ToggleGroupRoot), {
+				class: "toggle-group",
+				"aria-label": __props.label,
+				type: multiple.value ? "multiple" : "single",
+				"model-value": multiple.value ? ids.value : ids.value[0] ?? "",
+				disabled: __props.disabled,
+				dir: __props.dir,
+				orientation: __props.orientation ?? "horizontal",
+				"data-orientation": __props.orientation ?? "horizontal",
+				"data-variant": __props.variant ?? "outline",
+				"data-size": __props.size ?? "md",
+				"data-icon-only": __props.iconOnly || void 0,
+				"onUpdate:modelValue": update
+			}, {
+				default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item) => {
+					return openBlock(), createBlock(unref(ToggleGroupItem), {
+						key: item.id,
+						value: item.id,
+						type: "button",
+						class: "toggle-group__item",
+						"aria-label": item.label,
+						disabled: __props.disabled || item.isDisabled
+					}, {
+						default: withCtx(() => [_ctx.$slots.icon ? (openBlock(), createElementBlock("span", _hoisted_1$2, [renderSlot(_ctx.$slots, "icon", { item })])) : createCommentVNode("", true), !__props.iconOnly ? (openBlock(), createElementBlock("span", _hoisted_2$2, toDisplayString(item.label), 1)) : createCommentVNode("", true)]),
+						_: 2
+					}, 1032, [
+						"value",
+						"aria-label",
+						"disabled"
+					]);
+				}), 128))]),
+				_: 3
+			}, 8, [
+				"aria-label",
+				"type",
+				"model-value",
+				"disabled",
+				"dir",
+				"orientation",
+				"data-orientation",
+				"data-variant",
+				"data-size",
+				"data-icon-only"
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/date-range-model.ts
+function dateRangeLabels(locale = "id-ID") {
+	return locale.startsWith("id") ? {
+		title: "Pilih rentang tanggal",
+		start: "Tanggal mulai",
+		end: "Tanggal akhir",
+		apply: "Terapkan",
+		cancel: "Batal",
+		clear: "Kosongkan",
+		previousMonth: "Bulan sebelumnya",
+		nextMonth: "Bulan berikutnya",
+		presets: "Pilihan cepat",
+		placeholder: "Pilih tanggal",
+		incomplete: "Lengkapi tanggal mulai dan akhir.",
+		order: "Tanggal akhir harus setelah atau sama dengan tanggal mulai.",
+		bounds: "Tanggal berada di luar batas yang diizinkan.",
+		unavailable: "Rentang memuat tanggal yang tidak tersedia.",
+		length: "Durasi rentang tidak sesuai batas yang diizinkan.",
+		required: "Rentang tanggal wajib diisi."
+	} : {
+		title: "Select date range",
+		start: "Start date",
+		end: "End date",
+		apply: "Apply",
+		cancel: "Cancel",
+		clear: "Clear",
+		previousMonth: "Previous month",
+		nextMonth: "Next month",
+		presets: "Quick selections",
+		placeholder: "Choose dates",
+		incomplete: "Enter both start and end dates.",
+		order: "End date must be on or after start date.",
+		bounds: "Dates are outside the allowed limits.",
+		unavailable: "The range includes an unavailable date.",
+		length: "The range duration is outside the allowed limits.",
+		required: "A date range is required."
+	};
+}
+function validDate(value) {
+	if (!/^(?!0000)\d{4}-\d{2}-\d{2}$/.test(value)) return false;
+	try {
+		return parseDate(value).toString() === value;
+	} catch {
+		return false;
+	}
+}
+function asDate(value) {
+	return value && validDate(value) ? parseDate(value) : void 0;
+}
+function currentDate() {
+	return today(getLocalTimeZone()).toString();
+}
+function rangeError(value, constraints = {}) {
+	if (!value) return null;
+	if (!validDate(value.start) || !validDate(value.end)) return "incomplete";
+	if (value.end < value.start) return "order";
+	if (constraints.minDate && value.start < constraints.minDate || constraints.maxDate && value.end > constraints.maxDate) return "bounds";
+	const start = parseDate(value.start), end = parseDate(value.end);
+	const days = end.calendar.toJulianDay(end) - start.calendar.toJulianDay(start) + 1;
+	if (constraints.minDays && days < constraints.minDays || constraints.maxDays && days > constraints.maxDays) return "length";
+	if (constraints.isDateUnavailable) for (let day = start; day.compare(end) <= 0; day = day.add({ days: 1 })) {
+		if (constraints.isDateUnavailable(day.toString())) return "unavailable";
+		if (day.compare(end) === 0) break;
+	}
+	return null;
+}
+function rangeText(value, locale = "id-ID") {
+	if (!value || !validDate(value.start) || !validDate(value.end)) return "";
+	const formatter = new Intl.DateTimeFormat(locale, {
+		day: "numeric",
+		month: "short",
+		year: "numeric",
+		timeZone: "UTC",
+		calendar: "gregory"
+	});
+	const date = (s) => parseDate(s).toDate("UTC");
+	return value.start === value.end ? formatter.format(date(value.start)) : `${formatter.format(date(value.start))} – ${formatter.format(date(value.end))}`;
+}
+function createDateRangePresets(referenceDate = currentDate(), locale = "id-ID", weekStartsOn = 1) {
+	const day = parseDate(referenceDate), week = startOfWeek(day, locale, weekStartsOn === 1 ? "mon" : "sun");
+	const id = locale.startsWith("id");
+	return [
+		{
+			id: "this-week",
+			label: id ? "Minggu ini" : "This Week",
+			start: week,
+			end: week.add({ days: 6 })
+		},
+		{
+			id: "last-week",
+			label: id ? "Minggu lalu" : "Last Week",
+			start: week.subtract({ days: 7 }),
+			end: week.subtract({ days: 1 })
+		},
+		{
+			id: "last-7-days",
+			label: id ? "7 hari terakhir" : "Last 7 Days",
+			start: day.subtract({ days: 6 }),
+			end: day
+		},
+		{
+			id: "last-30-days",
+			label: id ? "30 hari terakhir" : "Last 30 Days",
+			start: day.subtract({ days: 29 }),
+			end: day
+		},
+		{
+			id: "this-month",
+			label: id ? "Bulan ini" : "Current Month",
+			start: startOfMonth(day),
+			end: endOfMonth(day)
+		},
+		{
+			id: "next-month",
+			label: id ? "Bulan depan" : "Next Month",
+			start: startOfMonth(day.add({ months: 1 })),
+			end: endOfMonth(day.add({ months: 1 }))
+		}
+	].map(({ id, label, start, end }) => ({
+		id,
+		label,
+		value: {
+			start: start.toString(),
+			end: end.toString()
+		}
+	}));
+}
+//#endregion
+//#region src/DateRangePanel.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$1 = ["data-readonly"];
+var _hoisted_2$1 = { class: "date-range__intro" };
+var _hoisted_3$1 = ["id"];
+var _hoisted_4$1 = {
+	class: "date-range__summary",
+	"aria-live": "polite"
+};
+var _hoisted_5$1 = { class: "date-range__body" };
+var _hoisted_6$1 = ["aria-label"];
+var _hoisted_7$1 = [
+	"disabled",
+	"aria-pressed",
+	"onClick"
+];
+var _hoisted_8$1 = { class: "date-range__main" };
+var _hoisted_9$1 = {
+	key: 0,
+	class: "date-range__jump"
+};
+var _hoisted_10$1 = [
+	"aria-label",
+	"disabled",
+	"value"
+];
+var _hoisted_11 = ["value"];
+var _hoisted_12 = [
+	"disabled",
+	"value",
+	"min",
+	"max"
+];
+var _hoisted_13 = {
+	key: 1,
+	class: "date-range__inputs"
+};
+var _hoisted_14 = [
+	"value",
+	"min",
+	"max",
+	"disabled",
+	"readonly",
+	"aria-invalid",
+	"aria-describedby",
+	"onInput"
+];
+var _hoisted_15 = { class: "date-range__navigation" };
+var _hoisted_16 = { class: "date-range__months" };
+var _hoisted_17 = { class: "date-range__heading" };
+var _hoisted_18 = {
+	class: "date-range__validation",
+	"aria-live": "polite"
+};
+var _hoisted_19 = ["id"];
+var _hoisted_20 = { class: "date-range__footer" };
+var _hoisted_21 = ["disabled"];
+var _hoisted_22 = ["disabled"];
+//#endregion
+//#region src/DateRangePanel.vue
+var DateRangePanel_default = /* @__PURE__ */ defineComponent({
+	__name: "DateRangePanel",
+	props: {
+		options: {},
+		draft: {},
+		labels: {},
+		id: {},
+		disabled: { type: Boolean },
+		readonly: { type: Boolean },
+		required: { type: Boolean }
+	},
+	emits: [
+		"draft",
+		"apply",
+		"cancel"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const locale = computed(() => props.options.locale ?? "id-ID");
+		const nullable = computed(() => props.draft.start || props.draft.end ? props.draft : null);
+		const errorCode = computed(() => rangeError(nullable.value, props.options) ?? (props.required && !nullable.value ? "required" : null));
+		const error = computed(() => errorCode.value ? props.labels[errorCode.value] : void 0);
+		function initialFocus() {
+			const date = asDate(props.draft.start) ?? asDate(props.options.referenceDate) ?? asDate(currentDate());
+			const min = asDate(props.options.minDate), max = asDate(props.options.maxDate);
+			return min && date.compare(min) < 0 ? min : max && date.compare(max) > 0 ? max : date;
+		}
+		const focused = shallowRef(initialFocus());
+		watch(() => props.draft.start, () => {
+			if (asDate(props.draft.start)) focused.value = asDate(props.draft.start);
+		});
+		const calendarValue = computed(() => ({
+			start: asDate(props.draft.start),
+			end: props.draft.start <= props.draft.end ? asDate(props.draft.end) : void 0
+		}));
+		function select(value) {
+			if (!props.disabled && !props.readonly) emit("draft", {
+				start: value.start?.toString() ?? "",
+				end: value.end?.toString() ?? ""
+			});
+		}
+		function edit(part, event) {
+			emit("draft", {
+				...props.draft,
+				[part]: event.target.value
+			});
+		}
+		function jumpYear(event) {
+			const el = event.target;
+			const year = Number(el.value);
+			if (Number.isInteger(year) && year >= 1 && year <= 9999) focused.value = focused.value.set({ year });
+			else el.value = String(focused.value.year);
+		}
+		const monthLabel = (date) => new Intl.DateTimeFormat(locale.value, {
+			month: "long",
+			year: "numeric",
+			calendar: "gregory",
+			timeZone: "UTC"
+		}).format(date.toDate("UTC"));
+		const unavailable = (date) => props.options.isDateUnavailable?.(date.toString()) ?? false;
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "date-range__content",
+				"data-readonly": __props.readonly || void 0
+			}, [
+				createElementVNode("header", _hoisted_2$1, [createElementVNode("h2", { id: `${__props.id}-title` }, toDisplayString(__props.labels.title), 9, _hoisted_3$1), createElementVNode("p", _hoisted_4$1, toDisplayString(unref(rangeText)(nullable.value, locale.value) || __props.labels.incomplete), 1)]),
+				createElementVNode("div", _hoisted_5$1, [__props.options.presets?.length ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: "date-range__presets",
+					role: "group",
+					"aria-label": __props.labels.presets
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options.presets, (preset) => {
+					return openBlock(), createElementBlock("button", {
+						key: preset.id,
+						type: "button",
+						class: "date-range__preset",
+						disabled: __props.disabled || __props.readonly || !!unref(rangeError)(preset.value, __props.options),
+						"aria-pressed": __props.draft.start === preset.value.start && __props.draft.end === preset.value.end,
+						onClick: ($event) => emit("draft", { ...preset.value })
+					}, toDisplayString(preset.label), 9, _hoisted_7$1);
+				}), 128))], 8, _hoisted_6$1)) : createCommentVNode("", true), createElementVNode("div", _hoisted_8$1, [
+					__props.options.showMonthYearPicker ? (openBlock(), createElementBlock("div", _hoisted_9$1, [createElementVNode("label", null, [createElementVNode("span", null, toDisplayString(locale.value.startsWith("id") ? "Bulan" : "Month"), 1), createElementVNode("select", {
+						form: "",
+						"aria-label": locale.value.startsWith("id") ? "Bulan" : "Month",
+						disabled: __props.disabled,
+						value: focused.value.month,
+						onChange: _cache[0] || (_cache[0] = ($event) => focused.value = focused.value.set({ month: Number($event.target.value) }))
+					}, [(openBlock(), createElementBlock(Fragment, null, renderList(12, (month) => {
+						return createElementVNode("option", {
+							key: month,
+							value: month
+						}, toDisplayString(new Intl.DateTimeFormat(locale.value, {
+							month: "long",
+							timeZone: "UTC",
+							calendar: "gregory"
+						}).format(focused.value.set({
+							month,
+							day: 1
+						}).toDate("UTC"))), 9, _hoisted_11);
+					}), 64))], 40, _hoisted_10$1)]), createElementVNode("label", null, [createElementVNode("span", null, toDisplayString(locale.value.startsWith("id") ? "Tahun" : "Year"), 1), createElementVNode("input", {
+						type: "number",
+						form: "",
+						disabled: __props.disabled,
+						value: focused.value.year,
+						min: unref(asDate)(__props.options.minDate)?.year ?? 1,
+						max: unref(asDate)(__props.options.maxDate)?.year ?? 9999,
+						onChange: jumpYear
+					}, null, 40, _hoisted_12)])])) : createCommentVNode("", true),
+					__props.options.showInputs !== false ? (openBlock(), createElementBlock("div", _hoisted_13, [(openBlock(), createElementBlock(Fragment, null, renderList(["start", "end"], (part) => {
+						return createElementVNode("label", {
+							key: part,
+							class: "date-range__field"
+						}, [createElementVNode("span", null, toDisplayString(__props.labels[part]), 1), createElementVNode("input", {
+							type: "date",
+							form: "",
+							value: __props.draft[part],
+							min: __props.options.minDate,
+							max: __props.options.maxDate,
+							disabled: __props.disabled,
+							readonly: __props.readonly,
+							"aria-invalid": !!errorCode.value,
+							"aria-describedby": error.value ? `${__props.id}-draft-error` : void 0,
+							onInput: ($event) => edit(part, $event)
+						}, null, 40, _hoisted_14)]);
+					}), 64))])) : createCommentVNode("", true),
+					createVNode(unref(RangeCalendarRoot), {
+						placeholder: focused.value,
+						"onUpdate:placeholder": _cache[1] || (_cache[1] = ($event) => focused.value = $event),
+						class: "date-range__calendar",
+						"model-value": calendarValue.value,
+						"number-of-months": __props.options.visibleMonths ?? 2,
+						"week-starts-on": __props.options.weekStartsOn ?? 1,
+						"weekday-format": "short",
+						"calendar-label": __props.labels.title,
+						locale: `${locale.value.split("-u-")[0]}-u-ca-gregory`,
+						dir: __props.options.dir,
+						"min-value": unref(asDate)(__props.options.minDate),
+						"max-value": unref(asDate)(__props.options.maxDate),
+						disabled: __props.disabled,
+						readonly: __props.readonly,
+						"is-date-unavailable": unavailable,
+						"onUpdate:modelValue": select
+					}, {
+						default: withCtx(({ grid, weekDays }) => [createElementVNode("div", _hoisted_15, [createVNode(unref(RangeCalendarPrev), {
+							as: "button",
+							type: "button",
+							class: "date-range__nav date-range__nav--previous",
+							"aria-label": __props.labels.previousMonth
+						}, {
+							default: withCtx(() => [createVNode(ChevronIcon_default)]),
+							_: 1
+						}, 8, ["aria-label"]), createVNode(unref(RangeCalendarNext), {
+							as: "button",
+							type: "button",
+							class: "date-range__nav date-range__nav--next",
+							"aria-label": __props.labels.nextMonth
+						}, {
+							default: withCtx(() => [createVNode(ChevronIcon_default)]),
+							_: 1
+						}, 8, ["aria-label"])]), createElementVNode("div", _hoisted_16, [(openBlock(true), createElementBlock(Fragment, null, renderList(grid, (month) => {
+							return openBlock(), createElementBlock("div", {
+								key: month.value.toString(),
+								class: "date-range__month"
+							}, [createElementVNode("h2", _hoisted_17, toDisplayString(monthLabel(month.value)), 1), createVNode(unref(RangeCalendarGrid), { class: "date-range__grid" }, {
+								default: withCtx(() => [createVNode(unref(RangeCalendarGridHead), null, {
+									default: withCtx(() => [createVNode(unref(RangeCalendarGridRow), null, {
+										default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(weekDays, (day) => {
+											return openBlock(), createBlock(unref(RangeCalendarHeadCell), {
+												key: day,
+												class: "date-range__weekday"
+											}, {
+												default: withCtx(() => [createTextVNode(toDisplayString(day), 1)]),
+												_: 2
+											}, 1024);
+										}), 128))]),
+										_: 2
+									}, 1024)]),
+									_: 2
+								}, 1024), createVNode(unref(RangeCalendarGridBody), null, {
+									default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(month.rows, (week, index) => {
+										return openBlock(), createBlock(unref(RangeCalendarGridRow), { key: index }, {
+											default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(week, (date) => {
+												return openBlock(), createBlock(unref(RangeCalendarCell), {
+													key: date.toString(),
+													date
+												}, {
+													default: withCtx(() => [createVNode(unref(RangeCalendarCellTrigger), {
+														class: "date-range__day",
+														day: date,
+														month: month.value
+													}, null, 8, ["day", "month"])]),
+													_: 2
+												}, 1032, ["date"]);
+											}), 128))]),
+											_: 2
+										}, 1024);
+									}), 128))]),
+									_: 2
+								}, 1024)]),
+								_: 2
+							}, 1024)]);
+						}), 128))])]),
+						_: 1
+					}, 8, [
+						"placeholder",
+						"model-value",
+						"number-of-months",
+						"week-starts-on",
+						"calendar-label",
+						"locale",
+						"dir",
+						"min-value",
+						"max-value",
+						"disabled",
+						"readonly"
+					]),
+					createElementVNode("div", _hoisted_18, [error.value ? (openBlock(), createElementBlock("p", {
+						key: 0,
+						id: `${__props.id}-draft-error`,
+						role: "alert"
+					}, toDisplayString(error.value), 9, _hoisted_19)) : createCommentVNode("", true)])
+				])]),
+				createElementVNode("footer", _hoisted_20, [createElementVNode("button", {
+					type: "button",
+					class: "button button--ghost button--sm",
+					disabled: __props.disabled || __props.readonly,
+					onClick: _cache[2] || (_cache[2] = ($event) => emit("draft", {
+						start: "",
+						end: ""
+					}))
+				}, toDisplayString(__props.labels.clear), 9, _hoisted_21), createElementVNode("div", null, [createElementVNode("button", {
+					type: "button",
+					class: "button button--secondary button--sm date-range__cancel",
+					onClick: _cache[3] || (_cache[3] = ($event) => emit("cancel"))
+				}, toDisplayString(__props.labels.cancel), 1), createElementVNode("button", {
+					type: "button",
+					class: "button button--primary button--sm date-range__apply",
+					disabled: __props.disabled || __props.readonly || !!errorCode.value,
+					onClick: _cache[4] || (_cache[4] = ($event) => emit("apply"))
+				}, toDisplayString(__props.labels.apply), 9, _hoisted_22)])])
+			], 8, _hoisted_1$1);
+		};
+	}
+});
+//#endregion
+//#region src/DateRangePicker.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["dir", "data-disabled"];
+var _hoisted_2 = ["id"];
+var _hoisted_3 = {
+	key: 0,
+	"aria-hidden": "true"
+};
+var _hoisted_4 = ["aria-labelledby", "dir"];
+var _hoisted_5 = ["id", "data-placeholder"];
+var _hoisted_6 = ["dir", "aria-labelledby"];
+var _hoisted_7 = ["id"];
+var _hoisted_8 = ["id"];
+var _hoisted_9 = [
+	"name",
+	"value",
+	"disabled"
+];
+var _hoisted_10 = [
+	"name",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/DateRangePicker.vue
+var DateRangePicker_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "DateRangePicker",
+	props: {
+		modelValue: { default: void 0 },
+		disabled: { type: Boolean },
+		readonly: { type: Boolean },
+		required: { type: Boolean },
+		invalid: { type: Boolean },
+		label: {},
+		defaultValue: { default: null },
+		size: { default: "md" },
+		variant: { default: "primary" },
+		hideLabel: { type: Boolean },
+		fullWidth: {
+			type: Boolean,
+			default: true
+		},
+		locale: { default: "id-ID" },
+		dir: { default: void 0 },
+		visibleMonths: { default: 2 },
+		weekStartsOn: { default: 1 },
+		display: { default: "popover" },
+		showInputs: {
+			type: Boolean,
+			default: true
+		},
+		showMonthYearPicker: {
+			type: Boolean,
+			default: false
+		},
+		triggerDisplay: { default: "text" },
+		presets: { default: () => [] },
+		labels: { default: void 0 },
+		formatRange: {
+			type: Function,
+			default: void 0
+		},
+		description: { default: void 0 },
+		errorMessage: { default: void 0 },
+		name: { default: void 0 },
+		referenceDate: { default: void 0 },
+		open: {
+			type: Boolean,
+			default: void 0
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: false
+		},
+		minDate: { default: void 0 },
+		maxDate: { default: void 0 },
+		minDays: { default: void 0 },
+		maxDays: { default: void 0 },
+		isDateUnavailable: {
+			type: Function,
+			default: void 0
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"update:open",
+		"apply"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const local = ref(props.defaultValue);
+		const committed = computed(() => props.modelValue !== void 0 ? props.modelValue : local.value);
+		const draft = ref({ ...committed.value ?? {
+			start: "",
+			end: ""
+		} });
+		watch(() => [committed.value?.start, committed.value?.end], () => {
+			draft.value = { ...committed.value ?? {
+				start: "",
+				end: ""
+			} };
+		});
+		const labels = computed(() => ({
+			...dateRangeLabels(props.locale),
+			...props.labels
+		}));
+		const id = useId(), root = ref(), formError = ref(false);
+		const disclosure = useDisclosure(props, (next) => emit("update:open", next));
+		const visible = computed(() => disclosure.visible.value && !props.disabled);
+		function changeOpen(next) {
+			if (next && props.disabled) return;
+			draft.value = { ...committed.value ?? {
+				start: "",
+				end: ""
+			} };
+			disclosure.change(next);
+		}
+		const committedError = computed(() => rangeError(committed.value, props));
+		const outerError = computed(() => props.invalid || !!committedError.value || formError.value);
+		const text = computed(() => {
+			const value = committed.value;
+			if (!value) return labels.value.placeholder;
+			const preset = props.presets.find((p) => p.value.start === value.start && p.value.end === value.end);
+			return props.formatRange?.(value, props.locale) ?? preset?.label ?? rangeText(value, props.locale);
+		});
+		function apply() {
+			const next = draft.value.start || draft.value.end ? { ...draft.value } : null;
+			if (props.disabled || props.readonly || rangeError(next, props) || props.required && !next) return;
+			local.value = next;
+			formError.value = false;
+			emit("update:modelValue", next);
+			emit("apply", next);
+			disclosure.change(false);
+		}
+		function reset(cancelled) {
+			if (!cancelled) {
+				if (props.modelValue === void 0) local.value = props.defaultValue;
+				formError.value = false;
+				changeOpen(false);
+			}
+		}
+		const describedBy = computed(() => outerError.value ? `${id}-error` : props.description ? `${id}-description` : void 0);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "root",
+				ref: root,
+				class: normalizeClass([
+					"date-range",
+					`date-range--${__props.size}`,
+					`date-range--${__props.variant}`,
+					!__props.fullWidth && "date-range--fit",
+					__props.hideLabel && "date-range--label-hidden",
+					__props.triggerDisplay === "icon" && "date-range--icon-trigger"
+				]),
+				dir: __props.dir,
+				"data-disabled": __props.disabled || void 0
+			}, [
+				createElementVNode("span", {
+					id: `${unref(id)}-label`,
+					class: "date-range__label"
+				}, [createTextVNode(toDisplayString(__props.label), 1), __props.required ? (openBlock(), createElementBlock("span", _hoisted_3, " *")) : createCommentVNode("", true)], 8, _hoisted_2),
+				__props.display === "inline" ? (openBlock(), createElementBlock("section", {
+					key: 0,
+					class: "date-range__panel date-range__inline",
+					"aria-labelledby": `${unref(id)}-title`,
+					dir: __props.dir
+				}, [createVNode(DateRangePanel_default, {
+					id: unref(id),
+					options: props,
+					draft: draft.value,
+					labels: labels.value,
+					disabled: __props.disabled,
+					readonly: __props.readonly,
+					required: __props.required,
+					onDraft: _cache[0] || (_cache[0] = ($event) => draft.value = $event),
+					onApply: apply,
+					onCancel: _cache[1] || (_cache[1] = ($event) => changeOpen(false))
+				}, null, 8, [
+					"id",
+					"draft",
+					"labels",
+					"disabled",
+					"readonly",
+					"required"
+				])], 8, _hoisted_4)) : (openBlock(), createBlock(unref(PopoverRoot), {
+					key: 1,
+					open: visible.value,
+					"onUpdate:open": changeOpen
+				}, {
+					default: withCtx(() => [createVNode(unref(PopoverTrigger), {
+						class: "date-range__trigger",
+						disabled: __props.disabled,
+						"aria-labelledby": `${unref(id)}-label ${unref(id)}-value`,
+						"aria-describedby": describedBy.value,
+						"aria-invalid": outerError.value
+					}, {
+						default: withCtx(() => [
+							_cache[5] || (_cache[5] = createElementVNode("svg", {
+								class: "date-range__icon",
+								"aria-hidden": "true",
+								focusable: "false",
+								viewBox: "0 0 24 24",
+								fill: "none",
+								stroke: "currentColor",
+								"stroke-width": "1.8",
+								"stroke-linecap": "round"
+							}, [createElementVNode("rect", {
+								x: "3",
+								y: "5",
+								width: "18",
+								height: "16",
+								rx: "2"
+							}), createElementVNode("path", { d: "M7 3v4m10-4v4M3 10h18" })], -1)),
+							createElementVNode("span", {
+								id: `${unref(id)}-value`,
+								class: "date-range__value",
+								"data-placeholder": !committed.value || void 0
+							}, toDisplayString(text.value), 9, _hoisted_5),
+							createVNode(ChevronIcon_default, { class: "date-range__chevron" })
+						]),
+						_: 1
+					}, 8, [
+						"disabled",
+						"aria-labelledby",
+						"aria-describedby",
+						"aria-invalid"
+					]), createVNode(unref(PopoverPortal), null, {
+						default: withCtx(() => [createVNode(unref(PopoverContent), {
+							"as-child": "",
+							side: "bottom",
+							align: "start",
+							"side-offset": 8,
+							"collision-padding": 16
+						}, {
+							default: withCtx(() => [createElementVNode("div", {
+								class: "date-range__panel date-range__dialog",
+								dir: __props.dir,
+								"aria-labelledby": `${unref(id)}-title`
+							}, [createVNode(DateRangePanel_default, {
+								id: unref(id),
+								options: props,
+								draft: draft.value,
+								labels: labels.value,
+								disabled: __props.disabled,
+								readonly: __props.readonly,
+								required: __props.required,
+								onDraft: _cache[2] || (_cache[2] = ($event) => draft.value = $event),
+								onApply: apply,
+								onCancel: _cache[3] || (_cache[3] = ($event) => changeOpen(false))
+							}, null, 8, [
+								"id",
+								"draft",
+								"labels",
+								"disabled",
+								"readonly",
+								"required"
+							])], 8, _hoisted_6)]),
+							_: 1
+						})]),
+						_: 1
+					})]),
+					_: 1
+				}, 8, ["open"])),
+				__props.description ? (openBlock(), createElementBlock("span", {
+					key: 2,
+					id: `${unref(id)}-description`,
+					class: "input__description"
+				}, toDisplayString(__props.description), 9, _hoisted_7)) : createCommentVNode("", true),
+				outerError.value ? (openBlock(), createElementBlock("span", {
+					key: 3,
+					id: `${unref(id)}-error`,
+					class: "input__error",
+					role: "alert"
+				}, toDisplayString(__props.errorMessage ?? (committedError.value ? labels.value[committedError.value] : labels.value.required)), 9, _hoisted_8)) : createCommentVNode("", true),
+				__props.name ? (openBlock(), createElementBlock(Fragment, { key: 4 }, [createElementVNode("input", {
+					type: "hidden",
+					name: `${__props.name}.start`,
+					value: committed.value?.start ?? "",
+					disabled: __props.disabled
+				}, null, 8, _hoisted_9), createElementVNode("input", {
+					type: "hidden",
+					name: `${__props.name}.end`,
+					value: committed.value?.end ?? "",
+					disabled: __props.disabled
+				}, null, 8, _hoisted_10)], 64)) : createCommentVNode("", true),
+				createVNode(SelectionValidation_default, {
+					"has-value": !!committed.value && !committedError.value,
+					required: __props.required || !!committedError.value,
+					disabled: __props.disabled,
+					onInvalid: _cache[4] || (_cache[4] = ($event) => {
+						formError.value = true;
+						root.value?.querySelector(".date-range__trigger")?.focus();
+					}),
+					onReset: reset
+				}, null, 8, [
+					"has-value",
+					"required",
+					"disabled"
+				])
+			], 10, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { Alert_default as Alert, Badge_default as Badge, Breadcrumb_default as Breadcrumb, Button_default as Button, ButtonGroup_default as ButtonGroup, ButtonGroupSeparator_default as ButtonGroupSeparator, ButtonGroupSeparator_default as ToggleButtonGroupSeparator, Card_default as Card, Chart_default as Chart, Checkbox_default as Checkbox, Combobox_default as Combobox, DataTable_default as DataTable, DateRangePicker_default as DateRangePicker, Dialog_default as Dialog, DropdownMenu_default as DropdownMenu, Empty_default as Empty, Field_default as Field, Form_default as Form, Input_default as Input, Label_default as Label, Listbox_default as Listbox, NumberField_default as NumberField, Pagination_default as Pagination, Popover_default as Popover, RadioGroup_default as RadioGroup, Select_default as Select, SelectGroup_default as SelectGroup, Separator_default as Separator, Sidebar_default as Sidebar, Skeleton_default as Skeleton, Spinner_default as Spinner, Switch_default as Switch, Table_default as Table, Tabs_default as Tabs, Textarea_default as Textarea, ToggleButton_default as ToggleButton, ToggleButtonGroup_default as ToggleButtonGroup, ToggleGroup_default as ToggleGroup, Tooltip_default as Tooltip, createDateRangePresets, rangeText as formatDateRange };
+
+//# sourceMappingURL=index.js.map