@svelte-thing/primitives 0.0.0

package/README.md

@@ -0,0 +1 @@
+# Primitives

package/dist/button/index.d.mts

@@ -0,0 +1,9 @@
+import { HTMLButtonAttributes } from "svelte/elements";
+
+//#region src/button/createButton.svelte.d.ts
+interface ButtonState {
+  props: HTMLButtonAttributes;
+}
+declare function createButton(): ButtonState;
+//#endregion
+export { ButtonState, createButton };

package/dist/button/index.mjs

@@ -0,0 +1,6 @@
+//#region src/button/createButton.svelte.ts
+function createButton() {
+	return { props: {} };
+}
+//#endregion
+export { createButton };

package/dist/chunk-D7D4PA-g.mjs

@@ -0,0 +1,13 @@
+//#region \0rolldown/runtime.js
+var __defProp = Object.defineProperty;
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+//#endregion
+export { __exportAll as t };

package/dist/context-BJAwVB1S.mjs

@@ -0,0 +1,5 @@
+import { createContext } from "svelte";
+//#region src/menu/root/context.ts
+const [getRoot, setRoot] = createContext();
+//#endregion
+export { setRoot as n, getRoot as t };

package/dist/context-D77KIx26.mjs

@@ -0,0 +1,5 @@
+import { createContext } from "svelte";
+//#region src/field/root/context.ts
+const [getRoot, setRoot] = createContext();
+//#endregion
+export { setRoot as n, getRoot as t };

package/dist/context-DwEoOJU2.mjs

@@ -0,0 +1,5 @@
+import { createContext } from "svelte";
+//#region src/tab/root/context.ts
+const [getRoot, setRoot] = createContext();
+//#endregion
+export { setRoot as n, getRoot as t };

package/dist/createInput.svelte-DTz79zNF.d.mts

@@ -0,0 +1,9 @@
+import { HTMLInputAttributes } from "svelte/elements";
+
+//#region src/field/input/createInput.svelte.d.ts
+interface InputState {
+  props: HTMLInputAttributes;
+}
+declare function createInput(): InputState;
+//#endregion
+export { createInput as n, InputState as t };

package/dist/createInput.svelte-DzcT9u1t.mjs

@@ -0,0 +1,92 @@
+import { t as getRoot } from "./context-D77KIx26.mjs";
+//#region src/field/input/createInput.svelte.ts
+function isCheckboxOrRadio(control) {
+	return control.type === "checkbox" || control.type === "radio";
+}
+function isFilled(control) {
+	if (isCheckboxOrRadio(control)) return control.checked;
+	return control.value !== "";
+}
+function syncValidity(root, control) {
+	if (!control.willValidate) return;
+	const { valid } = control.validity;
+	root.isValid = valid;
+	root.isInvalid = !valid;
+}
+function createInput() {
+	const root = getRoot();
+	return { props: {
+		get id() {
+			return root.controlId;
+		},
+		get disabled() {
+			return root.isDisabled;
+		},
+		get "aria-invalid"() {
+			return root.isInvalid ? true : void 0;
+		},
+		get "aria-describedby"() {
+			return root.isInvalid ? root.errorId : void 0;
+		},
+		get "data-disabled"() {
+			return root.isDisabled ? "" : void 0;
+		},
+		get "data-valid"() {
+			return root.isValid ? "" : void 0;
+		},
+		get "data-invalid"() {
+			return root.isInvalid ? "" : void 0;
+		},
+		get "data-dirty"() {
+			return root.isDirty ? "" : void 0;
+		},
+		get "data-touched"() {
+			return root.isTouched ? "" : void 0;
+		},
+		get "data-filled"() {
+			return root.isFilled ? "" : void 0;
+		},
+		get "data-focused"() {
+			return root.isFocused ? "" : void 0;
+		},
+		onchange(event) {
+			if (root.isDisabled) return;
+			const input = event.currentTarget;
+			root.isDirty = true;
+			root.isFilled = isFilled(input);
+			syncValidity(root, input);
+		},
+		oninput(event) {
+			if (root.isDisabled) return;
+			const input = event.currentTarget;
+			root.isDirty = true;
+			root.isFilled = isFilled(input);
+			syncValidity(root, input);
+		},
+		onfocus(event) {
+			if (root.isDisabled) return;
+			const input = event.currentTarget;
+			root.isFocused = true;
+			root.isFilled = isFilled(input);
+			syncValidity(root, input);
+		},
+		onblur(event) {
+			if (root.isDisabled) return;
+			const input = event.currentTarget;
+			root.isFocused = false;
+			root.isTouched = true;
+			root.isFilled = isFilled(input);
+			syncValidity(root, input);
+		},
+		onkeydown(event) {
+			if (root.isDisabled) return;
+			if (event.key !== "Enter") return;
+			const input = event.currentTarget;
+			root.isTouched = true;
+			root.isFilled = isFilled(input);
+			syncValidity(root, input);
+		}
+	} };
+}
+//#endregion
+export { createInput as t };

