@wirekyt/solid 0.0.1 → 0.0.2

package/dist/editable.js

@@ -0,0 +1,171 @@
+import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.js";
+import { a as mergeProps$2, d as createContext$1, i as useMachine, l as createSplitProps, r as normalizeProps } from "./core-7QKBNp9p.js";
+import { t as runIfFn } from "./run-if-fn-CjvD7VzQ.js";
+import { t as wire } from "./factory-D2A7xdtl.js";
+import { a as useLocaleContext, l as useEnvironmentContext } from "./providers-B-Vi5wQ7.js";
+import { h as useFieldContext } from "./field-CQr_Dibp.js";
+import { createMemo, createUniqueId } from "solid-js";
+import { createComponent, mergeProps as mergeProps$1 } from "solid-js/web";
+import * as editable from "@wirekyt/dom/machines/editable";
+import { anatomy as editableAnatomy } from "@wirekyt/dom/machines/editable";
+//#region src/components/editable/use-context.ts
+const [EditableProvider, useEditableContext] = createContext$1({
+	hookName: "useEditableContext",
+	providerName: "<EditableProvider />"
+});
+//#endregion
+//#region src/components/editable/area.tsx
+const EditableArea = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getAreaProps(), props);
+	return createComponent(wire.div, mergedProps);
+};
+//#endregion
+//#region src/components/editable/cancel-trigger.tsx
+const EditableCancelTrigger = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getCancelTriggerProps(), props);
+	return createComponent(wire.button, mergedProps);
+};
+//#endregion
+//#region src/components/editable/context.tsx
+const EditableContext = (props) => props.children(useEditableContext());
+//#endregion
+//#region src/components/editable/control.tsx
+const EditableControl = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getControlProps(), props);
+	return createComponent(wire.div, mergedProps);
+};
+//#endregion
+//#region src/components/editable/edit-trigger.tsx
+const EditableEditTrigger = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getEditTriggerProps(), props);
+	return createComponent(wire.button, mergedProps);
+};
+//#endregion
+//#region src/components/editable/input.tsx
+const EditableInput = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getInputProps(), props);
+	const field = useFieldContext();
+	return createComponent(wire.input, mergeProps$1({ get ["aria-describedby"]() {
+		return field?.().ariaDescribedby;
+	} }, mergedProps));
+};
+//#endregion
+//#region src/components/editable/label.tsx
+const EditableLabel = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getLabelProps(), props);
+	return createComponent(wire.label, mergedProps);
+};
+//#endregion
+//#region src/components/editable/preview.tsx
+const EditablePreview = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getPreviewProps(), props);
+	return createComponent(wire.span, mergedProps);
+};
+//#endregion
+//#region src/components/editable/use.ts
+const useEditable = (props) => {
+	const id = createUniqueId();
+	const locale = useLocaleContext();
+	const environment = useEnvironmentContext();
+	const field = useFieldContext();
+	const machineProps = createMemo(() => ({
+		id,
+		ids: {
+			label: field?.().ids.label,
+			input: field?.().ids.control
+		},
+		dir: locale().dir,
+		disabled: field?.().disabled,
+		invalid: field?.().invalid,
+		readOnly: field?.().readOnly,
+		required: field?.().required,
+		getRootNode: environment().getRootNode,
+		...runIfFn(props)
+	}));
+	const service = useMachine(editable.machine, machineProps);
+	return createMemo(() => editable.connect(service, normalizeProps));
+};
+//#endregion
+//#region src/components/editable/root.tsx
+const EditableRoot = (props) => {
+	const [useEditableProps, localProps] = createSplitProps()(props, [
+		"activationMode",
+		"autoResize",
+		"defaultEdit",
+		"defaultValue",
+		"disabled",
+		"edit",
+		"finalFocusEl",
+		"form",
+		"id",
+		"ids",
+		"invalid",
+		"maxLength",
+		"name",
+		"onEditChange",
+		"onFocusOutside",
+		"onInteractOutside",
+		"onPointerDownOutside",
+		"onValueChange",
+		"onValueCommit",
+		"onValueRevert",
+		"placeholder",
+		"readOnly",
+		"required",
+		"selectOnFocus",
+		"submitMode",
+		"translations",
+		"value"
+	]);
+	const api = useEditable(useEditableProps);
+	const mergedProps = mergeProps$2(() => api().getRootProps(), localProps);
+	return createComponent(EditableProvider, {
+		value: api,
+		get children() {
+			return createComponent(wire.div, mergedProps);
+		}
+	});
+};
+//#endregion
+//#region src/components/editable/root-provider.tsx
+const EditableRootProvider = (props) => {
+	const [{ value: editable }, localProps] = createSplitProps()(props, ["value"]);
+	const mergedProps = mergeProps$2(() => editable().getRootProps(), localProps);
+	return createComponent(EditableProvider, {
+		value: editable,
+		get children() {
+			return createComponent(wire.div, mergedProps);
+		}
+	});
+};
+//#endregion
+//#region src/components/editable/submit-trigger.tsx
+const EditableSubmitTrigger = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$2(() => api().getSubmitTriggerProps(), props);
+	return createComponent(wire.button, mergedProps);
+};
+//#endregion
+//#region src/components/editable/editable.ts
+var editable_exports = /* @__PURE__ */ __exportAll({
+	Area: () => EditableArea,
+	CancelTrigger: () => EditableCancelTrigger,
+	Context: () => EditableContext,
+	Control: () => EditableControl,
+	EditTrigger: () => EditableEditTrigger,
+	Input: () => EditableInput,
+	Label: () => EditableLabel,
+	Preview: () => EditablePreview,
+	Root: () => EditableRoot,
+	RootProvider: () => EditableRootProvider,
+	SubmitTrigger: () => EditableSubmitTrigger
+});
+//#endregion
+export { editable_exports as Editable, EditableArea, EditableCancelTrigger, EditableContext, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableRoot, EditableRootProvider, EditableSubmitTrigger, editableAnatomy, useEditable, useEditableContext };

