@dotss/tictoccroc 0.3.0 → 0.3.1

package/dist/shared/components/Calendar/Calendar.d.ts

@@ -7,5 +7,5 @@ export interface CalendarProps extends Omit<FlexboxProps, 'onChange' | 'value'>,
     weekHeadInlineCSS?: FlexboxProps['inlineCSS'];
     datePickerProps?: Omit<DatePickerProps, 'onChange' | 'value' | 'date'>;
 }
-declare const Calendar: any;
+declare const Calendar: import('react').ForwardRefExoticComponent<Omit<CalendarProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export default Calendar;

package/dist/shared/components/Image/Image.d.ts

@@ -20,5 +20,5 @@ export interface ImageProps extends Omit<HTMLProps<HTMLImageElement>, 'onError'>
     enableErrorFallback?: boolean;
     renderErrorFallback?: () => ReactNode;
 }
-declare const Image: any;
+declare const Image: import('react').ForwardRefExoticComponent<Omit<ImageProps, "ref"> & import('react').RefAttributes<HTMLImageElement>>;
 export default Image;

package/dist/shared/components/Masonry/Masonry.utils.d.ts

@@ -7,7 +7,7 @@ export declare function getHorizontalLayoutRows(images: {
     originalWidth?: number;
     width: number;
     height: number;
-}[], blocks: ReactElement<MasonryBlockProps>[], rowCount: number, fallbackWidth: number): ReactElement<MasonryBlockProps>[][];
+}[], blocks: ReactElement<MasonryBlockProps>[], rowCount: number, fallbackWidth: number): ReactElement<MasonryBlockProps, string | import('react').JSXElementConstructor<any>>[][];
 export declare function findNextFocusableElement(currentElement: HTMLDivElement, keyDirection: 'left' | 'right' | 'up' | 'down', candidates: (HTMLDivElement | null)[]): HTMLDivElement | null;
 export declare function getNextIndexHorizontalFromRows(rows: HTMLDivElement[][], currentIndex: number, keyDirection: 'up' | 'down' | 'left' | 'right'): number | null;
 export declare function findImageInChildren(children: ReactNode): ReactElement<ImageProps> | null;

package/dist/shared/components/Masonry/MasonryBlock/MasonryBlock.d.ts

@@ -17,5 +17,5 @@ export interface MasonryBlockProps extends FlexboxProps {
     }>;
     setInnerRef?: (ref: HTMLDivElement | null) => void;
 }
-declare const MasonryBlock: any;
+declare const MasonryBlock: import('react').ForwardRefExoticComponent<Omit<MasonryBlockProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export default MasonryBlock;

package/dist/shared/components/TimePicker/TimePicker.d.ts

@@ -19,5 +19,5 @@ export interface TimePickerProps extends Omit<FlexboxProps, 'onChange'> {
     renderStartTimeLabel?: (item: TimePickerItem, isSelected: boolean) => ReactNode;
     renderEndTimeLabel?: (item: TimePickerItem, isSelected: boolean) => ReactNode;
 }
-declare const TimePicker: any;
+declare const TimePicker: import('react').ForwardRefExoticComponent<Omit<TimePickerProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export default TimePicker;

package/dist/shared/components/TimePicker/TimePicker.mjs

@@ -1,9 +1,9 @@
 import { jsxs as R, jsx as c } from "react/jsx-runtime";
-import { forwardRef as O, useState as j, useRef as w, useEffect as r } from "react";
-import { ChainPicker as I, Typography as S, Flexbox as Q } from "@dotss/ui";
+import { forwardRef as O, useState as j, useRef as w, useCallback as Q, useEffect as r } from "react";
+import { Flexbox as U, Typography as S, ChainPicker as I } from "@dotss/ui";
 import z from "@emotion/styled";
-import b from "../../utils/getTimeRange/getTimeRange.mjs";
-const U = z.div`
+import x from "../../utils/getTimeRange/getTimeRange.mjs";
+const V = z.div`
   position: relative;
   display: flex;
   align-items: center;