package/dist/field/date/index.d.mts

@@ -0,0 +1,2 @@
+import { n as createPicker, t as PickerState } from "../../index-C-ME1Tk9.mjs";
+export { PickerState, createPicker };

package/dist/field/date/index.mjs

@@ -0,0 +1,27 @@
+import { t as getRoot } from "../../context-D77KIx26.mjs";
+//#region src/field/date/createPicker.svelte.ts
+function createPicker() {
+	const root = getRoot();
+	return { props: {
+		get disabled() {
+			return root.isDisabled;
+		},
+		get "aria-controls"() {
+			return root.controlId;
+		},
+		get "data-disabled"() {
+			return root.isDisabled ? "" : void 0;
+		},
+		type: "button",
+		onmousedown(event) {
+			event.preventDefault();
+		},
+		onclick() {
+			if (root.isDisabled) return;
+			const input = document.getElementById(root.controlId);
+			if (input && "showPicker" in input) input.showPicker();
+		}
+	} };
+}
+//#endregion
+export { createPicker };

package/dist/field/error/index.d.mts

@@ -0,0 +1,2 @@
+import { n as createError, t as ErrorState } from "../../index-CA_POIj_.mjs";
+export { ErrorState, createError };

package/dist/field/error/index.mjs

@@ -0,0 +1,10 @@
+import { t as getRoot } from "../../context-D77KIx26.mjs";
+//#region src/field/error/createError.svelte.ts
+function createError() {
+	const root = getRoot();
+	return { props: { get id() {
+		return root.errorId;
+	} } };
+}
+//#endregion
+export { createError };

package/dist/field/index.d.mts

@@ -0,0 +1,13 @@
+import { n as createPicker, t as PickerState } from "../index-C-ME1Tk9.mjs";
+import { n as createError, t as ErrorState } from "../index-CA_POIj_.mjs";
+import { n as createInput, t as InputState } from "../createInput.svelte-DTz79zNF.mjs";
+import { n as createLabel, t as LabelState } from "../index-OI9KlY5x.mjs";
+import { a as CreatePasswordProps, i as setPassword, n as createShow, o as PasswordState, r as getPassword, s as createPassword, t as ShowState } from "../index-Boej-mdy.mjs";
+import { a as createRoot, i as RootState, n as setRoot, r as CreateRootProps, t as getRoot } from "../index-BLb5EVhG.mjs";
+
+//#region src/field/index.d.ts
+declare namespace index_d_exports {
+  export { CreatePasswordProps, CreateRootProps, ErrorState, InputState, LabelState, PasswordState, PickerState, RootState, ShowState, createError, createInput, createLabel, createPassword, createPicker, createRoot, createShow, getPassword, getRoot, setPassword, setRoot };
+}
+//#endregion
+export { CreatePasswordProps, CreateRootProps, ErrorState, InputState, LabelState, PasswordState, PickerState, RootState, ShowState, createError, createInput, createLabel, createPassword, createPicker, createRoot, createShow, getPassword, getRoot, setPassword, setRoot, index_d_exports as t };

package/dist/field/index.mjs

