@yamada-ui/utils 0.1.4 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -180,6 +180,7 @@ import {
180
180
  darken,
181
181
  lighten
182
182
  } from "color2k";
183
+ var isGray = (colorScheme) => colorScheme === "gray" || colorScheme === "zinc" || colorScheme === "neutral" || colorScheme === "stone";
183
184
  var getColor = (color, fallback) => (theme, colorMode) => {
184
185
  const hex = getMemoizedObject(theme, `colors.${color}`, color);
185
186
  try {
@@ -194,27 +195,27 @@ var getColor = (color, fallback) => (theme, colorMode) => {
194
195
  }
195
196
  };
196
197
  var lightenColor = (color, amount) => (theme, colorMode) => {
197
- const raw = getColor(color)(theme, colorMode);
198
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
198
199
  return toHex(lighten(raw, amount / 100));
199
200
  };
200
201
  var darkenColor = (color, amount) => (theme, colorMode) => {
201
- const raw = getColor(color)(theme, colorMode);
202
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
202
203
  return toHex(darken(raw, amount / 100));
203
204
  };
204
205
  var tintColor = (color, amount) => (theme, colorMode) => {
205
- const raw = getColor(color)(theme, colorMode);
206
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
206
207
  return toHex(mix(raw, "#fff", amount));
207
208
  };
208
209
  var shadeColor = (color, amount) => (theme, colorMode) => {
209
- const raw = getColor(color)(theme, colorMode);
210
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
210
211
  return toHex(mix(raw, "#000", amount / 100));
211
212
  };
212
213
  var transparentizeColor = (color, alpha) => (theme, colorMode) => {
213
- const raw = getColor(color)(theme, colorMode);
214
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
214
215
  return transparentize(raw, 1 - alpha);
215
216
  };
216
217
  var toneColor = (color, l) => (theme, colorMode) => {
217
- const raw = getColor(color)(theme, colorMode);
218
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
218
219
  if (l < 0 || 900 < l)
219
220
  return color;
220
221
  let n = (l - 500) / 10;
@@ -271,7 +272,7 @@ var getBrightness = (color) => {
271
272
  return (r * 299 + g * 587 + b * 114) / 1e3;
272
273
  };
273
274
  var isTone = (color) => (theme, colorMode) => {
274
- const raw = getColor(color)(theme, colorMode);
275
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
275
276
  const brightness = getBrightness(raw);
276
277
  const isDark2 = brightness < 128;
277
278
  return isDark2 ? "dark" : "light";
@@ -452,6 +453,7 @@ export {
452
453
  useAsync,
453
454
  useAsyncFunc,
454
455
  useAsyncRetry,
456
+ isGray,
455
457
  getColor,
456
458
  lightenColor,
457
459
  darkenColor,
package/dist/color.d.mts CHANGED
@@ -1,18 +1,19 @@
1
1
  import { Dict } from './index.types.mjs';
2
2
 
3
- declare const getColor: (color: string, fallback?: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
4
- declare const lightenColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
5
- declare const darkenColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
6
- declare const tintColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
7
- declare const shadeColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
8
- declare const transparentizeColor: (color: string, alpha: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
9
- declare const toneColor: (color: string, l: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
3
+ declare const isGray: (colorScheme: string) => boolean;
4
+ declare const getColor: (color: string, fallback?: string) => (theme: Dict, colorMode?: 'light' | 'dark') => string;
5
+ declare const lightenColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
6
+ declare const darkenColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
7
+ declare const tintColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
8
+ declare const shadeColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
9
+ declare const transparentizeColor: (color: string, alpha: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
10
+ declare const toneColor: (color: string, l: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
10
11
  declare const randomColor: ({ string, colors, }?: {
11
12
  string?: string | undefined;
12
13
  colors?: string[] | undefined;
13
14
  }) => string;
14
- declare const isTone: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => "light" | "dark";
15
- declare const isLight: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => boolean;
16
- declare const isDark: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => boolean;
15
+ declare const isTone: (color: string) => (theme?: Dict, colorMode?: 'light' | 'dark') => "light" | "dark";
16
+ declare const isLight: (color: string) => (theme?: Dict, colorMode?: 'light' | 'dark') => boolean;
17
+ declare const isDark: (color: string) => (theme?: Dict, colorMode?: 'light' | 'dark') => boolean;
17
18
 
18
- export { darkenColor, getColor, isDark, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };
19
+ export { darkenColor, getColor, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };
package/dist/color.d.ts CHANGED
@@ -1,18 +1,19 @@
1
1
  import { Dict } from './index.types.js';
2
2
 
3
- declare const getColor: (color: string, fallback?: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
4
- declare const lightenColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
5
- declare const darkenColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
6
- declare const tintColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
7
- declare const shadeColor: (color: string, amount: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
8
- declare const transparentizeColor: (color: string, alpha: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
9
- declare const toneColor: (color: string, l: number) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => string;
3
+ declare const isGray: (colorScheme: string) => boolean;
4
+ declare const getColor: (color: string, fallback?: string) => (theme: Dict, colorMode?: 'light' | 'dark') => string;
5
+ declare const lightenColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
6
+ declare const darkenColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
7
+ declare const tintColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
8
+ declare const shadeColor: (color: string, amount: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
9
+ declare const transparentizeColor: (color: string, alpha: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
10
+ declare const toneColor: (color: string, l: number) => (theme?: Dict, colorMode?: 'light' | 'dark') => string;
10
11
  declare const randomColor: ({ string, colors, }?: {
11
12
  string?: string | undefined;
12
13
  colors?: string[] | undefined;
13
14
  }) => string;
14
- declare const isTone: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => "light" | "dark";
15
- declare const isLight: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => boolean;
16
- declare const isDark: (color: string) => (theme: Dict, colorMode: 'light' | 'dark' | undefined) => boolean;
15
+ declare const isTone: (color: string) => (theme?: Dict, colorMode?: 'light' | 'dark') => "light" | "dark";
16
+ declare const isLight: (color: string) => (theme?: Dict, colorMode?: 'light' | 'dark') => boolean;
17
+ declare const isDark: (color: string) => (theme?: Dict, colorMode?: 'light' | 'dark') => boolean;
17
18
 
18
- export { darkenColor, getColor, isDark, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };
19
+ export { darkenColor, getColor, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor };
package/dist/color.js CHANGED
@@ -23,6 +23,7 @@ __export(color_exports, {
23
23
  darkenColor: () => darkenColor,
24
24
  getColor: () => getColor,
25
25
  isDark: () => isDark,
26
+ isGray: () => isGray,
26
27
  isLight: () => isLight,
27
28
  isTone: () => isTone,
28
29
  lightenColor: () => lightenColor,
@@ -68,6 +69,7 @@ var memoizeObject = (func) => {
68
69
  var getMemoizedObject = memoizeObject(getObject);
69
70
 
70
71
  // src/color.ts
72
+ var isGray = (colorScheme) => colorScheme === "gray" || colorScheme === "zinc" || colorScheme === "neutral" || colorScheme === "stone";
71
73
  var getColor = (color, fallback) => (theme, colorMode) => {
72
74
  const hex = getMemoizedObject(theme, `colors.${color}`, color);
73
75
  try {
@@ -82,27 +84,27 @@ var getColor = (color, fallback) => (theme, colorMode) => {
82
84
  }
83
85
  };
84
86
  var lightenColor = (color, amount) => (theme, colorMode) => {
85
- const raw = getColor(color)(theme, colorMode);
87
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
86
88
  return (0, import_color2k.toHex)((0, import_color2k.lighten)(raw, amount / 100));
87
89
  };
88
90
  var darkenColor = (color, amount) => (theme, colorMode) => {
89
- const raw = getColor(color)(theme, colorMode);
91
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
90
92
  return (0, import_color2k.toHex)((0, import_color2k.darken)(raw, amount / 100));
91
93
  };
92
94
  var tintColor = (color, amount) => (theme, colorMode) => {
93
- const raw = getColor(color)(theme, colorMode);
95
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
94
96
  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#fff", amount));
95
97
  };
96
98
  var shadeColor = (color, amount) => (theme, colorMode) => {
97
- const raw = getColor(color)(theme, colorMode);
99
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
98
100
  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#000", amount / 100));
99
101
  };
100
102
  var transparentizeColor = (color, alpha) => (theme, colorMode) => {
101
- const raw = getColor(color)(theme, colorMode);
103
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
102
104
  return (0, import_color2k.transparentize)(raw, 1 - alpha);
103
105
  };
104
106
  var toneColor = (color, l) => (theme, colorMode) => {
105
- const raw = getColor(color)(theme, colorMode);
107
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
106
108
  if (l < 0 || 900 < l)
107
109
  return color;
108
110
  let n = (l - 500) / 10;
@@ -159,7 +161,7 @@ var getBrightness = (color) => {
159
161
  return (r * 299 + g * 587 + b * 114) / 1e3;
160
162
  };
161
163
  var isTone = (color) => (theme, colorMode) => {
162
- const raw = getColor(color)(theme, colorMode);
164
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
163
165
  const brightness = getBrightness(raw);
164
166
  const isDark2 = brightness < 128;
165
167
  return isDark2 ? "dark" : "light";
@@ -171,6 +173,7 @@ var isDark = (color) => (theme, colorMode) => isTone(color)(theme, colorMode) ==
171
173
  darkenColor,
172
174
  getColor,
173
175
  isDark,
176
+ isGray,
174
177
  isLight,
175
178
  isTone,
176
179
  lightenColor,
package/dist/color.mjs CHANGED
@@ -2,6 +2,7 @@ import {
2
2
  darkenColor,
3
3
  getColor,
4
4
  isDark,
5
+ isGray,
5
6
  isLight,
6
7
  isTone,
7
8
  lightenColor,
@@ -10,7 +11,7 @@ import {
10
11
  tintColor,
11
12
  toneColor,
12
13
  transparentizeColor
13
- } from "./chunk-EUA3L3L6.mjs";
14
+ } from "./chunk-32BEUAHK.mjs";
14
15
  import "./chunk-SLJ4M7XC.mjs";
15
16
  import "./chunk-VYMGBE25.mjs";
16
17
  import "./chunk-BZAW2D6U.mjs";
@@ -23,6 +24,7 @@ export {
23
24
  darkenColor,
24
25
  getColor,
25
26
  isDark,
27
+ isGray,
26
28
  isLight,
27
29
  isTone,
28
30
  lightenColor,
package/dist/function.mjs CHANGED
@@ -3,7 +3,7 @@ import {
3
3
  handlerAll,
4
4
  noop,
5
5
  runIfFunc
6
- } from "./chunk-EUA3L3L6.mjs";
6
+ } from "./chunk-32BEUAHK.mjs";
7
7
  import "./chunk-SLJ4M7XC.mjs";
8
8
  import "./chunk-VYMGBE25.mjs";
9
9
  import "./chunk-BZAW2D6U.mjs";
package/dist/index.d.mts CHANGED
@@ -6,7 +6,7 @@ export { AsyncFnReturn, AsyncState, AsyncStateRetry, DOMAttributes, FunctionRetu
6
6
  export { FocusableElement, ariaAttr, createdDom, dataAttr, getActiveElement, getAllFocusable, getEventRelatedTarget, getOwnerDocument, getOwnerWindow, getPlatform, hasNegativeTabIndex, hasTabIndex, isActiveElement, isApple, isContains, isContentEditable, isDisabled, isElement, isFocusable, isHTMLElement, isHidden, isMac, isSafari, isTabbable, platform, vendor } from './dom.mjs';
7
7
  export { escape } from './string.mjs';
8
8
  export { Operand, calc } from './calc.mjs';
9
- export { darkenColor, getColor, isDark, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.mjs';
9
+ export { darkenColor, getColor, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.mjs';
10
10
  export { filterEmpty } from './array.mjs';
11
11
  export { clampNumber, countDecimal, percentToValue, roundNumberToStep, toPrecision, valueToPercent } from './number.mjs';
12
12
  export { AnyPointerEvent, MixedEventListener, Point, PointType, PointerEventInfo, addDomEvent, addPointerEvent, getEventPoint, getEventWindow, isMouseEvent, isMultiTouchEvent, isTouchEvent, pointFromMouse, pointFromTouch } from './event.mjs';
package/dist/index.d.ts CHANGED
@@ -6,7 +6,7 @@ export { AsyncFnReturn, AsyncState, AsyncStateRetry, DOMAttributes, FunctionRetu
6
6
  export { FocusableElement, ariaAttr, createdDom, dataAttr, getActiveElement, getAllFocusable, getEventRelatedTarget, getOwnerDocument, getOwnerWindow, getPlatform, hasNegativeTabIndex, hasTabIndex, isActiveElement, isApple, isContains, isContentEditable, isDisabled, isElement, isFocusable, isHTMLElement, isHidden, isMac, isSafari, isTabbable, platform, vendor } from './dom.js';
7
7
  export { escape } from './string.js';
8
8
  export { Operand, calc } from './calc.js';
9
- export { darkenColor, getColor, isDark, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.js';
9
+ export { darkenColor, getColor, isDark, isGray, isLight, isTone, lightenColor, randomColor, shadeColor, tintColor, toneColor, transparentizeColor } from './color.js';
10
10
  export { filterEmpty } from './array.js';
11
11
  export { clampNumber, countDecimal, percentToValue, roundNumberToStep, toPrecision, valueToPercent } from './number.js';
12
12
  export { AnyPointerEvent, MixedEventListener, Point, PointType, PointerEventInfo, addDomEvent, addPointerEvent, getEventPoint, getEventWindow, isMouseEvent, isMultiTouchEvent, isTouchEvent, pointFromMouse, pointFromTouch } from './event.js';
package/dist/index.js CHANGED
@@ -78,6 +78,7 @@ __export(src_exports, {
78
78
  isEmpty: () => isEmpty,
79
79
  isFocusable: () => isFocusable,
80
80
  isFunction: () => isFunction,
81
+ isGray: () => isGray,
81
82
  isHTMLElement: () => isHTMLElement,
82
83
  isHidden: () => isHidden,
83
84
  isLight: () => isLight,
@@ -578,6 +579,7 @@ var calc = Object.assign(
578
579
 
579
580
  // src/color.ts
580
581
  var import_color2k = require("color2k");
582
+ var isGray = (colorScheme) => colorScheme === "gray" || colorScheme === "zinc" || colorScheme === "neutral" || colorScheme === "stone";
581
583
  var getColor = (color, fallback) => (theme, colorMode) => {
582
584
  const hex = getMemoizedObject(theme, `colors.${color}`, color);
583
585
  try {
@@ -592,27 +594,27 @@ var getColor = (color, fallback) => (theme, colorMode) => {
592
594
  }
593
595
  };
594
596
  var lightenColor = (color, amount) => (theme, colorMode) => {
595
- const raw = getColor(color)(theme, colorMode);
597
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
596
598
  return (0, import_color2k.toHex)((0, import_color2k.lighten)(raw, amount / 100));
597
599
  };
598
600
  var darkenColor = (color, amount) => (theme, colorMode) => {
599
- const raw = getColor(color)(theme, colorMode);
601
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
600
602
  return (0, import_color2k.toHex)((0, import_color2k.darken)(raw, amount / 100));
601
603
  };
602
604
  var tintColor = (color, amount) => (theme, colorMode) => {
603
- const raw = getColor(color)(theme, colorMode);
605
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
604
606
  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#fff", amount));
605
607
  };
606
608
  var shadeColor = (color, amount) => (theme, colorMode) => {
607
- const raw = getColor(color)(theme, colorMode);
609
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
608
610
  return (0, import_color2k.toHex)((0, import_color2k.mix)(raw, "#000", amount / 100));
609
611
  };
610
612
  var transparentizeColor = (color, alpha) => (theme, colorMode) => {
611
- const raw = getColor(color)(theme, colorMode);
613
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
612
614
  return (0, import_color2k.transparentize)(raw, 1 - alpha);
613
615
  };
614
616
  var toneColor = (color, l) => (theme, colorMode) => {
615
- const raw = getColor(color)(theme, colorMode);
617
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
616
618
  if (l < 0 || 900 < l)
617
619
  return color;
618
620
  let n = (l - 500) / 10;
@@ -669,7 +671,7 @@ var getBrightness = (color) => {
669
671
  return (r * 299 + g * 587 + b * 114) / 1e3;
670
672
  };
671
673
  var isTone = (color) => (theme, colorMode) => {
672
- const raw = getColor(color)(theme, colorMode);
674
+ const raw = theme ? getColor(color)(theme, colorMode) : color;
673
675
  const brightness = getBrightness(raw);
674
676
  const isDark2 = brightness < 128;
675
677
  return isDark2 ? "dark" : "light";
@@ -800,6 +802,7 @@ var addPointerEvent = (target, type, cb, options) => addDomEvent(target, type, w
800
802
  isEmpty,
801
803
  isFocusable,
802
804
  isFunction,
805
+ isGray,
803
806
  isHTMLElement,
804
807
  isHidden,
805
808
  isLight,
package/dist/index.mjs CHANGED
@@ -16,6 +16,7 @@ import {
16
16
  handlerAll,
17
17
  includesChildren,
18
18
  isDark,
19
+ isGray,
19
20
  isLight,
20
21
  isRefObject,
21
22
  isTone,
@@ -48,7 +49,7 @@ import {
48
49
  useSafeLayoutEffect,
49
50
  useUnmountEffect,
50
51
  useUpdateEffect
51
- } from "./chunk-EUA3L3L6.mjs";
52
+ } from "./chunk-32BEUAHK.mjs";
52
53
  import "./chunk-SLJ4M7XC.mjs";
53
54
  import {
54
55
  clampNumber,
@@ -168,6 +169,7 @@ export {
168
169
  isEmpty,
169
170
  isFocusable,
170
171
  isFunction,
172
+ isGray,
171
173
  isHTMLElement,
172
174
  isHidden,
173
175
  isLight,
package/dist/object.mjs CHANGED
@@ -13,7 +13,7 @@ import {
13
13
  pickObject,
14
14
  replaceObject,
15
15
  splitObject
16
- } from "./chunk-EUA3L3L6.mjs";
16
+ } from "./chunk-32BEUAHK.mjs";
17
17
  import "./chunk-SLJ4M7XC.mjs";
18
18
  import "./chunk-VYMGBE25.mjs";
19
19
  import "./chunk-BZAW2D6U.mjs";
package/dist/react.mjs CHANGED
@@ -19,7 +19,7 @@ import {
19
19
  useSafeLayoutEffect,
20
20
  useUnmountEffect,
21
21
  useUpdateEffect
22
- } from "./chunk-EUA3L3L6.mjs";
22
+ } from "./chunk-32BEUAHK.mjs";
23
23
  import "./chunk-SLJ4M7XC.mjs";
24
24
  import "./chunk-VYMGBE25.mjs";
25
25
  import "./chunk-BZAW2D6U.mjs";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/utils",
3
- "version": "0.1.4",
3
+ "version": "0.2.0",
4
4
  "description": "Yamada UI utils",
5
5
  "keywords": [
6
6
  "utils",