package/dist/editable.jsx

@@ -0,0 +1,162 @@
+import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.jsx";
+import { a as mergeProps$1, d as createContext$1, i as useMachine, l as createSplitProps, r as normalizeProps } from "./core-7QKBNp9p.jsx";
+import { t as runIfFn } from "./run-if-fn-CjvD7VzQ.jsx";
+import { t as wire } from "./factory-DRw_slzE.jsx";
+import { a as useLocaleContext, l as useEnvironmentContext } from "./providers-CqNHqLpB.jsx";
+import { h as useFieldContext } from "./field-R5jVNdtK.jsx";
+import { createMemo, createUniqueId } from "solid-js";
+import * as editable from "@wirekyt/dom/machines/editable";
+import { anatomy as editableAnatomy } from "@wirekyt/dom/machines/editable";
+//#region src/components/editable/use-context.ts
+const [EditableProvider, useEditableContext] = createContext$1({
+	hookName: "useEditableContext",
+	providerName: "<EditableProvider />"
+});
+//#endregion
+//#region src/components/editable/area.tsx
+const EditableArea = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getAreaProps(), props);
+	return <wire.div {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/cancel-trigger.tsx
+const EditableCancelTrigger = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getCancelTriggerProps(), props);
+	return <wire.button {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/context.tsx
+const EditableContext = (props) => props.children(useEditableContext());
+//#endregion
+//#region src/components/editable/control.tsx
+const EditableControl = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getControlProps(), props);
+	return <wire.div {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/edit-trigger.tsx
+const EditableEditTrigger = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getEditTriggerProps(), props);
+	return <wire.button {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/input.tsx
+const EditableInput = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getInputProps(), props);
+	const field = useFieldContext();
+	return <wire.input aria-describedby={field?.().ariaDescribedby} {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/label.tsx
+const EditableLabel = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getLabelProps(), props);
+	return <wire.label {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/preview.tsx
+const EditablePreview = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getPreviewProps(), props);
+	return <wire.span {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/use.ts
+const useEditable = (props) => {
+	const id = createUniqueId();
+	const locale = useLocaleContext();
+	const environment = useEnvironmentContext();
+	const field = useFieldContext();
+	const machineProps = createMemo(() => ({
+		id,
+		ids: {
+			label: field?.().ids.label,
+			input: field?.().ids.control
+		},
+		dir: locale().dir,
+		disabled: field?.().disabled,
+		invalid: field?.().invalid,
+		readOnly: field?.().readOnly,
+		required: field?.().required,
+		getRootNode: environment().getRootNode,
+		...runIfFn(props)
+	}));
+	const service = useMachine(editable.machine, machineProps);
+	return createMemo(() => editable.connect(service, normalizeProps));
+};
+//#endregion
+//#region src/components/editable/root.tsx
+const EditableRoot = (props) => {
+	const [useEditableProps, localProps] = createSplitProps()(props, [
+		"activationMode",
+		"autoResize",
+		"defaultEdit",
+		"defaultValue",
+		"disabled",
+		"edit",
+		"finalFocusEl",
+		"form",
+		"id",
+		"ids",
+		"invalid",
+		"maxLength",
+		"name",
+		"onEditChange",
+		"onFocusOutside",
+		"onInteractOutside",
+		"onPointerDownOutside",
+		"onValueChange",
+		"onValueCommit",
+		"onValueRevert",
+		"placeholder",
+		"readOnly",
+		"required",
+		"selectOnFocus",
+		"submitMode",
+		"translations",
+		"value"
+	]);
+	const api = useEditable(useEditableProps);
+	const mergedProps = mergeProps$1(() => api().getRootProps(), localProps);
+	return <EditableProvider value={api}>
+      <wire.div {...mergedProps} />
+    </EditableProvider>;
+};
+//#endregion
+//#region src/components/editable/root-provider.tsx
+const EditableRootProvider = (props) => {
+	const [{ value: editable }, localProps] = createSplitProps()(props, ["value"]);
+	const mergedProps = mergeProps$1(() => editable().getRootProps(), localProps);
+	return <EditableProvider value={editable}>
+      <wire.div {...mergedProps} />
+    </EditableProvider>;
+};
+//#endregion
+//#region src/components/editable/submit-trigger.tsx
+const EditableSubmitTrigger = (props) => {
+	const api = useEditableContext();
+	const mergedProps = mergeProps$1(() => api().getSubmitTriggerProps(), props);
+	return <wire.button {...mergedProps} />;
+};
+//#endregion
+//#region src/components/editable/editable.ts
+var editable_exports = /* @__PURE__ */ __exportAll({
+	Area: () => EditableArea,
+	CancelTrigger: () => EditableCancelTrigger,
+	Context: () => EditableContext,
+	Control: () => EditableControl,
+	EditTrigger: () => EditableEditTrigger,
+	Input: () => EditableInput,
+	Label: () => EditableLabel,
+	Preview: () => EditablePreview,
+	Root: () => EditableRoot,
+	RootProvider: () => EditableRootProvider,
+	SubmitTrigger: () => EditableSubmitTrigger
+});
+//#endregion
+export { editable_exports as Editable, EditableArea, EditableCancelTrigger, EditableContext, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableRoot, EditableRootProvider, EditableSubmitTrigger, editableAnatomy, useEditable, useEditableContext };

package/dist/factory-D2A7xdtl.js

@@ -0,0 +1,34 @@
+import { a as mergeProps$2 } from "./core-7QKBNp9p.js";
+import { splitProps } from "solid-js";
+import { Dynamic, createComponent, mergeProps as mergeProps$1 } from "solid-js/web";
+//#region src/components/factory.tsx
+const withAsProp = (Component) => {
+	const WireComponent = (props) => {
+		const [localProps, parentProps] = splitProps(props, ["asChild"]);
+		if (localProps.asChild) {
+			const propsFn = (userProps) => {
+				const [, restProps] = splitProps(parentProps, ["ref"]);
+				return mergeProps$2(restProps, userProps);
+			};
+			return localProps.asChild(propsFn);
+		}
+		return createComponent(Dynamic, mergeProps$1({ component: Component }, parentProps));
+	};
+	return WireComponent;
+};
+function jsxFactory() {
+	const cache = /* @__PURE__ */ new Map();
+	return new Proxy(withAsProp, {
+		apply(_target, _thisArg, argArray) {
+			return withAsProp(argArray[0]);
+		},
+		get(_, element) {
+			const asElement = element;
+			if (!cache.has(asElement)) cache.set(asElement, withAsProp(asElement));
+			return cache.get(asElement);
+		}
+	});
+}
+const wire = jsxFactory();
+//#endregion
+export { wire as t };

package/dist/factory-DRw_slzE.jsx

@@ -0,0 +1,34 @@
+import { a as mergeProps$1 } from "./core-7QKBNp9p.jsx";
+import { splitProps } from "solid-js";
+import { Dynamic } from "solid-js/web";
+//#region src/components/factory.tsx
+const withAsProp = (Component) => {
+	const WireComponent = (props) => {
+		const [localProps, parentProps] = splitProps(props, ["asChild"]);
+		if (localProps.asChild) {
+			const propsFn = (userProps) => {
+				const [, restProps] = splitProps(parentProps, ["ref"]);
+				return mergeProps$1(restProps, userProps);
+			};
+			return localProps.asChild(propsFn);
+		}
+		return <Dynamic component={Component} {...parentProps} />;
+	};
+	return WireComponent;
+};
+function jsxFactory() {
+	const cache = /* @__PURE__ */ new Map();
+	return new Proxy(withAsProp, {
+		apply(_target, _thisArg, argArray) {
+			return withAsProp(argArray[0]);
+		},
+		get(_, element) {
+			const asElement = element;
+			if (!cache.has(asElement)) cache.set(asElement, withAsProp(asElement));
+			return cache.get(asElement);
+		}
+	});
+}
+const wire = jsxFactory();
+//#endregion
+export { wire as t };

package/dist/factory-wuwfJqbU.d.ts

@@ -0,0 +1,15 @@
+import { n as Assign } from "./index-ClU-Lb8Z.js";
+import { ComponentProps, JSX } from "solid-js";
+//#region src/components/factory.d.ts
+type ElementType = keyof JSX.IntrinsicElements;
+type JsxElements = { [E in ElementType]: WireComponent<E>; };
+type ParentProps$1<T extends ElementType> = (userProps?: JSX.IntrinsicElements[T]) => JSX.HTMLAttributes<any>;
+type PolymorphicProps<T extends ElementType> = {
+  asChild?: (props: ParentProps$1<T>) => JSX.Element;
+};
+type HTMLProps<E extends ElementType> = JSX.IntrinsicElements[E];
+type HTMLWireProps<E extends ElementType> = Assign<ComponentProps<E>, PolymorphicProps<E>>;
+type WireComponent<E extends ElementType> = (props: HTMLWireProps<E>) => JSX.Element;
+declare const wire: JsxElements;
+//#endregion
+export { wire as i, HTMLWireProps as n, PolymorphicProps as r, HTMLProps as t };