@@ -11,36 +11,36 @@ const U = z.div`
   gap: ${({ theme: { spacing: o } }) => o.content(7)}px;
   width: 100%;
   padding: ${({ theme: { spacing: o } }) => o.content(2)}px 0;
-`, V = z.div`
+`, W = z.div`
   position: absolute;
   width: 100%;
   height: 54px;
   background: ${({ theme: o }) => o.palette.background.primary};
   border-radius: 12px;
-`, k = O(function({
+`, C = O(function({
   onChange: F,
   onChangeStartTime: p,
   onChangeEndTime: s,
   startTime: l = 9,
-  endTime: n = 12,
-  range: t = [0, 24],
+  endTime: t = 12,
+  range: n = [0, 24],
   step: i = 1,
-  startTimeChainPickerProps: m,
-  endTimeChainPickerProps: f,
+  startTimeChainPickerProps: u,
+  endTimeChainPickerProps: d,
   timePickerHighlightProps: H,
   renderStartTimeLabel: N,
   renderEndTimeLabel: q,
   inlineCSS: A,
   ...B
 }, D) {
-  const [a, y] = j(l), [u, x] = j(n), E = w(
-    b(0, 24, { minTime: t[0], maxTime: t[1] - i })
-  ), d = w(
-    b(0, 24, { minTime: l + i, maxTime: t[1] })
-  ), $ = (e, h) => {
+  const [f, y] = j(l), [m, b] = j(t), E = w(
+    x(0, 24, { minTime: n[0], maxTime: n[1] - i })
+  ), a = w(
+    x(0, 24, { minTime: l + i, maxTime: n[1] })
+  ), h = Q((e, $) => {
     const [v, M] = e.label.split(":").map(Number), K = v >= 12, g = v % 12 || 12, L = K ? "오후" : "오전";
     return /* @__PURE__ */ R(
-      Q,
+      U,
       {
         gap: 1,
         alignItems: "center",
@@ -48,75 +48,73 @@ const U = z.div`
         "aria-label": `${L} ${g}시 ${M}분`,
         inlineCSS: { width: "82px" },
         children: [
-          /* @__PURE__ */ c(S, { tag: "span", variant: h ? "h5M" : "b5M", children: L }),
-          /* @__PURE__ */ c(S, { tag: "span", variant: h ? "h2M" : "h4M", children: `${g}:${M.toString().padStart(2, "0")}` })
+          /* @__PURE__ */ c(S, { tag: "span", variant: $ ? "h5M" : "b5M", children: L }),
+          /* @__PURE__ */ c(S, { tag: "span", variant: $ ? "h2M" : "h4M", children: `${g}:${M.toString().padStart(2, "0")}` })
         ]
       }
     );
-  }, G = (e) => {
-    y(e), d.current = b(0, 24, {
-      minTime: e + i > t[1] ? t[1] : e + i,
-      maxTime: t[1]
-    }), e >= n - 0.5 && x(d.current[0].value);
+  }, []), G = (e) => {
+    y(e), a.current = x(0, 24, {
+      minTime: e + i > n[1] ? n[1] : e + i,
+      maxTime: n[1]
+    }), e >= t - 0.5 && b(a.current[0].value);
   }, J = (e) => {
-    x(e);
+    b(e);
   };
   return r(() => {
-    d.current = b(0, 24, {
-      minTime: l + i > t[1] ? t[1] : l + i,
-      maxTime: t[1]
+    a.current = x(0, 24, {
+      minTime: l + i > n[1] ? n[1] : l + i,
+      maxTime: n[1]
     });
-  }, [l, n, t, i]), r(() => {
+  }, [l, t, n, i]), r(() => {
     y(l);
   }, [l]), r(() => {
-    l >= n - 0.5 ? x(d.current[0].value) : x(n);
-  }, [l, n]), r(() => {
-    F(a, u);
-  }, [a, u]), r(() => {
-    p == null || p(a);
-  }, [a]), r(() => {
-    s == null || s(u);
-  }, [u]), /* @__PURE__ */ R(U, { ref: D, css: A, role: "group", "aria-label": "시간 선택", ...B, children: [
-    /* @__PURE__ */ c(V, { ...H, "aria-hidden": !0 }),
+    l >= t - 0.5 ? b(a.current[0].value) : b(t);
+  }, [l, t]), r(() => {
+    F(f, m);
+  }, [f, m]), r(() => {
+    p == null || p(f);
+  }, [f]), r(() => {
+    s == null || s(m);
+  }, [m]), /* @__PURE__ */ R(V, { ref: D, css: A, role: "group", "aria-label": "시간 선택", ...B, children: [
+    /* @__PURE__ */ c(W, { ...H, "aria-hidden": !0 }),
     /* @__PURE__ */ c(
       I,
       {
         column: E.current,
         value: l,
         onChange: G,
-        renderLabel: N || $,
+        renderLabel: N || h,
         "aria-label": "시작 시간 선택",
         inlineCSS: {
           "& > li": {
             padding: 0
           },
-          ...m == null ? void 0 : m.inlineCSS
+          ...u == null ? void 0 : u.inlineCSS
         },
-        ...m
-      },
-      `start-time-${a}`
+        ...u
+      }
     ),
     /* @__PURE__ */ c(S, { variant: "h5M", color: "grey.50", "aria-hidden": !0, inlineCSS: { zIndex: 1 }, children: "부터" }),
     /* @__PURE__ */ c(
       I,
       {
-        column: d.current,
-        value: n,
+        column: a.current,
+        value: t,
         onChange: J,
-        renderLabel: q || $,
+        renderLabel: q || h,
         "aria-label": "종료 시간 선택",
         inlineCSS: {
           "& > li": {
             padding: 0
           },
-          ...f == null ? void 0 : f.inlineCSS
+          ...d == null ? void 0 : d.inlineCSS
         },
-        ...f
-      },
-      `end-time-${u}`
+        ...d
+      }
     )
   ] });
 });
 export {
-  k as default
+  C as default
 };

