@primer/react 38.25.1-rc.c82500a2c → 38.26.0-rc.0fd8871fd
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/CHANGELOG.md +32 -1
- package/dist/ActionList/index.d.ts +6 -6
- package/dist/ActionMenu/ActionMenu.d.ts.map +1 -1
- package/dist/ActionMenu/ActionMenu.js +0 -1
- package/dist/AnchoredOverlay/AnchoredOverlay.d.ts.map +1 -1
- package/dist/AnchoredOverlay/AnchoredOverlay.js +1 -1
- package/dist/Button/{ButtonBase-713ecf3d.css → ButtonBase-311501b9.css} +2 -2
- package/dist/Button/{ButtonBase-713ecf3d.css.map → ButtonBase-311501b9.css.map} +1 -1
- package/dist/Button/ButtonBase.d.ts.map +1 -1
- package/dist/Button/ButtonBase.js +1 -0
- package/dist/Button/ButtonBase.module.css.js +1 -1
- package/dist/CheckboxGroup/CheckboxGroup.js +0 -1
- package/dist/DataTable/index.d.ts.map +1 -1
- package/dist/DataTable/index.js +0 -1
- package/dist/Dialog/Dialog.d.ts +0 -1
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +0 -1
- package/dist/FormControl/FormControl.d.ts +3 -3
- package/dist/NavList/NavList.d.ts +4 -4
- package/dist/NavList/NavList.d.ts.map +1 -1
- package/dist/NavList/NavList.js +7 -6
- package/dist/PageLayout/PageLayout.d.ts +0 -1
- package/dist/PageLayout/PageLayout.d.ts.map +1 -1
- package/dist/PageLayout/PageLayout.js +0 -1
- package/dist/RadioGroup/RadioGroup.d.ts +3 -4
- package/dist/RadioGroup/RadioGroup.d.ts.map +1 -1
- package/dist/RadioGroup/RadioGroup.js +0 -1
- package/dist/SegmentedControl/SegmentedControl.d.ts +2 -3
- package/dist/SegmentedControl/SegmentedControl.d.ts.map +1 -1
- package/dist/SegmentedControl/SegmentedControl.js +0 -1
- package/dist/ThemeProvider.d.ts +6 -0
- package/dist/ThemeProvider.d.ts.map +1 -1
- package/dist/ThemeProvider.js +38 -21
- package/dist/Timeline/Timeline-0c88f21b.css +2 -0
- package/dist/Timeline/Timeline-0c88f21b.css.map +1 -0
- package/dist/Timeline/Timeline.d.ts +16 -0
- package/dist/Timeline/Timeline.d.ts.map +1 -1
- package/dist/Timeline/Timeline.js +85 -1
- package/dist/Timeline/Timeline.module.css.js +2 -2
- package/dist/Timeline/index.d.ts +1 -1
- package/dist/Timeline/index.d.ts.map +1 -1
- package/dist/Tooltip/Tooltip.js +1 -1
- package/dist/experimental/UnderlinePanels/UnderlinePanels.d.ts.map +1 -1
- package/dist/experimental/UnderlinePanels/UnderlinePanels.js +101 -58
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/useSlots.d.ts.map +1 -1
- package/dist/hooks/useSlots.js +24 -0
- package/dist/index.d.ts +5 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -0
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts +3 -3
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.js +3 -4
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.js +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.js +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.js +1 -1
- package/dist/internal/components/TextInputWrapper-b2f7f9fa.css +2 -0
- package/dist/internal/components/TextInputWrapper-b2f7f9fa.css.map +1 -0
- package/dist/internal/components/TextInputWrapper.d.ts.map +1 -1
- package/dist/internal/components/TextInputWrapper.js +33 -24
- package/dist/internal/components/TextInputWrapper.module.css.js +1 -1
- package/dist/utils/as-slot.d.ts +20 -0
- package/dist/utils/as-slot.d.ts.map +1 -0
- package/dist/utils/as-slot.js +30 -0
- package/generated/components.json +16 -0
- package/package.json +2 -2
- package/dist/Timeline/Timeline-05decc91.css +0 -2
- package/dist/Timeline/Timeline-05decc91.css.map +0 -1
- package/dist/internal/components/TextInputWrapper-889df5d3.css +0 -2
- package/dist/internal/components/TextInputWrapper-889df5d3.css.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { c } from 'react-compiler-runtime';
|
|
2
|
-
import React, { useState, useRef,
|
|
2
|
+
import React, { useState, useRef, useMemo, Children, isValidElement, cloneElement, createContext, useContext } from 'react';
|
|
3
3
|
import { TabContainerElement } from '@github/tab-container-element';
|
|
4
4
|
import { createComponent } from '../../utils/create-component.js';
|
|
5
5
|
import { UnderlineWrapper, UnderlineItemList, UnderlineItem } from '../../internal/components/UnderlineTabbedInterface.js';
|
|
@@ -9,10 +9,21 @@ import useIsomorphicLayoutEffect from '../../utils/useIsomorphicLayoutEffect.js'
|
|
|
9
9
|
import classes from './UnderlinePanels.module.css.js';
|
|
10
10
|
import { clsx } from 'clsx';
|
|
11
11
|
import { isSlot } from '../../utils/is-slot.js';
|
|
12
|
-
import {
|
|
12
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
13
13
|
import { useId } from '../../hooks/useId.js';
|
|
14
14
|
|
|
15
15
|
const TabContainerComponent = createComponent(TabContainerElement, 'tab-container');
|
|
16
|
+
|
|
17
|
+
// Carries flags that affect every Tab's rendering but that don't belong on the
|
|
18
|
+
// consumer-facing Tab API. Passing them via context (instead of cloneElement)
|
|
19
|
+
// keeps each Tab element's props referentially stable across UnderlinePanels
|
|
20
|
+
// re-renders, so React.memo(Tab) can skip work when an unrelated piece of
|
|
21
|
+
// state changes.
|
|
22
|
+
|
|
23
|
+
const UnderlinePanelsContext = /*#__PURE__*/createContext({
|
|
24
|
+
iconsVisible: true,
|
|
25
|
+
loadingCounters: undefined
|
|
26
|
+
});
|
|
16
27
|
const UnderlinePanels = ({
|
|
17
28
|
'aria-label': ariaLabel,
|
|
18
29
|
'aria-labelledby': ariaLabelledBy,
|
|
@@ -27,21 +38,22 @@ const UnderlinePanels = ({
|
|
|
27
38
|
// We need to always call useId() because React Hooks must be
|
|
28
39
|
// called in the exact same order in every component render
|
|
29
40
|
const parentId = useId(props.id);
|
|
30
|
-
const [
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
//
|
|
36
|
-
//
|
|
41
|
+
const [tabs_0, tabPanels_0, tabsHaveIcons_0] = useMemo(() => {
|
|
42
|
+
// Walk children, clone each Tab with a generated id, and each Panel with a
|
|
43
|
+
// matching aria-labelledby. Derive in render so we never ship a
|
|
44
|
+
// "before-the-effect-ran" empty-tablist frame and so that re-renders of
|
|
45
|
+
// UnderlinePanels don't churn through an extra commit cycle.
|
|
46
|
+
//
|
|
47
|
+
// iconsVisible / loadingCounters are NOT baked into the cloned Tab
|
|
48
|
+
// elements — they flow through UnderlinePanelsContext, so this memo's deps
|
|
49
|
+
// can stay tight ([children, parentId]) and Tab elements stay
|
|
50
|
+
// referentially stable across resize-driven iconsVisible toggles.
|
|
37
51
|
let tabIndex = 0;
|
|
38
52
|
let panelIndex = 0;
|
|
39
53
|
const childrenWithProps = Children.map(children, child => {
|
|
40
54
|
if (/*#__PURE__*/isValidElement(child) && (child.type === Tab || isSlot(child, Tab))) {
|
|
41
55
|
return /*#__PURE__*/cloneElement(child, {
|
|
42
|
-
id: `${parentId}-tab-${tabIndex++}
|
|
43
|
-
loadingCounters,
|
|
44
|
-
iconsVisible
|
|
56
|
+
id: `${parentId}-tab-${tabIndex++}`
|
|
45
57
|
});
|
|
46
58
|
}
|
|
47
59
|
if (/*#__PURE__*/isValidElement(child) && (child.type === Panel || isSlot(child, Panel))) {
|
|
@@ -52,64 +64,81 @@ const UnderlinePanels = ({
|
|
|
52
64
|
}
|
|
53
65
|
return child;
|
|
54
66
|
});
|
|
55
|
-
const
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
}, [children, parentId
|
|
64
|
-
const
|
|
67
|
+
const tabs = [];
|
|
68
|
+
const tabPanels = [];
|
|
69
|
+
for (const child_0 of Children.toArray(childrenWithProps)) {
|
|
70
|
+
if (! /*#__PURE__*/isValidElement(child_0)) continue;
|
|
71
|
+
if (child_0.type === Tab || isSlot(child_0, Tab)) tabs.push(child_0);else if (child_0.type === Panel || isSlot(child_0, Panel)) tabPanels.push(child_0);
|
|
72
|
+
}
|
|
73
|
+
const tabsHaveIcons = tabs.some(tab => /*#__PURE__*/React.isValidElement(tab) && tab.props.icon);
|
|
74
|
+
return [tabs, tabPanels, tabsHaveIcons];
|
|
75
|
+
}, [children, parentId]);
|
|
76
|
+
const contextValue = useMemo(() => ({
|
|
77
|
+
iconsVisible,
|
|
78
|
+
loadingCounters
|
|
79
|
+
}), [iconsVisible, loadingCounters]);
|
|
65
80
|
|
|
66
|
-
//
|
|
67
|
-
|
|
81
|
+
// Mirror iconsVisible into a ref so the list observer below can read it
|
|
82
|
+
// without being re-created on every toggle (re-creating the observer
|
|
83
|
+
// would re-trigger its initial callback and churn extra work).
|
|
84
|
+
const iconsVisibleRef = useRef(iconsVisible);
|
|
68
85
|
useIsomorphicLayoutEffect(() => {
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
86
|
+
iconsVisibleRef.current = iconsVisible;
|
|
87
|
+
}, [iconsVisible]);
|
|
88
|
+
|
|
89
|
+
// The list's natural width (icons + labels), kept in sync via a
|
|
90
|
+
// ResizeObserver on the list — never read in render, so updates don't
|
|
91
|
+
// cause commits. Only refreshed while icons are visible: when icons are
|
|
92
|
+
// hidden the list is at its compressed width, which is not the value we
|
|
93
|
+
// want to compare against. The ResizeObserver fires synchronously on
|
|
94
|
+
// observe, which seeds the ref on mount for free.
|
|
95
|
+
const listWidthRef = useRef(0);
|
|
96
|
+
useResizeObserver(entries => {
|
|
97
|
+
if (!tabsHaveIcons_0) return;
|
|
98
|
+
if (!iconsVisibleRef.current) return;
|
|
99
|
+
listWidthRef.current = entries[0].contentRect.width;
|
|
100
|
+
}, listRef, []);
|
|
75
101
|
|
|
76
102
|
// when the wrapper resizes, check if the icons should be visible
|
|
77
103
|
// by comparing the wrapper width to the list width
|
|
78
104
|
useResizeObserver(resizeObserverEntries => {
|
|
79
|
-
if (!
|
|
105
|
+
if (!tabsHaveIcons_0) {
|
|
80
106
|
return;
|
|
81
107
|
}
|
|
82
108
|
const wrapperWidth = resizeObserverEntries[0].contentRect.width;
|
|
83
|
-
setIconsVisible(wrapperWidth >
|
|
109
|
+
setIconsVisible(wrapperWidth > listWidthRef.current);
|
|
84
110
|
}, wrapperRef, []);
|
|
85
111
|
if (process.env.NODE_ENV !== "production") {
|
|
86
|
-
const selectedTabs =
|
|
112
|
+
const selectedTabs = tabs_0.filter(tab_0 => {
|
|
87
113
|
const ariaSelected = /*#__PURE__*/React.isValidElement(tab_0) && tab_0.props['aria-selected'];
|
|
88
114
|
return ariaSelected === true || ariaSelected === 'true';
|
|
89
115
|
});
|
|
90
116
|
!(selectedTabs.length <= 1) ? process.env.NODE_ENV !== "production" ? invariant(false, 'Only one tab can be selected at a time.') : invariant(false) : void 0;
|
|
91
|
-
!(
|
|
117
|
+
!(tabs_0.length === tabPanels_0.length) ? process.env.NODE_ENV !== "production" ? invariant(false, `The number of tabs and panels must be equal. Counted ${tabs_0.length} tabs and ${tabPanels_0.length} panels.`) : invariant(false) : void 0;
|
|
92
118
|
}
|
|
93
|
-
return /*#__PURE__*/
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
119
|
+
return /*#__PURE__*/jsx(UnderlinePanelsContext.Provider, {
|
|
120
|
+
value: contextValue,
|
|
121
|
+
children: /*#__PURE__*/jsxs(TabContainerComponent, {
|
|
122
|
+
children: [/*#__PURE__*/jsx(UnderlineWrapper, {
|
|
123
|
+
ref: wrapperRef,
|
|
124
|
+
slot: "tablist-wrapper",
|
|
125
|
+
"data-icons-visible": iconsVisible,
|
|
126
|
+
className: clsx(className, classes.StyledUnderlineWrapper),
|
|
127
|
+
...props,
|
|
128
|
+
children: /*#__PURE__*/jsx(UnderlineItemList, {
|
|
129
|
+
ref: listRef,
|
|
130
|
+
"aria-label": ariaLabel,
|
|
131
|
+
"aria-labelledby": ariaLabelledBy,
|
|
132
|
+
role: "tablist",
|
|
133
|
+
children: tabs_0
|
|
134
|
+
})
|
|
135
|
+
}), tabPanels_0]
|
|
136
|
+
})
|
|
108
137
|
});
|
|
109
138
|
};
|
|
110
139
|
UnderlinePanels.displayName = "UnderlinePanels";
|
|
111
|
-
const
|
|
112
|
-
const $ = c(
|
|
140
|
+
const TabImpl = t0 => {
|
|
141
|
+
const $ = c(16);
|
|
113
142
|
let ariaSelected;
|
|
114
143
|
let onSelect;
|
|
115
144
|
let props;
|
|
@@ -128,6 +157,10 @@ const Tab = t0 => {
|
|
|
128
157
|
onSelect = $[2];
|
|
129
158
|
props = $[3];
|
|
130
159
|
}
|
|
160
|
+
const {
|
|
161
|
+
iconsVisible,
|
|
162
|
+
loadingCounters
|
|
163
|
+
} = useContext(UnderlinePanelsContext);
|
|
131
164
|
let t1;
|
|
132
165
|
if ($[4] !== onSelect) {
|
|
133
166
|
t1 = event => {
|
|
@@ -156,7 +189,7 @@ const Tab = t0 => {
|
|
|
156
189
|
const keyDownHandler = t2;
|
|
157
190
|
const t3 = ariaSelected ? 0 : -1;
|
|
158
191
|
let t4;
|
|
159
|
-
if ($[8] !== ariaSelected || $[9] !== clickHandler || $[10] !==
|
|
192
|
+
if ($[8] !== ariaSelected || $[9] !== clickHandler || $[10] !== iconsVisible || $[11] !== keyDownHandler || $[12] !== loadingCounters || $[13] !== props || $[14] !== t3) {
|
|
160
193
|
t4 = /*#__PURE__*/jsx(UnderlineItem, {
|
|
161
194
|
as: "button",
|
|
162
195
|
role: "tab",
|
|
@@ -165,19 +198,30 @@ const Tab = t0 => {
|
|
|
165
198
|
type: "button",
|
|
166
199
|
onClick: clickHandler,
|
|
167
200
|
onKeyDown: keyDownHandler,
|
|
201
|
+
iconsVisible: iconsVisible,
|
|
202
|
+
loadingCounters: loadingCounters,
|
|
168
203
|
...props
|
|
169
204
|
});
|
|
170
205
|
$[8] = ariaSelected;
|
|
171
206
|
$[9] = clickHandler;
|
|
172
|
-
$[10] =
|
|
173
|
-
$[11] =
|
|
174
|
-
$[12] =
|
|
175
|
-
$[13] =
|
|
207
|
+
$[10] = iconsVisible;
|
|
208
|
+
$[11] = keyDownHandler;
|
|
209
|
+
$[12] = loadingCounters;
|
|
210
|
+
$[13] = props;
|
|
211
|
+
$[14] = t3;
|
|
212
|
+
$[15] = t4;
|
|
176
213
|
} else {
|
|
177
|
-
t4 = $[
|
|
214
|
+
t4 = $[15];
|
|
178
215
|
}
|
|
179
216
|
return t4;
|
|
180
217
|
};
|
|
218
|
+
|
|
219
|
+
// Memoized so that UnderlinePanels re-rendering (e.g. when iconsVisible flips)
|
|
220
|
+
// only re-renders Tabs whose own props actually changed. iconsVisible and
|
|
221
|
+
// loadingCounters reach Tab via UnderlinePanelsContext, so Tabs still react
|
|
222
|
+
// to those changes through context propagation.
|
|
223
|
+
TabImpl.displayName = 'UnderlinePanels.Tab';
|
|
224
|
+
const Tab = /*#__PURE__*/React.memo(TabImpl);
|
|
181
225
|
Tab.displayName = 'UnderlinePanels.Tab';
|
|
182
226
|
const Panel = t0 => {
|
|
183
227
|
const $ = c(6);
|
|
@@ -215,7 +259,6 @@ var UnderlinePanels_default = Object.assign(UnderlinePanels, {
|
|
|
215
259
|
Panel,
|
|
216
260
|
Tab
|
|
217
261
|
});
|
|
218
|
-
UnderlinePanels.__SLOT__ = Symbol('UnderlinePanels');
|
|
219
262
|
Tab.__SLOT__ = Symbol('UnderlinePanels.Tab');
|
|
220
263
|
Panel.__SLOT__ = Symbol('UnderlinePanels.Panel');
|
|
221
264
|
|
package/dist/hooks/index.d.ts
CHANGED
|
@@ -17,4 +17,5 @@ export { useRefObjectAsForwardedRef } from './useRefObjectAsForwardedRef';
|
|
|
17
17
|
export { useId } from './useId';
|
|
18
18
|
export { useIsMacOS } from './useIsMacOS';
|
|
19
19
|
export { useMergedRefs } from './useMergedRefs';
|
|
20
|
+
export { useSlots } from './useSlots';
|
|
20
21
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,iBAAiB,EAAC,MAAM,qBAAqB,CAAA;AACrD,YAAY,EAAC,yBAAyB,EAAE,iBAAiB,EAAC,MAAM,qBAAqB,CAAA;AACrF,OAAO,EAAC,sBAAsB,EAAC,MAAM,0BAA0B,CAAA;AAC/D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAA;AACnD,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAA;AAC3D,YAAY,EAAC,4BAA4B,EAAC,MAAM,wBAAwB,CAAA;AACxE,YAAY,EAAC,4BAA4B,EAAC,MAAM,uBAAuB,CAAA;AACvE,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAA;AACvC,YAAY,EAAC,kBAAkB,EAAC,MAAM,cAAc,CAAA;AACpD,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAC,wBAAwB,EAAC,MAAM,4BAA4B,CAAA;AACnE,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAC,yBAAyB,EAAC,MAAM,6BAA6B,CAAA;AACrE,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAC,0BAA0B,EAAC,MAAM,8BAA8B,CAAA;AACvE,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAA;AAC7B,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAA;AACvC,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,iBAAiB,EAAC,MAAM,qBAAqB,CAAA;AACrD,YAAY,EAAC,yBAAyB,EAAE,iBAAiB,EAAC,MAAM,qBAAqB,CAAA;AACrF,OAAO,EAAC,sBAAsB,EAAC,MAAM,0BAA0B,CAAA;AAC/D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAA;AACnD,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAA;AAC3D,YAAY,EAAC,4BAA4B,EAAC,MAAM,wBAAwB,CAAA;AACxE,YAAY,EAAC,4BAA4B,EAAC,MAAM,uBAAuB,CAAA;AACvE,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAA;AACvC,YAAY,EAAC,kBAAkB,EAAC,MAAM,cAAc,CAAA;AACpD,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAC,wBAAwB,EAAC,MAAM,4BAA4B,CAAA;AACnE,OAAO,EAAC,mBAAmB,EAAC,MAAM,uBAAuB,CAAA;AACzD,OAAO,EAAC,yBAAyB,EAAC,MAAM,6BAA6B,CAAA;AACrE,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAC,0BAA0B,EAAC,MAAM,8BAA8B,CAAA;AACvE,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAA;AAC7B,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAA;AACvC,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAA;AAC7C,OAAO,EAAC,QAAQ,EAAC,MAAM,YAAY,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSlots.d.ts","sourceRoot":"","sources":["../../src/hooks/useSlots.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AAKH,KAAK,KAAK,GAAG,GAAG,CAAA;AAChB,KAAK,gBAAgB,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;AAChD,KAAK,wBAAwB,GAAG,CAAC,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,OAAO,CAAC,CAAA;AAE7E,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,gBAAgB,GAAG,wBAAwB,CAAC,CAAA;AAEpF,KAAK,YAAY,CAAC,MAAM,SAAS,UAAU,IAAI;KAC5C,QAAQ,IAAI,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC;CACxD,CAAA;AAED,KAAK,SAAS,CAAC,MAAM,EAAE,QAAQ,SAAS,MAAM,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,SAAS,KAAK,CAAC,WAAW,GAC9F,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,GACtF,MAAM,CAAC,QAAQ,CAAC,SAAS,SAAS;IAC9B,MAAM,WAAW,SAAS,KAAK,CAAC,WAAW;IAE3C,MAAM,OAAO;CACd,GACD,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,wBAAwB,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,GAC5E,KAAK,CAAA;AAeX,0EAA0E;AAC1E,wBAAgB,QAAQ,CAAC,MAAM,SAAS,UAAU,EAChD,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,MAAM,EAAE,MAAM,GACb,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC,
|
|
1
|
+
{"version":3,"file":"useSlots.d.ts","sourceRoot":"","sources":["../../src/hooks/useSlots.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AAKH,KAAK,KAAK,GAAG,GAAG,CAAA;AAChB,KAAK,gBAAgB,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;AAChD,KAAK,wBAAwB,GAAG,CAAC,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,OAAO,CAAC,CAAA;AAE7E,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,gBAAgB,GAAG,wBAAwB,CAAC,CAAA;AAEpF,KAAK,YAAY,CAAC,MAAM,SAAS,UAAU,IAAI;KAC5C,QAAQ,IAAI,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC;CACxD,CAAA;AAED,KAAK,SAAS,CAAC,MAAM,EAAE,QAAQ,SAAS,MAAM,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,SAAS,KAAK,CAAC,WAAW,GAC9F,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,GACtF,MAAM,CAAC,QAAQ,CAAC,SAAS,SAAS;IAC9B,MAAM,WAAW,SAAS,KAAK,CAAC,WAAW;IAE3C,MAAM,OAAO;CACd,GACD,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,wBAAwB,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,GAC5E,KAAK,CAAA;AAeX,0EAA0E;AAC1E,wBAAgB,QAAQ,CAAC,MAAM,SAAS,UAAU,EAChD,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,MAAM,EAAE,MAAM,GACb,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC,CAwDpD"}
|
package/dist/hooks/useSlots.js
CHANGED
|
@@ -101,6 +101,9 @@ function useSlots(children, config) {
|
|
|
101
101
|
// Try to match child against a slot
|
|
102
102
|
const matchedIndex = findMatchingSlot(child, values, totalSlots);
|
|
103
103
|
if (matchedIndex === -1) {
|
|
104
|
+
if (process.env.NODE_ENV !== "production") {
|
|
105
|
+
warnIfDisplayNameMatchesWithoutMarker(child, keys, values, totalSlots);
|
|
106
|
+
}
|
|
104
107
|
rest.push(child);
|
|
105
108
|
return;
|
|
106
109
|
}
|
|
@@ -147,4 +150,25 @@ function warnIfDuplicate(child, keys, values, totalSlots) {
|
|
|
147
150
|
return false;
|
|
148
151
|
}
|
|
149
152
|
|
|
153
|
+
/**
|
|
154
|
+
* Dev-only: detect children whose displayName matches a slot's component
|
|
155
|
+
* displayName but that don't share the `__SLOT__` marker. Catches a common
|
|
156
|
+
* footgun where a wrapper around a slot component forgets to copy the marker.
|
|
157
|
+
*/
|
|
158
|
+
function warnIfDisplayNameMatchesWithoutMarker(child, keys, values, totalSlots) {
|
|
159
|
+
const childType = child.type;
|
|
160
|
+
if (typeof childType !== 'function' && typeof childType !== 'object') return;
|
|
161
|
+
const childName = childType.displayName;
|
|
162
|
+
if (!childName) return;
|
|
163
|
+
for (let i = 0; i < totalSlots; i++) {
|
|
164
|
+
const slotValue = values[i];
|
|
165
|
+
const component = Array.isArray(slotValue) ? slotValue[0] : slotValue;
|
|
166
|
+
const slotName = component.displayName;
|
|
167
|
+
if (slotName && slotName === childName) {
|
|
168
|
+
process.env.NODE_ENV !== "production" ? warning(true, `useSlots: child with displayName "${childName}" matches slot "${String(keys[i])}" by name but is missing the \`__SLOT__\` marker. ` + `Did you forget to copy the marker? Use \`asSlot(wrapper, ParentSlotComponent)\` to copy it.`) : void 0;
|
|
169
|
+
return;
|
|
170
|
+
}
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
|
|
150
174
|
export { useSlots };
|
package/dist/index.d.ts
CHANGED
|
@@ -30,7 +30,10 @@ export { useId } from './hooks/useId';
|
|
|
30
30
|
export { useSyncedState } from './hooks/useSyncedState';
|
|
31
31
|
export { useAnchoredPosition, type AnchoredPositionHookSettings } from './hooks/useAnchoredPosition';
|
|
32
32
|
export { createComponent } from './utils/create-component';
|
|
33
|
-
export type { SlotMarker } from './utils/types';
|
|
33
|
+
export type { SlotMarker, WithSlotMarker, FCWithSlotMarker } from './utils/types';
|
|
34
|
+
export { asSlot } from './utils/as-slot';
|
|
35
|
+
export { isSlot } from './utils/is-slot';
|
|
36
|
+
export { useSlots } from './hooks/useSlots';
|
|
34
37
|
export { default as Radio } from './Radio';
|
|
35
38
|
export type { RadioProps } from './Radio';
|
|
36
39
|
export { ActionList } from './ActionList';
|
|
@@ -119,7 +122,7 @@ export type { TextInputWithTokensProps } from './TextInputWithTokens';
|
|
|
119
122
|
export { default as Text } from './Text';
|
|
120
123
|
export type { TextProps } from './Text';
|
|
121
124
|
export { default as Timeline } from './Timeline';
|
|
122
|
-
export type { TimelineProps, TimelineBadgeVariant, TimelineBadgeProps, TimelineBodyProps, TimelineBreakProps, TimelineItemsProps, TimelineItemProps, } from './Timeline';
|
|
125
|
+
export type { TimelineProps, TimelineActionsProps, TimelineAvatarProps, TimelineBadgeVariant, TimelineBadgeProps, TimelineBodyProps, TimelineBreakProps, TimelineItemsProps, TimelineItemProps, } from './Timeline';
|
|
123
126
|
export { default as Token, IssueLabelToken } from './Token';
|
|
124
127
|
export type { TokenProps, IssueLabelTokenProps } from './Token';
|
|
125
128
|
export { Tooltip } from './TooltipV2';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,OAAO,IAAI,KAAK,EAAE,KAAK,eAAe,EAAE,KAAK,gBAAgB,EAAC,MAAM,SAAS,CAAA;AACrF,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,MAAM,cAAc,CAAA;AAClD,YAAY,EAAC,eAAe,EAAC,MAAM,cAAc,CAAA;AACjD,OAAO,EAAC,OAAO,IAAI,aAAa,EAAE,QAAQ,EAAE,iBAAiB,EAAC,MAAM,iBAAiB,CAAA;AACrF,YAAY,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAA;AAGvD,cAAc,UAAU,CAAA;AACxB,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAA;AACvC,YAAY,EACV,eAAe,EACf,qBAAqB,EACrB,sBAAsB,EACtB,mBAAmB,EACnB,qBAAqB,GACtB,MAAM,cAAc,CAAA;AACrB,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAA;AACjD,YAAY,EACV,oBAAoB,EACpB,0BAA0B,EAC1B,2BAA2B,EAC3B,wBAAwB,EACxB,0BAA0B,GAC3B,MAAM,mBAAmB,CAAA;AAG1B,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,MAAM,oBAAoB,CAAA;AACxD,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,MAAM,wBAAwB,CAAA;AAChE,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAA;AAC3D,YAAY,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAA;AAChE,OAAO,EAAC,oBAAoB,EAAC,MAAM,8BAA8B,CAAA;AACjE,OAAO,EAAC,gBAAgB,EAAC,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAC,UAAU,EAAC,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAC,UAAU,EAAC,MAAM,yCAAyC,CAAA;AAClE,OAAO,EAAC,YAAY,EAAC,MAAM,sBAAsB,CAAA;AACjD,YAAY,EAAC,qBAAqB,EAAC,MAAM,sBAAsB,CAAA;AAC/D,OAAO,EAAC,SAAS,EAAE,YAAY,EAAC,MAAM,sBAAsB,CAAA;AAC5D,YAAY,EAAC,qBAAqB,EAAC,MAAM,sBAAsB,CAAA;AAC/D,OAAO,EAAC,0BAA0B,EAAC,MAAM,oCAAoC,CAAA;AAC7E,OAAO,EAAC,aAAa,EAAC,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAA;AAC3D,OAAO,EAAC,kBAAkB,EAAE,KAAK,eAAe,EAAC,MAAM,4BAA4B,CAAA;AACnF,OAAO,EAAC,OAAO,IAAI,yBAAyB,EAAC,MAAM,mCAAmC,CAAA;AACtF,OAAO,EAAC,sBAAsB,EAAC,MAAM,gCAAgC,CAAA;AACrE,OAAO,EAAC,KAAK,EAAC,MAAM,eAAe,CAAA;AACnC,OAAO,EAAC,cAAc,EAAC,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAC,mBAAmB,EAAE,KAAK,4BAA4B,EAAC,MAAM,6BAA6B,CAAA;AAGlG,OAAO,EAAC,eAAe,EAAC,MAAM,0BAA0B,CAAA;AACxD,YAAY,EAAC,UAAU,EAAC,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -21,6 +21,9 @@ export { useId } from './hooks/useId.js';
|
|
|
21
21
|
export { useSyncedState } from './hooks/useSyncedState.js';
|
|
22
22
|
export { useAnchoredPosition } from './hooks/useAnchoredPosition.js';
|
|
23
23
|
export { createComponent } from './utils/create-component.js';
|
|
24
|
+
export { asSlot } from './utils/as-slot.js';
|
|
25
|
+
export { isSlot } from './utils/is-slot.js';
|
|
26
|
+
export { useSlots } from './hooks/useSlots.js';
|
|
24
27
|
export { ActionList } from './ActionList/index.js';
|
|
25
28
|
export { Banner } from './Banner/index.js';
|
|
26
29
|
export { default as Label } from './Label/Label.js';
|
|
@@ -23,13 +23,13 @@ export type CheckboxOrRadioGroupProps = {
|
|
|
23
23
|
};
|
|
24
24
|
export type { CheckboxOrRadioGroupLabelProps } from './CheckboxOrRadioGroupLabel';
|
|
25
25
|
declare const _default: React.FC<React.PropsWithChildren<CheckboxOrRadioGroupProps>> & {
|
|
26
|
-
Caption: import("
|
|
26
|
+
Caption: import("../../..").FCWithSlotMarker<{
|
|
27
27
|
className?: string;
|
|
28
28
|
} & {
|
|
29
29
|
children?: React.ReactNode | undefined;
|
|
30
30
|
}>;
|
|
31
|
-
Label: import("
|
|
32
|
-
Validation: import("
|
|
31
|
+
Label: import("../../..").FCWithSlotMarker<React.PropsWithChildren<import("./CheckboxOrRadioGroupLabel").CheckboxOrRadioGroupLabelProps>>;
|
|
32
|
+
Validation: import("../../..").FCWithSlotMarker<React.PropsWithChildren<import("./CheckboxOrRadioGroupValidation").CheckboxOrRadioGroupValidationProps>>;
|
|
33
33
|
};
|
|
34
34
|
export default _default;
|
|
35
35
|
//# sourceMappingURL=CheckboxOrRadioGroup.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroup.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroup.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAYzB,MAAM,MAAM,yBAAyB,GAAG;IACtC,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,CAAC,iBAAiB,CAAC,CAAC,EAAE,MAAM,CAAA;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AA8GD,YAAY,EAAC,8BAA8B,EAAC,MAAM,6BAA6B,CAAA;;;;;;;;;;AAC/E,wBAIE"}
|
|
@@ -9,7 +9,6 @@ import VisuallyHidden from '../../../_VisuallyHidden.js';
|
|
|
9
9
|
import { useSlots } from '../../../hooks/useSlots.js';
|
|
10
10
|
import classes from './CheckboxOrRadioGroup.module.css.js';
|
|
11
11
|
import { clsx } from 'clsx';
|
|
12
|
-
import { isSlot } from '../../../utils/is-slot.js';
|
|
13
12
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
14
13
|
|
|
15
14
|
const CheckboxOrRadioGroup = ({
|
|
@@ -26,9 +25,9 @@ const CheckboxOrRadioGroup = ({
|
|
|
26
25
|
label: CheckboxOrRadioGroupLabel,
|
|
27
26
|
validation: CheckboxOrRadioGroupValidation
|
|
28
27
|
});
|
|
29
|
-
const labelChild =
|
|
30
|
-
const validationChild =
|
|
31
|
-
const captionChild =
|
|
28
|
+
const labelChild = slots.label;
|
|
29
|
+
const validationChild = slots.validation;
|
|
30
|
+
const captionChild = slots.caption;
|
|
32
31
|
const id = useId(idProp);
|
|
33
32
|
const validationMessageId = validationChild ? `${id}-validationMessage` : undefined;
|
|
34
33
|
const captionId = captionChild ? `${id}-caption` : undefined;
|
|
@@ -21,6 +21,6 @@ const CheckboxOrRadioGroupCaption = ({
|
|
|
21
21
|
});
|
|
22
22
|
};
|
|
23
23
|
CheckboxOrRadioGroupCaption.displayName = "CheckboxOrRadioGroupCaption";
|
|
24
|
-
CheckboxOrRadioGroupCaption.__SLOT__ = Symbol('
|
|
24
|
+
CheckboxOrRadioGroupCaption.__SLOT__ = Symbol('CheckboxOrRadioGroup.Caption');
|
|
25
25
|
|
|
26
26
|
export { CheckboxOrRadioGroupCaption as default };
|
|
@@ -35,6 +35,6 @@ const CheckboxOrRadioGroupLabel = ({
|
|
|
35
35
|
});
|
|
36
36
|
};
|
|
37
37
|
CheckboxOrRadioGroupLabel.displayName = "CheckboxOrRadioGroupLabel";
|
|
38
|
-
CheckboxOrRadioGroupLabel.__SLOT__ = Symbol('
|
|
38
|
+
CheckboxOrRadioGroupLabel.__SLOT__ = Symbol('CheckboxOrRadioGroup.Label');
|
|
39
39
|
|
|
40
40
|
export { CheckboxOrRadioGroupLabel as default };
|
|
@@ -19,6 +19,6 @@ const CheckboxOrRadioGroupValidation = ({
|
|
|
19
19
|
});
|
|
20
20
|
};
|
|
21
21
|
CheckboxOrRadioGroupValidation.displayName = "CheckboxOrRadioGroupValidation";
|
|
22
|
-
CheckboxOrRadioGroupValidation.__SLOT__ = Symbol('
|
|
22
|
+
CheckboxOrRadioGroupValidation.__SLOT__ = Symbol('CheckboxOrRadioGroup.Validation');
|
|
23
23
|
|
|
24
24
|
export { CheckboxOrRadioGroupValidation as default };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.prc-components-TextInputBaseWrapper-wY-n0{align-items:stretch;background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--control-borderColor-rest,#d1d9e0);border-radius:var(--borderRadius-medium,.375rem);box-shadow:var(--shadow-inset,inset 0 1px 0 0 #1f23280a);color:var(--fgColor-default,#1f2328);cursor:text;display:inline-flex;font-size:var(--text-body-size-medium,.875rem);line-height:var(--base-size-20,1.25rem);min-height:var(--base-size-32,2rem);outline:none;overflow:hidden;vertical-align:middle}.prc-components-TextInputBaseWrapper-wY-n0 input,.prc-components-TextInputBaseWrapper-wY-n0 textarea{cursor:text}.prc-components-TextInputBaseWrapper-wY-n0 select{cursor:pointer}:is(.prc-components-TextInputBaseWrapper-wY-n0 input,.prc-components-TextInputBaseWrapper-wY-n0 textarea,.prc-components-TextInputBaseWrapper-wY-n0 select)::placeholder{color:var(--fgColor-muted,#59636e)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-no-trailing-action]:focus-within),.prc-components-TextInputBaseWrapper-wY-n0:where([data-trailing-action][data-focused]){border-color:var(--borderColor-accent-emphasis,#0969da);outline:var(--borderWidth-thick,.125rem) solid var(--borderColor-accent-emphasis,#0969da);outline-offset:-1px}.prc-components-TextInputBaseWrapper-wY-n0>textarea{padding:var(--base-size-12,.75rem)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-contrast]){background-color:var(--control-bgColor-contrast,var(--bgColor-inset,#f6f8fa))}.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]){background-color:var(--control-bgColor-disabled,#eff2f5);border-color:var(--control-borderColor-disabled,#818b981a);box-shadow:none;color:var(--fgColor-disabled,#818b98)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) input,.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) select,.prc-components-TextInputBaseWrapper-wY-n0:where([data-disabled]) textarea{cursor:not-allowed}.prc-components-TextInputBaseWrapper-wY-n0:where([data-monospace]){font-family:var(--fontStack-monospace,ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]){border-color:var(--borderColor-danger-emphasis,#cf222e)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]):where([data-no-trailing-action]):focus-within,.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=error]):where([data-trailing-action][data-focused]){border-color:var(--control-borderColor-danger,#cf222e);outline:2px solid var(--control-borderColor-danger,#cf222e);outline-offset:-1px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-validation=success]){border-color:var(--bgColor-success-emphasis,#1f883d)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-block]){align-self:stretch;display:flex;width:100%}@media screen and (min-width:48rem){.prc-components-TextInputBaseWrapper-wY-n0{font-size:var(--text-body-size-medium,.875rem)}}.prc-components-TextInputBaseWrapper-wY-n0{--inner-action-size:var(--base-size-24,1.5rem)}.prc-components-TextInputBaseWrapper-wY-n0:where([data-size=small]){--inner-action-size:var(--base-size-20,1.25rem);font-size:var(--text-body-size-small,.75rem);line-height:var(--base-size-20,1.25rem);min-height:var(--base-size-28,1.75rem);padding-bottom:3px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:3px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-size=large]){--inner-action-size:var(--base-size-28,1.75rem);height:var(--base-size-40,2.5rem);padding-bottom:10px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:10px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-variant=small]){font-size:(--text-body-size-small);line-height:var(--base-size-20,1.25rem);min-height:28px;padding-bottom:3px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:3px}.prc-components-TextInputBaseWrapper-wY-n0:where([data-variant=large]){font-size:var(--text-title-size-medium,1.25rem);padding-bottom:10px;padding-left:var(--base-size-8,.5rem);padding-right:var(--base-size-8,.5rem);padding-top:10px}.prc-components-TextInputWrapper-Hpdqi,.prc-components-TextInputWrapper-Hpdqi>input,.prc-components-TextInputWrapper-Hpdqi>select{padding-left:0;padding-right:0}.prc-components-TextInputWrapper-Hpdqi{background-position:right 8px center;background-repeat:no-repeat}.prc-components-TextInputWrapper-Hpdqi>:not(:last-child){margin-right:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi .TextInput-action,.prc-components-TextInputWrapper-Hpdqi .TextInput-icon{align-self:center;color:var(--fgColor-muted,#59636e);flex-shrink:0}.prc-components-TextInputWrapper-Hpdqi:where([data-leading-visual]){padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-trailing-visual][data-no-trailing-action]){padding-right:var(--base-size-8,.5rem)}:is(.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-visual]),.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-action]))>input,:is(.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-visual]),.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-trailing-action]))>select{padding-left:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-trailing-visual][data-no-trailing-action])>input,.prc-components-TextInputWrapper-Hpdqi:where([data-no-trailing-visual][data-no-trailing-action])>select{padding-right:var(--base-size-8,.5rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action])>input,.prc-components-TextInputWrapper-Hpdqi:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action])>select{padding-left:var(--base-size-12,.75rem);padding-right:var(--base-size-12,.75rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-size=large]):where([data-leading-visual]){padding-left:var(--base-size-12,.75rem)}.prc-components-TextInputWrapper-Hpdqi:where([data-size=large]):where([data-trailing-visual][data-no-trailing-action]){padding-right:var(--base-size-12,.75rem)}
|
|
2
|
+
/*# sourceMappingURL=TextInputWrapper-b2f7f9fa.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/internal/components/TextInputWrapper.module.css.js"],"names":[],"mappings":"AAAA,2CAeE,mBAAoB,CALpB,4CAAwC,CACxC,qFAAqE,CACrE,gDAAyC,CAEzC,wDAA+B,CAP/B,oCAA6B,CAE7B,WAAY,CARZ,mBAAoB,CAGpB,8CAAuC,CAEvC,uCAAgC,CAJhC,mCAA+B,CAW/B,YAAa,CAVb,eAAgB,CAKhB,qBA6IF,CApIE,qGAEE,WACF,CAEA,kDACE,cACF,CAKE,yKACE,kCACF,CAGF,gLAEE,uDAAgD,CAChD,yFAA0E,CAC1E,mBACF,CAEA,oDACE,kCACF,CAEA,kEAGE,6EACF,CAEA,kEAEE,wDAAiD,CACjD,0DAAiD,CACjD,eAAgB,CAHhB,qCAUF,CALE,4NAGE,kBACF,CAGF,mEACE,mHACF,CAEA,0EACE,uDAQF,CANE,8OAEE,sDAA+C,CAC/C,2DAAoD,CACpD,mBACF,CAGF,4EAEE,oDACF,CAEA,+DAGE,kBAAmB,CAFnB,YAAa,CACb,UAEF,CAGA,oCA3FF,2CA4FI,8CAyDJ,CAxDE,CA7FF,2CA+FE,8CAsDF,CApDE,oEACE,+CAAwC,CASxC,4CAAsC,CAEtC,uCAAgC,CAThC,sCAA+B,CAK/B,kBAAmB,CACnB,qCAAgC,CAHhC,sCAAiC,CADjC,eAQF,CAEA,oEACE,+CAAwC,CAExC,iCAA2B,CAK3B,mBAAoB,CACpB,qCAAgC,CAHhC,sCAAiC,CADjC,gBAKF,CAGA,uEASE,kCAAmC,CAEnC,uCAAgC,CAVhC,eAAgB,CAKhB,kBAAmB,CACnB,qCAAgC,CAHhC,sCAAiC,CADjC,eASF,CAGA,uEAOE,+CAAwC,CAFxC,mBAAoB,CACpB,qCAAgC,CAHhC,sCAAiC,CADjC,gBAMF,CAOA,kIAGE,cAAe,CADf,eAEF,CARF,uCAcE,oCAAqC,CAHrC,2BA+CF,CA1CE,yDACE,qCACF,CAEA,gHAEE,iBAAkB,CAClB,kCAA2B,CAC3B,aACF,CAGA,oEACE,qCACF,CAGA,8FACE,sCACF,CAKE,2YAEE,qCACF,CAIF,+MAEE,sCACF,CAGA,+PAEE,uCAAiC,CACjC,wCACF,CAKA,6FACE,uCACF,CAEA,uHACE,wCACF","file":"TextInputWrapper-b2f7f9fa.css","sourcesContent":[".TextInputBaseWrapper {\n display: inline-flex;\n min-height: var(--base-size-32);\n overflow: hidden;\n font-size: var(--text-body-size-medium);\n /* stylelint-disable-next-line primer/typography */\n line-height: var(--base-size-20);\n color: var(--fgColor-default);\n vertical-align: middle;\n cursor: text;\n background-color: var(--bgColor-default);\n border: var(--borderWidth-thin) solid var(--control-borderColor-rest);\n border-radius: var(--borderRadius-medium);\n outline: none;\n box-shadow: var(--shadow-inset);\n align-items: stretch;\n\n input,\n textarea {\n cursor: text;\n }\n\n select {\n cursor: pointer;\n }\n\n input,\n textarea,\n select {\n &::placeholder {\n color: var(--fgColor-muted);\n }\n }\n\n &:where([data-trailing-action][data-focused]),\n &:where([data-no-trailing-action]:focus-within) {\n border-color: var(--borderColor-accent-emphasis);\n outline: var(--borderWidth-thick) solid var(--borderColor-accent-emphasis);\n outline-offset: -1px;\n }\n\n > textarea {\n padding: var(--base-size-12);\n }\n\n &:where([data-contrast]) {\n /* this variable is available behind a feature flag in gh/gh */\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--control-bgColor-contrast, var(--bgColor-inset));\n }\n\n &:where([data-disabled]) {\n color: var(--fgColor-disabled);\n background-color: var(--control-bgColor-disabled);\n border-color: var(--control-borderColor-disabled);\n box-shadow: none;\n\n input,\n textarea,\n select {\n cursor: not-allowed;\n }\n }\n\n &:where([data-monospace]) {\n font-family: var(--fontStack-monospace);\n }\n\n &:where([data-validation='error']) {\n border-color: var(--borderColor-danger-emphasis);\n\n &:where([data-trailing-action][data-focused]),\n &:where([data-no-trailing-action]):focus-within {\n border-color: var(--control-borderColor-danger);\n outline: 2px solid var(--control-borderColor-danger);\n outline-offset: -1px;\n }\n }\n\n &:where([data-validation='success']) {\n /* stylelint-disable-next-line primer/colors */\n border-color: var(--bgColor-success-emphasis);\n }\n\n &:where([data-block]) {\n display: flex;\n width: 100%;\n align-self: stretch;\n }\n\n /* Ensures inputs don't zoom on mobile but are body-font size on desktop */\n @media screen and (--viewportRange-regular) {\n font-size: var(--text-body-size-medium);\n }\n\n --inner-action-size: var(--base-size-24); /* Default size */\n\n &:where([data-size='small']) {\n --inner-action-size: var(--base-size-20);\n\n min-height: var(--base-size-28);\n /* stylelint-disable-next-line primer/spacing */\n padding-top: 3px;\n padding-right: var(--base-size-8);\n /* stylelint-disable-next-line primer/spacing */\n padding-bottom: 3px;\n padding-left: var(--base-size-8);\n font-size: var(--text-body-size-small);\n /* stylelint-disable-next-line primer/typography */\n line-height: var(--base-size-20);\n }\n\n &:where([data-size='large']) {\n --inner-action-size: var(--base-size-28);\n\n height: var(--base-size-40);\n /* stylelint-disable-next-line primer/spacing */\n padding-top: 10px;\n padding-right: var(--base-size-8);\n /* stylelint-disable-next-line primer/spacing */\n padding-bottom: 10px;\n padding-left: var(--base-size-8);\n }\n\n /* Deprecated */\n &:where([data-variant='small']) {\n min-height: 28px;\n /* stylelint-disable-next-line primer/spacing */\n padding-top: 3px;\n padding-right: var(--base-size-8);\n /* stylelint-disable-next-line primer/spacing */\n padding-bottom: 3px;\n padding-left: var(--base-size-8);\n /* stylelint-disable-next-line declaration-property-value-no-unknown */\n font-size: (--text-body-size-small);\n /* stylelint-disable-next-line primer/typography */\n line-height: var(--base-size-20);\n }\n\n /* Deprecated */\n &:where([data-variant='large']) {\n /* stylelint-disable-next-line primer/spacing */\n padding-top: 10px;\n padding-right: var(--base-size-8);\n /* stylelint-disable-next-line primer/spacing */\n padding-bottom: 10px;\n padding-left: var(--base-size-8);\n font-size: var(--text-title-size-medium);\n }\n}\n\n.TextInputWrapper {\n padding-right: 0;\n padding-left: 0;\n\n > input,\n > select {\n padding-right: 0;\n padding-left: 0;\n }\n\n /* Repeat and position set for form states (success, error, etc) */\n background-repeat: no-repeat;\n\n /* For form validation. This keeps images 8px from right and centered vertically. */\n background-position: right 8px center;\n\n & > :not(:last-child) {\n margin-right: var(--base-size-8);\n }\n\n & :global(.TextInput-icon) /* stylelint-disable-line selector-class-pattern */,\n & :global(.TextInput-action) /* stylelint-disable-line selector-class-pattern */ {\n align-self: center;\n color: var(--fgColor-muted);\n flex-shrink: 0;\n }\n\n /* With leading visual */\n &:where([data-leading-visual]) {\n padding-left: var(--base-size-8);\n }\n\n /* With trailing visual */\n &:where([data-trailing-visual][data-no-trailing-action]) {\n padding-right: var(--base-size-8);\n }\n\n /* Only trailing visual */\n &:where([data-no-leading-visual][data-trailing-visual]),\n &:where([data-no-leading-visual][data-trailing-action]) {\n > input,\n > select {\n padding-left: var(--base-size-8);\n }\n }\n\n /* Only leading visual */\n &:where([data-no-trailing-visual][data-no-trailing-action]) > input,\n &:where([data-no-trailing-visual][data-no-trailing-action]) > select {\n padding-right: var(--base-size-8);\n }\n\n /* No visuals at all */\n &:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action]) > input,\n &:where([data-no-leading-visual][data-no-trailing-visual][data-no-trailing-action]) > select {\n padding-left: var(--base-size-12);\n padding-right: var(--base-size-12);\n }\n}\n\n/* Large size input */\n.TextInputWrapper:where([data-size='large']) {\n &:where([data-leading-visual]) {\n padding-left: var(--base-size-12);\n }\n\n &:where([data-trailing-visual][data-no-trailing-action]) {\n padding-right: var(--base-size-12);\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextInputWrapper.d.ts","sourceRoot":"","sources":["../../../src/internal/components/TextInputWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,KAAK,cAAc,EAAC,MAAM,OAAO,CAAA;AAChD,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,wCAAwC,CAAA;AAKhF,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEzD,KAAK,+BAA+B,GAAG;IACrC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,gBAAgB,CAAC,EAAE,oBAAoB,CAAA;IACvC,0CAA0C;IAC1C,OAAO,CAAC,EAAE,cAAc,CAAA;IACxB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,6DAA6D;IAC7D,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC3B,CAAA;AAOD,eAAO,MAAM,oBAAoB;uBAJZ,OAAO;wBACN,OAAO;
|
|
1
|
+
{"version":3,"file":"TextInputWrapper.d.ts","sourceRoot":"","sources":["../../../src/internal/components/TextInputWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,KAAK,cAAc,EAAC,MAAM,OAAO,CAAA;AAChD,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,wCAAwC,CAAA;AAKhF,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEzD,KAAK,+BAA+B,GAAG;IACrC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,gBAAgB,CAAC,EAAE,oBAAoB,CAAA;IACvC,0CAA0C;IAC1C,OAAO,CAAC,EAAE,cAAc,CAAA;IACxB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,6DAA6D;IAC7D,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC3B,CAAA;AAOD,eAAO,MAAM,oBAAoB;uBAJZ,OAAO;wBACN,OAAO;uEAqD5B,CAAA;AAGD,eAAO,MAAM,gBAAgB;uBAzDR,OAAO;wBACN,OAAO;kHAuE3B,CAAA;AAEF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,OAAO,oBAAoB,CAAC,CAAA;AAChF,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,OAAO,gBAAgB,CAAC,CAAA;AACxE,eAAe,gBAAgB,CAAA"}
|
|
@@ -5,7 +5,7 @@ import styles from './TextInputWrapper.module.css.js';
|
|
|
5
5
|
import { jsx } from 'react/jsx-runtime';
|
|
6
6
|
|
|
7
7
|
const TextInputBaseWrapper = /*#__PURE__*/React.forwardRef(function TextInputBaseWrapper(t0, forwardRef) {
|
|
8
|
-
const $ = c(
|
|
8
|
+
const $ = c(44);
|
|
9
9
|
let block;
|
|
10
10
|
let className;
|
|
11
11
|
let contrast;
|
|
@@ -134,11 +134,12 @@ const TextInputBaseWrapper = /*#__PURE__*/React.forwardRef(function TextInputBas
|
|
|
134
134
|
const t10 = monospace || undefined;
|
|
135
135
|
const t11 = size || undefined;
|
|
136
136
|
const t12 = hasTrailingAction || undefined;
|
|
137
|
-
const t13 =
|
|
138
|
-
const t14 =
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
137
|
+
const t13 = hasTrailingAction ? undefined : true;
|
|
138
|
+
const t14 = validationStatus || undefined;
|
|
139
|
+
const t15 = variant || undefined;
|
|
140
|
+
let t16;
|
|
141
|
+
if ($[29] !== forwardRef || $[30] !== memoizedStyle || $[31] !== restProps || $[32] !== t10 || $[33] !== t11 || $[34] !== t12 || $[35] !== t13 || $[36] !== t14 || $[37] !== t15 || $[38] !== t5 || $[39] !== t6 || $[40] !== t7 || $[41] !== t8 || $[42] !== t9) {
|
|
142
|
+
t16 = /*#__PURE__*/jsx("span", {
|
|
142
143
|
ref: forwardRef,
|
|
143
144
|
className: t5,
|
|
144
145
|
"data-block": t6,
|
|
@@ -148,8 +149,9 @@ const TextInputBaseWrapper = /*#__PURE__*/React.forwardRef(function TextInputBas
|
|
|
148
149
|
"data-monospace": t10,
|
|
149
150
|
"data-size": t11,
|
|
150
151
|
"data-trailing-action": t12,
|
|
151
|
-
"data-
|
|
152
|
-
"data-
|
|
152
|
+
"data-no-trailing-action": t13,
|
|
153
|
+
"data-validation": t14,
|
|
154
|
+
"data-variant": t15,
|
|
153
155
|
style: memoizedStyle,
|
|
154
156
|
"data-component": "TextInput",
|
|
155
157
|
...restProps
|
|
@@ -162,20 +164,21 @@ const TextInputBaseWrapper = /*#__PURE__*/React.forwardRef(function TextInputBas
|
|
|
162
164
|
$[34] = t12;
|
|
163
165
|
$[35] = t13;
|
|
164
166
|
$[36] = t14;
|
|
165
|
-
$[37] =
|
|
166
|
-
$[38] =
|
|
167
|
-
$[39] =
|
|
168
|
-
$[40] =
|
|
169
|
-
$[41] =
|
|
170
|
-
$[42] =
|
|
167
|
+
$[37] = t15;
|
|
168
|
+
$[38] = t5;
|
|
169
|
+
$[39] = t6;
|
|
170
|
+
$[40] = t7;
|
|
171
|
+
$[41] = t8;
|
|
172
|
+
$[42] = t9;
|
|
173
|
+
$[43] = t16;
|
|
171
174
|
} else {
|
|
172
|
-
|
|
175
|
+
t16 = $[43];
|
|
173
176
|
}
|
|
174
|
-
return
|
|
177
|
+
return t16;
|
|
175
178
|
});
|
|
176
179
|
TextInputBaseWrapper.displayName = 'TextInputBaseWrapper';
|
|
177
180
|
const TextInputWrapper = /*#__PURE__*/React.forwardRef(function TextInputWrapper(t0, forwardRef) {
|
|
178
|
-
const $ = c(
|
|
181
|
+
const $ = c(15);
|
|
179
182
|
let className;
|
|
180
183
|
let hasLeadingVisual;
|
|
181
184
|
let hasTrailingVisual;
|
|
@@ -207,14 +210,18 @@ const TextInputWrapper = /*#__PURE__*/React.forwardRef(function TextInputWrapper
|
|
|
207
210
|
t1 = $[6];
|
|
208
211
|
}
|
|
209
212
|
const t2 = hasLeadingVisual || undefined;
|
|
210
|
-
const t3 =
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
213
|
+
const t3 = hasLeadingVisual ? undefined : true;
|
|
214
|
+
const t4 = hasTrailingVisual || undefined;
|
|
215
|
+
const t5 = hasTrailingVisual ? undefined : true;
|
|
216
|
+
let t6;
|
|
217
|
+
if ($[7] !== forwardRef || $[8] !== restProps || $[9] !== t1 || $[10] !== t2 || $[11] !== t3 || $[12] !== t4 || $[13] !== t5) {
|
|
218
|
+
t6 = /*#__PURE__*/jsx(TextInputBaseWrapper, {
|
|
214
219
|
ref: forwardRef,
|
|
215
220
|
className: t1,
|
|
216
221
|
"data-leading-visual": t2,
|
|
217
|
-
"data-
|
|
222
|
+
"data-no-leading-visual": t3,
|
|
223
|
+
"data-trailing-visual": t4,
|
|
224
|
+
"data-no-trailing-visual": t5,
|
|
218
225
|
...restProps
|
|
219
226
|
});
|
|
220
227
|
$[7] = forwardRef;
|
|
@@ -223,10 +230,12 @@ const TextInputWrapper = /*#__PURE__*/React.forwardRef(function TextInputWrapper
|
|
|
223
230
|
$[10] = t2;
|
|
224
231
|
$[11] = t3;
|
|
225
232
|
$[12] = t4;
|
|
233
|
+
$[13] = t5;
|
|
234
|
+
$[14] = t6;
|
|
226
235
|
} else {
|
|
227
|
-
|
|
236
|
+
t6 = $[14];
|
|
228
237
|
}
|
|
229
|
-
return
|
|
238
|
+
return t6;
|
|
230
239
|
});
|
|
231
240
|
|
|
232
241
|
export { TextInputBaseWrapper, TextInputWrapper, TextInputWrapper as default };
|