@@ -0,0 +1,25 @@
+import { t as __exportAll } from "../chunk-D7D4PA-g.mjs";
+import { n as setRoot, t as getRoot } from "../context-D77KIx26.mjs";
+import { createPicker } from "./date/index.mjs";
+import { createError } from "./error/index.mjs";
+import { t as createInput } from "../createInput.svelte-DzcT9u1t.mjs";
+import "./input/index.mjs";
+import { createLabel } from "./label/index.mjs";
+import { createPassword, createShow, getPassword, setPassword } from "./password/index.mjs";
+import { createRoot } from "./root/index.mjs";
+//#region src/field/index.ts
+var field_exports = /* @__PURE__ */ __exportAll({
+	createError: () => createError,
+	createInput: () => createInput,
+	createLabel: () => createLabel,
+	createPassword: () => createPassword,
+	createPicker: () => createPicker,
+	createRoot: () => createRoot,
+	createShow: () => createShow,
+	getPassword: () => getPassword,
+	getRoot: () => getRoot,
+	setPassword: () => setPassword,
+	setRoot: () => setRoot
+});
+//#endregion
+export { createError, createInput, createLabel, createPassword, createPicker, createRoot, createShow, getPassword, getRoot, setPassword, setRoot, field_exports as t };

package/dist/field/input/index.d.mts

@@ -0,0 +1,2 @@
+import { n as createInput, t as InputState } from "../../createInput.svelte-DTz79zNF.mjs";
+export { InputState, createInput };

package/dist/field/input/index.mjs

@@ -0,0 +1,2 @@
+import { t as createInput } from "../../createInput.svelte-DzcT9u1t.mjs";
+export { createInput };

package/dist/field/label/index.d.mts

@@ -0,0 +1,2 @@
+import { n as createLabel, t as LabelState } from "../../index-OI9KlY5x.mjs";
+export { LabelState, createLabel };

package/dist/field/label/index.mjs

@@ -0,0 +1,15 @@
+import { t as getRoot } from "../../context-D77KIx26.mjs";
+//#region src/field/label/createLabel.svelte.ts
+function createLabel() {
+	const root = getRoot();
+	return { props: {
+		get for() {
+			return root.controlId;
+		},
+		get id() {
+			return root.labelId;
+		}
+	} };
+}
+//#endregion
+export { createLabel };

package/dist/field/password/index.d.mts

@@ -0,0 +1,2 @@
+import { a as CreatePasswordProps, i as setPassword, n as createShow, o as PasswordState, r as getPassword, s as createPassword, t as ShowState } from "../../index-Boej-mdy.mjs";
+export { CreatePasswordProps, PasswordState, ShowState, createPassword, createShow, getPassword, setPassword };

package/dist/field/password/index.mjs

@@ -0,0 +1,61 @@
+import { t as getRoot } from "../../context-D77KIx26.mjs";
+import { t as createInput } from "../../createInput.svelte-DzcT9u1t.mjs";
+import { createContext } from "svelte";
+import { mergeProps } from "@svelte-thing/component-utils";
+//#region src/field/password/context.ts
+const [getPassword, setPassword] = createContext();
+//#endregion
+//#region src/field/password/createPassword.svelte.ts
+function createPassword(props) {
+	let isVisible = $derived(props.isVisible ?? false);
+	const password = mergeProps(createInput(), {
+		get isVisible() {
+			return isVisible;
+		},
+		set isVisible(visible) {
+			isVisible = visible;
+		},
+		toggle() {
+			isVisible = !isVisible;
+		},
+		props: { get type() {
+			return isVisible ? "text" : "password";
+		} }
+	});
+	setPassword(password);
+	return password;
+}
+//#endregion
+//#region src/field/password/createShow.svelte.ts
+function createShow() {
+	const root = getRoot();
+	const password = getPassword();
+	return { props: {
+		get disabled() {
+			return root.isDisabled;
+		},
+		get "aria-controls"() {
+			return root.controlId;
+		},
+		get "aria-pressed"() {
+			return password.isVisible;
+		},
+		get "data-disabled"() {
+			return root.isDisabled ? "" : void 0;
+		},
+		get "data-visible"() {
+			return password.isVisible ? "" : void 0;
+		},
+		type: "button",
+		onmousedown(event) {
+			event.preventDefault();
+		},
+		onclick() {
+			if (root.isDisabled) return;
+			password.toggle();
+			document.getElementById(root.controlId)?.focus?.();
+		}
+	} };
+}
+//#endregion
+export { createPassword, createShow, getPassword, setPassword };