package/dist/shared/hooks/useInView/useInView.d.ts

@@ -1,4 +1,4 @@
 import { RefObject } from 'react';
 export default function useInView(targetRef: RefObject<HTMLElement | null>, options?: IntersectionObserverInit): {
-    isInView: any;
+    isInView: boolean;
 };

package/dist/shared/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.d.ts

@@ -1,2 +1,3 @@
-declare const useIsomorphicLayoutEffect: any;
+import { useEffect } from 'react';
+declare const useIsomorphicLayoutEffect: typeof useEffect;
 export default useIsomorphicLayoutEffect;

package/dist/teacher/profile/components/AvailableScheduleSection/AvailableScheduleSection.d.ts

@@ -18,5 +18,5 @@ export interface AvailableScheduleSectionProps extends FlexboxProps {
         };
     };
 }
-declare const AvailableScheduleSection: any;
+declare const AvailableScheduleSection: import('react').ForwardRefExoticComponent<Omit<AvailableScheduleSectionProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export default AvailableScheduleSection;

package/dist/teacher/profile/components/CareNoteSection/CareNoteSection.d.ts

@@ -3,5 +3,5 @@ export interface CareNoteSectionProps extends FlexboxProps {
     totalCount: number;
     onClickViewAll?: () => void;
 }
-declare const CareNoteSection: any;
+declare const CareNoteSection: import('react').ForwardRefExoticComponent<Omit<CareNoteSectionProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export default CareNoteSection;

package/dist/teacher/profile/components/ParentReviewSection/ParentReviewSection.d.ts

@@ -3,5 +3,5 @@ export interface ParentReviewSectionProps extends FlexboxProps {
     totalCount: number;
     onClickViewAll?: () => void;
 }
-declare const ParentReviewSection: any;
+declare const ParentReviewSection: import('react').ForwardRefExoticComponent<Omit<ParentReviewSectionProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
 export default ParentReviewSection;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dotss/tictoccroc",
   "type": "module",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "Tictoccroc shared components, hooks, utils, and APIs for Dotss",
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
@@ -103,6 +103,7 @@
   "devDependencies": {
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
+    "@storybook/addon-docs": "^9.0.4",
     "@storybook/addon-onboarding": "^9.0.4",
     "@storybook/react-vite": "^9.0.4",
     "@types/node": "^22.15.29",
@@ -111,7 +112,11 @@
     "glob": "^10.4.2",
     "storybook": "^9.0.4",
     "vite-plugin-dts": "^4.5.4",
-    "vitest": "^1.6.0"
+    "vitest": "^1.6.0",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0"
   },
   "peerDependencies": {
     "@dotss/ui": ">=1.0.3",