@koobiq/react-components 0.11.0 → 0.12.0

package/dist/components/Form/components/FormGroup/FormGroup.js

@@ -0,0 +1,9 @@
+import { jsx } from "react/jsx-runtime";
+import { polymorphicForwardRef, clsx } from "@koobiq/react-core";
+import s from "../../Form.module.css.js";
+const FormGroup = polymorphicForwardRef(
+  ({ className, as: Tag = "div", ...other }, ref) => /* @__PURE__ */ jsx(Tag, { className: clsx(s.group, className), ...other, ref })
+);
+export {
+  FormGroup
+};

package/dist/components/Form/components/FormGroup/index.d.ts

@@ -0,0 +1 @@
+export * from './FormGroup';

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

@@ -0,0 +1,3 @@
+export * from './FormActions';
+export * from './FormGroup';
+export * from './FormCaption';

package/dist/components/Form/types.d.ts

@@ -1,22 +1,26 @@
 import type { ComponentRef } from 'react';
 import type { FormProps as FormPropsPrimitive } from '@koobiq/react-primitives';
 import type { ResponsiveValue } from '../../utils';
-import type { FormControlPropLabelAlign, FormControlPropLabelPlacement } from '../FormControl';
+import type { FormFieldPropLabelAlign, FormFieldPropLabelPlacement } from '../FormField';
 export declare const formPropLabelInlineSize: readonly ["80", "128", "160", "200", "240", "280", "320", "360", "400", "1/4", "2/5", "1/2", "max-content"];
 export type FormPropLabelInlineSize = (typeof formPropLabelInlineSize)[number];
 export type FormProps = {
+    /** Whether the Form elements are disabled. */
+    isDisabled?: boolean;
+    /** Whether the Form elements can be selected but not changed by the user. */
+    isReadOnly?: boolean;
     /**
      * The label's overall position relative to the element it is labeling.
      * Responsive values allowed.
      * @default 'top'
      */
-    labelPlacement?: FormControlPropLabelPlacement | ResponsiveValue<FormControlPropLabelPlacement>;
+    labelPlacement?: FormFieldPropLabelPlacement | ResponsiveValue<FormFieldPropLabelPlacement>;
     /**
      * The label's horizontal alignment relative to the element it is labeling.
      * Responsive values allowed.
      * @default 'start'
      */
-    labelAlign?: FormControlPropLabelAlign | ResponsiveValue<FormControlPropLabelAlign>;
+    labelAlign?: FormFieldPropLabelAlign | ResponsiveValue<FormFieldPropLabelAlign>;
     /**
      * Size of the label column when `labelPlacement="side"`.
      * Ignored for `"top"`.

package/dist/components/Form/utils.js

@@ -1,17 +1,17 @@
 const templatePresets = {
   "max-content": void 0,
-  "1/4": "1fr 3fr",
-  "2/5": "2fr 3fr",
-  "1/2": "1fr 1fr",
-  "80": "80px 1fr",
-  "128": "128px 1fr",
-  "160": "160px 1fr",
-  "200": "200px 1fr",
-  "240": "240px 1fr",
-  "280": "280px 1fr",
-  "320": "320px 1fr",
-  "360": "360px 1fr",
-  "400": "400px 1fr"
+  "1/4": "25%",
+  "2/5": "40%",
+  "1/2": "50%",
+  "80": "80px",
+  "128": "128px",
+  "160": "160px",
+  "200": "200px",
+  "240": "240px",
+  "280": "280px",
+  "320": "320px",
+  "360": "360px",
+  "400": "400px"
 };
 export {
   templatePresets

package/dist/components/FormField/FormField.d.ts

@@ -0,0 +1,22 @@
+import type { ComponentPropsWithRef, ElementType } from 'react';
+import { FormFieldCaption } from './FormFieldCaption';
+import { FormFieldControlGroup } from './FormFieldControlGroup';
+import { FormFieldError } from './FormFieldError';
+import { FormFieldInput } from './FormFieldInput';
+import { FormFieldInputDate } from './FormFieldInputDate';
+import { FormFieldLabel } from './FormFieldLabel';
+import { FormFieldSelect } from './FormFieldSelect';
+import type { FormFieldBaseProps } from './types';
+export declare const FormFieldComponent: import("@koobiq/react-core").PolyForwardComponent<"div", FormFieldBaseProps, ElementType>;
+type CompoundedComponent = typeof FormFieldComponent & {
+    Label: typeof FormFieldLabel;
+    Error: typeof FormFieldError;
+    Caption: typeof FormFieldCaption;
+    ControlGroup: typeof FormFieldControlGroup;
+    Input: typeof FormFieldInput;
+    InputDate: typeof FormFieldInputDate;
+    Select: typeof FormFieldSelect;
+};
+export declare const FormField: CompoundedComponent;
+export type FormFieldProps<As extends ElementType = 'div'> = ComponentPropsWithRef<typeof FormField<As>>;
+export {};

package/dist/components/FormField/FormField.js

@@ -0,0 +1,55 @@
+import { jsx } from "react/jsx-runtime";
+import { polymorphicForwardRef, clsx } from "@koobiq/react-core";
+import s from "./FormField.module.css.js";
+import { useForm } from "../Form/FormContext.js";
+import { FormFieldLabel } from "./FormFieldLabel/FormFieldLabel.js";
+import { FormFieldError } from "./FormFieldError/FormFieldError.js";
+import { FormFieldCaption } from "./FormFieldCaption/FormFieldCaption.js";
+import { FormFieldControlGroup } from "./FormFieldControlGroup/FormFieldControlGroup.js";
+import { FormFieldInput } from "./FormFieldInput/FormFieldInput.js";
+import { FormFieldInputDate } from "./FormFieldInputDate/FormFieldInputDate.js";
+import { FormFieldSelect } from "./FormFieldSelect/FormFieldSelect.js";
+const FormFieldComponent = polymorphicForwardRef((props, ref) => {
+  const {
+    as: Tag = "div",
+    fullWidth,
+    className,
+    labelAlign: labelAlignProp,
+    labelPlacement: labelPlacementProp,
+    ...other
+  } = props;
+  const { labelPlacement: formLabelPlacement, labelAlign: formLabelAlign } = useForm();
+  const labelPlacement = labelPlacementProp ?? formLabelPlacement ?? "top";
+  const labelAlign = labelAlignProp ?? formLabelAlign ?? "start";
+  return /* @__PURE__ */ jsx(
+    Tag,
+    {
+      className: clsx(
+        s.base,
+        className,
+        s[labelAlign],
+        s[labelPlacement],
+        fullWidth && s.fullWidth
+      ),
+      "data-slot": "form-field",
+      "data-label-align": labelAlign,
+      "data-label-placement": labelPlacement,
+      "data-fullwidth": fullWidth || void 0,
+      ...other,
+      ref
+    }
+  );
+});
+const FormField = FormFieldComponent;
+FormField.Label = FormFieldLabel;
+FormField.Error = FormFieldError;
+FormField.Caption = FormFieldCaption;
+FormField.ControlGroup = FormFieldControlGroup;
+FormField.Input = FormFieldInput;
+FormField.InputDate = FormFieldInputDate;
+FormField.Select = FormFieldSelect;
+FormField.displayName = "FormField";
+export {
+  FormField,
+  FormFieldComponent
+};

