@delightui/components 0.1.82 → 0.1.83

package/dist/cjs/components/atoms/Checkbox/Checkbox.presenter.d.ts

@@ -295,7 +295,7 @@ declare const usePresenter: (props: CheckboxProps) => {
     };
     labelAlignment: import("./Checkbox.types").CheckboxLabelAlignmentEnum;
     disabled: boolean;
-    isChecked: boolean | undefined;
+    isChecked: boolean;
     required: boolean | undefined;
     name: string | undefined;
     invalid: boolean;

package/dist/cjs/components/atoms/Checkbox/CheckboxLikeFieldsExample.d.ts

@@ -0,0 +1,2 @@
+declare const CheckboxLikeFieldsExample: () => import("react/jsx-runtime").JSX.Element;
+export default CheckboxLikeFieldsExample;

package/dist/cjs/components/atoms/Checkbox/useCheckboxField.d.ts

@@ -0,0 +1,11 @@
+export type CheckboxFieldProps = {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    value?: boolean;
+    onValueChange?: (value: boolean) => void;
+};
+declare const useCheckboxField: ({ checked, defaultChecked, value, onValueChange }: CheckboxFieldProps) => {
+    isChecked: boolean;
+    onCheckboxChanged: (event: React.ChangeEvent<HTMLInputElement>) => void;
+};
+export default useCheckboxField;

package/dist/cjs/components/atoms/CustomToggle/CustomToggle.presenter.d.ts

