@tamagui/label 2.0.0-rc.4 → 2.0.0-rc.40
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/dist/cjs/Label.cjs +139 -113
- package/dist/cjs/Label.native.js +144 -122
- package/dist/cjs/Label.native.js.map +1 -1
- package/dist/cjs/index.cjs +7 -5
- package/dist/cjs/index.native.js +7 -5
- package/dist/cjs/index.native.js.map +1 -1
- package/dist/esm/Label.mjs +105 -81
- package/dist/esm/Label.mjs.map +1 -1
- package/dist/esm/Label.native.js +110 -90
- package/dist/esm/Label.native.js.map +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -6
- package/dist/jsx/Label.mjs +105 -81
- package/dist/jsx/Label.mjs.map +1 -1
- package/dist/jsx/Label.native.js +144 -122
- package/dist/jsx/Label.native.js.map +1 -1
- package/dist/jsx/index.js +1 -1
- package/dist/jsx/index.js.map +1 -6
- package/dist/jsx/index.native.js +7 -5
- package/package.json +14 -17
- package/dist/cjs/Label.js +0 -107
- package/dist/cjs/Label.js.map +0 -6
- package/dist/cjs/index.js +0 -15
- package/dist/cjs/index.js.map +0 -6
- package/dist/esm/Label.js +0 -92
- package/dist/esm/Label.js.map +0 -6
- package/dist/jsx/Label.js +0 -92
- package/dist/jsx/Label.js.map +0 -6
package/dist/cjs/index.native.js
CHANGED
|
@@ -5,15 +5,17 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
|
5
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
6
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
7
|
var __copyProps = (to, from, except, desc) => {
|
|
8
|
-
|
|
8
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
9
|
+
for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
9
10
|
get: () => from[key],
|
|
10
11
|
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
11
12
|
});
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
13
|
+
}
|
|
14
|
+
return to;
|
|
15
|
+
};
|
|
16
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
15
17
|
var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
|
|
16
|
-
value:
|
|
18
|
+
value: true
|
|
17
19
|
}), mod);
|
|
18
20
|
var index_exports = {};
|
|
19
21
|
module.exports = __toCommonJS(index_exports);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","index_exports","module","exports"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"
|
|
1
|
+
{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","index_exports","module","exports"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,aAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAP,YAAc,CAAAK,aAAA","ignoreList":[]}
|
package/dist/esm/Label.mjs
CHANGED
|
@@ -8,99 +8,123 @@ import { SizableText } from "@tamagui/text";
|
|
|
8
8
|
import { styled } from "@tamagui/web";
|
|
9
9
|
import * as React from "react";
|
|
10
10
|
import { jsx } from "react/jsx-runtime";
|
|
11
|
-
const NAME = "Label"
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
size: {
|
|
37
|
-
"...size": (val, extras) => {
|
|
38
|
-
const buttonHeight = getButtonSized(val, extras)?.height;
|
|
39
|
-
return {
|
|
40
|
-
...getFontSized(val, extras),
|
|
41
|
-
lineHeight: buttonHeight ? extras.tokens.size[buttonHeight] : void 0
|
|
42
|
-
};
|
|
11
|
+
const NAME = "Label";
|
|
12
|
+
const [LabelProvider, useLabelContextImpl] = createContext(NAME, {
|
|
13
|
+
id: void 0,
|
|
14
|
+
controlRef: {
|
|
15
|
+
current: null
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
const LabelFrame = styled(SizableText, {
|
|
19
|
+
name: "Label",
|
|
20
|
+
render: "label",
|
|
21
|
+
variants: {
|
|
22
|
+
unstyled: {
|
|
23
|
+
false: {
|
|
24
|
+
size: "$true",
|
|
25
|
+
color: "$color",
|
|
26
|
+
backgroundColor: "transparent",
|
|
27
|
+
display: "flex",
|
|
28
|
+
alignItems: "center",
|
|
29
|
+
userSelect: "none",
|
|
30
|
+
cursor: "default",
|
|
31
|
+
pressStyle: {
|
|
32
|
+
color: "$colorPress"
|
|
43
33
|
}
|
|
44
34
|
}
|
|
45
35
|
},
|
|
46
|
-
|
|
47
|
-
|
|
36
|
+
size: {
|
|
37
|
+
"...size": (val, extras) => {
|
|
38
|
+
const buttonStyle = getButtonSized(val, extras);
|
|
39
|
+
const buttonHeight = buttonStyle?.height;
|
|
40
|
+
const fontStyle = getFontSized(val, extras);
|
|
41
|
+
return {
|
|
42
|
+
...fontStyle,
|
|
43
|
+
lineHeight: buttonHeight ? extras.tokens.size[buttonHeight] : void 0
|
|
44
|
+
};
|
|
45
|
+
}
|
|
48
46
|
}
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
47
|
+
},
|
|
48
|
+
defaultVariants: {
|
|
49
|
+
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
50
|
+
}
|
|
51
|
+
});
|
|
52
|
+
const Label = LabelFrame.styleable(function Label2(props, forwardedRef) {
|
|
53
|
+
const {
|
|
54
|
+
htmlFor,
|
|
55
|
+
id: idProp,
|
|
56
|
+
...labelProps
|
|
57
|
+
} = props;
|
|
58
|
+
const controlRef = React.useRef(null);
|
|
59
|
+
const ref = React.useRef(null);
|
|
60
|
+
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
61
|
+
const backupId = React.useId();
|
|
62
|
+
const id = idProp ?? backupId;
|
|
63
|
+
if (isWeb) {
|
|
64
|
+
React.useEffect(() => {
|
|
62
65
|
if (htmlFor) {
|
|
63
66
|
const element = document.getElementById(htmlFor);
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
67
|
+
const label = ref.current;
|
|
68
|
+
if (label && element) {
|
|
69
|
+
const getAriaLabel = () => element.getAttribute("aria-labelledby");
|
|
70
|
+
const ariaLabelledBy = [id, getAriaLabel()].filter(Boolean).join(" ");
|
|
71
|
+
element.setAttribute("aria-labelledby", ariaLabelledBy);
|
|
72
|
+
controlRef.current = element;
|
|
73
|
+
return () => {
|
|
68
74
|
if (!id) return;
|
|
69
75
|
const ariaLabelledBy2 = getAriaLabel()?.replace(id, "");
|
|
70
|
-
ariaLabelledBy2 === ""
|
|
76
|
+
if (ariaLabelledBy2 === "") {
|
|
77
|
+
element.removeAttribute("aria-labelledby");
|
|
78
|
+
} else if (ariaLabelledBy2) {
|
|
79
|
+
element.setAttribute("aria-labelledby", ariaLabelledBy2);
|
|
80
|
+
}
|
|
71
81
|
};
|
|
72
82
|
}
|
|
73
83
|
}
|
|
74
|
-
}, [id, htmlFor])
|
|
84
|
+
}, [id, htmlFor]);
|
|
85
|
+
}
|
|
86
|
+
return /* @__PURE__ */jsx(LabelProvider, {
|
|
87
|
+
id,
|
|
88
|
+
controlRef,
|
|
89
|
+
children: /* @__PURE__ */jsx(LabelFrame, {
|
|
75
90
|
id,
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
props.onMouseDown?.(event), !event.defaultPrevented && event.detail > 1 && event.preventDefault();
|
|
84
|
-
},
|
|
85
|
-
onPress: event => {
|
|
86
|
-
if (props.onPress?.(event), isWeb) {
|
|
87
|
-
if (htmlFor || !controlRef.current || event.defaultPrevented) return;
|
|
88
|
-
const isClickingControl = controlRef.current.contains(event.target),
|
|
89
|
-
isUserClick = event.isTrusted === !0;
|
|
90
|
-
!isClickingControl && isUserClick && (controlRef.current.click(), controlRef.current.focus());
|
|
91
|
-
} else props.htmlFor && focusFocusable(props.htmlFor);
|
|
91
|
+
htmlFor,
|
|
92
|
+
...labelProps,
|
|
93
|
+
ref: composedRefs,
|
|
94
|
+
onMouseDown: event => {
|
|
95
|
+
props.onMouseDown?.(event);
|
|
96
|
+
if (!event.defaultPrevented && event.detail > 1) {
|
|
97
|
+
event.preventDefault();
|
|
92
98
|
}
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
99
|
+
},
|
|
100
|
+
onPress: event => {
|
|
101
|
+
props.onPress?.(event);
|
|
102
|
+
if (isWeb) {
|
|
103
|
+
if (htmlFor || !controlRef.current || event.defaultPrevented) return;
|
|
104
|
+
const isClickingControl = controlRef.current.contains(event.target);
|
|
105
|
+
const isUserClick = event.isTrusted === true;
|
|
106
|
+
if (!isClickingControl && isUserClick) {
|
|
107
|
+
controlRef.current.click();
|
|
108
|
+
controlRef.current.focus();
|
|
109
|
+
}
|
|
110
|
+
} else {
|
|
111
|
+
if (props.htmlFor) {
|
|
112
|
+
focusFocusable(props.htmlFor);
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
})
|
|
117
|
+
});
|
|
118
|
+
});
|
|
119
|
+
const useLabelContext = element => {
|
|
120
|
+
const context = useLabelContextImpl("LabelConsumer");
|
|
121
|
+
const {
|
|
122
|
+
controlRef
|
|
123
|
+
} = context;
|
|
124
|
+
React.useEffect(() => {
|
|
125
|
+
if (element) controlRef.current = element;
|
|
126
|
+
}, [element, controlRef]);
|
|
127
|
+
return context.id;
|
|
128
|
+
};
|
|
105
129
|
export { Label, LabelFrame, useLabelContext };
|
|
106
130
|
//# sourceMappingURL=Label.mjs.map
|
package/dist/esm/Label.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useComposedRefs","isWeb","createContext","focusFocusable","getButtonSized","getFontSized","SizableText","styled","React","jsx","NAME","LabelProvider","useLabelContextImpl","id","controlRef","current","LabelFrame","name","render","variants","unstyled","false","size","color","backgroundColor","display","alignItems","userSelect","cursor","pressStyle","...size","val","extras","buttonHeight","height","lineHeight","tokens","defaultVariants","process","env","TAMAGUI_HEADLESS","Label","styleable","props","forwardedRef","htmlFor","idProp","labelProps","useRef","ref","composedRefs","backupId","useId","useEffect","element","document","getElementById","getAriaLabel","getAttribute","ariaLabelledBy","filter","Boolean","join","setAttribute","ariaLabelledBy2","replace","removeAttribute","children","onMouseDown","event","defaultPrevented","detail","preventDefault","onPress","isClickingControl","contains","target","isUserClick","isTrusted","click","focus","useLabelContext","context"],"sources":["../../src/Label.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,eAAA,QAAuB;AAChC,SAASC,KAAA,QAAa;AACtB,SAASC,aAAA,QAAqB;AAC9B,SAASC,cAAA,QAAsB;AAC/B,SAASC,cAAA,QAAsB;AAC/B,SAASC,YAAA,QAAoB;AAC7B,SAASC,WAAA,QAAmB;AAE5B,SAASC,MAAA,QAAc;AACvB,YAAYC,KAAA,MAAW;AA8FjB,SAAAC,GAAA;AA5FN,MAAMC,IAAA,GAAO;
|
|
1
|
+
{"version":3,"names":["useComposedRefs","isWeb","createContext","focusFocusable","getButtonSized","getFontSized","SizableText","styled","React","jsx","NAME","LabelProvider","useLabelContextImpl","id","controlRef","current","LabelFrame","name","render","variants","unstyled","false","size","color","backgroundColor","display","alignItems","userSelect","cursor","pressStyle","...size","val","extras","buttonStyle","buttonHeight","height","fontStyle","lineHeight","tokens","defaultVariants","process","env","TAMAGUI_HEADLESS","Label","styleable","Label2","props","forwardedRef","htmlFor","idProp","labelProps","useRef","ref","composedRefs","backupId","useId","useEffect","element","document","getElementById","label","getAriaLabel","getAttribute","ariaLabelledBy","filter","Boolean","join","setAttribute","ariaLabelledBy2","replace","removeAttribute","children","onMouseDown","event","defaultPrevented","detail","preventDefault","onPress","isClickingControl","contains","target","isUserClick","isTrusted","click","focus","useLabelContext","context"],"sources":["../../src/Label.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
package/dist/esm/Label.native.js
CHANGED
|
@@ -8,109 +8,129 @@ import { getFontSized } from "@tamagui/get-font-sized";
|
|
|
8
8
|
import { SizableText } from "@tamagui/text";
|
|
9
9
|
import { styled } from "@tamagui/web";
|
|
10
10
|
import * as React from "react";
|
|
11
|
-
var NAME = "Label"
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
size: {
|
|
37
|
-
"...size": function (val, extras) {
|
|
38
|
-
var buttonStyle = getButtonSized(val, extras),
|
|
39
|
-
buttonHeight = buttonStyle?.height,
|
|
40
|
-
fontStyle = getFontSized(val, extras);
|
|
41
|
-
return {
|
|
42
|
-
...fontStyle,
|
|
43
|
-
lineHeight: buttonHeight ? extras.tokens.size[buttonHeight] : void 0
|
|
44
|
-
};
|
|
11
|
+
var NAME = "Label";
|
|
12
|
+
var [LabelProvider, useLabelContextImpl] = createContext(NAME, {
|
|
13
|
+
id: void 0,
|
|
14
|
+
controlRef: {
|
|
15
|
+
current: null
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
var LabelFrame = styled(SizableText, {
|
|
19
|
+
name: "Label",
|
|
20
|
+
render: "label",
|
|
21
|
+
variants: {
|
|
22
|
+
unstyled: {
|
|
23
|
+
false: {
|
|
24
|
+
size: "$true",
|
|
25
|
+
color: "$color",
|
|
26
|
+
backgroundColor: "transparent",
|
|
27
|
+
display: "flex",
|
|
28
|
+
alignItems: "center",
|
|
29
|
+
userSelect: "none",
|
|
30
|
+
cursor: "default",
|
|
31
|
+
pressStyle: {
|
|
32
|
+
color: "$colorPress"
|
|
45
33
|
}
|
|
46
34
|
}
|
|
47
35
|
},
|
|
48
|
-
|
|
49
|
-
|
|
36
|
+
size: {
|
|
37
|
+
"...size": function (val, extras) {
|
|
38
|
+
var buttonStyle = getButtonSized(val, extras);
|
|
39
|
+
var buttonHeight = buttonStyle === null || buttonStyle === void 0 ? void 0 : buttonStyle.height;
|
|
40
|
+
var fontStyle = getFontSized(val, extras);
|
|
41
|
+
return {
|
|
42
|
+
...fontStyle,
|
|
43
|
+
lineHeight: buttonHeight ? extras.tokens.size[buttonHeight] : void 0
|
|
44
|
+
};
|
|
45
|
+
}
|
|
50
46
|
}
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
47
|
+
},
|
|
48
|
+
defaultVariants: {
|
|
49
|
+
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
50
|
+
}
|
|
51
|
+
});
|
|
52
|
+
var Label = LabelFrame.styleable(function Label2(props, forwardedRef) {
|
|
53
|
+
var {
|
|
54
|
+
htmlFor,
|
|
55
|
+
id: idProp,
|
|
56
|
+
...labelProps
|
|
57
|
+
} = props;
|
|
58
|
+
var controlRef = React.useRef(null);
|
|
59
|
+
var ref = React.useRef(null);
|
|
60
|
+
var composedRefs = useComposedRefs(forwardedRef, ref);
|
|
61
|
+
var backupId = React.useId();
|
|
62
|
+
var id = idProp !== null && idProp !== void 0 ? idProp : backupId;
|
|
63
|
+
if (isWeb) {
|
|
64
|
+
React.useEffect(function () {
|
|
64
65
|
if (htmlFor) {
|
|
65
|
-
var element = document.getElementById(htmlFor)
|
|
66
|
-
|
|
66
|
+
var element = document.getElementById(htmlFor);
|
|
67
|
+
var label = ref.current;
|
|
67
68
|
if (label && element) {
|
|
68
69
|
var getAriaLabel = function () {
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
70
|
+
return element.getAttribute("aria-labelledby");
|
|
71
|
+
};
|
|
72
|
+
var ariaLabelledBy = [id, getAriaLabel()].filter(Boolean).join(" ");
|
|
73
|
+
element.setAttribute("aria-labelledby", ariaLabelledBy);
|
|
74
|
+
controlRef.current = element;
|
|
75
|
+
return function () {
|
|
73
76
|
var _getAriaLabel;
|
|
74
|
-
if (id)
|
|
75
|
-
|
|
76
|
-
|
|
77
|
+
if (!id) return;
|
|
78
|
+
var ariaLabelledBy2 = (_getAriaLabel = getAriaLabel()) === null || _getAriaLabel === void 0 ? void 0 : _getAriaLabel.replace(id, "");
|
|
79
|
+
if (ariaLabelledBy2 === "") {
|
|
80
|
+
element.removeAttribute("aria-labelledby");
|
|
81
|
+
} else if (ariaLabelledBy2) {
|
|
82
|
+
element.setAttribute("aria-labelledby", ariaLabelledBy2);
|
|
77
83
|
}
|
|
78
84
|
};
|
|
79
85
|
}
|
|
80
86
|
}
|
|
81
|
-
}, [id, htmlFor])
|
|
87
|
+
}, [id, htmlFor]);
|
|
88
|
+
}
|
|
89
|
+
return /* @__PURE__ */_jsx(LabelProvider, {
|
|
90
|
+
id,
|
|
91
|
+
controlRef,
|
|
92
|
+
children: /* @__PURE__ */_jsx(LabelFrame, {
|
|
82
93
|
id,
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
94
|
+
// @ts-ignore
|
|
95
|
+
htmlFor,
|
|
96
|
+
...labelProps,
|
|
97
|
+
ref: composedRefs,
|
|
98
|
+
onMouseDown: function (event) {
|
|
99
|
+
var _props_onMouseDown;
|
|
100
|
+
(_props_onMouseDown = props.onMouseDown) === null || _props_onMouseDown === void 0 ? void 0 : _props_onMouseDown.call(props, event);
|
|
101
|
+
if (!event.defaultPrevented && event.detail > 1) {
|
|
102
|
+
event.preventDefault();
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
onPress: function (event) {
|
|
106
|
+
var _props_onPress;
|
|
107
|
+
(_props_onPress = props.onPress) === null || _props_onPress === void 0 ? void 0 : _props_onPress.call(props, event);
|
|
108
|
+
if (isWeb) {
|
|
109
|
+
if (htmlFor || !controlRef.current || event.defaultPrevented) return;
|
|
110
|
+
var isClickingControl = controlRef.current.contains(event.target);
|
|
111
|
+
var isUserClick = event.isTrusted === true;
|
|
112
|
+
if (!isClickingControl && isUserClick) {
|
|
113
|
+
controlRef.current.click();
|
|
114
|
+
controlRef.current.focus();
|
|
115
|
+
}
|
|
116
|
+
} else {
|
|
117
|
+
if (props.htmlFor) {
|
|
118
|
+
focusFocusable(props.htmlFor);
|
|
119
|
+
}
|
|
102
120
|
}
|
|
103
|
-
}
|
|
104
|
-
})
|
|
105
|
-
})
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
};
|
|
121
|
+
}
|
|
122
|
+
})
|
|
123
|
+
});
|
|
124
|
+
});
|
|
125
|
+
var useLabelContext = function (element) {
|
|
126
|
+
var context = useLabelContextImpl("LabelConsumer");
|
|
127
|
+
var {
|
|
128
|
+
controlRef
|
|
129
|
+
} = context;
|
|
130
|
+
React.useEffect(function () {
|
|
131
|
+
if (element) controlRef.current = element;
|
|
132
|
+
}, [element, controlRef]);
|
|
133
|
+
return context.id;
|
|
134
|
+
};
|
|
115
135
|
export { Label, LabelFrame, useLabelContext };
|
|
116
136
|
//# sourceMappingURL=Label.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["jsx","_jsx","useComposedRefs","isWeb","createContext","focusFocusable","getButtonSized","getFontSized","SizableText","styled","React","NAME","LabelProvider","useLabelContextImpl","id","controlRef","current","LabelFrame","name","render","variants","unstyled","false","size","color","backgroundColor","display","alignItems","userSelect","cursor","pressStyle","...size","val","extras","buttonStyle","buttonHeight","height","fontStyle","lineHeight","tokens","defaultVariants","process","env","TAMAGUI_HEADLESS","Label","styleable","props","forwardedRef","htmlFor","idProp","labelProps","useRef","ref","composedRefs","backupId","useId","useEffect","element","document","getElementById","label","getAriaLabel","getAttribute","ariaLabelledBy","filter","Boolean","join","setAttribute","_getAriaLabel","ariaLabelledBy2","replace","removeAttribute","children","onMouseDown","event","_props_onMouseDown","call","defaultPrevented","detail","preventDefault","onPress","_props_onPress"],"sources":["../../src/Label.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,GAAA,IAAAC,IAAA,2BAAuB;AAChC,SAASC,eAAa;AACtB,SAASC,KAAA,4BAAqB;AAC9B,SAASC,aAAA,iCAAsB;AAC/B,SAASC,cAAA,QAAsB;AAC/B,SAASC,cAAA,QAAoB;AAC7B,SAASC,YAAA,QAAmB;AAE5B,SAASC,WAAA,QAAc;AACvB,SAAAC,MAAY,QAAW;AA8FjB,YAAAC,KAAA;AA5FN,IAAAC,IAAM,UAAO;
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","useComposedRefs","isWeb","createContext","focusFocusable","getButtonSized","getFontSized","SizableText","styled","React","NAME","LabelProvider","useLabelContextImpl","id","controlRef","current","LabelFrame","name","render","variants","unstyled","false","size","color","backgroundColor","display","alignItems","userSelect","cursor","pressStyle","...size","val","extras","buttonStyle","buttonHeight","height","fontStyle","lineHeight","tokens","defaultVariants","process","env","TAMAGUI_HEADLESS","Label","styleable","Label2","props","forwardedRef","htmlFor","idProp","labelProps","useRef","ref","composedRefs","backupId","useId","useEffect","element","document","getElementById","label","getAriaLabel","getAttribute","ariaLabelledBy","filter","Boolean","join","setAttribute","_getAriaLabel","ariaLabelledBy2","replace","removeAttribute","children","onMouseDown","event","_props_onMouseDown","call","defaultPrevented","detail","preventDefault","onPress","_props_onPress","isClickingControl","contains","target","isUserClick","isTrusted","click","focus"],"sources":["../../src/Label.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export * from "./Label";
|
|
1
|
+
export * from "./Label.mjs";
|
|
2
2
|
//# sourceMappingURL=index.js.map
|