kahuna-base-react-components 1.4.4 → 1.4.5

package/dist/types.d.ts

@@ -250,6 +250,9 @@ interface KSelectDateProps {
     isTileDisabled?: TileDisabledFunc;
     applyUndefinedValue?: boolean;
     buttonText?: string;
+    open?: boolean;
+    setOpen?: (open: boolean) => void;
+    onCancel?: () => void;
 }
 declare const KSelectDate: React.FC<KSelectDateProps>;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kahuna-base-react-components",
-  "version": "1.4.4",
+  "version": "1.4.5",
   "description": "Kahuna Base React Components",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/src/components/KSelectDate/KSelectDate.stories.tsx

@@ -15,9 +15,15 @@ export default {
 
 const KSelectDateWrapper: React.FC<KSelectDateProps> = (args) => {
   const [selectedDate, setSelectedDate] = useState<Date | undefined>(undefined)
+  const [open, setOpen] = useState<boolean>(false)
   useEffect(() => {
     // console.log("selectedDate: ", selectedDate)
   }, [selectedDate])
+
+  useEffect(() => {
+    console.log("open: ", open)
+  }, [open])
+
   const periods = [
     { value: "202401", label: "202401" },
     { value: "202402", label: "202402" },
@@ -59,7 +65,12 @@ const KSelectDateWrapper: React.FC<KSelectDateProps> = (args) => {
           />
           <KSelectDate
             {...args}
+            key={selectedDate?.toString()}
             value={selectedDate}
+            open={open}
+            setOpen={setOpen}
+            hideBody
+            hideBackdrop
             onChange={(date) => {
               // console.log("date: ", date)
               if (date) {
@@ -71,10 +82,15 @@ const KSelectDateWrapper: React.FC<KSelectDateProps> = (args) => {
                 // console.log("Deleting is completed")
               }
             }}
+            onCancel={() => {
+              console.log("close:::")
+            }}
             anchorToButton
           />
       </div>
-      <div></div>
+      <div className="cursor-pointer" onClick={() => {
+        setOpen(true)
+      }}>Deneme Butonu</div>
     </div>
   )
 }

package/src/components/KSelectDate/KSelectDate.tsx

@@ -36,6 +36,9 @@ export interface KSelectDateProps {
   isTileDisabled?: TileDisabledFunc
   applyUndefinedValue?: boolean // if this prop's value is false, makes the Apply button disabled when chosen date is undefined
   buttonText?: string
+  open?: boolean // Use open and setOpen props together. Opens the calendar without requiring a click on the calendar icon.
+  setOpen?: (open: boolean) => void // Use open and setOpen props together. 
+  onCancel?: () => void
 }
 interface MonthSelectorType {
   monthName: string
@@ -70,6 +73,13 @@ const KSelectDate: React.FC<KSelectDateProps> = (props) => {
   const [weekDays, setWeekDays] = useState<DaySelectorType[]>([])
   const [openCalendar, setOpenCalendar] = useState<boolean>(false)
 
+  useEffect(() => {
+    if (props.open) {
+      setOpenCalendar(true)  // Used only to open the calendar. The Cancel and Apply buttons handle closing it.
+      setCalendarDate(value)
+    }
+  }, [props.open])
+
   const onlyMonthSelection = props.onlyMonthSelection || false
   const hideBody = props.hideBody || false
 
@@ -170,6 +180,8 @@ const KSelectDate: React.FC<KSelectDateProps> = (props) => {
             textColor="#111"
             onClick={() => {
               setOpenCalendar(false)
+              if (props.setOpen) props.setOpen(false)
+              if (props.onCancel) props.onCancel()
             }}
           />
           <KButton
@@ -182,6 +194,7 @@ const KSelectDate: React.FC<KSelectDateProps> = (props) => {
             onClick={() => {
               setValue(calendarDate)
               setOpenCalendar(false)
+              if (props.setOpen) props.setOpen(false)
             }}
           />
         </div>
@@ -400,6 +413,7 @@ const KSelectDate: React.FC<KSelectDateProps> = (props) => {
               onClick={() => {
                 if (openCalendar) {
                   setOpenCalendar(false)
+                  if (props.setOpen) props.setOpen(false)
                 } else {
                   setOpenCalendar(true)
                   setCalendarDate(value)

package/dist/components/KButton/KButton.stories.d.ts

@@ -1,10 +0,0 @@
-import { Meta } from "@storybook/react";
-import KButton from "./KButton";
-declare const _default: Meta<typeof KButton>;
-export default _default;
-export declare const KButtonText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KButton").KButtonProps>;
-export declare const KButtonIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KButton").KButtonProps>;
-export declare const KButtonLeftIconText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KButton").KButtonProps>;
-export declare const KButtonRightIconText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KButton").KButtonProps>;
-export declare const KButtonLeftRightIconText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KButton").KButtonProps>;
-export declare const KButtonLeftRightMiddleIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KButton").KButtonProps>;

package/dist/components/KCodeInput/KCodeInput.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta } from "@storybook/react";
-import KCodeInput, { KCodeInputProps } from "./KCodeInput";
-declare const _default: Meta<typeof KCodeInput>;
-export default _default;
-export declare const KCodeInputPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KCodeInputProps>;
-export declare const KCodeInputSecondary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KCodeInputProps>;
-export declare const KCodeInputDefault: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KCodeInputProps>;

package/dist/components/KDropdown/KDropdown.stories.d.ts

@@ -1,9 +0,0 @@
-import { Meta } from "@storybook/react";
-import KDropdown, { KDropdownProps } from "./KDropdown";
-declare const _default: Meta<typeof KDropdown>;
-export default _default;
-export declare const KDropdownSingle: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KDropdownProps>;
-export declare const KDropdownMulti: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KDropdownProps>;
-export declare const KDropdownLeftIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KDropdownProps>;
-export declare const KDropdownRightIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KDropdownProps>;
-export declare const KDropdownLeftRightIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KDropdownProps>;

package/dist/components/KInput/KInput.stories.d.ts

@@ -1,10 +0,0 @@
-import { Meta } from "@storybook/react";
-import KInput, { KInputProps } from "./KInput";
-declare const _default: Meta<typeof KInput>;
-export default _default;
-export declare const KInputPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KInputProps>;
-export declare const KInputRange: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KInputProps>;
-export declare const KInputCheckbox: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KInputProps>;
-export declare const KInputLeftIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KInputProps>;
-export declare const KInputRightIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KInputProps>;
-export declare const KInputLeftRightIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KInputProps>;

package/dist/components/KLogo/KLogo.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from "@storybook/react";
-import KLogo from "./KLogo";
-declare const _default: Meta<typeof KLogo>;
-export default _default;
-export declare const KLogoText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KLogo").KLogoProps>;
-export declare const KLogoHover: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KLogo").KLogoProps>;

package/dist/components/KSelectDate/KSelectDate.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from "@storybook/react";
-import KSelectDate, { KSelectDateProps } from "./KSelectDate";
-declare const _default: Meta<typeof KSelectDate>;
-export default _default;
-export declare const KSelectDatePrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectDateProps>;
-export declare const KSelectDateHoverText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectDateProps>;

package/dist/components/KSelectRange/KSelectRange.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta } from "@storybook/react";
-import KSelectRange, { KSelectRangeProps } from "./KSelectRange";
-declare const _default: Meta<typeof KSelectRange>;
-export default _default;
-export declare const KSelectRangePrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectRangeProps>;
-export declare const KSelectRangeMinimumDate: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectRangeProps>;
-export declare const KSelectRangeHoverText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectRangeProps>;

package/dist/components/KSelectRangeDate/KSelectRangeDate.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta } from "@storybook/react";
-import KSelectRangeDate, { KSelectRangeDateProps } from "./KSelectRangeDate";
-declare const _default: Meta<typeof KSelectRangeDate>;
-export default _default;
-export declare const KSelectRangePrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectRangeDateProps>;
-export declare const KSelectRangeWeekly: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectRangeDateProps>;
-export declare const KSelectRangeDateMinimumDate: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectRangeDateProps>;
-export declare const KSelectRangeHoverText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSelectRangeDateProps>;

package/dist/components/KSlider/KSlider.stories.d.ts

@@ -1,5 +0,0 @@
-import { Meta } from "@storybook/react";
-import KSlider from "./KSlider";
-declare const _default: Meta<typeof KSlider>;
-export default _default;
-export declare const KSliderPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KSlider").KSliderProps>;

package/dist/components/KSliderLabel/KSliderLabel.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from "@storybook/react";
-import KSliderLabel, { SliderLabelProps } from "./KSliderLabel";
-declare const _default: Meta<typeof KSliderLabel>;
-export default _default;
-export declare const KSliderLabelPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, SliderLabelProps>;
-export declare const KSliderLabelHoverText: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, SliderLabelProps>;

package/dist/components/KSpan/KSpan.stories.d.ts

@@ -1,5 +0,0 @@
-import { Meta } from "@storybook/react";
-import KSpan, { KSpanProps } from "./KSpan";
-declare const _default: Meta<typeof KSpan>;
-export default _default;
-export declare const KSpanPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KSpanProps>;

package/dist/components/KTextArea/KTextArea.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta } from "@storybook/react";
-import KTextArea from "./KTextArea";
-declare const _default: Meta<typeof KTextArea>;
-export default _default;
-export declare const KTextAreaPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KTextArea").KTextAreaProps>;
-export declare const KTextAreaLeftIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KTextArea").KTextAreaProps>;
-export declare const KTextAreaRightIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KTextArea").KTextAreaProps>;
-export declare const KTextAreaLeftRightIcon: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./KTextArea").KTextAreaProps>;

package/dist/components/KTitleSpan/KTitleSpan.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from "@storybook/react";
-import KTitleSpan, { KTitleSpanProps } from "./KTitleSpan";
-declare const _default: Meta<typeof KTitleSpan>;
-export default _default;
-export declare const KTitleSpanPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KTitleSpanProps>;
-export declare const KTitleSpanSecondary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KTitleSpanProps>;

package/dist/components/KTooltip/KTooltip.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from "@storybook/react";
-import KTooltip, { KTooltipProps } from "./KTooltip";
-declare const _default: Meta<typeof KTooltip>;
-export default _default;
-export declare const KTooltipPrimary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KTooltipProps>;
-export declare const KTooltipSecondary: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, KTooltipProps>;