@kanmu/popcorn-icons 1.1.2 → 1.2.1

package/README.md

@@ -22,8 +22,14 @@ yarn add react-native-svg
 
 すべてのアイコンコンポーネントは以下のデフォルト値を持ちます。
 
-- サイズ: `24`（幅・高さ）
-- 色: `currentColor`（親要素のテキスト色を継承）
+- サイズ: `medium`
+- 色: `dark`
+
+`size` と `color` は Popcorn のデザイントークンに対応する文字列リテラルです。
+型としては `IconSize` / `IconColor` を利用できます。
+
+- `size`: `2xsmall` / `xsmall` / `small` / `medium` / `large` / `xlarge`
+- `color`: `blue` / `dark` / `default` / `disabled` / `green` / `inverse` / `light` / `link` / `red` / `yellow`
 
 ### 基本的な使用例
 
@@ -34,8 +40,8 @@ import {View} from 'react-native';
 const MyComponent = () => {
   return (
     <View>
-      <Icon name="house" color="#272A32" size={24} />
-      <Icon name="magnifyingGlass" color="#A6AAB7" size={24} />
+      <Icon color="dark" name="house" size="medium" />
+      <Icon color="light" name="magnifyingGlass" size="medium" />
     </View>
   );
 };
@@ -51,10 +57,10 @@ const CustomizedIcons = () => {
   return (
     <View style={styles.container}>
       <Icon
+        color="light"
         name="chevronRight"
-        size={36}
-        color="#A6AAB7"
         opacity={0.7}
+        size="large"
         style={{transform: [{rotate: '45deg'}]}}
       />
 
@@ -64,7 +70,7 @@ const CustomizedIcons = () => {
         accessibilityHint="検索画面を開きます"
         style={styles.iconButton}
       >
-        <Icon name="magnifyingGlass" size={20} color="#272A32" />
+        <Icon color="dark" name="magnifyingGlass" size="small"  />
       </Pressable>
     </View>
   );

package/dist/Icon.d.mts

@@ -2,11 +2,14 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { SvgProps } from 'react-native-svg';
 
 type IconName = 'bars' | 'bell' | 'bellFill' | 'calendar' | 'check' | 'checkCircleFill' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUp' | 'clockRotateLeft' | 'creditCard' | 'creditCardFill' | 'creditCardSwipe' | 'exclamationCircle' | 'exclamationCircleFill' | 'exclamationTriangle' | 'eyeFill' | 'eyeSlashFill' | 'file' | 'gauge' | 'gear' | 'gearFill' | 'gift' | 'giftFill' | 'globe' | 'handPointUp' | 'house' | 'houseFill' | 'lock' | 'magnifyingGlass' | 'minusCircle' | 'minusCircleFill' | 'mobile' | 'monthlyLimit' | 'phoneFill' | 'plus' | 'plusCircle' | 'plusCircleFill' | 'pochitto' | 'question' | 'questionCircle' | 'rotateRight' | 'shop' | 'squareDot' | 'unlock' | 'vandlykun' | 'xmark' | 'xmarkCircle' | 'xmarkCircleFill' | 'yenSign';
+type IconSize = '2xsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+type IconColor = 'blue' | 'dark' | 'default' | 'disabled' | 'green' | 'inverse' | 'light' | 'link' | 'red' | 'yellow';
 interface IconProps extends SvgProps {
     name: IconName;
-    size?: number;
+    size?: IconSize;
+    color?: IconColor;
 }
 declare const iconNames: IconName[];
-declare const Icon: ({ name, ...props }: IconProps) => react_jsx_runtime.JSX.Element;
+declare const Icon: ({ name, size, color, ...props }: IconProps) => react_jsx_runtime.JSX.Element;
 
-export { Icon, type IconName, type IconProps, Icon as default, iconNames };
+export { Icon, type IconColor, type IconName, type IconProps, type IconSize, Icon as default, iconNames };

package/dist/Icon.d.ts

@@ -2,11 +2,14 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { SvgProps } from 'react-native-svg';
 
 type IconName = 'bars' | 'bell' | 'bellFill' | 'calendar' | 'check' | 'checkCircleFill' | 'chevronDown' | 'chevronLeft' | 'chevronRight' | 'chevronUp' | 'clockRotateLeft' | 'creditCard' | 'creditCardFill' | 'creditCardSwipe' | 'exclamationCircle' | 'exclamationCircleFill' | 'exclamationTriangle' | 'eyeFill' | 'eyeSlashFill' | 'file' | 'gauge' | 'gear' | 'gearFill' | 'gift' | 'giftFill' | 'globe' | 'handPointUp' | 'house' | 'houseFill' | 'lock' | 'magnifyingGlass' | 'minusCircle' | 'minusCircleFill' | 'mobile' | 'monthlyLimit' | 'phoneFill' | 'plus' | 'plusCircle' | 'plusCircleFill' | 'pochitto' | 'question' | 'questionCircle' | 'rotateRight' | 'shop' | 'squareDot' | 'unlock' | 'vandlykun' | 'xmark' | 'xmarkCircle' | 'xmarkCircleFill' | 'yenSign';
+type IconSize = '2xsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+type IconColor = 'blue' | 'dark' | 'default' | 'disabled' | 'green' | 'inverse' | 'light' | 'link' | 'red' | 'yellow';
 interface IconProps extends SvgProps {
     name: IconName;
-    size?: number;
+    size?: IconSize;
+    color?: IconColor;
 }
 declare const iconNames: IconName[];
-declare const Icon: ({ name, ...props }: IconProps) => react_jsx_runtime.JSX.Element;
+declare const Icon: ({ name, size, color, ...props }: IconProps) => react_jsx_runtime.JSX.Element;
 
-export { Icon, type IconName, type IconProps, Icon as default, iconNames };
+export { Icon, type IconColor, type IconName, type IconProps, type IconSize, Icon as default, iconNames };

package/dist/Icon.js

@@ -34,7 +34,37 @@ __export(Icon_exports, {
 });
 module.exports = __toCommonJS(Icon_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_popcorn_tokens = require("@kanmu/popcorn-tokens");
 var icons = __toESM(require("./icons"));
+const getTokenNumber = (value) => {
+  if (typeof value === "object" && value !== null && "number" in value) {
+    return value.number;
+  }
+  if (typeof value === "number") {
+    return value;
+  }
+  return Number(value);
+};
+const iconSizeMap = {
+  "2xsmall": getTokenNumber(import_popcorn_tokens.icon2xsmall),
+  xsmall: getTokenNumber(import_popcorn_tokens.iconXsmall),
+  small: getTokenNumber(import_popcorn_tokens.iconSmall),
+  medium: getTokenNumber(import_popcorn_tokens.iconMedium),
+  large: getTokenNumber(import_popcorn_tokens.iconLarge),
+  xlarge: getTokenNumber(import_popcorn_tokens.iconXlarge)
+};
+const iconColorMap = {
+  blue: String(import_popcorn_tokens.colorsSemanticIconBlue),
+  dark: String(import_popcorn_tokens.colorsSemanticIconDark),
+  default: String(import_popcorn_tokens.colorsSemanticIconDefault),
+  disabled: String(import_popcorn_tokens.colorsSemanticIconDisabled),
+  green: String(import_popcorn_tokens.colorsSemanticIconGreen),
+  inverse: String(import_popcorn_tokens.colorsSemanticIconInverse),
+  light: String(import_popcorn_tokens.colorsSemanticIconLight),
+  link: String(import_popcorn_tokens.colorsSemanticIconLink),
+  red: String(import_popcorn_tokens.colorsSemanticIconRed),
+  yellow: String(import_popcorn_tokens.colorsSemanticIconYellow)
+};
 const iconMap = {
   bars: icons.Bars,
   bell: icons.Bell,
@@ -89,9 +119,9 @@ const iconMap = {
   yenSign: icons.YenSign
 };
 const iconNames = Object.keys(iconMap);
-const Icon = ({ name, ...props }) => {
+const Icon = ({ name, size = "medium", color = "dark", ...props }) => {
   const IconComponent = iconMap[name];
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconComponent, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconComponent, { ...props, size: iconSizeMap[size], color: iconColorMap[color] });
 };
 var Icon_default = Icon;
 // Annotate the CommonJS export names for ESM import in node:

package/dist/Icon.mjs

@@ -1,5 +1,52 @@
 import { jsx } from "react/jsx-runtime";
+import {
+  colorsSemanticIconBlue,
+  colorsSemanticIconDark,
+  colorsSemanticIconDefault,
+  colorsSemanticIconDisabled,
+  colorsSemanticIconGreen,
+  colorsSemanticIconInverse,
+  colorsSemanticIconLight,
+  colorsSemanticIconLink,
+  colorsSemanticIconRed,
+  colorsSemanticIconYellow,
+  icon2xsmall,
+  iconLarge,
+  iconMedium,
+  iconSmall,
+  iconXlarge,
+  iconXsmall
+} from "@kanmu/popcorn-tokens";
 import * as icons from "./icons";
+const getTokenNumber = (value) => {
+  if (typeof value === "object" && value !== null && "number" in value) {
+    return value.number;
+  }
+  if (typeof value === "number") {
+    return value;
+  }
+  return Number(value);
+};
+const iconSizeMap = {
+  "2xsmall": getTokenNumber(icon2xsmall),
+  xsmall: getTokenNumber(iconXsmall),
+  small: getTokenNumber(iconSmall),
+  medium: getTokenNumber(iconMedium),
+  large: getTokenNumber(iconLarge),
+  xlarge: getTokenNumber(iconXlarge)
+};
+const iconColorMap = {
+  blue: String(colorsSemanticIconBlue),
+  dark: String(colorsSemanticIconDark),
+  default: String(colorsSemanticIconDefault),
+  disabled: String(colorsSemanticIconDisabled),
+  green: String(colorsSemanticIconGreen),
+  inverse: String(colorsSemanticIconInverse),
+  light: String(colorsSemanticIconLight),
+  link: String(colorsSemanticIconLink),
+  red: String(colorsSemanticIconRed),
+  yellow: String(colorsSemanticIconYellow)
+};
 const iconMap = {
   bars: icons.Bars,
   bell: icons.Bell,
@@ -54,9 +101,9 @@ const iconMap = {
   yenSign: icons.YenSign
 };
 const iconNames = Object.keys(iconMap);
-const Icon = ({ name, ...props }) => {
+const Icon = ({ name, size = "medium", color = "dark", ...props }) => {
   const IconComponent = iconMap[name];
-  return /* @__PURE__ */ jsx(IconComponent, { ...props });
+  return /* @__PURE__ */ jsx(IconComponent, { ...props, size: iconSizeMap[size], color: iconColorMap[color] });
 };
 var Icon_default = Icon;
 export {

package/dist/icons/Bars.d.mts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgBars: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgBars: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgBars as default };

package/dist/icons/Bars.d.ts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgBars: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgBars: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgBars as default };

package/dist/icons/Bars.js

@@ -33,7 +33,7 @@ __export(Bars_exports, {
 module.exports = __toCommonJS(Bars_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react_native_svg = __toESM(require("react-native-svg"));
-const SvgBars = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgBars = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -42,7 +42,7 @@ const SvgBars = ({ size = 24, width = size, height = size, ...restProps }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_svg.default, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_native_svg.Path,
     {
-      fill: "currentColor",
+      fill: color,
       d: "M19.286 16.286a.857.857 0 1 1 0 1.714H4.715a.858.858 0 0 1 0-1.714zM19.286 11.143a.858.858 0 0 1 0 1.714H4.715a.858.858 0 0 1 0-1.714zM19.286 6a.858.858 0 0 1 0 1.714H4.715a.857.857 0 1 1 0-1.714z"
     }
   ) });

package/dist/icons/Bars.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import Svg, { Path } from "react-native-svg";
-const SvgBars = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgBars = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -9,7 +9,7 @@ const SvgBars = ({ size = 24, width = size, height = size, ...restProps }) => {
   return /* @__PURE__ */ jsx(Svg, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
     Path,
     {
-      fill: "currentColor",
+      fill: color,
       d: "M19.286 16.286a.857.857 0 1 1 0 1.714H4.715a.858.858 0 0 1 0-1.714zM19.286 11.143a.858.858 0 0 1 0 1.714H4.715a.858.858 0 0 1 0-1.714zM19.286 6a.858.858 0 0 1 0 1.714H4.715a.857.857 0 1 1 0-1.714z"
     }
   ) });

package/dist/icons/Bell.d.mts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgBell: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgBell: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgBell as default };

package/dist/icons/Bell.d.ts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgBell: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgBell: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgBell as default };

package/dist/icons/Bell.js

@@ -33,7 +33,7 @@ __export(Bell_exports, {
 module.exports = __toCommonJS(Bell_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react_native_svg = __toESM(require("react-native-svg"));
-const SvgBell = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgBell = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -42,7 +42,7 @@ const SvgBell = ({ size = 24, width = size, height = size, ...restProps }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_svg.default, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_native_svg.Path,
     {
-      fill: "currentColor",
+      fill: color,
       fillRule: "evenodd",
       d: "M13.915 3.757a5.4 5.4 0 0 1 1.602.905q.7.577 1.259 1.372t.93 1.718q.37.924.58 1.961.62 3.113 1.317 4.92.696 1.809 1.826 2.938h-7.207q.135.387.135.785 0 .975-.69 1.667a2.27 2.27 0 0 1-1.667.69 2.27 2.27 0 0 1-1.666-.69 2.27 2.27 0 0 1-.691-1.667q0-.4.135-.785H2.571q1.13-1.13 1.826-2.937.697-1.809 1.317-4.92.21-1.038.58-1.962a8.4 8.4 0 0 1 .93-1.718q.56-.795 1.26-1.372.699-.578 1.601-.905a5.6 5.6 0 0 1 1.916-.328q1.01 0 1.914.328m-1.916 13.815a.76.76 0 0 0-.556.23.76.76 0 0 0-.23.555q0 .325.23.556.232.23.556.23a.76.76 0 0 0 .556-.23.76.76 0 0 0 .23-.556.76.76 0 0 0-.23-.555.76.76 0 0 0-.556-.23m0-12.429q-.693 0-1.306.215a3.7 3.7 0 0 0-1.05.55q-.435.336-.81.805a6 6 0 0 0-.607.911q-.232.442-.421.945-.19.502-.278.828-.09.326-.15.637-.765 3.856-1.686 5.823h12.617q-.921-1.967-1.686-5.823-.06-.311-.15-.637a10 10 0 0 0-.7-1.773 6 6 0 0 0-.606-.911 4.7 4.7 0 0 0-.81-.805 3.8 3.8 0 0 0-1.05-.55A3.9 3.9 0 0 0 12 5.143",
       clipRule: "evenodd"

package/dist/icons/Bell.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import Svg, { Path } from "react-native-svg";
-const SvgBell = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgBell = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -9,7 +9,7 @@ const SvgBell = ({ size = 24, width = size, height = size, ...restProps }) => {
   return /* @__PURE__ */ jsx(Svg, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
     Path,
     {
-      fill: "currentColor",
+      fill: color,
       fillRule: "evenodd",
       d: "M13.915 3.757a5.4 5.4 0 0 1 1.602.905q.7.577 1.259 1.372t.93 1.718q.37.924.58 1.961.62 3.113 1.317 4.92.696 1.809 1.826 2.938h-7.207q.135.387.135.785 0 .975-.69 1.667a2.27 2.27 0 0 1-1.667.69 2.27 2.27 0 0 1-1.666-.69 2.27 2.27 0 0 1-.691-1.667q0-.4.135-.785H2.571q1.13-1.13 1.826-2.937.697-1.809 1.317-4.92.21-1.038.58-1.962a8.4 8.4 0 0 1 .93-1.718q.56-.795 1.26-1.372.699-.578 1.601-.905a5.6 5.6 0 0 1 1.916-.328q1.01 0 1.914.328m-1.916 13.815a.76.76 0 0 0-.556.23.76.76 0 0 0-.23.555q0 .325.23.556.232.23.556.23a.76.76 0 0 0 .556-.23.76.76 0 0 0 .23-.556.76.76 0 0 0-.23-.555.76.76 0 0 0-.556-.23m0-12.429q-.693 0-1.306.215a3.7 3.7 0 0 0-1.05.55q-.435.336-.81.805a6 6 0 0 0-.607.911q-.232.442-.421.945-.19.502-.278.828-.09.326-.15.637-.765 3.856-1.686 5.823h12.617q-.921-1.967-1.686-5.823-.06-.311-.15-.637a10 10 0 0 0-.7-1.773 6 6 0 0 0-.606-.911 4.7 4.7 0 0 0-.81-.805 3.8 3.8 0 0 0-1.05-.55A3.9 3.9 0 0 0 12 5.143",
       clipRule: "evenodd"

package/dist/icons/BellFill.d.mts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgBellFill: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgBellFill: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgBellFill as default };

package/dist/icons/BellFill.d.ts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgBellFill: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgBellFill: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgBellFill as default };

package/dist/icons/BellFill.js

@@ -33,7 +33,7 @@ __export(BellFill_exports, {
 module.exports = __toCommonJS(BellFill_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react_native_svg = __toESM(require("react-native-svg"));
-const SvgBellFill = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgBellFill = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -42,7 +42,7 @@ const SvgBellFill = ({ size = 24, width = size, height = size, ...restProps }) =
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_svg.default, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_native_svg.Path,
     {
-      fill: "currentColor",
+      fill: color,
       fillRule: "evenodd",
       d: "M13.915 3.757a5.4 5.4 0 0 1 1.602.905q.7.577 1.259 1.372t.93 1.718q.37.924.58 1.962.62 3.111 1.317 4.92.696 1.807 1.826 2.937h-7.207q.135.387.135.785 0 .975-.69 1.667a2.27 2.27 0 0 1-1.667.69 2.27 2.27 0 0 1-1.666-.69 2.27 2.27 0 0 1-.691-1.667q0-.4.135-.785H2.571q1.13-1.13 1.826-2.937.697-1.809 1.317-4.92.21-1.038.58-1.962a8.4 8.4 0 0 1 .93-1.718q.56-.795 1.26-1.372.699-.578 1.601-.905a5.6 5.6 0 0 1 1.916-.328q1.01 0 1.914.328",
       clipRule: "evenodd"

package/dist/icons/BellFill.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import Svg, { Path } from "react-native-svg";
-const SvgBellFill = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgBellFill = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -9,7 +9,7 @@ const SvgBellFill = ({ size = 24, width = size, height = size, ...restProps }) =
   return /* @__PURE__ */ jsx(Svg, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
     Path,
     {
-      fill: "currentColor",
+      fill: color,
       fillRule: "evenodd",
       d: "M13.915 3.757a5.4 5.4 0 0 1 1.602.905q.7.577 1.259 1.372t.93 1.718q.37.924.58 1.962.62 3.111 1.317 4.92.696 1.807 1.826 2.937h-7.207q.135.387.135.785 0 .975-.69 1.667a2.27 2.27 0 0 1-1.667.69 2.27 2.27 0 0 1-1.666-.69 2.27 2.27 0 0 1-.691-1.667q0-.4.135-.785H2.571q1.13-1.13 1.826-2.937.697-1.809 1.317-4.92.21-1.038.58-1.962a8.4 8.4 0 0 1 .93-1.718q.56-.795 1.26-1.372.699-.578 1.601-.905a5.6 5.6 0 0 1 1.916-.328q1.01 0 1.914.328",
       clipRule: "evenodd"

package/dist/icons/Calendar.d.mts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgCalendar: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgCalendar: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgCalendar as default };

package/dist/icons/Calendar.d.ts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgCalendar: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgCalendar: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgCalendar as default };

package/dist/icons/Calendar.js

@@ -33,7 +33,7 @@ __export(Calendar_exports, {
 module.exports = __toCommonJS(Calendar_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react_native_svg = __toESM(require("react-native-svg"));
-const SvgCalendar = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgCalendar = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -42,7 +42,7 @@ const SvgCalendar = ({ size = 24, width = size, height = size, ...restProps }) =
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_svg.default, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_native_svg.Path,
     {
-      fill: "currentColor",
+      fill: color,
       d: "M6.857 5.571s0 .857.857.857.857-.857.857-.857V3.857h6.858v1.714s-.001.857.856.857.858-.857.858-.857V3.857h1.714c.71 0 1.286.579 1.286 1.285v13.715c0 .71-.58 1.286-1.286 1.286H5.142c-.71 0-1.285-.58-1.285-1.286V5.142c0-.71.579-1.285 1.285-1.285h1.715zM5.571 18.428h12.858v-8.142H5.57zm6.382-7.57a.857.857 0 0 1 1.333.713v5.144a.857.857 0 0 1-1.715 0V13.14c-.347.263-.879.157-1.142-.237a.857.857 0 0 1 .239-1.188z"
     }
   ) });

package/dist/icons/Calendar.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import Svg, { Path } from "react-native-svg";
-const SvgCalendar = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgCalendar = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -9,7 +9,7 @@ const SvgCalendar = ({ size = 24, width = size, height = size, ...restProps }) =
   return /* @__PURE__ */ jsx(Svg, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
     Path,
     {
-      fill: "currentColor",
+      fill: color,
       d: "M6.857 5.571s0 .857.857.857.857-.857.857-.857V3.857h6.858v1.714s-.001.857.856.857.858-.857.858-.857V3.857h1.714c.71 0 1.286.579 1.286 1.285v13.715c0 .71-.58 1.286-1.286 1.286H5.142c-.71 0-1.285-.58-1.285-1.286V5.142c0-.71.579-1.285 1.285-1.285h1.715zM5.571 18.428h12.858v-8.142H5.57zm6.382-7.57a.857.857 0 0 1 1.333.713v5.144a.857.857 0 0 1-1.715 0V13.14c-.347.263-.879.157-1.142-.237a.857.857 0 0 1 .239-1.188z"
     }
   ) });

package/dist/icons/Check.d.mts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgCheck: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgCheck: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgCheck as default };

package/dist/icons/Check.d.ts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgCheck: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgCheck: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgCheck as default };

package/dist/icons/Check.js

@@ -33,7 +33,7 @@ __export(Check_exports, {
 module.exports = __toCommonJS(Check_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react_native_svg = __toESM(require("react-native-svg"));
-const SvgCheck = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgCheck = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -42,7 +42,7 @@ const SvgCheck = ({ size = 24, width = size, height = size, ...restProps }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_svg.default, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_native_svg.Path,
     {
-      fill: "currentColor",
+      fill: color,
       d: "M19.784 5.242A1.071 1.071 0 1 1 21.3 6.758L9.503 18.554q-.067.115-.165.213a1.07 1.07 0 0 1-1.516 0l-5.151-5.152A1.071 1.071 0 1 1 4.187 12.1l4.37 4.37z"
     }
   ) });

package/dist/icons/Check.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import Svg, { Path } from "react-native-svg";
-const SvgCheck = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgCheck = ({ size = 24, width = size, height = size, color, ...restProps }) => {
   const props = {
     ...restProps,
     width,
@@ -9,7 +9,7 @@ const SvgCheck = ({ size = 24, width = size, height = size, ...restProps }) => {
   return /* @__PURE__ */ jsx(Svg, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
     Path,
     {
-      fill: "currentColor",
+      fill: color,
       d: "M19.784 5.242A1.071 1.071 0 1 1 21.3 6.758L9.503 18.554q-.067.115-.165.213a1.07 1.07 0 0 1-1.516 0l-5.151-5.152A1.071 1.071 0 1 1 4.187 12.1l4.37 4.37z"
     }
   ) });

package/dist/icons/CheckCircleFill.d.mts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgCheckCircleFill: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgCheckCircleFill: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgCheckCircleFill as default };

package/dist/icons/CheckCircleFill.d.ts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgCheckCircleFill: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgCheckCircleFill: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgCheckCircleFill as default };

package/dist/icons/CheckCircleFill.js

@@ -33,7 +33,13 @@ __export(CheckCircleFill_exports, {
 module.exports = __toCommonJS(CheckCircleFill_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react_native_svg = __toESM(require("react-native-svg"));
-const SvgCheckCircleFill = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgCheckCircleFill = ({
+  size = 24,
+  width = size,
+  height = size,
+  color,
+  ...restProps
+}) => {
   const props = {
     ...restProps,
     width,
@@ -42,7 +48,7 @@ const SvgCheckCircleFill = ({ size = 24, width = size, height = size, ...restPro
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_svg.default, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_native_svg.Path,
     {
-      fill: "currentColor",
+      fill: color,
       fillRule: "evenodd",
       d: "M12 2.571a9.43 9.43 0 0 1 9.429 9.43A9.43 9.43 0 0 1 12 21.428 9.43 9.43 0 0 1 2.571 12a9.43 9.43 0 0 1 9.43-9.429m5.694 5.607a.857.857 0 0 0-1.212 0l-6.408 6.407-2.12-2.121a.857.857 0 1 0-1.213 1.212l2.121 2.121s.472.606 1.212.607c.741 0 1.213-.607 1.213-.607l6.406-6.406a.86.86 0 0 0 0-1.213",
       clipRule: "evenodd"

package/dist/icons/CheckCircleFill.mjs

@@ -1,6 +1,12 @@
 import { jsx } from "react/jsx-runtime";
 import Svg, { Path } from "react-native-svg";
-const SvgCheckCircleFill = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgCheckCircleFill = ({
+  size = 24,
+  width = size,
+  height = size,
+  color,
+  ...restProps
+}) => {
   const props = {
     ...restProps,
     width,
@@ -9,7 +15,7 @@ const SvgCheckCircleFill = ({ size = 24, width = size, height = size, ...restPro
   return /* @__PURE__ */ jsx(Svg, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx(
     Path,
     {
-      fill: "currentColor",
+      fill: color,
       fillRule: "evenodd",
       d: "M12 2.571a9.43 9.43 0 0 1 9.429 9.43A9.43 9.43 0 0 1 12 21.428 9.43 9.43 0 0 1 2.571 12a9.43 9.43 0 0 1 9.43-9.429m5.694 5.607a.857.857 0 0 0-1.212 0l-6.408 6.407-2.12-2.121a.857.857 0 1 0-1.213 1.212l2.121 2.121s.472.606 1.212.607c.741 0 1.213-.607 1.213-.607l6.406-6.406a.86.86 0 0 0 0-1.213",
       clipRule: "evenodd"

package/dist/icons/ChevronDown.d.mts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgChevronDown: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgChevronDown: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgChevronDown as default };

package/dist/icons/ChevronDown.d.ts

@@ -6,7 +6,8 @@ interface ISvgProps extends SvgProps {
     xmlnsXlink?: string;
     xmlSpace?: string;
     size?: number;
+    color?: string;
 }
-declare const SvgChevronDown: ({ size, width, height, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
+declare const SvgChevronDown: ({ size, width, height, color, ...restProps }: ISvgProps) => react_jsx_runtime.JSX.Element;
 
 export { SvgChevronDown as default };

package/dist/icons/ChevronDown.js

@@ -33,7 +33,13 @@ __export(ChevronDown_exports, {
 module.exports = __toCommonJS(ChevronDown_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react_native_svg = __toESM(require("react-native-svg"));
-const SvgChevronDown = ({ size = 24, width = size, height = size, ...restProps }) => {
+const SvgChevronDown = ({
+  size = 24,
+  width = size,
+  height = size,
+  color,
+  ...restProps
+}) => {
   const props = {
     ...restProps,
     width,
@@ -42,7 +48,7 @@ const SvgChevronDown = ({ size = 24, width = size, height = size, ...restProps }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_svg.default, { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_native_svg.Path,
     {
-      fill: "currentColor",
+      fill: color,
       d: "M4.76 7.25a1.074 1.074 0 1 0-1.52 1.52l7.964 7.966c.44.439 1.151.439 1.59 0L20.76 8.77a1.074 1.074 0 1 0-1.52-1.52L12 14.49z"
     }
   ) });