fis-component 0.0.45 → 0.0.47

package/dist/cjs/types/src/components/Input/DateRange/DateRange.stories.d.ts

@@ -2,12 +2,13 @@ import { DateRangeProps } from ".";
 declare const meta: {
     title: string;
     component: {
-        ({ placeholder, label, required, message, negative, positive, ...rest }: DateRangeProps): import("react/jsx-runtime").JSX.Element;
+        ({ placeholder, label, required, message, negative, positive, disabled, ...rest }: DateRangeProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     tags: string[];
     args: {
         label: string;
+        disabled: false;
         required: true;
         message: string;
         negative: false;

package/dist/cjs/types/src/components/Input/DateRange/index.d.ts

@@ -1,14 +1,27 @@
 export type DateRangeProps = {
     className?: string;
-    placeholder?: [string, string];
     label?: string;
     required?: boolean;
+    disabled?: boolean;
     message?: string;
     negative?: boolean;
     positive?: boolean;
-};
+    placeholder?: [string, string];
+} & React.ComponentProps<typeof RangePicker>;
+declare const RangePicker: import("react").ForwardRefExoticComponent<Omit<import("rc-picker").RangePickerProps<import("dayjs").Dayjs>, "locale" | "generateConfig" | "hideHeader"> & {
+    locale?: import("antd/es/date-picker/generatePicker").PickerLocale;
+    size?: import("antd/es/button").ButtonSize;
+    placement?: "bottomLeft" | "bottomRight" | "topLeft" | "topRight";
+    bordered?: boolean;
+    status?: import("antd/es/_util/statusUtils").InputStatus;
+    variant?: import("antd/es/config-provider").Variant;
+    dropdownClassName?: string;
+    popupClassName?: string;
+    rootClassName?: string;
+    popupStyle?: React.CSSProperties;
+} & import("react").RefAttributes<import("rc-picker").PickerRef>>;
 declare const FISDateRange: {
-    ({ placeholder, label, required, message, negative, positive, ...rest }: DateRangeProps): import("react/jsx-runtime").JSX.Element;
+    ({ placeholder, label, required, message, negative, positive, disabled, ...rest }: DateRangeProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default FISDateRange;

package/dist/cjs/types/src/components/Input/DateRange/styles.d.ts

@@ -1,6 +1,7 @@
 interface DateRangeProps {
     $negative?: boolean;
     $positive?: boolean;
+    $disabled?: boolean;
 }
 export declare const DivDateRangeContainerSC: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DateRangeProps>> & string;
 export declare const DivSeparatorIconSC: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DateRangeProps>> & string;

package/dist/esm/index.js

@@ -64603,7 +64603,7 @@ const DivContainerSC$7 = styled.div `
     cursor: default;
   }
 
-  &:hover:not(:has(.icon-suffix:hover)) {
+  &:hover:not(.disabled):not(:has(.icon-suffix:hover)) {
     outline-color: ${getTheme("com/input/field/default/border/hover")};
     background-color: ${getTheme("com/input/field/default/background/hover")};
 
@@ -64664,9 +64664,9 @@ const FISInputField = forwardRef(({ onClickSuffix, onClickPrefix, ...props }, re
             dropdownPrefix: typePrefix === "dropdown",
             iconPrefix: iconPrefix,
             prefix: typePrefix === "prefix" || typePrefix === "dropdown",
-            suffix: typeSuffix === "suffix" ||
-                typeSuffix === "dropdown",
+            suffix: typeSuffix === "suffix" || typeSuffix === "dropdown",
             iconSuffix: typeSuffix === "icon",
+            disabled: disabled,
         }), children: [iconPrefix && typePrefix !== "prefix" && typePrefix !== "dropdown" && (jsx(DivIconSC$2, { className: classNames({
                     "input-text-lg": sizeInput === "lg",
                 }), children: iconPrefix })), typePrefix === "prefix" && (jsxs(DivPrefixSC, { onClick: onClickPrefix, className: classNames({ disabled: disabled }), children: [iconPrefix && jsx(DivIconPrefixSC$1, { children: iconPrefix }), labelPrefix && jsx(SpanTextPrefixSC, { children: labelPrefix })] })), typePrefix === "dropdown" && (jsxs(DivDropdownPreFixSC, { className: classNames({
@@ -71665,6 +71665,18 @@ const DivDateRangeContainerSC = styled.div `
     justify-content: center;
   }
 
+  ${(props) => props.$disabled &&
+    css `
+      .ant-picker-range {
+        background-color: ${getTheme("com/input/field/disable/background-color")};
+        border-color: ${getTheme("com/input/field/disable/stroke-color")};
+
+        .ant-picker-suffix svg {
+          color: ${getTheme("com/button/disable/icon-color")};
+        }
+      }
+    `}
+
   ${(props) => {
     if (props.$negative) {
         return css `
@@ -71714,12 +71726,12 @@ const DivSuffixIconSC = styled.div `
 `;
 
 const { RangePicker } = DatePicker;
-const FISDateRange = ({ placeholder = ["dd/mm/yyyy", "dd/mm/yyyy"], label, required = true, message, negative = false, positive = false, ...rest }) => {
+const FISDateRange = ({ placeholder = ["dd/mm/yyyy", "dd/mm/yyyy"], label, required = true, message, negative = false, positive = false, disabled = true, ...rest }) => {
     const [open, setOpen] = useState(false);
     const handleOpenCalendar = () => {
         setOpen(!open);
     };
-    return (jsxs(DivDateRangeContainerSC, { "$negative": negative, "$positive": positive, children: [label && jsx(FISInputLabel, { textLabel: label, required: required }), jsx(RangePicker, { open: open, onOpenChange: setOpen, placeholder: placeholder, separator: jsx(DivSeparatorIconSC, { "$negative": negative, children: jsx(ArrowRightIcon, {}) }), suffixIcon: jsx(DivSuffixIconSC, { children: jsx(FISIconButton, { size: "sm", variant: "tertiary-invisible", icon: jsx(CalendarIcon, {}), onClick: handleOpenCalendar }) }), ...rest }), message && (jsx("div", { className: "hint-box", children: jsx("div", { className: "hint-text", children: message }) }))] }));
+    return (jsxs(DivDateRangeContainerSC, { "$negative": negative, "$positive": positive, "$disabled": disabled, children: [label && jsx(FISInputLabel, { textLabel: label, required: required }), jsx(RangePicker, { open: open, onOpenChange: setOpen, placeholder: placeholder, disabled: disabled, separator: jsx(DivSeparatorIconSC, { "$negative": negative, children: jsx(ArrowRightIcon, {}) }), suffixIcon: jsx(DivSuffixIconSC, { children: jsx(FISIconButton, { disabled: disabled, size: "sm", variant: "tertiary-invisible", icon: jsx(CalendarIcon, {}), onClick: handleOpenCalendar }) }), ...rest }), message && (jsx("div", { className: "hint-box", children: jsx("div", { className: "hint-text", children: message }) }))] }));
 };
 FISDateRange.displayName = "FISDateRange";