@darthrapid/react-native-color-picker 0.1.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.
- package/LICENSE +20 -0
- package/README.md +160 -0
- package/lib/module/components/color-picker.js +214 -0
- package/lib/module/components/color-picker.js.map +1 -0
- package/lib/module/components/hue-strip.js +113 -0
- package/lib/module/components/hue-strip.js.map +1 -0
- package/lib/module/components/picker-panel.js +121 -0
- package/lib/module/components/picker-panel.js.map +1 -0
- package/lib/module/components/picker-tab.js +38 -0
- package/lib/module/components/picker-tab.js.map +1 -0
- package/lib/module/components/recent-tab.js +89 -0
- package/lib/module/components/recent-tab.js.map +1 -0
- package/lib/module/components/sat-bright-pad.js +171 -0
- package/lib/module/components/sat-bright-pad.js.map +1 -0
- package/lib/module/components/tab-bar.js +41 -0
- package/lib/module/components/tab-bar.js.map +1 -0
- package/lib/module/components/values-tab.js +161 -0
- package/lib/module/components/values-tab.js.map +1 -0
- package/lib/module/index.js +4 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/package.json +1 -0
- package/lib/module/shared/const.js +43 -0
- package/lib/module/shared/const.js.map +1 -0
- package/lib/module/types/misc.js +4 -0
- package/lib/module/types/misc.js.map +1 -0
- package/lib/module/utils/colors.js +52 -0
- package/lib/module/utils/colors.js.map +1 -0
- package/lib/typescript/package.json +1 -0
- package/lib/typescript/src/components/color-picker.d.ts +37 -0
- package/lib/typescript/src/components/color-picker.d.ts.map +1 -0
- package/lib/typescript/src/components/hue-strip.d.ts +10 -0
- package/lib/typescript/src/components/hue-strip.d.ts.map +1 -0
- package/lib/typescript/src/components/picker-panel.d.ts +32 -0
- package/lib/typescript/src/components/picker-panel.d.ts.map +1 -0
- package/lib/typescript/src/components/picker-tab.d.ts +17 -0
- package/lib/typescript/src/components/picker-tab.d.ts.map +1 -0
- package/lib/typescript/src/components/recent-tab.d.ts +12 -0
- package/lib/typescript/src/components/recent-tab.d.ts.map +1 -0
- package/lib/typescript/src/components/sat-bright-pad.d.ts +14 -0
- package/lib/typescript/src/components/sat-bright-pad.d.ts.map +1 -0
- package/lib/typescript/src/components/tab-bar.d.ts +11 -0
- package/lib/typescript/src/components/tab-bar.d.ts.map +1 -0
- package/lib/typescript/src/components/values-tab.d.ts +17 -0
- package/lib/typescript/src/components/values-tab.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +3 -0
- package/lib/typescript/src/index.d.ts.map +1 -0
- package/lib/typescript/src/shared/const.d.ts +33 -0
- package/lib/typescript/src/shared/const.d.ts.map +1 -0
- package/lib/typescript/src/types/misc.d.ts +21 -0
- package/lib/typescript/src/types/misc.d.ts.map +1 -0
- package/lib/typescript/src/utils/colors.d.ts +14 -0
- package/lib/typescript/src/utils/colors.d.ts.map +1 -0
- package/package.json +123 -0
- package/src/components/color-picker.tsx +290 -0
- package/src/components/hue-strip.tsx +134 -0
- package/src/components/picker-panel.tsx +176 -0
- package/src/components/picker-tab.tsx +48 -0
- package/src/components/recent-tab.tsx +90 -0
- package/src/components/sat-bright-pad.tsx +158 -0
- package/src/components/tab-bar.tsx +59 -0
- package/src/components/values-tab.tsx +166 -0
- package/src/index.tsx +2 -0
- package/src/shared/const.ts +43 -0
- package/src/types/misc.ts +24 -0
- package/src/utils/colors.ts +57 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["hsbToHex","h","s","b","s1","b1","k","n","f","Math","max","min","toHex","v","round","toString","padStart","hexToHsb","hex","clean","replace","full","length","split","map","c","join","r","parseInt","slice","g","d","hexToRgb","isValidHex","test","getContrastColor","luminance"],"sourceRoot":"../../../src","sources":["utils/colors.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"type":"module"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { type DimensionValue, type StyleProp, type ViewStyle } from "react-native";
|
|
3
|
+
import type { ColorPickerLabels, ColorPickerRef, TabId } from "../types/misc";
|
|
4
|
+
export type ColorPickerProps = {
|
|
5
|
+
/** Current color value (hex string) */
|
|
6
|
+
value?: string;
|
|
7
|
+
/** Called when color changes */
|
|
8
|
+
onChange?: (hex: string) => void;
|
|
9
|
+
/** Tabs to show (default: ["picker", "values", "recent"]) */
|
|
10
|
+
tabs?: TabId[];
|
|
11
|
+
/** Max recent colors (default: 16) */
|
|
12
|
+
maxRecentColors?: number;
|
|
13
|
+
/** Panel width in modal mode (default: 320). Accepts number or "100%". Ignored in inline mode. */
|
|
14
|
+
panelWidth?: DimensionValue;
|
|
15
|
+
/** Hue strip height (default: 28) */
|
|
16
|
+
hueStripHeight?: number;
|
|
17
|
+
/** Theme (default: "dark") */
|
|
18
|
+
theme?: "light" | "dark";
|
|
19
|
+
/** Disable touch input */
|
|
20
|
+
disabled?: boolean;
|
|
21
|
+
/** Style for the picker panel */
|
|
22
|
+
style?: StyleProp<ViewStyle>;
|
|
23
|
+
/** Swatch size (default: 48) */
|
|
24
|
+
swatchSize?: number;
|
|
25
|
+
/** Swatch border radius (default: 12) */
|
|
26
|
+
swatchBorderRadius?: number;
|
|
27
|
+
/** Style for the swatch trigger */
|
|
28
|
+
swatchStyle?: StyleProp<ViewStyle>;
|
|
29
|
+
/** Render inline instead of modal (default: false) */
|
|
30
|
+
inline?: boolean;
|
|
31
|
+
/** Override default labels for i18n */
|
|
32
|
+
labels?: ColorPickerLabels;
|
|
33
|
+
/** Style for modal wrapper */
|
|
34
|
+
modalStyle?: StyleProp<ViewStyle>;
|
|
35
|
+
};
|
|
36
|
+
export declare const ColorPicker: React.ForwardRefExoticComponent<ColorPickerProps & React.RefAttributes<ColorPickerRef>>;
|
|
37
|
+
//# sourceMappingURL=color-picker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"color-picker.d.ts","sourceRoot":"","sources":["../../../../src/components/color-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAKN,MAAM,OAAO,CAAC;AACf,OAAO,EAGL,KAAK,cAAc,EACnB,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAI9E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gCAAgC;IAChC,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,6DAA6D;IAC7D,IAAI,CAAC,EAAE,KAAK,EAAE,CAAC;IACf,sCAAsC;IACtC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kGAAkG;IAClG,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,qCAAqC;IACrC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,8BAA8B;IAC9B,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACzB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iCAAiC;IACjC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,gCAAgC;IAChC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yCAAyC;IACzC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,mCAAmC;IACnC,WAAW,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACnC,sDAAsD;IACtD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uCAAuC;IACvC,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,8BAA8B;IAC9B,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACnC,CAAC;AAEF,eAAO,MAAM,WAAW,yFA4OvB,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
type HueStripProps = {
|
|
2
|
+
hue: number;
|
|
3
|
+
height: number;
|
|
4
|
+
disabled: boolean;
|
|
5
|
+
thumbBorder: string;
|
|
6
|
+
onChange: (hue: number) => void;
|
|
7
|
+
};
|
|
8
|
+
export declare function HueStrip({ hue, height, disabled, thumbBorder, onChange, }: HueStripProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=hue-strip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hue-strip.d.ts","sourceRoot":"","sources":["../../../../src/components/hue-strip.tsx"],"names":[],"mappings":"AAYA,KAAK,aAAa,GAAG;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC,CAAA;AAED,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,MAAM,EACN,QAAQ,EACR,WAAW,EACX,QAAQ,GACT,EAAE,aAAa,2CA2Gf"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { type StyleProp, type ViewStyle } from "react-native";
|
|
2
|
+
import type { ColorPickerLabels, TabId, Theme } from "../types/misc";
|
|
3
|
+
type PickerPanelProps = {
|
|
4
|
+
hue: number;
|
|
5
|
+
sat: number;
|
|
6
|
+
bright: number;
|
|
7
|
+
currentHex: string;
|
|
8
|
+
contrastColor: string;
|
|
9
|
+
hexInput: string;
|
|
10
|
+
recentColors: string[];
|
|
11
|
+
tabs: TabId[];
|
|
12
|
+
hueStripHeight: number;
|
|
13
|
+
disabled: boolean;
|
|
14
|
+
t: Theme;
|
|
15
|
+
labels: Required<ColorPickerLabels>;
|
|
16
|
+
onHueChange: (h: number) => void;
|
|
17
|
+
onSatBrightChange: (vals: {
|
|
18
|
+
s: number;
|
|
19
|
+
b: number;
|
|
20
|
+
}) => void;
|
|
21
|
+
onHexInputChange: (text: string) => void;
|
|
22
|
+
onHexSubmit: () => void;
|
|
23
|
+
onHexInputFocus: () => void;
|
|
24
|
+
onHexInputBlur: () => void;
|
|
25
|
+
onSaveRecent: () => void;
|
|
26
|
+
onRecentSelect: (hex: string) => void;
|
|
27
|
+
onClearRecent: () => void;
|
|
28
|
+
style?: StyleProp<ViewStyle>;
|
|
29
|
+
};
|
|
30
|
+
export declare function PickerPanel({ hue, sat, bright, currentHex, contrastColor, hexInput, recentColors, tabs, hueStripHeight, disabled, t, onHueChange, onSatBrightChange, onHexInputChange, onHexSubmit, onHexInputFocus, onHexInputBlur, onSaveRecent, onRecentSelect, onClearRecent, labels, style, }: PickerPanelProps): import("react/jsx-runtime").JSX.Element;
|
|
31
|
+
export {};
|
|
32
|
+
//# sourceMappingURL=picker-panel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"picker-panel.d.ts","sourceRoot":"","sources":["../../../../src/components/picker-panel.tsx"],"names":[],"mappings":"AACA,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAMrE,KAAK,gBAAgB,GAAG;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,CAAC,EAAE,KAAK,CAAC;IACT,MAAM,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IACpC,WAAW,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,iBAAiB,EAAE,CAAC,IAAI,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC5D,gBAAgB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAA;AAED,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,GAAG,EACH,MAAM,EACN,UAAU,EACV,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,IAAI,EACJ,cAAc,EACd,QAAQ,EACR,CAAC,EACD,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,cAAc,EACd,YAAY,EACZ,cAAc,EACd,aAAa,EACb,MAAM,EACN,KAAK,GACN,EAAE,gBAAgB,2CAiHlB"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { Theme } from "../types/misc";
|
|
2
|
+
type PickerTabProps = {
|
|
3
|
+
hue: number;
|
|
4
|
+
sat: number;
|
|
5
|
+
bright: number;
|
|
6
|
+
hueStripHeight: number;
|
|
7
|
+
disabled: boolean;
|
|
8
|
+
t: Theme;
|
|
9
|
+
onHueChange: (h: number) => void;
|
|
10
|
+
onSatBrightChange: (vals: {
|
|
11
|
+
s: number;
|
|
12
|
+
b: number;
|
|
13
|
+
}) => void;
|
|
14
|
+
};
|
|
15
|
+
export declare function PickerTab({ hue, sat, bright, hueStripHeight, disabled, t, onHueChange, onSatBrightChange, }: PickerTabProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export {};
|
|
17
|
+
//# sourceMappingURL=picker-tab.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"picker-tab.d.ts","sourceRoot":"","sources":["../../../../src/components/picker-tab.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAI3C,KAAK,cAAc,GAAG;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,CAAC,EAAE,KAAK,CAAC;IACT,WAAW,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,iBAAiB,EAAE,CAAC,IAAI,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAC7D,CAAA;AAED,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,GAAG,EACH,MAAM,EACN,cAAc,EACd,QAAQ,EACR,CAAC,EACD,WAAW,EACX,iBAAiB,GAClB,EAAE,cAAc,2CAoBhB"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { ColorPickerLabels, Theme } from "../types/misc";
|
|
2
|
+
type RecentTabProps = {
|
|
3
|
+
recentColors: string[];
|
|
4
|
+
disabled: boolean;
|
|
5
|
+
t: Theme;
|
|
6
|
+
labels: Required<ColorPickerLabels>;
|
|
7
|
+
onSelect: (hex: string) => void;
|
|
8
|
+
onClear: () => void;
|
|
9
|
+
};
|
|
10
|
+
export declare function RecentTab({ recentColors, disabled, t, labels, onSelect, onClear, }: RecentTabProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export {};
|
|
12
|
+
//# sourceMappingURL=recent-tab.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"recent-tab.d.ts","sourceRoot":"","sources":["../../../../src/components/recent-tab.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAE9D,KAAK,cAAc,GAAG;IACpB,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,QAAQ,EAAE,OAAO,CAAC;IAClB,CAAC,EAAE,KAAK,CAAC;IACT,MAAM,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IACpC,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAA;AAED,wBAAgB,SAAS,CAAC,EACxB,YAAY,EACZ,QAAQ,EACR,CAAC,EACD,MAAM,EACN,QAAQ,EACR,OAAO,GACR,EAAE,cAAc,2CAkEhB"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
type SatBrightPadProps = {
|
|
2
|
+
hue: number;
|
|
3
|
+
sat: number;
|
|
4
|
+
bright: number;
|
|
5
|
+
disabled: boolean;
|
|
6
|
+
thumbBorder: string;
|
|
7
|
+
onChange: (vals: {
|
|
8
|
+
s: number;
|
|
9
|
+
b: number;
|
|
10
|
+
}) => void;
|
|
11
|
+
};
|
|
12
|
+
export declare function SatBrightPad({ hue, sat, bright, disabled, thumbBorder, onChange, }: SatBrightPadProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export {};
|
|
14
|
+
//# sourceMappingURL=sat-bright-pad.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sat-bright-pad.d.ts","sourceRoot":"","sources":["../../../../src/components/sat-bright-pad.tsx"],"names":[],"mappings":"AAYA,KAAK,iBAAiB,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CACpD,CAAA;AAED,wBAAgB,YAAY,CAAC,EAC3B,GAAG,EACH,GAAG,EACH,MAAM,EACN,QAAQ,EACR,WAAW,EACX,QAAQ,GACT,EAAE,iBAAiB,2CAiInB"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { ColorPickerLabels, TabId, Theme } from "../types/misc";
|
|
2
|
+
type TabBarProps = {
|
|
3
|
+
tabs: TabId[];
|
|
4
|
+
active: TabId;
|
|
5
|
+
onSelect: (tab: TabId) => void;
|
|
6
|
+
t: Theme;
|
|
7
|
+
labels: Required<ColorPickerLabels>;
|
|
8
|
+
};
|
|
9
|
+
export declare function TabBar({ tabs, active, onSelect, t, labels, }: TabBarProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=tab-bar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tab-bar.d.ts","sourceRoot":"","sources":["../../../../src/components/tab-bar.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAErE,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,MAAM,EAAE,KAAK,CAAC;IACd,QAAQ,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,CAAC;IAC/B,CAAC,EAAE,KAAK,CAAC;IACT,MAAM,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC;CACrC,CAAA;AAED,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,CAAC,EACD,MAAM,GACP,EAAE,WAAW,2CAqCb"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { Theme } from "../types/misc";
|
|
2
|
+
type ValuesTabProps = {
|
|
3
|
+
hue: number;
|
|
4
|
+
sat: number;
|
|
5
|
+
bright: number;
|
|
6
|
+
currentHex: string;
|
|
7
|
+
hexInput: string;
|
|
8
|
+
disabled: boolean;
|
|
9
|
+
t: Theme;
|
|
10
|
+
onHexInputChange: (text: string) => void;
|
|
11
|
+
onHexSubmit: () => void;
|
|
12
|
+
onHexInputFocus: () => void;
|
|
13
|
+
onHexInputBlur: () => void;
|
|
14
|
+
};
|
|
15
|
+
export declare function ValuesTab({ hue, sat, bright, currentHex, hexInput, disabled, t, onHexInputChange, onHexSubmit, onHexInputFocus, onHexInputBlur, }: ValuesTabProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export {};
|
|
17
|
+
//# sourceMappingURL=values-tab.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"values-tab.d.ts","sourceRoot":"","sources":["../../../../src/components/values-tab.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAG3C,KAAK,cAAc,GAAG;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,CAAC,EAAE,KAAK,CAAC;IACT,gBAAgB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;CAC5B,CAAA;AAED,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,GAAG,EACH,MAAM,EACN,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,CAAC,EACD,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,cAAc,GACf,EAAE,cAAc,2CAmIhB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC/E,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import type { ColorPickerLabels } from "../types/misc";
|
|
2
|
+
export declare const DEFAULT_LABELS: Required<ColorPickerLabels>;
|
|
3
|
+
export declare const themes: {
|
|
4
|
+
dark: {
|
|
5
|
+
background: string;
|
|
6
|
+
surface: string;
|
|
7
|
+
border: string;
|
|
8
|
+
text: string;
|
|
9
|
+
textMuted: string;
|
|
10
|
+
textDim: string;
|
|
11
|
+
inputBg: string;
|
|
12
|
+
thumbBorder: string;
|
|
13
|
+
overlay: string;
|
|
14
|
+
tabActive: string;
|
|
15
|
+
tabInactive: string;
|
|
16
|
+
tabIndicator: string;
|
|
17
|
+
};
|
|
18
|
+
light: {
|
|
19
|
+
background: string;
|
|
20
|
+
surface: string;
|
|
21
|
+
border: string;
|
|
22
|
+
text: string;
|
|
23
|
+
textMuted: string;
|
|
24
|
+
textDim: string;
|
|
25
|
+
inputBg: string;
|
|
26
|
+
thumbBorder: string;
|
|
27
|
+
overlay: string;
|
|
28
|
+
tabActive: string;
|
|
29
|
+
tabInactive: string;
|
|
30
|
+
tabIndicator: string;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
//# sourceMappingURL=const.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../../../src/shared/const.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEvD,eAAO,MAAM,cAAc,EAAE,QAAQ,CAAC,iBAAiB,CAStD,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BlB,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { themes } from "../shared/const";
|
|
2
|
+
export type ColorPickerRef = {
|
|
3
|
+
getColor: () => string;
|
|
4
|
+
setColor: (hex: string) => void;
|
|
5
|
+
clearRecent: () => void;
|
|
6
|
+
open: () => void;
|
|
7
|
+
close: () => void;
|
|
8
|
+
};
|
|
9
|
+
export type TabId = "picker" | "values" | "recent";
|
|
10
|
+
export type ColorPickerLabels = {
|
|
11
|
+
picker?: string;
|
|
12
|
+
values?: string;
|
|
13
|
+
recent?: string;
|
|
14
|
+
save?: string;
|
|
15
|
+
savedColors?: string;
|
|
16
|
+
clearAll?: string;
|
|
17
|
+
noSavedColors?: string;
|
|
18
|
+
noSavedColorsHint?: string;
|
|
19
|
+
};
|
|
20
|
+
export type Theme = (typeof themes)["dark"];
|
|
21
|
+
//# sourceMappingURL=misc.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"misc.d.ts","sourceRoot":"","sources":["../../../../src/types/misc.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAE9C,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,MAAM,MAAM,CAAC;IACvB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,KAAK,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAEnD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,KAAK,GAAG,CAAC,OAAO,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export declare function hsbToHex(h: number, s: number, b: number): string;
|
|
2
|
+
export declare function hexToHsb(hex: string): {
|
|
3
|
+
h: number;
|
|
4
|
+
s: number;
|
|
5
|
+
b: number;
|
|
6
|
+
};
|
|
7
|
+
export declare function hexToRgb(hex: string): {
|
|
8
|
+
r: number;
|
|
9
|
+
g: number;
|
|
10
|
+
b: number;
|
|
11
|
+
};
|
|
12
|
+
export declare function isValidHex(hex: string): boolean;
|
|
13
|
+
export declare function getContrastColor(hex: string): string;
|
|
14
|
+
//# sourceMappingURL=colors.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../../../src/utils/colors.ts"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAWhE;AAED,wBAAgB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAwBzE;AAED,wBAAgB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAOzE;AAED,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAE/C;AAED,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAIpD"}
|
package/package.json
ADDED
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@darthrapid/react-native-color-picker",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "Lightweight HSB color picker for React Native with modal/inline modes, tabs, and i18n support. Pure JS, Expo compatible.",
|
|
5
|
+
"main": "./lib/module/index.js",
|
|
6
|
+
"types": "./lib/typescript/src/index.d.ts",
|
|
7
|
+
"exports": {
|
|
8
|
+
".": {
|
|
9
|
+
"source": "./src/index.tsx",
|
|
10
|
+
"types": "./lib/typescript/src/index.d.ts",
|
|
11
|
+
"default": "./lib/module/index.js"
|
|
12
|
+
},
|
|
13
|
+
"./package.json": "./package.json"
|
|
14
|
+
},
|
|
15
|
+
"files": [
|
|
16
|
+
"src",
|
|
17
|
+
"lib",
|
|
18
|
+
"!**/__tests__",
|
|
19
|
+
"!**/__fixtures__",
|
|
20
|
+
"!**/__mocks__",
|
|
21
|
+
"!**/.*"
|
|
22
|
+
],
|
|
23
|
+
"scripts": {
|
|
24
|
+
"example": "bun run --cwd example",
|
|
25
|
+
"clean": "del-cli lib",
|
|
26
|
+
"prepare": "bob build",
|
|
27
|
+
"typecheck": "tsc",
|
|
28
|
+
"test": "jest"
|
|
29
|
+
},
|
|
30
|
+
"keywords": [
|
|
31
|
+
"react-native",
|
|
32
|
+
"color-picker",
|
|
33
|
+
"hsb",
|
|
34
|
+
"hue",
|
|
35
|
+
"saturation",
|
|
36
|
+
"svg",
|
|
37
|
+
"modal",
|
|
38
|
+
"inline",
|
|
39
|
+
"i18n",
|
|
40
|
+
"expo",
|
|
41
|
+
"ios",
|
|
42
|
+
"android"
|
|
43
|
+
],
|
|
44
|
+
"repository": {
|
|
45
|
+
"type": "git",
|
|
46
|
+
"url": "git+https://github.com/MartinRapcan/react-native-color-picker.git"
|
|
47
|
+
},
|
|
48
|
+
"author": "Martin Rapčan <rapcan.rmartin@gmail.com> (https://github.com/MartinRapcan)",
|
|
49
|
+
"license": "MIT",
|
|
50
|
+
"bugs": {
|
|
51
|
+
"url": "https://github.com/MartinRapcan/react-native-color-picker/issues"
|
|
52
|
+
},
|
|
53
|
+
"homepage": "https://github.com/MartinRapcan/react-native-color-picker#readme",
|
|
54
|
+
"publishConfig": {
|
|
55
|
+
"registry": "https://registry.npmjs.org/"
|
|
56
|
+
},
|
|
57
|
+
"devDependencies": {
|
|
58
|
+
"@commitlint/config-conventional": "^19.8.1",
|
|
59
|
+
"@react-native/babel-preset": "0.83.0",
|
|
60
|
+
"@types/jest": "^29.5.14",
|
|
61
|
+
"@types/react": "^19.1.12",
|
|
62
|
+
"commitlint": "^19.8.1",
|
|
63
|
+
"del-cli": "^6.0.0",
|
|
64
|
+
"jest": "^29.7.0",
|
|
65
|
+
"lefthook": "^2.0.3",
|
|
66
|
+
"react": "19.1.0",
|
|
67
|
+
"react-native": "0.81.5",
|
|
68
|
+
"react-native-builder-bob": "^0.40.13",
|
|
69
|
+
"turbo": "^2.5.6",
|
|
70
|
+
"typescript": "^5.9.2"
|
|
71
|
+
},
|
|
72
|
+
"peerDependencies": {
|
|
73
|
+
"react": "*",
|
|
74
|
+
"react-native": "*",
|
|
75
|
+
"react-native-svg": "^15.15.3"
|
|
76
|
+
},
|
|
77
|
+
"workspaces": [
|
|
78
|
+
"example"
|
|
79
|
+
],
|
|
80
|
+
"react-native-builder-bob": {
|
|
81
|
+
"source": "src",
|
|
82
|
+
"output": "lib",
|
|
83
|
+
"targets": [
|
|
84
|
+
[
|
|
85
|
+
"module",
|
|
86
|
+
{
|
|
87
|
+
"esm": true
|
|
88
|
+
}
|
|
89
|
+
],
|
|
90
|
+
[
|
|
91
|
+
"typescript",
|
|
92
|
+
{
|
|
93
|
+
"project": "tsconfig.build.json",
|
|
94
|
+
"tsc": "node_modules/typescript/bin/tsc"
|
|
95
|
+
}
|
|
96
|
+
]
|
|
97
|
+
]
|
|
98
|
+
},
|
|
99
|
+
"jest": {
|
|
100
|
+
"preset": "react-native",
|
|
101
|
+
"modulePathIgnorePatterns": [
|
|
102
|
+
"<rootDir>/example/node_modules",
|
|
103
|
+
"<rootDir>/lib/"
|
|
104
|
+
],
|
|
105
|
+
"transformIgnorePatterns": [
|
|
106
|
+
"node_modules/(?!(.bun|react-native|@react-native|react-native-svg)/)"
|
|
107
|
+
]
|
|
108
|
+
},
|
|
109
|
+
"commitlint": {
|
|
110
|
+
"extends": [
|
|
111
|
+
"@commitlint/config-conventional"
|
|
112
|
+
]
|
|
113
|
+
},
|
|
114
|
+
"create-react-native-library": {
|
|
115
|
+
"type": "library",
|
|
116
|
+
"languages": "js",
|
|
117
|
+
"tools": [
|
|
118
|
+
"jest",
|
|
119
|
+
"lefthook"
|
|
120
|
+
],
|
|
121
|
+
"version": "0.57.2"
|
|
122
|
+
}
|
|
123
|
+
}
|