@tipp/ui 1.4.24 → 1.4.26

package/dist/molecules/navigation.js

@@ -3,6 +3,7 @@ import {
 } from "../chunk-F44BXTHN.js";
 import "../chunk-KTVZ4KLX.js";
 import "../chunk-OHBL3CTQ.js";
+import "../chunk-FR2GDOU2.js";
 import "../chunk-74DX4CU7.js";
 import "../chunk-OYM4XCHQ.js";
 import "../chunk-YJ7ZFOYL.js";
@@ -10,14 +11,15 @@ import "../chunk-5ZITU5L7.js";
 import "../chunk-EW6OPYEW.js";
 import "../chunk-VOQU7ZOV.js";
 import "../chunk-CYYWMYE7.js";
+import "../chunk-6DJOIRMF.js";
 import "../chunk-FPD73OHW.js";
 import "../chunk-ZKZDVS7G.js";
 import "../chunk-MUNMDHRF.js";
 import "../chunk-TVDKGMBI.js";
-import "../chunk-3JRNKBMN.js";
+import "../chunk-AA46GU2O.js";
 import "../chunk-HYITAA4J.js";
 import "../chunk-5H3YPCZK.js";
-import "../chunk-FR2GDOU2.js";
+import "../chunk-XQOL7UBI.js";
 import "../chunk-TULWX7D6.js";
 import "../chunk-SIM6HKVI.js";
 import "../chunk-3GR5ZATM.js";
@@ -25,41 +27,39 @@ import "../chunk-5AVBYDPB.js";
 import "../chunk-365QMK4D.js";
 import "../chunk-YO3BQW6S.js";
 import "../chunk-6IVCARWS.js";
-import "../chunk-6DJOIRMF.js";
+import "../chunk-2DZ2Y3JI.js";
 import "../chunk-DJN2IEY6.js";
 import "../chunk-25HMMI7R.js";
 import "../chunk-EGEQY3KT.js";
 import "../chunk-HK224ADT.js";
 import "../chunk-O3T3TM3V.js";
 import "../chunk-O3DNDMV3.js";
-import "../chunk-XQOL7UBI.js";
+import "../chunk-OHMOP5PV.js";
 import "../chunk-LZJR77Q2.js";
 import "../chunk-Q37G2GS6.js";
 import "../chunk-VTJZMOSP.js";
 import "../chunk-2VD5Y72N.js";
-import "../chunk-HS4UMG25.js";
+import "../chunk-UC627KGO.js";
 import "../chunk-4WFMOFN2.js";
 import "../chunk-WKFZ5MMN.js";
 import "../chunk-ACVANQJ4.js";
 import "../chunk-52MVZ6AN.js";
-import "../chunk-2DZ2Y3JI.js";
+import "../chunk-4Y5BEXVN.js";
 import "../chunk-U7JPP7WJ.js";
+import "../chunk-LQY4RKWI.js";
 import "../chunk-ZD7MNMED.js";
 import "../chunk-B6XJN6EC.js";
 import "../chunk-UVKNLJDZ.js";
 import "../chunk-MIMJ7LON.js";
 import "../chunk-IQEEPHOY.js";
 import "../chunk-LHCDPZ5E.js";
-import "../chunk-OHMOP5PV.js";
-import "../chunk-LQY4RKWI.js";
+import "../chunk-F77ES5Y3.js";
 import "../chunk-J242TTFH.js";
 import "../chunk-EAXUQEO5.js";
 import "../chunk-YJCCE5WP.js";
 import "../chunk-3SSSCLJ5.js";
 import "../chunk-EWD4AO5N.js";
 import "../chunk-YGL6SWKN.js";
-import "../chunk-4Y5BEXVN.js";
-import "../chunk-F77ES5Y3.js";
 import "../chunk-N552FDTV.js";
 export {
   Navigation

package/dist/molecules/stepper.js

@@ -1,10 +1,10 @@
 import {
   Stepper
-} from "../chunk-DTWPFSUG.js";
+} from "../chunk-KVNTQ4LE.js";
 import "../chunk-25HMMI7R.js";
 import "../chunk-52MVZ6AN.js";
-import "../chunk-3SSSCLJ5.js";
 import "../chunk-F77ES5Y3.js";
+import "../chunk-3SSSCLJ5.js";
 import "../chunk-N552FDTV.js";
 export {
   Stepper

package/dist/molecules/tag-selector.js

@@ -1,8 +1,9 @@
 import {
   TagSelector
-} from "../chunk-AY53GMSH.js";
+} from "../chunk-XBI2YSRP.js";
 import "../chunk-KTVZ4KLX.js";
 import "../chunk-OHBL3CTQ.js";
+import "../chunk-FR2GDOU2.js";
 import "../chunk-74DX4CU7.js";
 import "../chunk-OYM4XCHQ.js";
 import "../chunk-YJ7ZFOYL.js";
@@ -10,14 +11,15 @@ import "../chunk-5ZITU5L7.js";
 import "../chunk-EW6OPYEW.js";
 import "../chunk-VOQU7ZOV.js";
 import "../chunk-CYYWMYE7.js";
+import "../chunk-6DJOIRMF.js";
 import "../chunk-FPD73OHW.js";
 import "../chunk-ZKZDVS7G.js";
 import "../chunk-MUNMDHRF.js";
 import "../chunk-TVDKGMBI.js";
-import "../chunk-3JRNKBMN.js";
+import "../chunk-AA46GU2O.js";
 import "../chunk-HYITAA4J.js";
 import "../chunk-5H3YPCZK.js";
-import "../chunk-FR2GDOU2.js";
+import "../chunk-XQOL7UBI.js";
 import "../chunk-TULWX7D6.js";
 import "../chunk-SIM6HKVI.js";
 import "../chunk-3GR5ZATM.js";
