@hanzogui/checkbox 2.0.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 +21 -0
- package/dist/cjs/Checkbox.cjs +111 -0
- package/dist/cjs/Checkbox.native.js +117 -0
- package/dist/cjs/Checkbox.native.js.map +1 -0
- package/dist/cjs/CheckboxStyledContext.cjs +33 -0
- package/dist/cjs/CheckboxStyledContext.native.js +36 -0
- package/dist/cjs/CheckboxStyledContext.native.js.map +1 -0
- package/dist/cjs/createCheckbox.cjs +184 -0
- package/dist/cjs/createCheckbox.native.js +209 -0
- package/dist/cjs/createCheckbox.native.js.map +1 -0
- package/dist/cjs/index.cjs +35 -0
- package/dist/cjs/index.native.js +38 -0
- package/dist/cjs/index.native.js.map +1 -0
- package/dist/esm/Checkbox.mjs +87 -0
- package/dist/esm/Checkbox.mjs.map +1 -0
- package/dist/esm/Checkbox.native.js +90 -0
- package/dist/esm/Checkbox.native.js.map +1 -0
- package/dist/esm/CheckboxStyledContext.mjs +10 -0
- package/dist/esm/CheckboxStyledContext.mjs.map +1 -0
- package/dist/esm/CheckboxStyledContext.native.js +10 -0
- package/dist/esm/CheckboxStyledContext.native.js.map +1 -0
- package/dist/esm/createCheckbox.mjs +148 -0
- package/dist/esm/createCheckbox.mjs.map +1 -0
- package/dist/esm/createCheckbox.native.js +171 -0
- package/dist/esm/createCheckbox.native.js.map +1 -0
- package/dist/esm/index.js +11 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/index.mjs +11 -0
- package/dist/esm/index.mjs.map +1 -0
- package/dist/esm/index.native.js +11 -0
- package/dist/esm/index.native.js.map +1 -0
- package/dist/jsx/Checkbox.mjs +87 -0
- package/dist/jsx/Checkbox.mjs.map +1 -0
- package/dist/jsx/Checkbox.native.js +117 -0
- package/dist/jsx/Checkbox.native.js.map +1 -0
- package/dist/jsx/CheckboxStyledContext.mjs +10 -0
- package/dist/jsx/CheckboxStyledContext.mjs.map +1 -0
- package/dist/jsx/CheckboxStyledContext.native.js +36 -0
- package/dist/jsx/CheckboxStyledContext.native.js.map +1 -0
- package/dist/jsx/createCheckbox.mjs +148 -0
- package/dist/jsx/createCheckbox.mjs.map +1 -0
- package/dist/jsx/createCheckbox.native.js +209 -0
- package/dist/jsx/createCheckbox.native.js.map +1 -0
- package/dist/jsx/index.js +11 -0
- package/dist/jsx/index.js.map +1 -0
- package/dist/jsx/index.mjs +11 -0
- package/dist/jsx/index.mjs.map +1 -0
- package/dist/jsx/index.native.js +38 -0
- package/dist/jsx/index.native.js.map +1 -0
- package/package.json +63 -0
- package/src/Checkbox.tsx +122 -0
- package/src/CheckboxStyledContext.tsx +16 -0
- package/src/createCheckbox.tsx +280 -0
- package/src/index.ts +12 -0
- package/types/Checkbox.d.ts +39 -0
- package/types/CheckboxStyledContext.d.ts +9 -0
- package/types/createCheckbox.d.ts +196 -0
- package/types/index.d.ts +324 -0
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
import { isIndeterminate, useCheckbox } from "@hanzo/gui-checkbox-headless";
|
|
2
|
+
import { getVariableValue, isWeb, shouldRenderNativePlatform, useProps, useTheme, withStaticProperties } from "@hanzo/gui-core";
|
|
3
|
+
import { getFontSize } from "@hanzo/gui-font-size";
|
|
4
|
+
import { getSize } from "@hanzo/gui-get-token";
|
|
5
|
+
import { useGetThemedIcon } from "@hanzo/gui-helpers";
|
|
6
|
+
import { useControllableState } from "@hanzo/gui-use-controllable-state";
|
|
7
|
+
import React, { useMemo } from "react";
|
|
8
|
+
import { CheckboxFrame, CheckboxIndicatorFrame } from "./Checkbox.mjs";
|
|
9
|
+
import { CheckboxStyledContext } from "./CheckboxStyledContext.mjs";
|
|
10
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
11
|
+
const CheckboxContext = React.createContext({
|
|
12
|
+
checked: !1,
|
|
13
|
+
disabled: !1
|
|
14
|
+
}),
|
|
15
|
+
ensureContext = x => {
|
|
16
|
+
x.context || (x.context = CheckboxContext);
|
|
17
|
+
};
|
|
18
|
+
function createCheckbox(createProps) {
|
|
19
|
+
const {
|
|
20
|
+
Frame = CheckboxFrame,
|
|
21
|
+
Indicator = CheckboxIndicatorFrame
|
|
22
|
+
} = createProps;
|
|
23
|
+
ensureContext(Frame), ensureContext(Indicator);
|
|
24
|
+
const FrameComponent = Frame.styleable(function (_props, forwardedRef) {
|
|
25
|
+
const {
|
|
26
|
+
scaleSize = 0.45,
|
|
27
|
+
sizeAdjust = 0,
|
|
28
|
+
scaleIcon,
|
|
29
|
+
checked: checkedProp,
|
|
30
|
+
defaultChecked,
|
|
31
|
+
onCheckedChange,
|
|
32
|
+
native,
|
|
33
|
+
unstyled = !1,
|
|
34
|
+
activeStyle,
|
|
35
|
+
activeTheme,
|
|
36
|
+
...props
|
|
37
|
+
} = _props,
|
|
38
|
+
propsActive = useProps(props),
|
|
39
|
+
styledContext = React.useContext(CheckboxStyledContext.context);
|
|
40
|
+
let adjustedSize = 0,
|
|
41
|
+
size = 0;
|
|
42
|
+
unstyled || (adjustedSize = getVariableValue(getSize(propsActive.size ?? styledContext?.size ?? "$true", {
|
|
43
|
+
shift: sizeAdjust
|
|
44
|
+
})), size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize);
|
|
45
|
+
const [checked = !1, setChecked] = useControllableState({
|
|
46
|
+
prop: checkedProp,
|
|
47
|
+
defaultProp: defaultChecked,
|
|
48
|
+
onChange: onCheckedChange
|
|
49
|
+
}),
|
|
50
|
+
{
|
|
51
|
+
checkboxProps,
|
|
52
|
+
checkboxRef,
|
|
53
|
+
bubbleInput
|
|
54
|
+
} = useCheckbox(
|
|
55
|
+
// @ts-ignore
|
|
56
|
+
propsActive, [checked, setChecked], forwardedRef);
|
|
57
|
+
if (shouldRenderNativePlatform(native) === "web") return /* @__PURE__ */jsx("input", {
|
|
58
|
+
type: "checkbox",
|
|
59
|
+
defaultChecked: isIndeterminate(checked) ? !1 : checked,
|
|
60
|
+
tabIndex: -1,
|
|
61
|
+
ref: checkboxRef,
|
|
62
|
+
disabled: checkboxProps.disabled,
|
|
63
|
+
style: {
|
|
64
|
+
appearance: "auto",
|
|
65
|
+
accentColor: "var(--color6)",
|
|
66
|
+
...checkboxProps.style
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
const memoizedContext = useMemo(() => ({
|
|
70
|
+
checked,
|
|
71
|
+
disabled: checkboxProps.disabled
|
|
72
|
+
}), [checked, checkboxProps.disabled]),
|
|
73
|
+
isActive = !!checked,
|
|
74
|
+
disabled = checkboxProps.disabled;
|
|
75
|
+
return /* @__PURE__ */jsx(CheckboxContext.Provider, {
|
|
76
|
+
value: memoizedContext,
|
|
77
|
+
children: /* @__PURE__ */jsxs(CheckboxStyledContext.Provider, {
|
|
78
|
+
size: propsActive.size ?? styledContext?.size ?? "$true",
|
|
79
|
+
scaleIcon: scaleIcon ?? styledContext?.scaleIcon ?? 1,
|
|
80
|
+
unstyled,
|
|
81
|
+
active: isActive,
|
|
82
|
+
disabled,
|
|
83
|
+
children: [/* @__PURE__ */jsx(Frame, {
|
|
84
|
+
render: "button",
|
|
85
|
+
ref: checkboxRef,
|
|
86
|
+
unstyled,
|
|
87
|
+
theme: activeTheme ?? null,
|
|
88
|
+
...(isWeb && {
|
|
89
|
+
type: "button"
|
|
90
|
+
}),
|
|
91
|
+
...(!unstyled && {
|
|
92
|
+
width: size,
|
|
93
|
+
height: size,
|
|
94
|
+
size
|
|
95
|
+
}),
|
|
96
|
+
checked,
|
|
97
|
+
disabled,
|
|
98
|
+
...checkboxProps,
|
|
99
|
+
...props,
|
|
100
|
+
...(isActive && {
|
|
101
|
+
...(!unstyled && !activeStyle && {
|
|
102
|
+
backgroundColor: "$backgroundActive"
|
|
103
|
+
}),
|
|
104
|
+
...activeStyle
|
|
105
|
+
}),
|
|
106
|
+
children: propsActive.children
|
|
107
|
+
}), bubbleInput]
|
|
108
|
+
})
|
|
109
|
+
});
|
|
110
|
+
}),
|
|
111
|
+
IndicatorComponent = Indicator.styleable((props, forwardedRef) => {
|
|
112
|
+
const {
|
|
113
|
+
children: childrenProp,
|
|
114
|
+
forceMount,
|
|
115
|
+
disablePassStyles,
|
|
116
|
+
unstyled = !1,
|
|
117
|
+
activeStyle,
|
|
118
|
+
...indicatorProps
|
|
119
|
+
} = props,
|
|
120
|
+
styledContext = CheckboxStyledContext.useStyledContext(),
|
|
121
|
+
{
|
|
122
|
+
active
|
|
123
|
+
} = styledContext;
|
|
124
|
+
let children = childrenProp;
|
|
125
|
+
if (!unstyled) {
|
|
126
|
+
const iconSize = (typeof styledContext.size == "number" ? styledContext.size * 0.65 : getFontSize(styledContext.size)) * styledContext.scaleIcon,
|
|
127
|
+
theme = useTheme(),
|
|
128
|
+
getThemedIcon = useGetThemedIcon({
|
|
129
|
+
size: iconSize,
|
|
130
|
+
color: theme.color
|
|
131
|
+
});
|
|
132
|
+
children = React.Children.toArray(childrenProp).map(child => disablePassStyles || !React.isValidElement(child) ? child : getThemedIcon(child));
|
|
133
|
+
}
|
|
134
|
+
const context = React.useContext(CheckboxContext);
|
|
135
|
+
return forceMount || isIndeterminate(context.checked) || context.checked === !0 ? /* @__PURE__ */jsx(Indicator, {
|
|
136
|
+
pointerEvents: "none",
|
|
137
|
+
...indicatorProps,
|
|
138
|
+
...(active && activeStyle),
|
|
139
|
+
ref: forwardedRef,
|
|
140
|
+
children
|
|
141
|
+
}) : null;
|
|
142
|
+
});
|
|
143
|
+
return withStaticProperties(FrameComponent, {
|
|
144
|
+
Indicator: IndicatorComponent
|
|
145
|
+
});
|
|
146
|
+
}
|
|
147
|
+
export { CheckboxContext, createCheckbox };
|
|
148
|
+
//# sourceMappingURL=createCheckbox.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["isIndeterminate","useCheckbox","getVariableValue","isWeb","shouldRenderNativePlatform","useProps","useTheme","withStaticProperties","getFontSize","getSize","useGetThemedIcon","useControllableState","React","useMemo","CheckboxFrame","CheckboxIndicatorFrame","CheckboxStyledContext","jsx","jsxs","CheckboxContext","createContext","checked","disabled","ensureContext","x","context","createCheckbox","createProps","Frame","Indicator","FrameComponent","styleable","_props","forwardedRef","scaleSize","sizeAdjust","scaleIcon","checkedProp","defaultChecked","onCheckedChange","native","unstyled","activeStyle","activeTheme","props","propsActive","styledContext","useContext","adjustedSize","size","shift","Math","round","setChecked","prop","defaultProp","onChange","checkboxProps","checkboxRef","bubbleInput","type","tabIndex","ref","style","appearance","accentColor","memoizedContext","isActive","Provider","value","children","active","render","theme","width","height","backgroundColor","IndicatorComponent","childrenProp","forceMount","disablePassStyles","indicatorProps","useStyledContext","iconSize","getThemedIcon","color","Children","toArray","map","child","isValidElement","pointerEvents"],"sources":["../../src/createCheckbox.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { isIndeterminate, useCheckbox } from "@hanzo/gui-checkbox-headless";
|
|
3
|
+
import { getVariableValue, isWeb, shouldRenderNativePlatform, useProps, useTheme, withStaticProperties } from "@hanzo/gui-core";
|
|
4
|
+
import { registerFocusable } from "@hanzo/gui-focusable";
|
|
5
|
+
import { getFontSize } from "@hanzo/gui-font-size";
|
|
6
|
+
import { getSize } from "@hanzo/gui-get-token";
|
|
7
|
+
import { useGetThemedIcon } from "@hanzo/gui-helpers";
|
|
8
|
+
import { useControllableState } from "@hanzo/gui-use-controllable-state";
|
|
9
|
+
import React, { useMemo } from "react";
|
|
10
|
+
import { CheckboxFrame, CheckboxIndicatorFrame } from "./Checkbox.native.js";
|
|
11
|
+
import { CheckboxStyledContext } from "./CheckboxStyledContext.native.js";
|
|
12
|
+
var CheckboxContext = /* @__PURE__ */React.createContext({
|
|
13
|
+
checked: !1,
|
|
14
|
+
disabled: !1
|
|
15
|
+
}),
|
|
16
|
+
ensureContext = function (x) {
|
|
17
|
+
x.context || (x.context = CheckboxContext);
|
|
18
|
+
};
|
|
19
|
+
function createCheckbox(createProps) {
|
|
20
|
+
var {
|
|
21
|
+
Frame = CheckboxFrame,
|
|
22
|
+
Indicator = CheckboxIndicatorFrame
|
|
23
|
+
} = createProps;
|
|
24
|
+
ensureContext(Frame), ensureContext(Indicator);
|
|
25
|
+
var FrameComponent = Frame.styleable(function (_props, forwardedRef) {
|
|
26
|
+
var {
|
|
27
|
+
scaleSize = 0.45,
|
|
28
|
+
sizeAdjust = 0,
|
|
29
|
+
scaleIcon,
|
|
30
|
+
checked: checkedProp,
|
|
31
|
+
defaultChecked,
|
|
32
|
+
onCheckedChange,
|
|
33
|
+
native,
|
|
34
|
+
unstyled = !1,
|
|
35
|
+
activeStyle,
|
|
36
|
+
activeTheme,
|
|
37
|
+
...props
|
|
38
|
+
} = _props,
|
|
39
|
+
propsActive = useProps(props),
|
|
40
|
+
styledContext = React.useContext(CheckboxStyledContext.context),
|
|
41
|
+
adjustedSize = 0,
|
|
42
|
+
size = 0;
|
|
43
|
+
if (!unstyled) {
|
|
44
|
+
var _propsActive_size, _ref;
|
|
45
|
+
adjustedSize = getVariableValue(getSize((_ref = (_propsActive_size = propsActive.size) !== null && _propsActive_size !== void 0 ? _propsActive_size : styledContext?.size) !== null && _ref !== void 0 ? _ref : "$true", {
|
|
46
|
+
shift: sizeAdjust
|
|
47
|
+
})), size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize;
|
|
48
|
+
}
|
|
49
|
+
var [checked = !1, setChecked] = useControllableState({
|
|
50
|
+
prop: checkedProp,
|
|
51
|
+
defaultProp: defaultChecked,
|
|
52
|
+
onChange: onCheckedChange
|
|
53
|
+
}),
|
|
54
|
+
{
|
|
55
|
+
checkboxProps,
|
|
56
|
+
checkboxRef,
|
|
57
|
+
bubbleInput
|
|
58
|
+
} = useCheckbox(
|
|
59
|
+
// @ts-ignore
|
|
60
|
+
propsActive, [checked, setChecked], forwardedRef);
|
|
61
|
+
React.useEffect(function () {
|
|
62
|
+
if (props.id && !props.disabled) return registerFocusable(props.id, {
|
|
63
|
+
focusAndSelect: function () {
|
|
64
|
+
setChecked?.(function (value) {
|
|
65
|
+
return !value;
|
|
66
|
+
});
|
|
67
|
+
},
|
|
68
|
+
focus: function () {}
|
|
69
|
+
});
|
|
70
|
+
}, [props.id, props.disabled]);
|
|
71
|
+
var renderNative = shouldRenderNativePlatform(native);
|
|
72
|
+
if (renderNative === "web") return /* @__PURE__ */_jsx("input", {
|
|
73
|
+
type: "checkbox",
|
|
74
|
+
defaultChecked: isIndeterminate(checked) ? !1 : checked,
|
|
75
|
+
tabIndex: -1,
|
|
76
|
+
ref: checkboxRef,
|
|
77
|
+
disabled: checkboxProps.disabled,
|
|
78
|
+
style: {
|
|
79
|
+
appearance: "auto",
|
|
80
|
+
accentColor: "var(--color6)",
|
|
81
|
+
...checkboxProps.style
|
|
82
|
+
}
|
|
83
|
+
});
|
|
84
|
+
var memoizedContext = useMemo(function () {
|
|
85
|
+
return {
|
|
86
|
+
checked,
|
|
87
|
+
disabled: checkboxProps.disabled
|
|
88
|
+
};
|
|
89
|
+
}, [checked, checkboxProps.disabled]),
|
|
90
|
+
isActive = !!checked,
|
|
91
|
+
disabled = checkboxProps.disabled,
|
|
92
|
+
_propsActive_size1,
|
|
93
|
+
_ref1,
|
|
94
|
+
_ref2;
|
|
95
|
+
return /* @__PURE__ */_jsx(CheckboxContext.Provider, {
|
|
96
|
+
value: memoizedContext,
|
|
97
|
+
children: /* @__PURE__ */_jsxs(CheckboxStyledContext.Provider, {
|
|
98
|
+
size: (_ref1 = (_propsActive_size1 = propsActive.size) !== null && _propsActive_size1 !== void 0 ? _propsActive_size1 : styledContext?.size) !== null && _ref1 !== void 0 ? _ref1 : "$true",
|
|
99
|
+
scaleIcon: (_ref2 = scaleIcon ?? styledContext?.scaleIcon) !== null && _ref2 !== void 0 ? _ref2 : 1,
|
|
100
|
+
unstyled,
|
|
101
|
+
active: isActive,
|
|
102
|
+
disabled,
|
|
103
|
+
children: [/* @__PURE__ */_jsx(Frame, {
|
|
104
|
+
render: "button",
|
|
105
|
+
ref: checkboxRef,
|
|
106
|
+
unstyled,
|
|
107
|
+
theme: activeTheme ?? null,
|
|
108
|
+
...(isWeb && {
|
|
109
|
+
type: "button"
|
|
110
|
+
}),
|
|
111
|
+
...(!unstyled && {
|
|
112
|
+
width: size,
|
|
113
|
+
height: size,
|
|
114
|
+
size
|
|
115
|
+
}),
|
|
116
|
+
checked,
|
|
117
|
+
disabled,
|
|
118
|
+
...checkboxProps,
|
|
119
|
+
...props,
|
|
120
|
+
...(isActive && {
|
|
121
|
+
...(!unstyled && !activeStyle && {
|
|
122
|
+
backgroundColor: "$backgroundActive"
|
|
123
|
+
}),
|
|
124
|
+
...activeStyle
|
|
125
|
+
}),
|
|
126
|
+
children: propsActive.children
|
|
127
|
+
}), bubbleInput]
|
|
128
|
+
})
|
|
129
|
+
});
|
|
130
|
+
}),
|
|
131
|
+
IndicatorComponent = Indicator.styleable(function (props, forwardedRef) {
|
|
132
|
+
var {
|
|
133
|
+
children: childrenProp,
|
|
134
|
+
forceMount,
|
|
135
|
+
disablePassStyles,
|
|
136
|
+
unstyled = !1,
|
|
137
|
+
activeStyle,
|
|
138
|
+
...indicatorProps
|
|
139
|
+
} = props,
|
|
140
|
+
styledContext = CheckboxStyledContext.useStyledContext(),
|
|
141
|
+
{
|
|
142
|
+
active
|
|
143
|
+
} = styledContext,
|
|
144
|
+
children = childrenProp;
|
|
145
|
+
if (!unstyled) {
|
|
146
|
+
var iconSize = (typeof styledContext.size == "number" ? styledContext.size * 0.65 : getFontSize(styledContext.size)) * styledContext.scaleIcon,
|
|
147
|
+
theme = useTheme(),
|
|
148
|
+
getThemedIcon = useGetThemedIcon({
|
|
149
|
+
size: iconSize,
|
|
150
|
+
color: theme.color
|
|
151
|
+
}),
|
|
152
|
+
childrens = React.Children.toArray(childrenProp);
|
|
153
|
+
children = childrens.map(function (child) {
|
|
154
|
+
return disablePassStyles || ! /* @__PURE__ */React.isValidElement(child) ? child : getThemedIcon(child);
|
|
155
|
+
});
|
|
156
|
+
}
|
|
157
|
+
var context = React.useContext(CheckboxContext);
|
|
158
|
+
return forceMount || isIndeterminate(context.checked) || context.checked === !0 ? /* @__PURE__ */_jsx(Indicator, {
|
|
159
|
+
pointerEvents: "none",
|
|
160
|
+
...indicatorProps,
|
|
161
|
+
...(active && activeStyle),
|
|
162
|
+
ref: forwardedRef,
|
|
163
|
+
children
|
|
164
|
+
}) : null;
|
|
165
|
+
});
|
|
166
|
+
return withStaticProperties(FrameComponent, {
|
|
167
|
+
Indicator: IndicatorComponent
|
|
168
|
+
});
|
|
169
|
+
}
|
|
170
|
+
export { CheckboxContext, createCheckbox };
|
|
171
|
+
//# sourceMappingURL=createCheckbox.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","isIndeterminate","useCheckbox","getVariableValue","isWeb","shouldRenderNativePlatform","useProps","useTheme","withStaticProperties","registerFocusable","getFontSize","getSize","useGetThemedIcon","useControllableState","React","useMemo","CheckboxFrame","CheckboxIndicatorFrame","CheckboxStyledContext","CheckboxContext","createContext","checked","disabled","ensureContext","x","context","createCheckbox","createProps","Frame","Indicator","FrameComponent","styleable","_props","forwardedRef","scaleSize","sizeAdjust","scaleIcon","checkedProp","defaultChecked","onCheckedChange","native","unstyled","activeStyle","activeTheme","props","propsActive","styledContext","useContext","adjustedSize","size","_propsActive_size","_ref","shift","Math","round","setChecked","prop","defaultProp","onChange","checkboxProps","checkboxRef","bubbleInput","useEffect","id","focusAndSelect","value","focus","renderNative","type","tabIndex","ref","style","appearance","accentColor","memoizedContext","isActive","_propsActive_size1","_ref1","_ref2","Provider","children","active","render","theme","width","height","backgroundColor","IndicatorComponent","childrenProp","forceMount","disablePassStyles","indicatorProps","useStyledContext","iconSize","getThemedIcon","color","childrens","Children","toArray","map","child","isValidElement","pointerEvents"],"sources":["../../src/createCheckbox.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { CheckboxFrame, CheckboxIndicatorFrame } from "./Checkbox.mjs";
|
|
2
|
+
import { createCheckbox } from "./createCheckbox.mjs";
|
|
3
|
+
export * from "./createCheckbox.mjs";
|
|
4
|
+
export * from "./Checkbox.mjs";
|
|
5
|
+
export * from "./CheckboxStyledContext.mjs";
|
|
6
|
+
const Checkbox = createCheckbox({
|
|
7
|
+
Frame: CheckboxFrame,
|
|
8
|
+
Indicator: CheckboxIndicatorFrame
|
|
9
|
+
});
|
|
10
|
+
export { Checkbox };
|
|
11
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["CheckboxFrame","CheckboxIndicatorFrame","createCheckbox","Checkbox","Frame","Indicator"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,SAASA,aAAA,EAAeC,sBAAA,QAA8B;AACtD,SAASC,cAAA,QAAsB;AAE/B,cAAc;AACd,cAAc;AACd,cAAc;AAGP,MAAMC,QAAA,GAAWD,cAAA,CAAe;EACrCE,KAAA,EAAOJ,aAAA;EACPK,SAAA,EAAWJ;AACb,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { CheckboxFrame, CheckboxIndicatorFrame } from "./Checkbox.mjs";
|
|
2
|
+
import { createCheckbox } from "./createCheckbox.mjs";
|
|
3
|
+
export * from "./createCheckbox.mjs";
|
|
4
|
+
export * from "./Checkbox.mjs";
|
|
5
|
+
export * from "./CheckboxStyledContext.mjs";
|
|
6
|
+
const Checkbox = createCheckbox({
|
|
7
|
+
Frame: CheckboxFrame,
|
|
8
|
+
Indicator: CheckboxIndicatorFrame
|
|
9
|
+
});
|
|
10
|
+
export { Checkbox };
|
|
11
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["CheckboxFrame","CheckboxIndicatorFrame","createCheckbox","Checkbox","Frame","Indicator"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,SAASA,aAAA,EAAeC,sBAAA,QAA8B;AACtD,SAASC,cAAA,QAAsB;AAE/B,cAAc;AACd,cAAc;AACd,cAAc;AAGP,MAAMC,QAAA,GAAWD,cAAA,CAAe;EACrCE,KAAA,EAAOJ,aAAA;EACPK,SAAA,EAAWJ;AACb,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { CheckboxFrame, CheckboxIndicatorFrame } from "./Checkbox.native.js";
|
|
2
|
+
import { createCheckbox } from "./createCheckbox.native.js";
|
|
3
|
+
export * from "./createCheckbox.native.js";
|
|
4
|
+
export * from "./Checkbox.native.js";
|
|
5
|
+
export * from "./CheckboxStyledContext.native.js";
|
|
6
|
+
var Checkbox = createCheckbox({
|
|
7
|
+
Frame: CheckboxFrame,
|
|
8
|
+
Indicator: CheckboxIndicatorFrame
|
|
9
|
+
});
|
|
10
|
+
export { Checkbox };
|
|
11
|
+
//# sourceMappingURL=index.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["CheckboxFrame","CheckboxIndicatorFrame","createCheckbox","Checkbox","Frame","Indicator"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,SAASA,aAAA,EAAeC,sBAAA,QAA8B;AACtD,SAASC,cAAA,QAAsB;AAE/B,cAAc;AACd,cAAc;AACd,cAAc;AAGP,IAAAC,QAAM,GAAAD,cAAW;EACtBE,KAAA,EAAOJ,aAAA;EACPK,SAAA,EAAWJ;AACb,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import { getVariableValue, styled } from "@hanzo/gui-core";
|
|
2
|
+
import { getSize } from "@hanzo/gui-get-token";
|
|
3
|
+
import { YStack } from "@hanzo/gui-stacks";
|
|
4
|
+
import { CheckboxStyledContext } from "./CheckboxStyledContext.mjs";
|
|
5
|
+
const INDICATOR_NAME = "CheckboxIndicator",
|
|
6
|
+
CheckboxIndicatorFrame = styled(YStack, {
|
|
7
|
+
// use Checkbox for easier themes
|
|
8
|
+
name: INDICATOR_NAME,
|
|
9
|
+
context: CheckboxStyledContext,
|
|
10
|
+
variants: {
|
|
11
|
+
unstyled: {
|
|
12
|
+
false: {}
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
defaultVariants: {
|
|
16
|
+
unstyled: process.env.HANZO_GUI_HEADLESS === "1"
|
|
17
|
+
}
|
|
18
|
+
}, {
|
|
19
|
+
accept: {
|
|
20
|
+
activeStyle: "style"
|
|
21
|
+
}
|
|
22
|
+
}),
|
|
23
|
+
CHECKBOX_NAME = "Checkbox",
|
|
24
|
+
CheckboxFrame = styled(YStack, {
|
|
25
|
+
name: CHECKBOX_NAME,
|
|
26
|
+
render: "button",
|
|
27
|
+
context: CheckboxStyledContext,
|
|
28
|
+
variants: {
|
|
29
|
+
unstyled: {
|
|
30
|
+
false: {
|
|
31
|
+
size: "$true",
|
|
32
|
+
backgroundColor: "$background",
|
|
33
|
+
alignItems: "center",
|
|
34
|
+
justifyContent: "center",
|
|
35
|
+
borderWidth: 1,
|
|
36
|
+
borderColor: "$borderColor",
|
|
37
|
+
hoverStyle: {
|
|
38
|
+
borderColor: "$borderColorHover"
|
|
39
|
+
},
|
|
40
|
+
pressStyle: {
|
|
41
|
+
backgroundColor: "$backgroundPress",
|
|
42
|
+
borderColor: "$borderColorPress"
|
|
43
|
+
},
|
|
44
|
+
focusStyle: {
|
|
45
|
+
borderColor: "$borderColorFocus"
|
|
46
|
+
},
|
|
47
|
+
focusVisibleStyle: {
|
|
48
|
+
outlineStyle: "solid",
|
|
49
|
+
outlineWidth: 2,
|
|
50
|
+
outlineColor: "$outlineColor"
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
},
|
|
54
|
+
disabled: {
|
|
55
|
+
true: {
|
|
56
|
+
pointerEvents: "none",
|
|
57
|
+
userSelect: "none",
|
|
58
|
+
cursor: "not-allowed",
|
|
59
|
+
hoverStyle: {
|
|
60
|
+
borderColor: "$borderColor",
|
|
61
|
+
backgroundColor: "$background"
|
|
62
|
+
},
|
|
63
|
+
pressStyle: {
|
|
64
|
+
borderColor: "$borderColor",
|
|
65
|
+
backgroundColor: "$background"
|
|
66
|
+
},
|
|
67
|
+
focusStyle: {
|
|
68
|
+
outlineWidth: 0
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
},
|
|
72
|
+
size: {
|
|
73
|
+
"...size": val => ({
|
|
74
|
+
borderRadius: getVariableValue(getSize(val)) / 8
|
|
75
|
+
})
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
defaultVariants: {
|
|
79
|
+
unstyled: process.env.HANZO_GUI_HEADLESS === "1"
|
|
80
|
+
}
|
|
81
|
+
}, {
|
|
82
|
+
accept: {
|
|
83
|
+
activeStyle: "style"
|
|
84
|
+
}
|
|
85
|
+
});
|
|
86
|
+
export { CheckboxFrame, CheckboxIndicatorFrame };
|
|
87
|
+
//# sourceMappingURL=Checkbox.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["getVariableValue","styled","getSize","YStack","CheckboxStyledContext","INDICATOR_NAME","CheckboxIndicatorFrame","name","context","variants","unstyled","false","defaultVariants","process","env","HANZO_GUI_HEADLESS","accept","activeStyle","CHECKBOX_NAME","CheckboxFrame","render","size","backgroundColor","alignItems","justifyContent","borderWidth","borderColor","hoverStyle","pressStyle","focusStyle","focusVisibleStyle","outlineStyle","outlineWidth","outlineColor","disabled","true","pointerEvents","userSelect","cursor","val","borderRadius"],"sources":["../../src/Checkbox.tsx"],"sourcesContent":[null],"mappings":"AAGA,SAASA,gBAAA,EAAkBC,MAAA,QAAc;AACzC,SAASC,OAAA,QAAe;AACxB,SAASC,MAAA,QAAc;AAEvB,SAASC,qBAAA,QAA6B;AAKtC,MAAMC,cAAA,GAAiB;EAEVC,sBAAA,GAAyBL,MAAA,CACpCE,MAAA,EACA;IAAA;IAEEI,IAAA,EAAMF,cAAA;IACNG,OAAA,EAASJ,qBAAA;IACTK,QAAA,EAAU;MACRC,QAAA,EAAU;QACRC,KAAA,EAAO,CAAC;MACV;IACF;IACAC,eAAA,EAAiB;MACfF,QAAA,EAAUG,OAAA,CAAQC,GAAA,CAAIC,kBAAA,KAAuB;IAC/C;EACF,GACA;IACEC,MAAA,EAAQ;MACNC,WAAA,EAAa;IACf;EACF,CACF;EAMMC,aAAA,GAAgB;EAETC,aAAA,GAAgBlB,MAAA,CAC3BE,MAAA,EACA;IACEI,IAAA,EAAMW,aAAA;IACNE,MAAA,EAAQ;IAERZ,OAAA,EAASJ,qBAAA;IACTK,QAAA,EAAU;MACRC,QAAA,EAAU;QACRC,KAAA,EAAO;UACLU,IAAA,EAAM;UACNC,eAAA,EAAiB;UACjBC,UAAA,EAAY;UACZC,cAAA,EAAgB;UAChBC,WAAA,EAAa;UACbC,WAAA,EAAa;UAEbC,UAAA,EAAY;YACVD,WAAA,EAAa;UACf;UAEAE,UAAA,EAAY;YACVN,eAAA,EAAiB;YACjBI,WAAA,EAAa;UACf;UAEAG,UAAA,EAAY;YACVH,WAAA,EAAa;UACf;UAEAI,iBAAA,EAAmB;YACjBC,YAAA,EAAc;YACdC,YAAA,EAAc;YACdC,YAAA,EAAc;UAChB;QACF;MACF;MAEAC,QAAA,EAAU;QACRC,IAAA,EAAM;UACJC,aAAA,EAAe;UACfC,UAAA,EAAY;UACZC,MAAA,EAAQ;UAERX,UAAA,EAAY;YACVD,WAAA,EAAa;YACbJ,eAAA,EAAiB;UACnB;UAEAM,UAAA,EAAY;YACVF,WAAA,EAAa;YACbJ,eAAA,EAAiB;UACnB;UAEAO,UAAA,EAAY;YACVG,YAAA,EAAc;UAChB;QACF;MACF;MAEAX,IAAA,EAAM;QACJ,WAAYkB,GAAA,KAEH;UACLC,YAAA,EAFkBxC,gBAAA,CAAiBE,OAAA,CAAQqC,GAAG,CAAC,IAAI;QAGrD;MAEJ;IACF;IAEA3B,eAAA,EAAiB;MACfF,QAAA,EAAUG,OAAA,CAAQC,GAAA,CAAIC,kBAAA,KAAuB;IAC/C;EACF,GACA;IACEC,MAAA,EAAQ;MACNC,WAAA,EAAa;IACf;EACF,CACF","ignoreList":[]}
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all) __defProp(target, name, {
|
|
9
|
+
get: all[name],
|
|
10
|
+
enumerable: !0
|
|
11
|
+
});
|
|
12
|
+
},
|
|
13
|
+
__copyProps = (to, from, except, desc) => {
|
|
14
|
+
if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, {
|
|
15
|
+
get: () => from[key],
|
|
16
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
17
|
+
});
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
|
|
21
|
+
value: !0
|
|
22
|
+
}), mod);
|
|
23
|
+
var Checkbox_exports = {};
|
|
24
|
+
__export(Checkbox_exports, {
|
|
25
|
+
CheckboxFrame: () => CheckboxFrame,
|
|
26
|
+
CheckboxIndicatorFrame: () => CheckboxIndicatorFrame
|
|
27
|
+
});
|
|
28
|
+
module.exports = __toCommonJS(Checkbox_exports);
|
|
29
|
+
var import_gui_core = require("@hanzo/gui-core"),
|
|
30
|
+
import_gui_get_token = require("@hanzo/gui-get-token"),
|
|
31
|
+
import_gui_stacks = require("@hanzo/gui-stacks"),
|
|
32
|
+
import_CheckboxStyledContext = require("./CheckboxStyledContext.native.js"),
|
|
33
|
+
INDICATOR_NAME = "CheckboxIndicator",
|
|
34
|
+
CheckboxIndicatorFrame = (0, import_gui_core.styled)(import_gui_stacks.YStack, {
|
|
35
|
+
// use Checkbox for easier themes
|
|
36
|
+
name: INDICATOR_NAME,
|
|
37
|
+
context: import_CheckboxStyledContext.CheckboxStyledContext,
|
|
38
|
+
variants: {
|
|
39
|
+
unstyled: {
|
|
40
|
+
false: {}
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
defaultVariants: {
|
|
44
|
+
unstyled: process.env.HANZO_GUI_HEADLESS === "1"
|
|
45
|
+
}
|
|
46
|
+
}, {
|
|
47
|
+
accept: {
|
|
48
|
+
activeStyle: "style"
|
|
49
|
+
}
|
|
50
|
+
}),
|
|
51
|
+
CHECKBOX_NAME = "Checkbox",
|
|
52
|
+
CheckboxFrame = (0, import_gui_core.styled)(import_gui_stacks.YStack, {
|
|
53
|
+
name: CHECKBOX_NAME,
|
|
54
|
+
render: "button",
|
|
55
|
+
context: import_CheckboxStyledContext.CheckboxStyledContext,
|
|
56
|
+
variants: {
|
|
57
|
+
unstyled: {
|
|
58
|
+
false: {
|
|
59
|
+
size: "$true",
|
|
60
|
+
backgroundColor: "$background",
|
|
61
|
+
alignItems: "center",
|
|
62
|
+
justifyContent: "center",
|
|
63
|
+
borderWidth: 1,
|
|
64
|
+
borderColor: "$borderColor",
|
|
65
|
+
hoverStyle: {
|
|
66
|
+
borderColor: "$borderColorHover"
|
|
67
|
+
},
|
|
68
|
+
pressStyle: {
|
|
69
|
+
backgroundColor: "$backgroundPress",
|
|
70
|
+
borderColor: "$borderColorPress"
|
|
71
|
+
},
|
|
72
|
+
focusStyle: {
|
|
73
|
+
borderColor: "$borderColorFocus"
|
|
74
|
+
},
|
|
75
|
+
focusVisibleStyle: {
|
|
76
|
+
outlineStyle: "solid",
|
|
77
|
+
outlineWidth: 2,
|
|
78
|
+
outlineColor: "$outlineColor"
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
disabled: {
|
|
83
|
+
true: {
|
|
84
|
+
pointerEvents: "none",
|
|
85
|
+
userSelect: "none",
|
|
86
|
+
cursor: "not-allowed",
|
|
87
|
+
hoverStyle: {
|
|
88
|
+
borderColor: "$borderColor",
|
|
89
|
+
backgroundColor: "$background"
|
|
90
|
+
},
|
|
91
|
+
pressStyle: {
|
|
92
|
+
borderColor: "$borderColor",
|
|
93
|
+
backgroundColor: "$background"
|
|
94
|
+
},
|
|
95
|
+
focusStyle: {
|
|
96
|
+
outlineWidth: 0
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
},
|
|
100
|
+
size: {
|
|
101
|
+
"...size": function (val) {
|
|
102
|
+
var radiusToken = (0, import_gui_core.getVariableValue)((0, import_gui_get_token.getSize)(val)) / 8;
|
|
103
|
+
return {
|
|
104
|
+
borderRadius: radiusToken
|
|
105
|
+
};
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
},
|
|
109
|
+
defaultVariants: {
|
|
110
|
+
unstyled: process.env.HANZO_GUI_HEADLESS === "1"
|
|
111
|
+
}
|
|
112
|
+
}, {
|
|
113
|
+
accept: {
|
|
114
|
+
activeStyle: "style"
|
|
115
|
+
}
|
|
116
|
+
});
|
|
117
|
+
//# sourceMappingURL=Checkbox.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","Checkbox_exports","CheckboxFrame","CheckboxIndicatorFrame","module","exports","import_gui_core","require","import_gui_get_token","import_gui_stacks","import_CheckboxStyledContext","INDICATOR_NAME","styled","YStack","context","CheckboxStyledContext","variants","unstyled","false","defaultVariants","process","env","HANZO_GUI_HEADLESS","accept","activeStyle","CHECKBOX_NAME","render","size","backgroundColor","alignItems","justifyContent","borderWidth","borderColor","hoverStyle","pressStyle","focusStyle","focusVisibleStyle","outlineStyle","outlineWidth","outlineColor","disabled","true","pointerEvents","userSelect","cursor","...size","val","radiusToken","getVariableValue","getSize","borderRadius"],"sources":["../../src/Checkbox.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { createStyledContext } from "@hanzo/gui-core";
|
|
2
|
+
const CheckboxStyledContext = createStyledContext({
|
|
3
|
+
size: "$true",
|
|
4
|
+
scaleIcon: 1,
|
|
5
|
+
unstyled: process.env.HANZO_GUI_HEADLESS === "1",
|
|
6
|
+
active: !1,
|
|
7
|
+
disabled: !1
|
|
8
|
+
});
|
|
9
|
+
export { CheckboxStyledContext };
|
|
10
|
+
//# sourceMappingURL=CheckboxStyledContext.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["createStyledContext","CheckboxStyledContext","size","scaleIcon","unstyled","process","env","HANZO_GUI_HEADLESS","active","disabled"],"sources":["../../src/CheckboxStyledContext.tsx"],"sourcesContent":[null],"mappings":"AACA,SAASA,mBAAA,QAA2B;AAE7B,MAAMC,qBAAA,GAAwBD,mBAAA,CAMlC;EACDE,IAAA,EAAM;EACNC,SAAA,EAAW;EACXC,QAAA,EAAUC,OAAA,CAAQC,GAAA,CAAIC,kBAAA,KAAuB;EAC7CC,MAAA,EAAQ;EACRC,QAAA,EAAU;AACZ,CAAC","ignoreList":[]}
|