@@ -3,8 +3,8 @@ declare const usePresenter: (props: CustomToggleProps) => {
     variantProps: {
         'component-variant': string;
     };
-    isChecked: boolean | undefined;
-    handleChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    isChecked: boolean;
+    handleChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
     disabled: boolean;
     invalid: boolean;
     otherInputProps: {

package/dist/cjs/components/atoms/Input/InputExample.d.ts

@@ -0,0 +1,2 @@
+declare const InputExample: () => import("react/jsx-runtime").JSX.Element;
+export default InputExample;

package/dist/cjs/components/atoms/Toggle/Toggle.presenter.d.ts

@@ -3,7 +3,7 @@ declare const usePresenter: (props: ToggleProps) => {
     variantProps: {
         'component-variant': string;
     };
-    isChecked: boolean | undefined;
+    isChecked: boolean;
     onToggleChanged: (event: React.ChangeEvent<HTMLInputElement>) => void;
     otherInputProps: {
         className?: string | undefined | undefined;

package/dist/cjs/components/atoms/ToggleButton/ToggleButton.presenter.d.ts

@@ -268,8 +268,8 @@ declare const usePresenter: (props: ToggleButtonProps) => {
         trailingIcon?: import("react").ReactNode;
         initialValue?: boolean | undefined;
     };
-    isChecked: boolean | undefined;
-    handleChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    isChecked: boolean;
+    handleChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
     disabled: boolean;
     required: boolean;
     invalid: boolean;

package/dist/cjs/library.css

@@ -558,6 +558,7 @@
   align-items: center;
   gap: var(--toggle-row-gap) var(--toggle-column-gap);
   color: var(--toggle-color);
+  cursor: pointer;
   height: var(--toggle-height);
   min-height: var(--toggle-min-height);
   max-height: var(--toggle-max-height);
@@ -3710,18 +3711,18 @@ span.flatpickr-weekday {
   color: var(--chip-input-color);
 }
 
-.ChipInput-module_chipInput__tCCgW .ChipInput-module_chipList__l2ctU {
+.ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU {
   --list-row-gap: var(--chip-input-chip-list-row-gap);
   --list-column-gap: var(--chip-input-chip-list-column-gap, var(--chip-input-chip-list-row-gap));
 }
 
-.ChipInput-module_chipInput__tCCgW .ChipInput-module_chipList__l2ctU > * {
+.ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU > * {
   display: flex;
   justify-content: flex-start;
   align-items: center;
 }
 
-.ChipInput-module_chipInput__tCCgW .ChipInput-module_chipList__l2ctU .ChipInput-module_chip__-6re8 {
+.ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU .ChipInput-module_chip__-6re8 {
   --chip-border-top-left-radius: var(--chip-input-chip-item-border-top-left-radius);
   --chip-border-top-right-radius: var(--chip-input-chip-item-border-top-right-radius);
   --chip-border-bottom-left-radius: var(--chip-input-chip-item-border-bottom-left-radius);
@@ -3735,21 +3736,21 @@ span.flatpickr-weekday {
   --chip-column-gap: var(--chip-input-chip-item-column-gap);
 }
 
-.ChipInput-module_chipInput__tCCgW .ChipInput-module_input__J979Z {
+.ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU .ChipInput-module_input__J979Z {
   --input-border-top-width: 0px;
   --input-border-right-width: 0px;
   --input-border-bottom-width: 0px;
   --input-border-left-width: 0px;
 }
 
-.ChipInput-module_chipInput__tCCgW .ChipInput-module_input__J979Z.ChipInput-module_disabledInput__ciuDU {
+.ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU .ChipInput-module_input__J979Z.ChipInput-module_disabledInput__ciuDU {
   --input-border-top-width: 0px;
   --input-border-right-width: 0px;
   --input-border-bottom-width: 0px;
   --input-border-left-width: 0px;
 }
 
-.ChipInput-module_chipInput__tCCgW .ChipInput-module_input__J979Z:hover:not(:disabled), .ChipInput-module_chipInput__tCCgW .ChipInput-module_input__J979Z:active:not(:disabled), .ChipInput-module_chipInput__tCCgW .ChipInput-module_input__J979Z:has(:focus-visible):not(:disabled) {
+.ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU .ChipInput-module_input__J979Z:hover:not(:disabled), .ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU .ChipInput-module_input__J979Z:active:not(:disabled), .ChipInput-module_chipInput__tCCgW .ChipInput-module_trigger__KLvR4 .ChipInput-module_chipList__l2ctU .ChipInput-module_input__J979Z:has(:focus-visible):not(:disabled) {
   --input-border-top-width: 0px;
   --input-border-right-width: 0px;
   --input-border-bottom-width: 0px;
@@ -14790,6 +14791,16 @@ span.flatpickr-weekday {
         --select-paragraph-spacing: 0px;
         --select-paragraph-indent: 0px
     }
+[data-theme='dark'] [component-variant="select-single-select"][invalid]:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-single-select"][invalid]:not(:disabled):not([disabled]), [data-theme='dark'] [component-variant="select-single-select"]:invalid:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-single-select"]:invalid:not(:disabled):not([disabled]) {
+        --select-width: 100%;
+        --select-row-gap: var(--spacing-space-2);
+        --select-column-gap: var(--spacing-space-2);
+        --select-font-family: sans-sarif;
+        --select-font-size: initial;
+        --select-font-weight: regular;
+        --select-paragraph-spacing: 0px;
+        --select-paragraph-indent: 0px
+    }
 [data-theme='dark'] [component-variant="select-single-select"][disabled],
 [data-theme='light'] [component-variant="select-single-select"][disabled],
 [data-theme='dark'] [component-variant="select-single-select"]:disabled,
@@ -14853,6 +14864,16 @@ span.flatpickr-weekday {
         --select-paragraph-spacing: 0px;
         --select-paragraph-indent: 0px
     }
+[data-theme='dark'] [component-variant="select-multi-select"][invalid]:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-multi-select"][invalid]:not(:disabled):not([disabled]), [data-theme='dark'] [component-variant="select-multi-select"]:invalid:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-multi-select"]:invalid:not(:disabled):not([disabled]) {
+        --select-width: 100%;
+        --select-row-gap: var(--spacing-space-2);
+        --select-column-gap: var(--spacing-space-2);
+        --select-font-family: sans-sarif;
+        --select-font-size: initial;
+        --select-font-weight: regular;
+        --select-paragraph-spacing: 0px;
+        --select-paragraph-indent: 0px
+    }
 [data-theme='dark'] [component-variant="select-multi-select"][disabled],
 [data-theme='light'] [component-variant="select-multi-select"][disabled],
 [data-theme='dark'] [component-variant="select-multi-select"]:disabled,
@@ -15001,6 +15022,33 @@ span.flatpickr-weekday {
         --select-trigger-paragraph-spacing: 0px;
         --select-trigger-paragraph-indent: 0px
     }
+[data-theme='dark'] [component-variant="select-single-select"][invalid]:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-single-select"][invalid]:not(:disabled):not([disabled]), [data-theme='dark'] [component-variant="select-single-select"]:invalid:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-single-select"]:invalid:not(:disabled):not([disabled]) {
+        --select-trigger-height: 32px;
+        --select-trigger-width: 100%;
+        --select-trigger-background-color: var(--interactive-surface-secondary-default);
+        --select-trigger-color: var(--text-primary);
+        --select-trigger-border-top-left-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-top-right-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-bottom-left-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-bottom-right-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-color: var(--border-destructive);
+        --select-trigger-border-top-width: 1px;
+        --select-trigger-border-right-width: 1px;
+        --select-trigger-border-bottom-width: 1px;
+        --select-trigger-border-left-width: 1px;
+        --select-trigger-padding-left: var(--spacing-space-5);
+        --select-trigger-padding-right: var(--spacing-space-5);
+        --select-trigger-padding-top: var(--spacing-space-5);
+        --select-trigger-padding-bottom: var(--spacing-space-5);
+        --select-trigger-row-gap: var(--spacing-space-5);
+        --select-trigger-column-gap: var(--spacing-space-5);
+        --select-trigger-font-family: var(--font-family-body);
+        --select-trigger-font-size: var(--font-size-body-small);
+        --select-trigger-font-weight: var(--font-weight-regular);
+        --select-trigger-line-height: var(--line-height-body-small);
+        --select-trigger-paragraph-spacing: 0px;
+        --select-trigger-paragraph-indent: 0px
+    }
 [data-theme='dark'] [component-variant="select-single-select"][disabled],
 [data-theme='light'] [component-variant="select-single-select"][disabled],
 [data-theme='dark'] [component-variant="select-single-select"]:disabled,
@@ -15166,6 +15214,33 @@ span.flatpickr-weekday {
         --select-trigger-paragraph-spacing: 0px;
         --select-trigger-paragraph-indent: 0px
     }
+[data-theme='dark'] [component-variant="select-multi-select"][invalid]:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-multi-select"][invalid]:not(:disabled):not([disabled]), [data-theme='dark'] [component-variant="select-multi-select"]:invalid:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-multi-select"]:invalid:not(:disabled):not([disabled]) {
+        --select-trigger-height: 32px;
+        --select-trigger-width: 100%;
+        --select-trigger-background-color: var(--interactive-surface-secondary-default);
+        --select-trigger-color: var(--text-primary);
+        --select-trigger-border-top-left-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-top-right-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-bottom-left-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-bottom-right-radius: var(--corner-radius-extra-small);
+        --select-trigger-border-color: var(--border-destructive);
+        --select-trigger-border-top-width: 1px;
+        --select-trigger-border-right-width: 1px;
+        --select-trigger-border-bottom-width: 1px;
+        --select-trigger-border-left-width: 1px;
+        --select-trigger-padding-left: var(--spacing-space-5);
+        --select-trigger-padding-right: var(--spacing-space-5);
+        --select-trigger-padding-top: var(--spacing-space-5);
+        --select-trigger-padding-bottom: var(--spacing-space-5);
+        --select-trigger-row-gap: var(--spacing-space-5);
+        --select-trigger-column-gap: var(--spacing-space-5);
+        --select-trigger-font-family: var(--font-family-body);
+        --select-trigger-font-size: var(--font-size-body-small);
+        --select-trigger-font-weight: var(--font-weight-regular);
+        --select-trigger-line-height: var(--line-height-body-small);
+        --select-trigger-paragraph-spacing: 0px;
+        --select-trigger-paragraph-indent: 0px
+    }
 [data-theme='dark'] [component-variant="select-multi-select"][disabled],
 [data-theme='light'] [component-variant="select-multi-select"][disabled],
 [data-theme='dark'] [component-variant="select-multi-select"]:disabled,
@@ -15316,6 +15391,30 @@ span.flatpickr-weekday {
         --select-options-paragraph-spacing: 0px;
         --select-options-paragraph-indent: 0px
     }
+[data-theme='dark'] [component-variant="select-single-select"][invalid]:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-single-select"][invalid]:not(:disabled):not([disabled]), [data-theme='dark'] [component-variant="select-single-select"]:invalid:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-single-select"]:invalid:not(:disabled):not([disabled]) {
+        --select-options-width: 100%;
+        --select-options-background-color: var(--surface-background-4);
+        --select-options-border-top-left-radius: var(--corner-radius-extra-small);
+        --select-options-border-top-right-radius: var(--corner-radius-extra-small);
+        --select-options-border-bottom-left-radius: var(--corner-radius-extra-small);
+        --select-options-border-bottom-right-radius: var(--corner-radius-extra-small);
+        --select-options-border-color: var(--border-border-grey-3);
+        --select-options-border-top-width: 1px;
+        --select-options-border-right-width: 1px;
+        --select-options-border-bottom-width: 1px;
+        --select-options-border-left-width: 1px;
+        --select-options-padding-left: var(--spacing-space-5);
+        --select-options-padding-right: var(--spacing-space-5);
+        --select-options-padding-top: var(--spacing-space-5);
+        --select-options-padding-bottom: var(--spacing-space-5);
+        --select-options-row-gap: var(--spacing-space-3);
+        --select-options-column-gap: var(--spacing-space-3);
+        --select-options-font-family: sans-sarif;
+        --select-options-font-size: initial;
+        --select-options-font-weight: regular;
+        --select-options-paragraph-spacing: 0px;
+        --select-options-paragraph-indent: 0px
+    }
 [data-theme='dark'] [component-variant="select-multi-select"], [data-theme='light'] [component-variant="select-multi-select"] {
         --select-options-width: 100%;
         --select-options-background-color: var(--surface-background-4);
@@ -15436,6 +15535,30 @@ span.flatpickr-weekday {
         --select-options-paragraph-spacing: 0px;
         --select-options-paragraph-indent: 0px
     }
+[data-theme='dark'] [component-variant="select-multi-select"][invalid]:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-multi-select"][invalid]:not(:disabled):not([disabled]), [data-theme='dark'] [component-variant="select-multi-select"]:invalid:not(:disabled):not([disabled]), [data-theme='light'] [component-variant="select-multi-select"]:invalid:not(:disabled):not([disabled]) {
+        --select-options-width: 100%;
+        --select-options-background-color: var(--surface-background-4);
+        --select-options-border-top-left-radius: var(--corner-radius-extra-small);
+        --select-options-border-top-right-radius: var(--corner-radius-extra-small);
+        --select-options-border-bottom-left-radius: var(--corner-radius-extra-small);
+        --select-options-border-bottom-right-radius: var(--corner-radius-extra-small);
+        --select-options-border-color: var(--border-border-grey-3);
+        --select-options-border-top-width: 1px;
+        --select-options-border-right-width: 1px;
+        --select-options-border-bottom-width: 1px;
+        --select-options-border-left-width: 1px;
+        --select-options-padding-left: var(--spacing-space-5);
+        --select-options-padding-right: var(--spacing-space-5);
+        --select-options-padding-top: var(--spacing-space-5);
+        --select-options-padding-bottom: var(--spacing-space-5);
+        --select-options-row-gap: var(--spacing-space-3);
+        --select-options-column-gap: var(--spacing-space-3);
+        --select-options-font-family: sans-sarif;
+        --select-options-font-size: initial;
+        --select-options-font-weight: regular;
+        --select-options-paragraph-spacing: 0px;
+        --select-options-paragraph-indent: 0px
+    }
 [data-theme='dark'] [component-variant^="select-list-item-"], [data-theme='light'] [component-variant^="select-list-item-"] {
         --select-list-item-opacity: 1;
         --select-list-item-height: auto;