@reitwagen/design-components 0.2.2 → 0.3.1

package/dist/components/Icons/IconAlarmOff.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconAlarmOff({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: [(0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M12 1.75c4.645 0 7.516 3.7 7.516 6.99a1 1 0 0 1-.007.105c-.232 1.62.18 2.777.676 3.746.127.248.26.482.392.717.13.23.264.466.382.696.23.449.45.973.45 1.547a2.3 2.3 0 0 1-.772 1.76c-.483.438-1.15.723-1.919.921-1.534.396-3.787.518-6.717.518L12 18.749c-2.93 0-5.184-.121-6.718-.517-.769-.198-1.435-.483-1.918-.921a2.3 2.3 0 0 1-.773-1.76c0-.574.221-1.098.45-1.547.118-.23.253-.467.383-.696.132-.235.264-.47.391-.717.496-.97.908-2.125.677-3.746a1 1 0 0 1-.008-.106c0-3.289 2.872-6.989 7.517-6.989" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", fillRule: "evenodd", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M15 20c-1.16 3-4.914 3-6 0z", clipRule: "evenodd" })] }));
 }

package/dist/components/Icons/IconAlarmOn.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconAlarmOn({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconAlarmOn;
 //# sourceMappingURL=IconAlarmOn.d.ts.map

package/dist/components/Icons/IconAlarmOn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconAlarmOn.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconAlarmOn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,KAAU,EAAE,MAAW,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CA2B3E;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"IconAlarmOn.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconAlarmOn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,KAAU,EAAE,MAAW,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CA2B3E;AAED,eAAe,WAAW,CAAC"}

package/dist/components/Icons/IconAlarmOn.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconAlarmOn({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: [(0, jsx_runtime_1.jsx)("path", { fill: "currentColor", fillRule: "evenodd", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M15 20c-1.16 3-4.914 3-6 0z", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { fill: "#F74444", d: "M22 4.5a2.5 2.5 0 1 1-5 0 2.5 2.5 0 0 1 5 0" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M12.001 1.75c1.695 0 3.152.495 4.321 1.28A3.5 3.5 0 0 0 19.467 8q.048.372.05.74 0 .053-.008.106c-.231 1.62.181 2.777.677 3.746.126.248.259.482.391.717.13.23.264.466.382.696.23.449.451.973.451 1.547a2.3 2.3 0 0 1-.773 1.76c-.483.438-1.15.723-1.918.921-1.535.396-3.788.518-6.718.518L12 18.749c-2.93 0-5.183-.121-6.718-.517-.769-.198-1.435-.483-1.918-.921a2.3 2.3 0 0 1-.773-1.76c0-.574.221-1.098.451-1.547.118-.23.252-.467.382-.696.132-.235.265-.47.391-.717.496-.969.908-2.125.677-3.746a1 1 0 0 1-.008-.106c0-3.289 2.873-6.989 7.517-6.989" })] }));
 }

package/dist/components/Icons/IconAppleDefault.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconAppleDefault({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconAppleDefault;
 //# sourceMappingURL=IconAppleDefault.d.ts.map

package/dist/components/Icons/IconAppleDefault.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconAppleDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconAppleDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAiBP;AAED,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"IconAppleDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconAppleDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAiBP;AAED,eAAe,gBAAgB,CAAC"}

package/dist/components/Icons/IconAppleDefault.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconAppleDefault({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M17.713 12.481c-.01-1.626.742-2.85 2.26-3.754-.85-1.192-2.134-1.848-3.826-1.974-1.603-.124-3.357.915-3.999.915-.678 0-2.23-.872-3.45-.872-2.52.038-5.198 1.969-5.198 5.897q0 1.742.65 3.595c.578 1.626 2.665 5.609 4.842 5.545 1.138-.027 1.943-.792 3.424-.792 1.437 0 2.181.792 3.451.792 2.196-.031 4.083-3.652 4.633-5.283-2.945-1.36-2.787-3.985-2.787-4.069m-2.556-7.27C16.39 3.776 16.278 2.47 16.24 2c-1.09.062-2.349.727-3.066 1.545-.79.877-1.255 1.961-1.155 3.184 1.177.088 2.252-.505 3.137-1.518" }) }));
 }

package/dist/components/Icons/IconArrowDown.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconArrowDown({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconArrowDown;
 //# sourceMappingURL=IconArrowDown.d.ts.map

package/dist/components/Icons/IconArrowDown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconArrowDown.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowDown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAoBP;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"IconArrowDown.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowDown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAoBP;AAED,eAAe,aAAa,CAAC"}

package/dist/components/Icons/IconArrowDown.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconArrowDown({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M12.274 19.75v-15M18.299 13.7l-6.024 6.05L6.25 13.7" }) }));
 }

package/dist/components/Icons/IconArrowLeft.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconArrowLeft({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconArrowLeft;
 //# sourceMappingURL=IconArrowLeft.d.ts.map

package/dist/components/Icons/IconArrowLeft.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconArrowLeft.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowLeft.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAoBP;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"IconArrowLeft.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowLeft.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAoBP;AAED,eAAe,aAAa,CAAC"}

package/dist/components/Icons/IconArrowLeft.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconArrowLeft({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M4.25 12.274h15M10.3 18.299l-6.05-6.024L10.3 6.25" }) }));
 }

package/dist/components/Icons/IconArrowRight.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconArrowRight({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconArrowRight;
 //# sourceMappingURL=IconArrowRight.d.ts.map

package/dist/components/Icons/IconArrowRight.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconArrowRight.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowRight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAoBP;AAED,eAAe,cAAc,CAAC"}
+{"version":3,"file":"IconArrowRight.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowRight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAoBP;AAED,eAAe,cAAc,CAAC"}

package/dist/components/Icons/IconArrowRight.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconArrowRight({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19.75 11.726h-15M13.7 5.701l6.05 6.024-6.05 6.025" }) }));
 }

package/dist/components/Icons/IconArrowUp.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconArrowUp({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconArrowUp;
 //# sourceMappingURL=IconArrowUp.d.ts.map

package/dist/components/Icons/IconArrowUp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconArrowUp.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowUp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,KAAU,EAAE,MAAW,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CAoB3E;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"IconArrowUp.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconArrowUp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,KAAU,EAAE,MAAW,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,2CAoB3E;AAED,eAAe,WAAW,CAAC"}

package/dist/components/Icons/IconArrowUp.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconArrowUp({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M11.726 4.25v15M5.701 10.3l6.024-6.05 6.025 6.05" }) }));
 }

package/dist/components/Icons/IconBikeDefault.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconBikeDefault({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconBikeDefault;
 //# sourceMappingURL=IconBikeDefault.d.ts.map

package/dist/components/Icons/IconBikeDefault.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconBikeDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconBikeDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAsDP;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"IconBikeDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconBikeDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAsDP;AAED,eAAe,eAAe,CAAC"}

package/dist/components/Icons/IconBikeDefault.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconBikeDefault({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: [(0, jsx_runtime_1.jsxs)("g", { clipPath: "url(#prefix__a)", children: [(0, jsx_runtime_1.jsx)("path", { fill: "#3C3C4A", fillRule: "evenodd", d: "M5.598 12.226a2.77 2.77 0 0 1 2.624 2.762l-.004.142a2.77 2.77 0 0 1-2.762 2.623l-.142-.003a2.77 2.77 0 0 1-2.62-2.62l-.003-.142a2.77 2.77 0 0 1 2.765-2.766zm-.142 2.07a.692.692 0 1 0 .071.004z", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { fill: "#3C3C4A", d: "M19.234 12.222A2.77 2.77 0 0 1 22 14.988a2.77 2.77 0 0 1-2.766 2.765 2.77 2.77 0 0 1-2.765-2.765 2.77 2.77 0 0 1 2.765-2.766" }), (0, jsx_runtime_1.jsx)("path", { fill: "#9D9DA8", d: "M5.579 14.627a.346.346 0 0 0 .481.087l2.507-1.737a.346.346 0 0 0-.394-.568l-2.507 1.737a.346.346 0 0 0-.087.481M19.252 14.48a.345.345 0 0 1-.393-.15l-1.419-2.3a.346.346 0 0 1 .59-.359l1.419 2.299a.346.346 0 0 1-.197.51m-.724.326a.35.35 0 0 1-.33-.075l-1.729-1.56a.345.345 0 1 1 .464-.513l1.729 1.56a.345.345 0 0 1-.134.588" }), (0, jsx_runtime_1.jsx)("path", { fill: "#9D9DA8", d: "M5.81 15.059a.345.345 0 0 0 .409.268l3.004-.629a.345.345 0 1 0-.141-.677l-3.005.629a.345.345 0 0 0-.267.409" }), (0, jsx_runtime_1.jsx)("path", { fill: "#4878FF", fillRule: "evenodd", d: "M14.527 6.122a.35.35 0 0 1 .39-.099l1.962.769c2.153.842 3.638 2.432 3.785 4.738a.347.347 0 0 1-.424.358 4.2 4.2 0 0 0-1.572-.067c-1.73.248-3.154 1.618-3.462 3.331a4.3 4.3 0 0 0-.058 1.093.347.347 0 0 1-.345.373h-4.87a1.04 1.04 0 0 1-1.037-1.038v-.818c0-1.215-.595-1.91-1.59-2.603l-1.75-1.048L3.333 12l-.7.76a.345.345 0 1 1-.575-.383l.691-1.038q.057-.085.152-.126l1.699-.729-1.745-1.079-.006-.004-.011-.008a.4.4 0 0 1-.042-.034l-.008-.008a.3.3 0 0 1-.035-.042q-.01-.015-.018-.032-.008-.014-.015-.029a.3.3 0 0 1-.019-.053L2.7 9.188a.35.35 0 0 1-.002-.145l.002-.009.005-.02.004-.013a.3.3 0 0 1 .034-.072l.004-.006.007-.01a.34.34 0 0 1 .191-.135l.019-.005a.4.4 0 0 1 .069-.007h3.806c.109 0 .212.051.277.138l.933 1.244h2.713c.423-1.191 1.914-2.074 3.682-2.074.348 0 .693.035 1.025.102l-.976-1.655a.35.35 0 0 1 .034-.4m3.392 2.046c-.08.646.143 1.33.704 1.842.28.255.637.405 1.012.46a5.3 5.3 0 0 0-1.716-2.302", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { fill: "#fff", d: "M5.456 16.025a1.04 1.04 0 0 1-1.037-1.037c0-.572.465-1.037 1.037-1.037s1.037.465 1.037 1.037-.465 1.037-1.037 1.037M19.234 13.951c.572 0 1.038.465 1.038 1.037s-.466 1.037-1.038 1.037a1.038 1.038 0 0 1 0-2.074" }), (0, jsx_runtime_1.jsx)("path", { fill: "#A0CBFF", fillRule: "evenodd", d: "M17.949 7.318c1.307.763 2.24 1.878 2.58 3.337a2.444 2.444 0 0 1-2.58-3.337", clipRule: "evenodd" })] }), (0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsx)("clipPath", { id: "prefix__a", children: (0, jsx_runtime_1.jsx)("path", { fill: "#fff", d: "M0 0h24v24H0z" }) }) })] }));
 }

package/dist/components/Icons/IconBookmarkOff.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconBookmarkOff({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconBookmarkOff;
 //# sourceMappingURL=IconBookmarkOff.d.ts.map

package/dist/components/Icons/IconBookmarkOff.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconBookmarkOff.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconBookmarkOff.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAqBP;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"IconBookmarkOff.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconBookmarkOff.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAqBP;AAED,eAAe,eAAe,CAAC"}

package/dist/components/Icons/IconBookmarkOff.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconBookmarkOff({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19.739 6.154c0-2.751-1.88-3.854-4.589-3.854H8.791C6.167 2.3 4.2 3.328 4.2 5.97v14.724a.95.95 0 0 0 1.413.828l6.382-3.58 6.327 3.574a.95.95 0 0 0 1.417-.827z", clipRule: "evenodd" }) }));
 }

package/dist/components/Icons/IconBookmarkOn.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconBookmarkOn({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconBookmarkOn;
 //# sourceMappingURL=IconBookmarkOn.d.ts.map

package/dist/components/Icons/IconBookmarkOn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconBookmarkOn.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconBookmarkOn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAuBP;AAED,eAAe,cAAc,CAAC"}
+{"version":3,"file":"IconBookmarkOn.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconBookmarkOn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAuBP;AAED,eAAe,cAAc,CAAC"}

package/dist/components/Icons/IconBookmarkOn.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconBookmarkOn({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", fillRule: "evenodd", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M19.739 6.154c0-2.751-1.88-3.854-4.589-3.854H8.791C6.167 2.3 4.2 3.328 4.2 5.97v14.724a.95.95 0 0 0 1.413.828l6.382-3.58 6.327 3.574a.95.95 0 0 0 1.417-.827z", clipRule: "evenodd" }) }));
 }

package/dist/components/Icons/IconCafeDefault.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconCafeDefault({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconCafeDefault;
 //# sourceMappingURL=IconCafeDefault.d.ts.map

package/dist/components/Icons/IconCafeDefault.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconCafeDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCafeDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAuBP;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"IconCafeDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCafeDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAuBP;AAED,eAAe,eAAe,CAAC"}

package/dist/components/Icons/IconCafeDefault.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconCafeDefault({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: [(0, jsx_runtime_1.jsx)("path", { fill: "currentColor", fillRule: "evenodd", d: "M18.534 9.945c0 .101.08.184.182.187a3.548 3.548 0 0 1-.182 7.09h-.448c-.357 0-.683.194-.884.488a7.64 7.64 0 0 1-13.95-4.308v-3.366a1 1 0 0 1 1-1h13.73c.305 0 .552.247.552.552zm0 3.457a7.6 7.6 0 0 1-.234 1.876.245.245 0 0 0 .234.307 1.91 1.91 0 0 0 .955-3.565c-.478-.277-.955.192-.955.744z", clipRule: "evenodd" }), (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M10.524 3.096a.794.794 0 0 1 1.076.32l.145.267c.39.718.292 1.603-.243 2.22a.37.37 0 0 0-.046.423l.144.267a.794.794 0 0 1-1.396.757l-.145-.267a1.96 1.96 0 0 1 .243-2.22.37.37 0 0 0 .046-.423l-.144-.267a.795.795 0 0 1 .32-1.077" })] }));
 }

package/dist/components/Icons/IconCalendarDefault.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconCalendarDefault({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconCalendarDefault;
 //# sourceMappingURL=IconCalendarDefault.d.ts.map

package/dist/components/Icons/IconCalendarDefault.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconCalendarDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCalendarDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CA4BP;AAED,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"IconCalendarDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCalendarDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CA4BP;AAED,eAAe,mBAAmB,CAAC"}

package/dist/components/Icons/IconCalendarDefault.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconCalendarDefault({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: [(0, jsx_runtime_1.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M3.093 9.404h17.824M16.442 13.31h.01M12.005 13.31h.009M7.558 13.31h.01M16.442 17.196h.01M12.005 17.196h.009M7.558 17.196h.01M16.044 2v3.29M7.965 2v3.29" }), (0, jsx_runtime_1.jsx)("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M16.238 3.58H7.771C4.834 3.58 3 5.214 3 8.221v9.05C3 20.326 4.834 22 7.771 22h8.458C19.175 22 21 20.355 21 17.348V8.222c.01-3.007-1.816-4.643-4.762-4.643", clipRule: "evenodd" })] }));
 }

package/dist/components/Icons/IconCallDefault.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconCallDefault({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconCallDefault;
 //# sourceMappingURL=IconCallDefault.d.ts.map

package/dist/components/Icons/IconCallDefault.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconCallDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCallDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAiBP;AAED,eAAe,eAAe,CAAC"}
+{"version":3,"file":"IconCallDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCallDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAiBP;AAED,eAAe,eAAe,CAAC"}

package/dist/components/Icons/IconCallDefault.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconCallDefault({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", d: "M8.384 2.48a2.4 2.4 0 0 1 2.793 1.134l.089.18.794 1.764a3 3 0 0 1-.53 3.262l-.16.158-1.252 1.168c-.225.214-.056 1.04.76 2.454.734 1.272 1.332 1.866 1.626 1.898h.052l.063-.012 2.46-.752a1.8 1.8 0 0 1 1.877.53l.11.137 1.628 2.256a2.4 2.4 0 0 1-.15 2.997l-.147.15-.65.618a4.2 4.2 0 0 1-4.458.846c-2.322-.936-4.432-3.075-6.348-6.394-1.92-3.328-2.718-6.228-2.362-8.712a4.2 4.2 0 0 1 2.713-3.347l.232-.077z" }) }));
 }

package/dist/components/Icons/IconCameraDefault.d.ts

@@ -1,9 +1,18 @@
 import type { SVGProps } from "react";
 interface Props extends SVGProps<SVGSVGElement> {
-    className?: string;
+    className: string;
     width?: number;
     height?: number;
 }
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 declare function IconCameraDefault({ className, width, height, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 export default IconCameraDefault;
 //# sourceMappingURL=IconCameraDefault.d.ts.map

package/dist/components/Icons/IconCameraDefault.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconCameraDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCameraDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAmBP;AAED,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"IconCameraDefault.d.ts","sourceRoot":"","sources":["../../../src/components/Icons/IconCameraDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,UAAU,KAAM,SAAQ,QAAQ,CAAC,aAAa,CAAC;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,KAAU,EACV,MAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,2CAmBP;AAED,eAAe,iBAAiB,CAAC"}

package/dist/components/Icons/IconCameraDefault.js

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * `Icon-` 컴포넌트의 기본 사이즈는 24px을 기준으로 합니다. className 속성으로 text color를 지정하여 색상을 변경할 수 있습니다.
+ * @see [RDS Storybook: Icon](https://main--691ac7d6da1eb0c0acb5f3e2.chromatic.com/?path=/docs/components-icons--docs)
+ * @example
+ * ```tsx
+ * <Icon width={24} height={24} className="text-gray-500" />
+ * <Icon className="text-gray-500" />
+ * ```
+ */
 function IconCameraDefault({ className, width = 24, height = 24, ...props }) {
     return ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: width, height: height, fill: "none", viewBox: "0 0 24 24", className: className, ...props, children: (0, jsx_runtime_1.jsx)("path", { fill: "currentColor", fillRule: "evenodd", d: "M12 2c.652 0 1.31.026 1.876.079.54.05 1.08.131 1.442.275.758.302 1.194.953 1.466 1.44.136.243.264.51.353.682.106.208.162.292.188.32.114.125.263.218.42.28.16.063.296.08.358.08A3.9 3.9 0 0 1 22 9.052v7.795a4.97 4.97 0 0 1-4.97 4.97H6.97A4.97 4.97 0 0 1 2 16.847V9.052a3.9 3.9 0 0 1 3.898-3.896c.06 0 .197-.017.357-.08.156-.062.305-.155.421-.28l.063-.092c.03-.05.071-.123.125-.228.088-.172.215-.44.351-.682.272-.487.709-1.138 1.467-1.44.362-.144.903-.225 1.442-.275.567-.053 1.225-.08 1.876-.08m0 7.199a3.93 3.93 0 1 0 0 7.859 3.93 3.93 0 0 0 0-7.859m5.495-.7a1 1 0 0 0 0 2h.01a1 1 0 0 0 0-2z", clipRule: "evenodd" }) }));
 }