package/dist/field/root/index.d.mts

@@ -0,0 +1,2 @@
+import { a as createRoot, i as RootState, n as setRoot, r as CreateRootProps, t as getRoot } from "../../index-BLb5EVhG.mjs";
+export { CreateRootProps, RootState, createRoot, getRoot, setRoot };

package/dist/field/root/index.mjs

@@ -0,0 +1,79 @@
+import { n as setRoot, t as getRoot } from "../../context-D77KIx26.mjs";
+import { uid } from "uid";
+//#region src/field/root/createRoot.svelte.ts
+function createRoot(props) {
+	const id = $derived(props.id ?? uid());
+	const labelId = $derived(`${id}-label`);
+	const controlId = $derived(`${id}-control`);
+	const errorId = $derived(`${id}-error`);
+	let isDirty = $derived(props.isDirty ?? false);
+	let isDisabled = $derived(props.isDisabled ?? false);
+	let isFilled = $derived(props.isFilled ?? false);
+	let isFocused = $derived(props.isFocused ?? false);
+	let isInvalid = $derived(props.isInvalid ?? false);
+	let isTouched = $derived(props.isTouched ?? false);
+	let isValid = $derived(props.isValid ?? false);
+	const root = {
+		get id() {
+			return id;
+		},
+		get labelId() {
+			return labelId;
+		},
+		get controlId() {
+			return controlId;
+		},
+		get errorId() {
+			return errorId;
+		},
+		get isDirty() {
+			return isDirty;
+		},
+		set isDirty(value) {
+			isDirty = value;
+		},
+		get isDisabled() {
+			return isDisabled;
+		},
+		set isDisabled(value) {
+			isDisabled = value;
+		},
+		get isFilled() {
+			return isFilled;
+		},
+		set isFilled(value) {
+			isFilled = value;
+		},
+		get isFocused() {
+			return isFocused;
+		},
+		set isFocused(value) {
+			isFocused = value;
+		},
+		get isInvalid() {
+			return isInvalid;
+		},
+		set isInvalid(value) {
+			isInvalid = value;
+		},
+		get isTouched() {
+			return isTouched;
+		},
+		set isTouched(value) {
+			isTouched = value;
+		},
+		get isValid() {
+			return isValid;
+		},
+		set isValid(value) {
+			isValid = value;
+		},
+		props: { get id() {
+			return id;
+		} }
+	};
+	setRoot(root);
+	return root;
+}
+//#endregion
+export { createRoot, getRoot, setRoot };

package/dist/index-07sbgO0w.d.mts

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from "svelte/elements";
+
+//#region src/tab/indicator/createIndicator.svelte.d.ts
+interface IndicatorState {
+  props: HTMLAttributes<HTMLSpanElement>;
+}
+declare function createIndicator(): IndicatorState;
+//#endregion
+export { createIndicator as n, IndicatorState as t };

package/dist/index-B-PBb_8h.d.mts

@@ -0,0 +1,14 @@
+import { Exact } from "@svelte-thing/type-utils";
+import { HTMLButtonAttributes } from "svelte/elements";
+
+//#region src/tab/trigger/createTrigger.svelte.d.ts
+interface CreateTriggerProps {
+  value: string;
+  disabled: boolean | null | undefined;
+}
+interface TriggerState {
+  props: HTMLButtonAttributes;
+}
+declare function createTrigger<T extends CreateTriggerProps>(props: Exact<CreateTriggerProps, T>): TriggerState;
+//#endregion
+export { TriggerState as n, createTrigger as r, CreateTriggerProps as t };

package/dist/index-BLb5EVhG.d.mts