@@ -25,41 +27,39 @@ import "../chunk-5AVBYDPB.js";
 import "../chunk-365QMK4D.js";
 import "../chunk-YO3BQW6S.js";
 import "../chunk-6IVCARWS.js";
-import "../chunk-6DJOIRMF.js";
+import "../chunk-2DZ2Y3JI.js";
 import "../chunk-DJN2IEY6.js";
 import "../chunk-25HMMI7R.js";
 import "../chunk-EGEQY3KT.js";
 import "../chunk-HK224ADT.js";
 import "../chunk-O3T3TM3V.js";
 import "../chunk-O3DNDMV3.js";
-import "../chunk-XQOL7UBI.js";
+import "../chunk-OHMOP5PV.js";
 import "../chunk-LZJR77Q2.js";
 import "../chunk-Q37G2GS6.js";
 import "../chunk-VTJZMOSP.js";
 import "../chunk-2VD5Y72N.js";
-import "../chunk-HS4UMG25.js";
+import "../chunk-UC627KGO.js";
 import "../chunk-4WFMOFN2.js";
 import "../chunk-WKFZ5MMN.js";
 import "../chunk-ACVANQJ4.js";
 import "../chunk-52MVZ6AN.js";
-import "../chunk-2DZ2Y3JI.js";
+import "../chunk-4Y5BEXVN.js";
 import "../chunk-U7JPP7WJ.js";
+import "../chunk-LQY4RKWI.js";
 import "../chunk-ZD7MNMED.js";
 import "../chunk-B6XJN6EC.js";
 import "../chunk-UVKNLJDZ.js";
 import "../chunk-MIMJ7LON.js";
 import "../chunk-IQEEPHOY.js";
 import "../chunk-LHCDPZ5E.js";
-import "../chunk-OHMOP5PV.js";
-import "../chunk-LQY4RKWI.js";
+import "../chunk-F77ES5Y3.js";
 import "../chunk-J242TTFH.js";
 import "../chunk-EAXUQEO5.js";
 import "../chunk-YJCCE5WP.js";
 import "../chunk-3SSSCLJ5.js";
 import "../chunk-EWD4AO5N.js";
 import "../chunk-YGL6SWKN.js";
-import "../chunk-4Y5BEXVN.js";
-import "../chunk-F77ES5Y3.js";
 import "../chunk-N552FDTV.js";
 export {
   TagSelector

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tipp/ui",
-  "version": "1.4.24",
+  "version": "1.4.26",
   "private": false,
   "sideEffects": false,
   "type": "module",

package/src/atoms/select.tsx

@@ -1,5 +1,9 @@
 import { Select as RadixSelect } from '@radix-ui/themes';
-import { forwardRef, useMemo } from 'react';
+import { createContext, forwardRef, useContext, useMemo } from 'react';
+
+const SelectContext = createContext<{ error?: boolean }>({
+  error: false,
+});
 
 export type ContentProps = RadixSelect.ContentProps & {
   isNavigation?: boolean;
@@ -7,11 +11,13 @@ export type ContentProps = RadixSelect.ContentProps & {
 
 const Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {
   const { className, isNavigation, ...rest } = props;
+  const { error } = useContext(SelectContext);
 
   const cls = useMemo(() => {
     const etc = isNavigation ? 'nav-select' : '';
-    return [etc, className].join(' ');
-  }, [className, isNavigation]);
+    const errorCls = error ? 'tipp-error' : '';
+    return [etc, errorCls, className].join(' ');
+  }, [className, error, isNavigation]);
 
   return (
     <RadixSelect.Content
@@ -22,10 +28,43 @@ const Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {
     />
   );
 });
-
 Content.displayName = 'Select.Content';
 
+const Trigger = forwardRef<HTMLButtonElement, RadixSelect.TriggerProps>(
+  (props, ref) => {
+    const { className, ...rest } = props;
+    const { error } = useContext(SelectContext);
+
+    const cls = useMemo(() => {
+      const errorCls = error ? 'error' : '';
+      return [errorCls, className].join(' ');
+    }, [className, error]);
+
+    return <RadixSelect.Trigger {...rest} className={cls} ref={ref} />;
+  }
+);
+
+Trigger.displayName = 'Select.Trigger';
+
+type RootProps = RadixSelect.RootProps & {
+  error?: boolean;
+};
+
+function Root(props: RootProps): React.ReactElement {
+  const { error, ...rest } = props;
+
+  return (
+    <SelectContext.Provider value={{ error }}>
+      <RadixSelect.Root {...rest} />
+    </SelectContext.Provider>
+  );
+}
+
+Root.displayName = 'Select.Root';
+
 export const Select = {
   ...RadixSelect,
+  Root,
+  Trigger,
   Content,
 };

package/src/molecules/date-picker/index.tsx

@@ -58,8 +58,10 @@ const renderCustomHeader: ReactDatePickerProps['renderCustomHeader'] = (
     nextMonthButtonDisabled,
   } = props;
 
-  const year = date.getFullYear();
-  const month = date.getMonth();
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- date가 undefined일 수 있음
+  const year = date ? date.getFullYear() : '-';
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- date가 undefined일 수 있음
+  const month = date ? date.getMonth() + 1 : '-';
 
   return (
     <Flex align="center" justify="between" pb="2" pl="2" pr="2">
@@ -75,7 +77,7 @@ const renderCustomHeader: ReactDatePickerProps['renderCustomHeader'] = (
           {year}년
         </Heading>
         <Heading variant="heading4" weight="regular">
-          {month + 1}월
+          {month}월
         </Heading>
       </Flex>