@moduix/react 1.1.0

package/dist/components/empty/Empty.js

@@ -0,0 +1,77 @@
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import Empty_module_default from "./Empty.module.js";
+import { jsx } from "react/jsx-runtime";
+import { ark } from "@ark-ui/react/factory";
+import { clsx } from "clsx";
+import { forwardRef } from "react";
+//#region src/components/empty/Empty.tsx
+const EmptyRoot = forwardRef(function EmptyRoot({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ark.div, {
+		ref,
+		"data-scope": "empty",
+		"data-part": "root",
+		"data-slot": "empty-root",
+		className: clsx(Empty_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+const EmptyIcon = forwardRef(function EmptyIcon({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ark.div, {
+		ref,
+		"data-scope": "empty",
+		"data-part": "icon",
+		"data-slot": "empty-icon",
+		className: clsx(Empty_module_default.icon, normalizeClassName(className)),
+		...props
+	});
+});
+const EmptyContent = forwardRef(function EmptyContent({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ark.div, {
+		ref,
+		"data-scope": "empty",
+		"data-part": "content",
+		"data-slot": "empty-content",
+		className: clsx(Empty_module_default.content, normalizeClassName(className)),
+		...props
+	});
+});
+const EmptyTitle = forwardRef(function EmptyTitle({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ark.h3, {
+		ref,
+		"data-scope": "empty",
+		"data-part": "title",
+		"data-slot": "empty-title",
+		className: clsx(Empty_module_default.title, normalizeClassName(className)),
+		...props
+	});
+});
+const EmptyDescription = forwardRef(function EmptyDescription({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ark.div, {
+		ref,
+		"data-scope": "empty",
+		"data-part": "description",
+		"data-slot": "empty-description",
+		className: clsx(Empty_module_default.description, normalizeClassName(className)),
+		...props
+	});
+});
+const EmptyActions = forwardRef(function EmptyActions({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(ark.div, {
+		ref,
+		"data-scope": "empty",
+		"data-part": "actions",
+		"data-slot": "empty-actions",
+		className: clsx(Empty_module_default.actions, normalizeClassName(className)),
+		...props
+	});
+});
+const Empty = Object.assign(EmptyRoot, {
+	Root: EmptyRoot,
+	Icon: EmptyIcon,
+	Content: EmptyContent,
+	Title: EmptyTitle,
+	Description: EmptyDescription,
+	Actions: EmptyActions
+});
+//#endregion
+export { Empty };

package/dist/components/empty/Empty.module.js

@@ -0,0 +1,12 @@
+import './Empty.css';
+//#region src/components/empty/Empty.module.css
+var Empty_module_default = {
+	"actions": "uHDs1G_actions",
+	"content": "uHDs1G_content",
+	"description": "uHDs1G_description",
+	"icon": "uHDs1G_icon",
+	"root": "uHDs1G_root",
+	"title": "uHDs1G_title"
+};
+//#endregion
+export { Empty_module_default as default };

package/dist/components/field/Field.css

@@ -0,0 +1,113 @@
+@layer ui.components {
+  .IJRJYG_root {
+    box-sizing: border-box;
+    align-items: flex-start;
+    gap: var(--field-gap, var(--spacing-1));
+    width: var(--field-width, 100%);
+    max-width: var(--field-max-width, none);
+    color: var(--field-color, var(--color-foreground));
+    flex-direction: column;
+    display: flex;
+
+    &[data-disabled] {
+      opacity: var(--field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .IJRJYG_item {
+    gap: var(--field-item-gap, var(--spacing-1));
+    display: grid;
+  }
+
+  .IJRJYG_label {
+    align-items: center;
+    gap: var(--field-label-gap, var(--spacing-2));
+    color: var(--field-label-color, var(--color-foreground));
+    font-size: var(--field-label-font-size, var(--text-sm));
+    font-weight: var(--field-label-font-weight, var(--weight-medium));
+    line-height: var(--field-label-line-height, var(--line-height-text-sm));
+    display: inline-flex;
+
+    &[data-disabled] {
+      opacity: var(--field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .IJRJYG_helperText {
+    color: var(--field-description-color, var(--color-muted-foreground));
+    font-size: var(--field-description-font-size, var(--text-sm));
+    line-height: var(--field-description-line-height, var(--line-height-text-sm));
+    margin: 0;
+
+    &[data-disabled] {
+      opacity: var(--field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .IJRJYG_control {
+    box-sizing: border-box;
+    width: var(--field-control-width, 100%);
+    min-height: var(--field-control-height, var(--size-lg));
+    border: var(--field-control-border-width, var(--border-width-sm))
+      var(--field-control-border-style, solid)
+      var(--field-control-border-color, var(--color-border));
+    border-radius: var(--field-control-radius, var(--radius-md));
+    padding: var(--field-control-padding-y, .5rem) var(--field-control-padding-x, .875rem);
+    background-color: var(--field-control-bg, var(--color-background));
+    color: var(--field-control-color, var(--color-foreground));
+    font: inherit;
+    font-size: var(--field-control-font-size, var(--text-md));
+    line-height: var(--field-control-line-height, var(--line-height-text-md));
+    outline: var(--field-focus-ring-width, var(--border-width-sm)) solid transparent;
+    outline-offset: var(--field-focus-ring-offset, -1px);
+    transition: border-color var(--field-control-transition, var(--transition-default)),
+      outline-color var(--field-control-transition, var(--transition-default)),
+      opacity var(--field-control-transition, var(--transition-default));
+    margin: 0;
+
+    &::placeholder {
+      color: var(--field-control-placeholder-color, var(--color-muted-foreground));
+    }
+
+    &:focus-visible {
+      outline-color: var(--field-focus-ring-color, var(--color-ring));
+    }
+
+    &[data-invalid] {
+      border-color: var(--field-control-border-color-invalid, var(--color-destructive));
+
+      &:focus-visible {
+        outline-color: var(--field-control-border-color-invalid, var(--color-destructive));
+      }
+    }
+
+    &[data-disabled], &:disabled {
+      pointer-events: none;
+      opacity: var(--field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .IJRJYG_textarea {
+    min-height: var(--field-textarea-min-height, 5rem);
+    resize: vertical;
+  }
+
+  .IJRJYG_select {
+    appearance: none;
+  }
+
+  .IJRJYG_errorText {
+    color: var(--field-error-color, var(--color-destructive));
+    font-size: var(--field-error-font-size, var(--text-sm));
+    line-height: var(--field-error-line-height, var(--line-height-text-sm));
+    margin: 0;
+
+    &[data-disabled] {
+      opacity: var(--field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .IJRJYG_requiredIndicator {
+    color: var(--field-required-indicator-color, var(--color-destructive));
+  }
+}

package/dist/components/field/Field.d.ts

@@ -0,0 +1,25 @@
+import { ComponentProps } from "react";
+import { Field } from "@ark-ui/react/field";
+
+//#region src/components/field/Field.d.ts
+type FieldItemProps = ComponentProps<'div'> & ComponentProps<typeof Field.Item>;
+declare function FieldItem({
+  className,
+  children,
+  value,
+  ...props
+}: FieldItemProps): import("react").JSX.Element;
+declare const Field$1: import("react").ForwardRefExoticComponent<Omit<Field.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+  Root: import("react").ForwardRefExoticComponent<Omit<Field.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  RootProvider: import("react").ForwardRefExoticComponent<Omit<Field.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Item: typeof FieldItem;
+  Label: import("react").ForwardRefExoticComponent<Omit<Field.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+  Input: import("react").ForwardRefExoticComponent<Omit<Field.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+  Textarea: import("react").ForwardRefExoticComponent<Omit<Field.TextareaProps & import("react").RefAttributes<HTMLTextAreaElement>, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;
+  Select: import("react").ForwardRefExoticComponent<Omit<Field.SelectProps & import("react").RefAttributes<HTMLSelectElement>, "ref"> & import("react").RefAttributes<HTMLSelectElement>>;
+  HelperText: import("react").ForwardRefExoticComponent<Omit<Field.HelperTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+  ErrorText: import("react").ForwardRefExoticComponent<Omit<Field.ErrorTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+  RequiredIndicator: import("react").ForwardRefExoticComponent<Omit<Field.RequiredIndicatorProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+};
+//#endregion
+export { Field$1 as Field };

package/dist/components/field/Field.js

@@ -0,0 +1,104 @@
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import Field_module_default from "./Field.module.js";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { forwardRef } from "react";
+import { Field } from "@ark-ui/react/field";
+//#region src/components/field/Field.tsx
+const FieldRoot = forwardRef(function FieldRoot({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.Root, {
+		ref,
+		"data-slot": "field-root",
+		className: clsx(Field_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldRootProvider = forwardRef(function FieldRootProvider({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.RootProvider, {
+		ref,
+		"data-slot": "field-root-provider",
+		className: clsx(Field_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+function FieldItem({ className, children, value, ...props }) {
+	return /* @__PURE__ */ jsx(Field.Item, {
+		value,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "field-item",
+			className: clsx(Field_module_default.item, normalizeClassName(className)),
+			...props,
+			children
+		})
+	});
+}
+const FieldLabel = forwardRef(function FieldLabel({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.Label, {
+		ref,
+		"data-slot": "field-label",
+		className: clsx(Field_module_default.label, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldInput = forwardRef(function FieldInput({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.Input, {
+		ref,
+		"data-slot": "field-input",
+		className: clsx(Field_module_default.control, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldTextarea = forwardRef(function FieldTextarea({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.Textarea, {
+		ref,
+		"data-slot": "field-textarea",
+		className: clsx(Field_module_default.control, Field_module_default.textarea, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldSelect = forwardRef(function FieldSelect({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.Select, {
+		ref,
+		"data-slot": "field-select",
+		className: clsx(Field_module_default.control, Field_module_default.select, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldHelperText = forwardRef(function FieldHelperText({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.HelperText, {
+		ref,
+		"data-slot": "field-helper-text",
+		className: clsx(Field_module_default.helperText, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldErrorText = forwardRef(function FieldErrorText({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.ErrorText, {
+		ref,
+		"data-slot": "field-error-text",
+		className: clsx(Field_module_default.errorText, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldRequiredIndicator = forwardRef(function FieldRequiredIndicator({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Field.RequiredIndicator, {
+		ref,
+		"data-slot": "field-required-indicator",
+		className: clsx(Field_module_default.requiredIndicator, normalizeClassName(className)),
+		...props
+	});
+});
+const Field$1 = Object.assign(FieldRoot, {
+	Root: FieldRoot,
+	RootProvider: FieldRootProvider,
+	Item: FieldItem,
+	Label: FieldLabel,
+	Input: FieldInput,
+	Textarea: FieldTextarea,
+	Select: FieldSelect,
+	HelperText: FieldHelperText,
+	ErrorText: FieldErrorText,
+	RequiredIndicator: FieldRequiredIndicator
+});
+//#endregion
+export { Field$1 as Field };

package/dist/components/field/Field.module.js

@@ -0,0 +1,15 @@
+import './Field.css';
+//#region src/components/field/Field.module.css
+var Field_module_default = {
+	"control": "IJRJYG_control",
+	"errorText": "IJRJYG_errorText",
+	"helperText": "IJRJYG_helperText",
+	"item": "IJRJYG_item",
+	"label": "IJRJYG_label",
+	"requiredIndicator": "IJRJYG_requiredIndicator",
+	"root": "IJRJYG_root",
+	"select": "IJRJYG_select",
+	"textarea": "IJRJYG_textarea"
+};
+//#endregion
+export { Field_module_default as default };

package/dist/components/field/index.d.ts

@@ -0,0 +1,2 @@
+import { Field } from "./Field.js";
+export { Field };

package/dist/components/fieldset/Fieldset.css

@@ -0,0 +1,52 @@
+@layer ui.components {
+  .JruAma_root, .JruAma_legend, .JruAma_helperText, .JruAma_errorText {
+    box-sizing: border-box;
+  }
+
+  .JruAma_root {
+    gap: var(--fieldset-gap, var(--spacing-4));
+    width: var(--fieldset-width, 100%);
+    max-width: var(--fieldset-max-width, none);
+    margin: var(--fieldset-margin, 0);
+    padding: var(--fieldset-padding, 0);
+    border-width: var(--fieldset-border-width, 0);
+    border-style: var(--fieldset-border-style, solid);
+    border-color: var(--fieldset-border-color, transparent);
+    border-radius: var(--fieldset-radius, var(--radius-none));
+    flex-direction: column;
+    min-inline-size: 0;
+    display: flex;
+
+    &[data-disabled] {
+      opacity: var(--fieldset-disabled-opacity, var(--opacity-disabled));
+    }
+
+    &[data-invalid] {
+      border-color: var(--fieldset-border-color-invalid, var(--color-destructive));
+    }
+  }
+
+  .JruAma_legend {
+    max-inline-size: 100%;
+    margin: var(--fieldset-legend-margin, 0);
+    padding: var(--fieldset-legend-padding, 0 0 var(--spacing-3));
+    color: var(--fieldset-legend-color, var(--color-foreground));
+    font-size: var(--fieldset-legend-font-size, var(--text-lg));
+    font-weight: var(--fieldset-legend-font-weight, var(--weight-semibold));
+    line-height: var(--fieldset-legend-line-height, var(--line-height-text-lg));
+    display: inline-block;
+  }
+
+  .JruAma_helperText, .JruAma_errorText {
+    font-size: var(--fieldset-message-font-size, var(--text-sm));
+    line-height: var(--fieldset-message-line-height, var(--line-height-text-sm));
+  }
+
+  .JruAma_helperText {
+    color: var(--fieldset-helper-text-color, var(--color-muted-foreground));
+  }
+
+  .JruAma_errorText {
+    color: var(--fieldset-error-text-color, var(--color-destructive));
+  }
+}

package/dist/components/fieldset/Fieldset.d.ts

@@ -0,0 +1,12 @@
+import { Fieldset } from "@ark-ui/react/fieldset";
+
+//#region src/components/fieldset/Fieldset.d.ts
+declare const Fieldset$1: import("react").ForwardRefExoticComponent<Omit<Fieldset.RootProps & import("react").RefAttributes<HTMLFieldSetElement>, "ref"> & import("react").RefAttributes<HTMLFieldSetElement>> & {
+  Root: import("react").ForwardRefExoticComponent<Omit<Fieldset.RootProps & import("react").RefAttributes<HTMLFieldSetElement>, "ref"> & import("react").RefAttributes<HTMLFieldSetElement>>;
+  RootProvider: import("react").ForwardRefExoticComponent<Omit<Fieldset.RootProviderProps & import("react").RefAttributes<HTMLFieldSetElement>, "ref"> & import("react").RefAttributes<HTMLFieldSetElement>>;
+  Legend: import("react").ForwardRefExoticComponent<Omit<Fieldset.LegendProps & import("react").RefAttributes<HTMLLegendElement>, "ref"> & import("react").RefAttributes<HTMLLegendElement>>;
+  HelperText: import("react").ForwardRefExoticComponent<Omit<Fieldset.HelperTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+  ErrorText: import("react").ForwardRefExoticComponent<Omit<Fieldset.ErrorTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+};
+//#endregion
+export { Fieldset$1 as Fieldset };

package/dist/components/fieldset/Fieldset.js

@@ -0,0 +1,56 @@
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import Fieldset_module_default from "./Fieldset.module.js";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { forwardRef } from "react";
+import { Fieldset } from "@ark-ui/react/fieldset";
+//#region src/components/fieldset/Fieldset.tsx
+const FieldsetRoot = forwardRef(function FieldsetRoot({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Fieldset.Root, {
+		ref,
+		"data-slot": "fieldset-root",
+		className: clsx(Fieldset_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldsetRootProvider = forwardRef(function FieldsetRootProvider({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Fieldset.RootProvider, {
+		ref,
+		"data-slot": "fieldset-root-provider",
+		className: clsx(Fieldset_module_default.root, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldsetLegend = forwardRef(function FieldsetLegend({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Fieldset.Legend, {
+		ref,
+		"data-slot": "fieldset-legend",
+		className: clsx(Fieldset_module_default.legend, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldsetHelperText = forwardRef(function FieldsetHelperText({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Fieldset.HelperText, {
+		ref,
+		"data-slot": "fieldset-helper-text",
+		className: clsx(Fieldset_module_default.helperText, normalizeClassName(className)),
+		...props
+	});
+});
+const FieldsetErrorText = forwardRef(function FieldsetErrorText({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Fieldset.ErrorText, {
+		ref,
+		"data-slot": "fieldset-error-text",
+		className: clsx(Fieldset_module_default.errorText, normalizeClassName(className)),
+		...props
+	});
+});
+const Fieldset$1 = Object.assign(FieldsetRoot, {
+	Root: FieldsetRoot,
+	RootProvider: FieldsetRootProvider,
+	Legend: FieldsetLegend,
+	HelperText: FieldsetHelperText,
+	ErrorText: FieldsetErrorText
+});
+//#endregion
+export { Fieldset$1 as Fieldset };

package/dist/components/fieldset/Fieldset.module.js

@@ -0,0 +1,10 @@
+import './Fieldset.css';
+//#region src/components/fieldset/Fieldset.module.css
+var Fieldset_module_default = {
+	"errorText": "JruAma_errorText",
+	"helperText": "JruAma_helperText",
+	"legend": "JruAma_legend",
+	"root": "JruAma_root"
+};
+//#endregion
+export { Fieldset_module_default as default };

package/dist/components/fieldset/index.d.ts

@@ -0,0 +1,2 @@
+import { Fieldset } from "./Fieldset.js";
+export { Fieldset };