@@ -0,0 +1,35 @@
+import { Exact } from "@svelte-thing/type-utils";
+
+//#region src/field/root/createRoot.svelte.d.ts
+interface CreateRootProps {
+  id: string | null | undefined;
+  isDirty: boolean | null | undefined;
+  isDisabled: boolean | null | undefined;
+  isFilled: boolean | null | undefined;
+  isFocused: boolean | null | undefined;
+  isInvalid: boolean | null | undefined;
+  isTouched: boolean | null | undefined;
+  isValid: boolean | null | undefined;
+}
+interface RootState {
+  id: string;
+  labelId: string;
+  controlId: string;
+  errorId: string;
+  isDirty: boolean;
+  isDisabled: boolean;
+  isFilled: boolean;
+  isFocused: boolean;
+  isInvalid: boolean;
+  isTouched: boolean;
+  isValid: boolean;
+  props: {
+    id: string;
+  };
+}
+declare function createRoot<T extends CreateRootProps>(props: Exact<CreateRootProps, T>): RootState;
+//#endregion
+//#region src/field/root/context.d.ts
+declare const getRoot: () => RootState, setRoot: (context: RootState) => RootState;
+//#endregion
+export { createRoot as a, RootState as i, setRoot as n, CreateRootProps as r, getRoot as t };

package/dist/index-BVVgDSdq.d.mts

@@ -0,0 +1 @@
+export { };

package/dist/index-Boej-mdy.d.mts

@@ -0,0 +1,25 @@
+import { t as InputState } from "./createInput.svelte-DTz79zNF.mjs";
+import { Exact } from "@svelte-thing/type-utils";
+import { HTMLButtonAttributes } from "svelte/elements";
+
+//#region src/field/password/createPassword.svelte.d.ts
+interface CreatePasswordProps {
+  isVisible: boolean | null | undefined;
+  type: 'password' | null | undefined;
+}
+interface PasswordState extends InputState {
+  isVisible: boolean;
+  toggle: () => void;
+}
+declare function createPassword<T extends CreatePasswordProps>(props: Exact<CreatePasswordProps, T>): PasswordState;
+//#endregion
+//#region src/field/password/context.d.ts
+declare const getPassword: () => PasswordState, setPassword: (context: PasswordState) => PasswordState;
+//#endregion
+//#region src/field/password/createShow.svelte.d.ts
+interface ShowState {
+  props: HTMLButtonAttributes;
+}
+declare function createShow(): ShowState;
+//#endregion
+export { CreatePasswordProps as a, setPassword as i, createShow as n, PasswordState as o, getPassword as r, createPassword as s, ShowState as t };

package/dist/index-C-ME1Tk9.d.mts

@@ -0,0 +1,9 @@
+import { HTMLButtonAttributes } from "svelte/elements";
+
+//#region src/field/date/createPicker.svelte.d.ts
+interface PickerState {
+  props: HTMLButtonAttributes;
+}
+declare function createPicker(): PickerState;
+//#endregion
+export { createPicker as n, PickerState as t };

package/dist/index-CA_POIj_.d.mts

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from "svelte/elements";
+
+//#region src/field/error/createError.svelte.d.ts
+interface ErrorState {
+  props: HTMLAttributes<HTMLElement>;
+}
+declare function createError(): ErrorState;
+//#endregion
+export { createError as n, ErrorState as t };

package/dist/index-CbchmhrC.d.mts

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from "svelte/elements";
+
+//#region src/tab/list/createList.svelte.d.ts
+interface ListState {
+  props: HTMLAttributes<HTMLUListElement>;
+}
+declare function createList(): ListState;
+//#endregion
+export { createList as n, ListState as t };

package/dist/index-D2vzMU8o.d.mts

@@ -0,0 +1,13 @@
+import { Exact } from "@svelte-thing/type-utils";
+import { HTMLAttributes } from "svelte/elements";
+
+//#region src/tab/panel/createPanel.svelte.d.ts
+interface CreatePanelProps {
+  value: string;
+}
+interface PanelState {
+  props: HTMLAttributes<HTMLElement>;
+}
+declare function createPanel<T extends CreatePanelProps>(props: Exact<CreatePanelProps, T>): PanelState;
+//#endregion
+export { PanelState as n, createPanel as r, CreatePanelProps as t };

package/dist/index-DAHEDQQS.d.mts

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from "svelte/elements";
+
+//#region src/tab/title/createTitle.svelte.d.ts
+interface TitleState {
+  props: HTMLAttributes<HTMLHeadingElement>;
+}
+declare function createTitle(): TitleState;
+//#endregion
+export { createTitle as n, TitleState as t };