package/dist/components/FormField/FormField.module.css.js

@@ -0,0 +1,17 @@
+const base = "kbq-formfield-b52e32";
+const fullWidth = "kbq-formfield-fullWidth-8515a1";
+const top = "kbq-formfield-top-f0a5c0";
+const side = "kbq-formfield-side-9d854f";
+const s = {
+  base,
+  fullWidth,
+  top,
+  side
+};
+export {
+  base,
+  s as default,
+  fullWidth,
+  side,
+  top
+};

package/dist/components/FormField/FormFieldAddon/FormFieldAddon.d.ts

@@ -0,0 +1,10 @@
+import type { ComponentRef, ReactNode } from 'react';
+import type { ExtendableComponentPropsWithRef } from '@koobiq/react-core';
+export declare const formFieldAddonPropPlacement: readonly ["start", "end"];
+export type FormFieldAddonPlacement = (typeof formFieldAddonPropPlacement)[number];
+export type FormFieldAddonProps = ExtendableComponentPropsWithRef<{
+    children?: ReactNode;
+    placement?: FormFieldAddonPlacement;
+}, 'div'>;
+export type FormFieldAddonRef = ComponentRef<'div'>;
+export declare const FormFieldAddon: import("react").ForwardRefExoticComponent<Omit<FormFieldAddonProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/{FieldComponents/FieldAddon/FieldAddon.js → FormField/FormFieldAddon/FormFieldAddon.js}

