@delightui/components 0.1.120 → 0.1.122

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

@@ -5,9 +5,11 @@ declare const usePresenter: (props: InputProps, ref: React.ForwardedRef<HTMLInpu
     };
     onInputChanged: (event: React.ChangeEvent<HTMLInputElement>) => void;
     otherInputProps: {
+        checked?: boolean | undefined;
         className?: string | undefined;
         form?: string | undefined;
         list?: string | undefined;
+        children?: import("react").ReactNode | undefined;
         role?: import("react").AriaRole | undefined;
         src?: string | undefined;
         onLoad?: import("react").ReactEventHandler<HTMLInputElement> | undefined;
@@ -114,7 +116,6 @@ declare const usePresenter: (props: InputProps, ref: React.ForwardedRef<HTMLInpu
         "aria-valuemin"?: number | undefined;
         "aria-valuenow"?: number | undefined;
         "aria-valuetext"?: string | undefined;
-        children?: import("react").ReactNode | undefined;
         dangerouslySetInnerHTML?: {
             __html: string | TrustedHTML;
         } | undefined;
@@ -277,7 +278,6 @@ declare const usePresenter: (props: InputProps, ref: React.ForwardedRef<HTMLInpu
         onTransitionEnd?: import("react").TransitionEventHandler<HTMLInputElement> | undefined;
         onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLInputElement> | undefined;
         pattern?: string | undefined;
-        checked?: boolean | undefined;
         size?: number | undefined;
         step?: number | string | undefined;
         autoComplete?: import("react").HTMLInputAutoCompleteAttribute | undefined;

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

@@ -7,8 +7,14 @@ declare const usePresenter: (props: PasswordProps) => {
     };
     hideTrailingIcon: boolean | undefined;
     otherPasswordProps: {
+        disabled?: boolean | undefined;
+        required?: boolean | undefined;
+        checked?: boolean | undefined;
+        value?: string | undefined;
+        'component-variant'?: string;
         form?: string | undefined;
         list?: string | undefined;
+        children?: import("react").ReactNode | undefined;
         role?: import("react").AriaRole | undefined;
         src?: string | undefined;
         onLoad?: import("react").ReactEventHandler<HTMLInputElement> | undefined;
@@ -115,7 +121,6 @@ declare const usePresenter: (props: PasswordProps) => {
         "aria-valuemin"?: number | undefined;
         "aria-valuenow"?: number | undefined;
         "aria-valuetext"?: string | undefined;
-        children?: import("react").ReactNode | undefined;
         dangerouslySetInnerHTML?: {
             __html: string | TrustedHTML;
         } | undefined;
@@ -277,11 +282,7 @@ declare const usePresenter: (props: PasswordProps) => {
         onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLInputElement> | undefined;
         onTransitionEnd?: import("react").TransitionEventHandler<HTMLInputElement> | undefined;
         onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLInputElement> | undefined;
-        disabled?: boolean | undefined;
         pattern?: string | undefined;
-        required?: boolean | undefined;
-        checked?: boolean | undefined;
-        value?: string | undefined;
         invalid?: boolean;
         size?: number | undefined;
         leadingIcon?: React.ReactNode;
@@ -305,7 +306,6 @@ declare const usePresenter: (props: PasswordProps) => {
         readOnly?: boolean | undefined;
         onValueChange?: ((value: string) => void) | undefined;
         preProcessInput?: (text: string) => string;
-        'component-variant'?: string;
         initialValue?: string | undefined;
     };
 };

package/dist/cjs/components/atoms/Spinner/Spinner.d.ts

@@ -1,3 +1,3 @@
 import { SpinnerProps } from './Spinner.types';
-declare const Spinner: ({ className }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;
+declare const Spinner: ({ className, "component-variant": componentVariant }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;
 export default Spinner;

package/dist/cjs/components/atoms/Spinner/Spinner.types.d.ts

@@ -1,3 +1,7 @@
 export type SpinnerProps = {
     className?: string;
+    /**
+     * Component variant for theming
+     */
+    'component-variant'?: string;
 };

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

@@ -8,6 +8,7 @@ declare const usePresenter: (props: TextAreaProps) => {
     otherTextAreaProps: {
         className?: string | undefined;
         form?: string | undefined;
+        children?: import("react").ReactNode | undefined;
         role?: import("react").AriaRole | undefined;
         onLoad?: import("react").ReactEventHandler<HTMLTextAreaElement> | undefined;
         onError?: import("react").ReactEventHandler<HTMLTextAreaElement> | undefined;
@@ -110,7 +111,6 @@ declare const usePresenter: (props: TextAreaProps) => {
         "aria-valuemin"?: number | undefined;
         "aria-valuenow"?: number | undefined;
         "aria-valuetext"?: string | undefined;
-        children?: import("react").ReactNode | undefined;
         dangerouslySetInnerHTML?: {
             __html: string | TrustedHTML;
         } | undefined;

package/dist/cjs/components/examples/PopoverContextMenuExample.d.ts

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

package/dist/cjs/components/molecules/ContextMenu/ContextMenu.types.d.ts

@@ -1,3 +1,8 @@
 import { ListProps } from "../List";
 import { ListItemType } from "../List/List.types";
-export type ContextMenuProps<T extends ListItemType> = ListProps<T>;
+export type ContextMenuProps<T extends ListItemType> = ListProps<T> & {
+    /**
+     * Component variant for theming
+     */
+    'component-variant'?: string;
+};

package/dist/cjs/components/molecules/List/List.types.d.ts

@@ -7,7 +7,7 @@ export type ListAlignEnum = 'Horizontal' | 'Vertical';
 /**
  * Represents a generic list item.
  */
-export type ListItemType = {
+export type ListItemType = object & {
     id?: string | number;
     itemClassName?: string;
     itemStyle?: React.CSSProperties;

package/dist/cjs/components/molecules/Search/Search.presenter.d.ts

@@ -19,9 +19,13 @@ declare const useSearchPresenter: (props: SearchProps) => {
         'component-variant': string;
     };
     restProps: {
+        disabled?: boolean | undefined;
+        required?: boolean | undefined;
+        checked?: boolean | undefined;
         className?: string | undefined;
         form?: string | undefined;
         list?: string | undefined;
+        children?: import("react").ReactNode | undefined;
         role?: import("react").AriaRole | undefined;
         src?: string | undefined;
         onLoad?: import("react").ReactEventHandler<HTMLInputElement> | undefined;
@@ -127,7 +131,6 @@ declare const useSearchPresenter: (props: SearchProps) => {
         "aria-valuemin"?: number | undefined;
         "aria-valuenow"?: number | undefined;
         "aria-valuetext"?: string | undefined;
-        children?: import("react").ReactNode | undefined;
         dangerouslySetInnerHTML?: {
             __html: string | TrustedHTML;
         } | undefined;
@@ -289,10 +292,7 @@ declare const useSearchPresenter: (props: SearchProps) => {
         onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLInputElement> | undefined;
         onTransitionEnd?: import("react").TransitionEventHandler<HTMLInputElement> | undefined;
         onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLInputElement> | undefined;
-        disabled?: boolean | undefined;
         pattern?: string | undefined;
-        required?: boolean | undefined;
-        checked?: boolean | undefined;
         size?: number | undefined;
         step?: number | string | undefined;
         autoComplete?: import("react").HTMLInputAutoCompleteAttribute | undefined;

package/dist/cjs/components/molecules/Select/Select.presenter.d.ts

@@ -15,11 +15,11 @@ declare const usePresenter: (props: SelectProps) => {
     selectedValue: import("../..").FieldValue;
     resetSelectedValue: () => void;
     triggerProps: {
-        id?: string;
         disabled?: boolean;
         required?: boolean;
         checked?: boolean;
         value?: import("../..").FieldValue | undefined;
+        id?: string;
         invalid?: boolean;
         onValueChange?: ((value: import("../..").FieldValue) => void) | undefined;
         initialValue?: import("../..").FieldValue | undefined;

package/dist/cjs/library.css

@@ -48,28 +48,32 @@
   background-color: var(--actionImage-background-color--disabled);
 }
 .Spinner-module_spinner__CfJfU {
-  --spinner-height: 14px;
-  --spinner-width: 14px;
-  --spinner-border-width: 2px;
-  --spinner-border-style: solid;
-  --spinner-border-color: currentcolor;
+  width: 16px;
+  width: var(--spinner-width, 16px);
+  height: 16px;
+  height: var(--spinner-height, 16px);
+  display: inline-block;
+  position: relative;
+}
+.Spinner-module_spinner__CfJfU .Spinner-module_inner__o2YHF {
+  --spinner-inner-border-width: 2px;
+  --spinner-inner-border-style: solid;
   width: 14px;
-  width: var(--spinner-width);
+  width: var(--spinner-inner-width, 14px);
   height: 14px;
-  height: var(--spinner-height);
+  height: var(--spinner-inner-height, 14px);
   border-width: 2px;
-  border-width: var(--spinner-border-width);
+  border-width: var(--spinner-inner-border-width);
   border-style: solid;
-  border-style: var(--spinner-border-style);
+  border-style: var(--spinner-inner-border-style);
   border-color: currentcolor;
-  border-color: var(--spinner-border-color);
+  border-color: var(--spinner-inner-color, currentcolor);
   border-top: 2px solid transparent;
-  border-top: var(--spinner-border-width) solid transparent;
+  border-top: var(--spinner-inner-border-width) solid transparent;
   border-radius: 50%;
   animation: Spinner-module_spin__136Ue 1s linear infinite;
   box-sizing: border-box;
 }
-
 @keyframes Spinner-module_spin__136Ue {
   0% {
     transform: rotate(0deg);
@@ -489,8 +493,8 @@
 .ListItem-module_listItem__jYwlh .ListItem-module_content__I-1o- {
   flex: 1;
   display: flex;
-  justify-content: center;
-  justify-content: var(--list-item-content-justify-content, center);
+  justify-content: flex-start;
+  justify-content: var(--list-item-content-justify-content, flex-start);
 }
 .ListItem-module_listItem__jYwlh .ListItem-module_content__I-1o- > *,
 .ListItem-module_listItem__jYwlh .ListItem-module_leadingIcon__BvSjG > *,
@@ -542,8 +546,8 @@
 .SelectListItem-module_listItem__alhXN .SelectListItem-module_content__IU02L {
   flex: 1;
   display: flex;
-  justify-content: center;
-  justify-content: var(--list-item-content-justify-content, center);
+  justify-content: flex-start;
+  justify-content: var(--list-item-content-justify-content, flex-start);
 }
 .SelectListItem-module_listItem__alhXN .SelectListItem-module_content__IU02L > *,
 .SelectListItem-module_listItem__alhXN .SelectListItem-module_leadingIcon__wMycl > *,
@@ -29326,6 +29330,16 @@ span.flatpickr-weekday {
         --spinner-paragraph-spacing: 0px;
         --spinner-paragraph-indent: 0px
     }
+[data-theme='dark'] [component-variant="spinner-default"], [data-theme='light'] [component-variant="spinner-default"] {
+        --spinner-inner-height: 14px;
+        --spinner-inner-width: 14px;
+        --spinner-inner-color: var(--colours-grey-50);
+        --spinner-inner-font-family: sans-sarif;
+        --spinner-inner-font-size: initial;
+        --spinner-inner-font-weight: regular;
+        --spinner-inner-paragraph-spacing: 0px;
+        --spinner-inner-paragraph-indent: 0px
+    }
 [data-theme='dark'] [component-variant^="modal-header-"], [data-theme='light'] [component-variant^="modal-header-"] {
         --modal-header-opacity: 1;
         --modal-header-height: auto;