package/dist/index-OI9KlY5x.d.mts

@@ -0,0 +1,9 @@
+import { HTMLLabelAttributes } from "svelte/elements";
+
+//#region src/field/label/createLabel.svelte.d.ts
+interface LabelState {
+  props: HTMLLabelAttributes;
+}
+declare function createLabel(): LabelState;
+//#endregion
+export { createLabel as n, LabelState as t };

package/dist/index-j-8eH9nJ.d.mts

@@ -0,0 +1,29 @@
+import { Exact } from "@svelte-thing/type-utils";
+import { HTMLAttributes } from "svelte/elements";
+
+//#region src/tab/root/createRoot.svelte.d.ts
+type Direction = 'ltr' | 'rtl';
+type Orientation = 'horizontal' | 'vertical';
+interface CreateRootProps {
+  activateOnFocus: boolean | undefined;
+  direction: Direction | undefined;
+  orientation: Orientation | undefined;
+  value: string | undefined;
+}
+type TValue = string | null;
+interface RootState {
+  activateOnFocus: boolean;
+  direction: Direction;
+  hasTitle: boolean;
+  id: string;
+  orientation: Orientation;
+  panel: TValue;
+  value: TValue;
+  props: HTMLAttributes<HTMLElement>;
+}
+declare function createRoot<T extends CreateRootProps>(props: Exact<CreateRootProps, T>): RootState;
+//#endregion
+//#region src/tab/root/context.d.ts
+declare const getRoot: () => RootState, setRoot: (context: RootState) => RootState;
+//#endregion
+export { Orientation as a, createRoot as c, Direction as i, setRoot as n, RootState as o, CreateRootProps as r, TValue as s, getRoot as t };

package/dist/index.d.mts

@@ -0,0 +1,3 @@
+import { t as index_d_exports } from "./field/index.mjs";
+import { t as index_d_exports$1 } from "./tab/index.mjs";
+export { index_d_exports as Field, index_d_exports$1 as Tab };

package/dist/index.mjs

@@ -0,0 +1,3 @@
+import { t as field_exports } from "./field/index.mjs";
+import { t as tab_exports } from "./tab/index.mjs";
+export { field_exports as Field, tab_exports as Tab };

package/dist/menu/index.d.mts

@@ -0,0 +1,5 @@
+import { CreateItemProps, ItemState, createItem } from "./item/index.mjs";
+import { CreatePopupProps, PopupState, createPopup } from "./popup/index.mjs";
+import { CreateRootProps, Orientation, RootState, createRoot, getRoot, setRoot } from "./root/index.mjs";
+import { CreateTriggerProps, TriggerState, createTrigger } from "./trigger/index.mjs";
+export { CreateItemProps, CreatePopupProps, CreateRootProps, CreateTriggerProps, ItemState, Orientation, PopupState, RootState, TriggerState, createItem, createPopup, createRoot, createTrigger, getRoot, setRoot };

package/dist/menu/index.mjs

@@ -0,0 +1,6 @@
+import { n as setRoot, t as getRoot } from "../context-BJAwVB1S.mjs";
+import { createItem } from "./item/index.mjs";
+import { createPopup } from "./popup/index.mjs";
+import { createRoot } from "./root/index.mjs";
+import { createTrigger } from "./trigger/index.mjs";
+export { createItem, createPopup, createRoot, createTrigger, getRoot, setRoot };

package/dist/menu/item/index.d.mts

@@ -0,0 +1,14 @@
+import { Exact } from "@svelte-thing/type-utils";
+import { HTMLAttributes } from "svelte/elements";
+
+//#region src/menu/item/createItem.svelte.d.ts
+interface CreateItemProps {
+  disabled: boolean | null | undefined;
+  id: string | null | undefined;
+}
+interface ItemState {
+  props: HTMLAttributes<HTMLElement>;
+}
+declare function createItem<T extends CreateItemProps>(props: Exact<CreateItemProps, T>): ItemState;
+//#endregion
+export { CreateItemProps, ItemState, createItem };