@@ -1,16 +1,11 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { isNotNil, clsx } from "@koobiq/react-core";
-import s from "./FieldAddon.module.css.js";
-const FieldAddon = forwardRef(
-  ({
-    placement = "start",
-    isInvalid,
-    isDisabled,
-    className,
-    children,
-    ...other
-  }, ref) => isNotNil(children) ? /* @__PURE__ */ jsx(
+import s from "./FormFieldAddon.module.css.js";
+import { useFormFieldControlGroup } from "../FormFieldControlGroup/FormFieldControlGroupContext.js";
+const FormFieldAddon = forwardRef(({ placement = "start", className, children, ...other }, ref) => {
+  const { isInvalid, isDisabled } = useFormFieldControlGroup();
+  return isNotNil(children) ? /* @__PURE__ */ jsx(
     "div",
     {
       className: clsx(
@@ -28,9 +23,9 @@ const FieldAddon = forwardRef(
       ref,
       children
     }
-  ) : null
-);
-FieldAddon.displayName = "FieldAddon";
+  ) : null;
+});
+FormFieldAddon.displayName = "FormFieldAddon";
 export {
-  FieldAddon
+  FormFieldAddon
 };

package/dist/components/FormField/FormFieldAddon/FormFieldAddon.module.css.js

@@ -0,0 +1,20 @@
+const base = "kbq-formfieldaddon-3e3223";
+const invalid = "kbq-formfieldaddon-invalid-6f8de4";
+const disabled = "kbq-formfieldaddon-disabled-d4ab91";
+const start = "kbq-formfieldaddon-start-a88be1";
+const end = "kbq-formfieldaddon-end-fb2bf3";
+const s = {
+  base,
+  invalid,
+  disabled,
+  start,
+  end
+};
+export {
+  base,
+  s as default,
+  disabled,
+  end,
+  invalid,
+  start
+};

package/dist/components/FormField/FormFieldAddon/index.d.ts

@@ -0,0 +1 @@
+export * from './FormFieldAddon';

package/dist/components/{FieldComponents/FieldCaption/FieldCaption.d.ts → FormField/FormFieldCaption/FormFieldCaption.d.ts}

@@ -1,7 +1,7 @@
 import { type TextProps, type TextRef } from '@koobiq/react-primitives';
-export type FieldCaptionProps = TextProps;
-export type FieldCaptionRef = TextRef;
-export declare const FieldCaption: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+export type FormFieldCaptionProps = TextProps;
+export type FormFieldCaptionRef = TextRef;
+export declare const FormFieldCaption: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
     ref?: ((instance: HTMLParagraphElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLParagraphElement> | null | undefined;
 }, "as" | keyof import("@koobiq/react-primitives").TextBaseProps> & import("@koobiq/react-primitives").TextBaseProps & {
     as?: "p" | undefined;

package/dist/components/{FieldComponents/FieldCaption/FieldCaption.js → FormField/FormFieldCaption/FormFieldCaption.js}

@@ -2,8 +2,8 @@ import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { isNotNil, clsx } from "@koobiq/react-core";
 import { Text } from "@koobiq/react-primitives";
-import s from "./FieldCaption.module.css.js";
-const FieldCaption = forwardRef(
+import s from "./FormFieldCaption.module.css.js";
+const FormFieldCaption = forwardRef(
   ({ children, className, ...other }, ref) => isNotNil(children) ? /* @__PURE__ */ jsx(
     Text,
     {
@@ -15,7 +15,7 @@ const FieldCaption = forwardRef(
     }
   ) : null
 );
-FieldCaption.displayName = "FieldCaption";
+FormFieldCaption.displayName = "FormFieldCaption";
 export {
-  FieldCaption
+  FormFieldCaption
 };

package/dist/components/{FieldComponents/FieldError/FieldError.module.css.js → FormField/FormFieldCaption/FormFieldCaption.module.css.js}

@@ -1,4 +1,4 @@
-const base = "kbq-fielderror-a0b0a4";
+const base = "kbq-formfieldcaption-8209de";
 const s = {
   base
 };

package/dist/components/FormField/FormFieldCaption/index.d.ts

@@ -0,0 +1 @@
+export * from './FormFieldCaption';

package/dist/components/FormField/FormFieldControlGroup/FormFieldControlGroup.d.ts

@@ -0,0 +1,2 @@
+import type { FormFieldControlGroupProps } from './index';
+export declare const FormFieldControlGroup: import("react").ForwardRefExoticComponent<Omit<FormFieldControlGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/{FieldComponents/FieldContentGroup/FieldContentGroup.js → FormField/FormFieldControlGroup/FormFieldControlGroup.js}

@@ -2,10 +2,10 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, Children, isValidElement, cloneElement } from "react";
 import { isNotNil, useFocusRing, mergeProps, clsx } from "@koobiq/react-core";
 import { Group } from "@koobiq/react-primitives";
-import s from "./FieldContentGroup.module.css.js";
-import { FieldContentGroupContext } from "./FieldContentGroupContext.js";
-import { FieldAddon } from "../FieldAddon/FieldAddon.js";
-const FieldContentGroup = forwardRef(function FieldContentGroup2({
+import s from "./FormFieldControlGroup.module.css.js";
+import { FormFieldControlGroupContext } from "./FormFieldControlGroupContext.js";
+import { FormFieldAddon } from "../FormFieldAddon/FormFieldAddon.js";
+const FormFieldControlGroup = forwardRef(function FieldContentGroup({
   variant = "filled",
   isInvalid,
   isDisabled,
@@ -30,11 +30,11 @@ const FieldContentGroup = forwardRef(function FieldContentGroup2({
       className: clsx(
         s.base,
         s[variant],
+        isFocused && s.focused,
         isInvalid && s.invalid,
         isDisabled && s.disabled,
-        isFocused && s.focused,
-        hasStartAddon && s.hasStartAddon,
         hasEndAddon && s.hasEndAddon,
+        hasStartAddon && s.hasStartAddon,
         className
       ),
       isInvalid,
@@ -42,7 +42,7 @@ const FieldContentGroup = forwardRef(function FieldContentGroup2({
       ...other,
       ref,
       children: ({ isHovered, isFocusWithin }) => /* @__PURE__ */ jsxs(
-        FieldContentGroupContext.Provider,
+        FormFieldControlGroupContext.Provider,
         {
           value: {
             hasStartAddon,
@@ -53,34 +53,16 @@ const FieldContentGroup = forwardRef(function FieldContentGroup2({
             isFocusWithin
           },
           children: [
-            /* @__PURE__ */ jsx(
-              FieldAddon,
-              {
-                placement: "start",
-                isInvalid,
-                isDisabled,
-                ...slotProps?.startAddon,
-                children: startAddon
-              }
-            ),
+            /* @__PURE__ */ jsx(FormFieldAddon, { placement: "start", ...slotProps?.startAddon, children: startAddon }),
             focusManagedChildren,
-            /* @__PURE__ */ jsx(
-              FieldAddon,
-              {
-                placement: "end",
-                isInvalid,
-                isDisabled,
-                ...slotProps?.endAddon,
-                children: endAddon
-              }
-            )
+            /* @__PURE__ */ jsx(FormFieldAddon, { placement: "end", ...slotProps?.endAddon, children: endAddon })
           ]
         }
       )
     }
   );
 });
-FieldContentGroup.displayName = "FieldContentGroup";
+FormFieldControlGroup.displayName = "FormFieldControlGroup";
 export {
-  FieldContentGroup
+  FormFieldControlGroup
 };

package/dist/components/FormField/FormFieldControlGroup/FormFieldControlGroup.module.css.js

@@ -0,0 +1,23 @@
+const base = "kbq-formfieldcontrolgroup-e5c3bd";
+const disabled = "kbq-formfieldcontrolgroup-disabled-16937d";
+const transparent = "kbq-formfieldcontrolgroup-transparent-85bd5d";
+const filled = "kbq-formfieldcontrolgroup-filled-c28a4b";
+const focused = "kbq-formfieldcontrolgroup-focused-43f1f7";
+const invalid = "kbq-formfieldcontrolgroup-invalid-f901a7";
+const s = {
+  base,
+  disabled,
+  transparent,
+  filled,
+  focused,
+  invalid
+};
+export {
+  base,
+  s as default,
+  disabled,
+  filled,
+  focused,
+  invalid,
+  transparent
+};

package/dist/components/FormField/FormFieldControlGroup/FormFieldControlGroupContext.d.ts

@@ -0,0 +1,10 @@
+export type FormFieldControlGroupContextProps = {
+    isDisabled?: boolean;
+    hasStartAddon?: boolean;
+    hasEndAddon?: boolean;
+    isHovered?: boolean;
+    isFocusWithin?: boolean;
+    isInvalid?: boolean;
+};
+export declare const FormFieldControlGroupContext: import("react").Context<FormFieldControlGroupContextProps>;
+export declare const useFormFieldControlGroup: () => FormFieldControlGroupContextProps;

package/dist/components/FormField/FormFieldControlGroup/FormFieldControlGroupContext.js

@@ -0,0 +1,7 @@
+import { createContext, useContext } from "react";
+const FormFieldControlGroupContext = createContext({});
+const useFormFieldControlGroup = () => useContext(FormFieldControlGroupContext);
+export {
+  FormFieldControlGroupContext,
+  useFormFieldControlGroup
+};

package/dist/components/FormField/FormFieldControlGroup/index.d.ts

@@ -0,0 +1,3 @@
+export * from './FormFieldControlGroup';
+export * from './FormFieldControlGroupContext';
+export * from './types';

package/dist/components/FormField/FormFieldControlGroup/types.d.ts

@@ -0,0 +1,30 @@
+import type { ComponentRef, ReactNode } from 'react';
+import type { DataAttributeProps, ExtendableComponentPropsWithRef } from '@koobiq/react-core';
+import type { FormFieldAddonProps } from '../FormFieldAddon';
+export declare const formFieldControlGroupPropVariant: readonly ["filled", "transparent"];
+export type FormFieldControlGroupPropVariant = (typeof formFieldControlGroupPropVariant)[number];
+export type FormFieldControlGroupProps = ExtendableComponentPropsWithRef<{
+    /** The content of the component. */
+    children?: ReactNode;
+    /** Addon placed before the children. */
+    startAddon?: ReactNode;
+    /** Addon placed after the children. */
+    endAddon?: ReactNode;
+    /**
+     * The variant to use.
+     * @default 'filled'
+     */
+    variant?: FormFieldControlGroupPropVariant;
+    /** Whether the input is disabled. */
+    isDisabled?: boolean;
+    /** Additional CSS-classes. */
+    className?: string;
+    /** Whether the input value is invalid. */
+    isInvalid?: boolean;
+    /** The props used for each slot inside. */
+    slotProps?: {
+        startAddon?: FormFieldAddonProps;
+        endAddon?: FormFieldAddonProps;
+    };
+} & DataAttributeProps, 'div'>;
+export type FormFieldControlGroupRef = ComponentRef<'div'>;

package/dist/components/FormField/FormFieldControlGroup/types.js

@@ -0,0 +1,7 @@
+const formFieldControlGroupPropVariant = [
+  "filled",
+  "transparent"
+];
+export {
+  formFieldControlGroupPropVariant
+};

package/dist/components/FormField/FormFieldError/FormFieldError.d.ts

@@ -0,0 +1,8 @@
+import { type ReactNode } from 'react';
+import { type ValidationResult } from '@koobiq/react-core';
+import { type TextProps, type TextRef } from '@koobiq/react-primitives';
+export type FormFieldErrorProps = Omit<TextProps, 'children'> & {
+    children?: ReactNode | ((v: ValidationResult) => ReactNode);
+};
+export type FormFieldErrorRef = TextRef;
+export declare const FormFieldError: import("react").ForwardRefExoticComponent<Omit<FormFieldErrorProps, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;

package/dist/components/FormField/FormFieldError/FormFieldError.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { clsx } from "@koobiq/react-core";
+import { FieldError } from "@koobiq/react-primitives";
+import s from "./FormFieldError.module.css.js";
+const FormFieldError = forwardRef(({ className, ...other }, ref) => /* @__PURE__ */ jsx(
+  FieldError,
+  {
+    className: clsx(s.base, className),
+    ...other,
+    ref
+  }
+));
+FormFieldError.displayName = "FormFieldError";
+export {
+  FormFieldError
+};

package/dist/components/{FieldComponents/FieldCaption/FieldCaption.module.css.js → FormField/FormFieldError/FormFieldError.module.css.js}

@@ -1,4 +1,4 @@
-const base = "kbq-fieldcaption-8a3413";
+const base = "kbq-formfielderror-5dded9";
 const s = {
   base
 };

package/dist/components/FormField/FormFieldError/index.d.ts

@@ -0,0 +1 @@
+export * from './FormFieldError';

package/dist/components/FormField/FormFieldInput/FormFieldInput.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentPropsWithRef } from 'react';
+export type FormFieldInputBaseProps = {
+    className?: string;
+    'data-testid'?: string;
+    as?: 'input' | 'textarea';
+};
+export declare const FormFieldInput: import("@koobiq/react-core").PolyForwardComponent<"input", FormFieldInputBaseProps, "input" | "textarea">;
+export type FormFieldInputProps<As extends 'input' | 'textarea' = 'input'> = ComponentPropsWithRef<typeof FormFieldInput<As>>;

package/dist/components/FormField/FormFieldInput/FormFieldInput.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+import { polymorphicForwardRef, clsx } from "@koobiq/react-core";
+import { Input, Textarea } from "@koobiq/react-primitives";
+import s from "./FormFieldInput.module.css.js";
+const FormFieldInput = polymorphicForwardRef(({ as = "input", className, ...other }, ref) => {
+  const Tag = as === "input" ? Input : Textarea;
+  return /* @__PURE__ */ jsx(Tag, { ...other, className: clsx(s.base, className), ref });
+});
+FormFieldInput.displayName = "FormFieldInput";
+export {
+  FormFieldInput
+};

package/dist/components/{FieldComponents/Field/Field.module.css.js → FormField/FormFieldInput/FormFieldInput.module.css.js}

@@ -1,4 +1,4 @@
-const base = "kbq-field-25e8f8";
+const base = "kbq-formfieldinput-b5d864";
 const s = {
   base
 };

package/dist/components/FormField/FormFieldInput/index.d.ts

@@ -0,0 +1 @@
+export * from './FormFieldInput';

package/dist/components/FormField/FormFieldInputDate/FormFieldInputDate.d.ts

@@ -0,0 +1,8 @@
+import { type ReactNode, type Ref } from 'react';
+export type FormFieldInputDateProps = {
+    className?: string;
+    children?: ReactNode;
+    'data-testid'?: string;
+    ref?: Ref<HTMLDivElement>;
+};
+export declare const FormFieldInputDate: import("react").ForwardRefExoticComponent<Omit<FormFieldInputDateProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/FormField/FormFieldInputDate/FormFieldInputDate.js

@@ -0,0 +1,9 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { clsx } from "@koobiq/react-core";
+import s from "./FormFieldInputDate.module.css.js";
+const FormFieldInputDate = forwardRef(({ children, className, ...other }, ref) => /* @__PURE__ */ jsx("div", { ...other, className: clsx(s.base, className), ref, children }));
+FormFieldInputDate.displayName = "FormFieldInputDate";
+export {
+  FormFieldInputDate
+};

package/dist/components/FormField/FormFieldInputDate/FormFieldInputDate.module.css.js

@@ -0,0 +1,8 @@
+const base = "kbq-formfieldinputdate-a158cd";
+const s = {
+  base
+};
+export {
+  base,
+  s as default
+};

package/dist/components/FormField/FormFieldInputDate/index.d.ts

@@ -0,0 +1 @@
+export * from './FormFieldInputDate';

package/dist/components/FormField/FormFieldLabel/FormFieldLabel.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentPropsWithRef, ElementType } from 'react';
+import type { FormFieldLabelBaseProps } from './types';
+export declare const FormFieldLabel: import("@koobiq/react-core").PolyForwardComponent<"label", FormFieldLabelBaseProps, ElementType>;
+export type FormFieldLabelProps<As extends ElementType = 'label'> = ComponentPropsWithRef<typeof FormFieldLabel<As>>;

package/dist/components/{FormControlLabel/FormControlLabel.js → FormField/FormFieldLabel/FormFieldLabel.js}

@@ -1,12 +1,13 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { polymorphicForwardRef, isNotNil, clsx } from "@koobiq/react-core";
 import { Label } from "@koobiq/react-primitives";
-import s from "./FormControlLabel.module.css.js";
-const FormControlLabel = polymorphicForwardRef(
+import s from "./FormFieldLabel.module.css.js";
+const FormFieldLabel = polymorphicForwardRef(
   ({ children, className, isHidden, isRequired, as = "label", ...other }, ref) => isNotNil(children) ? /* @__PURE__ */ jsxs(
     Label,
     {
       as,
+      "data-slot": "form-field-label",
       className: clsx(s.base, isHidden && s.hidden, className),
       ...other,
       ref,
@@ -20,7 +21,7 @@ const FormControlLabel = polymorphicForwardRef(
     }
   ) : null
 );
-FormControlLabel.displayName = "FormControlLabel";
+FormFieldLabel.displayName = "FormFieldLabel";
 export {
-  FormControlLabel
+  FormFieldLabel
 };

package/dist/components/FormField/FormFieldLabel/FormFieldLabel.module.css.js

@@ -0,0 +1,14 @@
+const base = "kbq-formfieldlabel-d39737";
+const hidden = "kbq-formfieldlabel-hidden-8f1ae7";
+const sup = "kbq-formfieldlabel-sup-725d9d";
+const s = {
+  base,
+  hidden,
+  sup
+};
+export {
+  base,
+  s as default,
+  hidden,
+  sup
+};

package/dist/components/FormField/FormFieldLabel/index.d.ts

@@ -0,0 +1,2 @@
+export * from './FormFieldLabel';
+export * from './types';

package/dist/components/{FormControlLabel → FormField/FormFieldLabel}/types.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-export type FormControlLabelBaseProps = {
+export type FormFieldLabelBaseProps = {
     isHidden?: boolean;
     className?: string;
     isRequired?: boolean;

package/dist/components/FormField/FormFieldSelect/FormFieldSelect.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentPropsWithRef, ElementType } from 'react';
+import type { FormFieldSelectBaseProps } from './index';
+export declare const FormFieldSelect: import("@koobiq/react-core").PolyForwardComponent<"div", FormFieldSelectBaseProps, ElementType>;
+export type FormFieldSelectProps<As extends ElementType = 'div'> = ComponentPropsWithRef<typeof FormFieldSelect<As>>;