@cdx-ui/components 0.1.1 → 0.1.2
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/README.md +8 -12
- package/lib/commonjs/components/Radio/index.js +14 -3
- package/lib/commonjs/components/Radio/index.js.map +1 -1
- package/lib/commonjs/components/Radio/styles.js +24 -8
- package/lib/commonjs/components/Radio/styles.js.map +1 -1
- package/lib/commonjs/components/Switch/styles.js +14 -14
- package/lib/commonjs/components/Switch/styles.js.map +1 -1
- package/lib/commonjs/figma/Field.Radio.figma.js +58 -0
- package/lib/commonjs/figma/Field.Radio.figma.js.map +1 -0
- package/lib/commonjs/figma/Radio.Group.figma.js +24 -0
- package/lib/commonjs/figma/Radio.Group.figma.js.map +1 -0
- package/lib/commonjs/figma/Radio.figma.js +12 -6
- package/lib/commonjs/figma/Radio.figma.js.map +1 -1
- package/lib/module/components/Radio/index.js +14 -3
- package/lib/module/components/Radio/index.js.map +1 -1
- package/lib/module/components/Radio/styles.js +25 -9
- package/lib/module/components/Radio/styles.js.map +1 -1
- package/lib/module/components/Switch/styles.js +14 -14
- package/lib/module/components/Switch/styles.js.map +1 -1
- package/lib/module/figma/Field.Radio.figma.js +52 -0
- package/lib/module/figma/Field.Radio.figma.js.map +1 -0
- package/lib/module/figma/Radio.Group.figma.js +18 -0
- package/lib/module/figma/Radio.Group.figma.js.map +1 -0
- package/lib/module/figma/Radio.figma.js +12 -6
- package/lib/module/figma/Radio.figma.js.map +1 -1
- package/lib/typescript/components/Radio/index.d.ts.map +1 -1
- package/lib/typescript/components/Radio/styles.d.ts.map +1 -1
- package/lib/typescript/components/Switch/styles.d.ts.map +1 -1
- package/lib/typescript/figma/Field.Radio.figma.d.ts +8 -0
- package/lib/typescript/figma/Field.Radio.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Radio.Group.figma.d.ts +8 -0
- package/lib/typescript/figma/Radio.Group.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Radio.figma.d.ts.map +1 -1
- package/package.json +5 -5
- package/src/components/Radio/index.tsx +22 -6
- package/src/components/Radio/styles.ts +46 -6
- package/src/components/Switch/styles.ts +23 -15
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
Styled, theme-aware UI components for the Forge Design System.
|
|
6
6
|
|
|
7
|
-
Built on top of [`@cdx-ui/primitives`](
|
|
7
|
+
Built on top of [`@cdx-ui/primitives`](https://www.npmjs.com/package/@cdx-ui/primitives), [`@cdx-ui/utils`](https://www.npmjs.com/package/@cdx-ui/utils), [`@cdx-ui/icons`](https://www.npmjs.com/package/@cdx-ui/icons), and [`@cdx-ui/formatters`](https://www.npmjs.com/package/@cdx-ui/formatters), styled via [Uniwind](https://uniwind.dev) + [CVA](https://cva.style). Design tokens from [`@cdx-ui/styles`](https://www.npmjs.com/package/@cdx-ui/styles) are consumed at the app level (not a direct package dependency).
|
|
8
8
|
|
|
9
9
|
## Installation
|
|
10
10
|
|
|
@@ -40,11 +40,9 @@ export function Example() {
|
|
|
40
40
|
}
|
|
41
41
|
```
|
|
42
42
|
|
|
43
|
-
Component stories live in [`apps/storybook`](../../apps/storybook/). See the full [component reference](../../docs/README.md#components) for per-component docs.
|
|
44
|
-
|
|
45
43
|
### Components
|
|
46
44
|
|
|
47
|
-
|
|
45
|
+
The [component reference](https://design.candescent.com/docs/components) is the source of truth for the catalog — every component has a page there with live examples, props, and accessibility notes.
|
|
48
46
|
|
|
49
47
|
> `Box` is exported but deprecated — use React Native's `View` directly.
|
|
50
48
|
|
|
@@ -70,7 +68,7 @@ Wrap your app (or the Forge UI section of it) with the top-level provider so ove
|
|
|
70
68
|
|
|
71
69
|
### Metro configuration helper
|
|
72
70
|
|
|
73
|
-
The `withForgeMetroConfig` helper now ships from [`@cdx-ui/native
|
|
71
|
+
The `withForgeMetroConfig` helper now ships from [`@cdx-ui/native`](https://www.npmjs.com/package/@cdx-ui/native), not this package — it is native build tooling, and keeping it here forced a Metro dependency onto every consumer of the component library.
|
|
74
72
|
|
|
75
73
|
```js
|
|
76
74
|
const { withForgeMetroConfig } = require('@cdx-ui/native/metro');
|
|
@@ -97,13 +95,11 @@ For convenience, the package re-exports several core RN components and hooks wit
|
|
|
97
95
|
|
|
98
96
|
## Figma Code Connect
|
|
99
97
|
|
|
100
|
-
Template files
|
|
101
|
-
|
|
102
|
-
See the **[Code Connect authoring guide](../../docs/internal/practices/code-connect.md)** for conventions, property mapping patterns, and local workflow.
|
|
98
|
+
Template files under `src/figma/` map Figma component variants to production Forge UI snippets shown in Figma Dev Mode. These files are excluded from the npm tarball (`!src/figma` in `files`) and published to Figma via CI on pushes to `main`. Conventions, property-mapping patterns, and the local workflow are documented in the repository's Code Connect authoring guide.
|
|
103
99
|
|
|
104
100
|
## Testing
|
|
105
101
|
|
|
106
|
-
Tests live
|
|
102
|
+
Tests live under `__tests__/`. This package uses two of the repo-root **`jest.config.js`** projects: **`rntl`** (jest-expo native + **`@testing-library/react-native`**) for `*.test.tsx`, and **`axe`** (jest-expo web + jsdom + **`@testing-library/react`** + **`jest-axe`**) for `*.axe.test.tsx` — both targeting `packages/components/__tests__/`. The repository's testing guide documents the full multi-project model.
|
|
107
103
|
|
|
108
104
|
```bash
|
|
109
105
|
# From monorepo root
|
|
@@ -114,13 +110,13 @@ pnpm test:all
|
|
|
114
110
|
|
|
115
111
|
Production types use `tsconfig.json`; tests use `tsconfig.test.json`.
|
|
116
112
|
|
|
117
|
-
**Authoring:**
|
|
113
|
+
**Authoring:** the repository's testing guide covers RNTL vs DOM, `fireEvent.press` vs `fireEvent.click`, and file naming.
|
|
118
114
|
|
|
119
115
|
**A11y-only ad-hoc** (from `packages/components`):
|
|
120
116
|
`pnpm exec jest --config ../../jest.config.js --testNamePattern="a11y"`
|
|
121
117
|
|
|
122
118
|
## License
|
|
123
119
|
|
|
124
|
-
[](
|
|
120
|
+
[](https://opensource.org/licenses/MIT)
|
|
125
121
|
|
|
126
|
-
MIT © 2026 Digital First Holdings LLC.
|
|
122
|
+
MIT © 2026 Digital First Holdings LLC. The full license text ships in the package as `LICENSE`.
|
|
@@ -66,7 +66,7 @@ const RadioIndicator = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
66
66
|
isFocusVisible
|
|
67
67
|
} = (0, _primitives.useRadioContext)();
|
|
68
68
|
const checkState = isChecked ? 'checked' : 'unchecked';
|
|
69
|
-
const fieldState = INDICATOR_STATES[`${checkState}:${isInvalid ? 'true' : 'false'}:${isPressed ? 'true' : 'false'}`];
|
|
69
|
+
const fieldState = isReadOnly ? `readonly-${checkState}${isInvalid ? '-invalid' : ''}` : INDICATOR_STATES[`${checkState}:${isInvalid ? 'true' : 'false'}:${isPressed ? 'true' : 'false'}`];
|
|
70
70
|
const computedClassName = (0, _utils.cn)((0, _styles.radioIndicatorVariants)(), className);
|
|
71
71
|
const Comp = asChild ? _primitives.Slot : _reactNative.View;
|
|
72
72
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Comp, {
|
|
@@ -86,11 +86,16 @@ const RadioIndicator = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
86
86
|
fieldState
|
|
87
87
|
})),
|
|
88
88
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
89
|
-
|
|
89
|
+
collapsable: false,
|
|
90
|
+
className: (0, _utils.cn)((0, _styles.radioInnerDotVariants)(),
|
|
91
|
+
// Native: unconditional bg so Uniwind does not have to win a data-attribute
|
|
92
|
+
// background over `bg-surface-action-strong` (web keeps compound selectors).
|
|
93
|
+
isReadOnly && isChecked && !isInvalid && 'bg-content-primary'),
|
|
90
94
|
...(0, _primitives.dataAttributes)({
|
|
91
95
|
checked: isChecked,
|
|
92
96
|
invalid: isInvalid,
|
|
93
97
|
hover: isHovered,
|
|
98
|
+
readonly: isReadOnly,
|
|
94
99
|
fieldState
|
|
95
100
|
})
|
|
96
101
|
}), children]
|
|
@@ -109,6 +114,10 @@ const RadioLabel = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
109
114
|
style,
|
|
110
115
|
...props
|
|
111
116
|
}, ref) => {
|
|
117
|
+
const {
|
|
118
|
+
isDisabled,
|
|
119
|
+
isReadOnly
|
|
120
|
+
} = (0, _primitives.useRadioContext)();
|
|
112
121
|
const computedClassName = (0, _utils.cn)((0, _styles.radioLabelVariants)(), className);
|
|
113
122
|
const Comp = asChild ? _primitives.Slot : _reactNative.Text;
|
|
114
123
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
|
|
@@ -117,7 +126,9 @@ const RadioLabel = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
117
126
|
style: style,
|
|
118
127
|
...props,
|
|
119
128
|
...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
|
|
120
|
-
slot: 'radio-label'
|
|
129
|
+
slot: 'radio-label',
|
|
130
|
+
disabled: isDisabled,
|
|
131
|
+
readonly: isReadOnly
|
|
121
132
|
})),
|
|
122
133
|
children: children
|
|
123
134
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_reactNative","_primitives","_utils","_styles","_jsxRuntime","RadioRoot","forwardRef","className","children","style","props","ref","computedClassName","cn","radioRootVariants","jsxs","mergeDataAttributes","dataAttributes","slot","jsx","RadioIndicator","displayName","INDICATOR_STATES","asChild","isChecked","isDisabled","isHovered","isInvalid","isReadOnly","isPressed","isFocusVisible","useRadioContext","checkState","fieldState","radioIndicatorVariants","Comp","Slot","View","hover","checked","disabled","focusVisible","invalid","readonly","active","radioInnerDotVariants","RadioLabel","radioLabelVariants","Text","RadioGroup","direction","value","defaultValue","onChange","isRequired","name","viewProps","radioGroupVariants","Radio","exports","Object","assign","Indicator","Label","Group"],"sourceRoot":"../../../../src","sources":["components/Radio/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AASA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAMkB,IAAAK,WAAA,GAAAL,OAAA;AAElB;AACA;AACA;;AAOA,MAAMM,SAAS,gBAAG,IAAAC,iBAAU,EAAmB,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAChG,MAAMC,iBAAiB,GAAG,IAAAC,SAAE,EAAC,IAAAC,yBAAiB,EAAC,CAAC,EAAEP,SAAS,CAAC;EAE5D,oBACE,IAAAH,WAAA,CAAAW,IAAA,EAACd,WAAA,CAAAI,SAAkB;IACjBM,GAAG,EAAEA,GAAI;IACTJ,SAAS,EAAEK,iBAAkB;IAC7BH,KAAK,EAAEA,KAAM;IAAA,GACTC,KAAK;IAAA,GACL,IAAAM,+BAAmB,EAACN,KAAK,EAAE,IAAAO,0BAAc,EAAC;MAAEC,IAAI,EAAE;IAAQ,CAAC,CAAC,CAAC;IAAAV,QAAA,gBAEjE,IAAAJ,WAAA,CAAAe,GAAA,EAACC,cAAc,IAAE,CAAC,EACjBZ,QAAQ;EAAA,CACS,CAAC;AAEzB,CAAC,CAAC;AAEFH,SAAS,CAACgB,WAAW,GAAG,OAAO;;AAE/B;AACA;AACA;;AAEA;AACA,MAAMC,gBAAgB,GAAG;EACvB,uBAAuB,EAAE,MAAM;EAC/B,sBAAsB,EAAE,SAAS;EACjC,sBAAsB,EAAE,QAAQ;EAChC,qBAAqB,EAAE,gBAAgB;EACvC,qBAAqB,EAAE,SAAS;EAChC,oBAAoB,EAAE,iBAAiB;EACvC,oBAAoB,EAAE,gBAAgB;EACtC,mBAAmB,EAAE;AACvB,CAAU;AAQV,MAAMF,cAAc,gBAAG,IAAAd,iBAAU,EAC/B,CAAC;EAAEiB,OAAO;EAAEhB,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC1D,MAAM;IAAEa,SAAS;IAAEC,UAAU;IAAEC,SAAS;IAAEC,SAAS;IAAEC,UAAU;IAAEC,SAAS;IAAEC;EAAe,CAAC,GAC1F,IAAAC,2BAAe,EAAC,CAAC;EAEnB,MAAMC,UAAU,GAAGR,SAAS,GAAG,SAAS,GAAG,WAAW;EACtD,MAAMS,UAAU,
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_primitives","_utils","_styles","_jsxRuntime","RadioRoot","forwardRef","className","children","style","props","ref","computedClassName","cn","radioRootVariants","jsxs","mergeDataAttributes","dataAttributes","slot","jsx","RadioIndicator","displayName","INDICATOR_STATES","asChild","isChecked","isDisabled","isHovered","isInvalid","isReadOnly","isPressed","isFocusVisible","useRadioContext","checkState","fieldState","radioIndicatorVariants","Comp","Slot","View","hover","checked","disabled","focusVisible","invalid","readonly","active","collapsable","radioInnerDotVariants","RadioLabel","radioLabelVariants","Text","RadioGroup","direction","value","defaultValue","onChange","isRequired","name","viewProps","radioGroupVariants","Radio","exports","Object","assign","Indicator","Label","Group"],"sourceRoot":"../../../../src","sources":["components/Radio/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -7,11 +7,13 @@ exports.radioRootVariants = exports.radioLabelVariants = exports.radioInnerDotVa
|
|
|
7
7
|
var _reactNative = require("react-native");
|
|
8
8
|
var _utils = require("@cdx-ui/utils");
|
|
9
9
|
var _constants = require("../../styles/constants");
|
|
10
|
-
const radioRootVariants = exports.radioRootVariants = (0, _utils.cva)(['flex-row items-center gap-2', 'data-[
|
|
10
|
+
const radioRootVariants = exports.radioRootVariants = (0, _utils.cva)(['flex-row items-center gap-2', _constants.DISABLED_OPACITY, _constants.DISABLED_CURSOR, 'data-[readonly=true]:cursor-default',
|
|
11
11
|
// Suppress default :focus-visible outline on the role="radio" Pressable;
|
|
12
12
|
// focus ring is drawn on the indicator instead of wrapping the whole control.
|
|
13
13
|
'web:outline-none web:focus:outline-none web:focus-visible:outline-none']);
|
|
14
|
-
const radioIndicatorVariants = exports.radioIndicatorVariants = (0, _utils.cva)(['items-center justify-center', 'rounded-[var(--border-radius-round)]', 'border-[length:var(--border-width-selected)]', 'h-5 w-5',
|
|
14
|
+
const radioIndicatorVariants = exports.radioIndicatorVariants = (0, _utils.cva)(['items-center justify-center', 'rounded-[var(--border-radius-round)]', 'border-[length:var(--border-width-selected)]', 'h-5 w-5',
|
|
15
|
+
// Figma: indicator fill is transparent; selection reads via border + inner dot only.
|
|
16
|
+
'bg-transparent', 'data-[checked=false]:border-content-secondary', 'data-[checked=true]:border-stroke-action', 'data-[invalid=true]:border-stroke-danger', _reactNative.Platform.select({
|
|
15
17
|
web: [_constants.TRANSITION_COLORS, 'group',
|
|
16
18
|
// Hover — unchecked (Figma: border unchanged, bg overlay at opacity/hover)
|
|
17
19
|
'data-[hover=true]:data-[checked=false]:bg-content-secondary/[0.08]',
|
|
@@ -19,19 +21,33 @@ const radioIndicatorVariants = exports.radioIndicatorVariants = (0, _utils.cva)(
|
|
|
19
21
|
'data-[hover=true]:data-[invalid=true]:data-[checked=false]:bg-surface-danger-strong/[0.08]', 'data-[hover=true]:data-[checked=true]:border-surface-action-strong-hover', 'data-[hover=true]:data-[invalid=true]:border-surface-danger-strong-hover',
|
|
20
22
|
// Active — CSS :active (web root does not track press via data-active).
|
|
21
23
|
// data-[hover=true] guard ensures active beats hover by specificity (0,3,0 > 0,2,0).
|
|
22
|
-
'web:active:data-[hover=true]:data-[checked=false]:border-stroke-hover', 'web:active:data-[hover=true]:data-[invalid=true]:data-[checked=false]:border-surface-danger-strong-active', 'web:active:data-[hover=true]:data-[checked=true]:border-surface-action-strong-active', 'web:active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-surface-danger-strong-active',
|
|
24
|
+
'web:active:data-[hover=true]:data-[checked=false]:border-stroke-hover', 'web:active:data-[hover=true]:data-[invalid=true]:data-[checked=false]:border-surface-danger-strong-active', 'web:active:data-[hover=true]:data-[checked=true]:border-surface-action-strong-active', 'web:active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-surface-danger-strong-active',
|
|
25
|
+
// Focus ring — applies to read-only as well (focusable + aria-readonly).
|
|
26
|
+
'web:data-[focus-visible=true]:outline-none', 'web:data-[focus-visible=true]:ring-2 web:data-[focus-visible=true]:ring-stroke-focus web:data-[focus-visible=true]:ring-offset-2',
|
|
27
|
+
// Read-only — Figma: transparent fill + content-tertiary border (checked and unchecked).
|
|
28
|
+
// After hover/active so equal-or-higher specificity keeps the static treatment.
|
|
29
|
+
// Invalid is not a Figma readonly variant; retain danger so error remains visible.
|
|
30
|
+
'data-[readonly=true]:data-[checked=false]:border-content-tertiary', 'data-[readonly=true]:data-[checked=true]:border-content-tertiary', 'data-[readonly=true]:data-[invalid=true]:border-stroke-danger', 'data-[readonly=true]:data-[hover=true]:data-[checked=false]:bg-transparent', 'data-[readonly=true]:data-[hover=true]:data-[invalid=true]:data-[checked=false]:bg-transparent', 'data-[readonly=true]:data-[hover=true]:data-[checked=false]:border-content-tertiary', 'data-[readonly=true]:data-[hover=true]:data-[checked=true]:border-content-tertiary', 'data-[readonly=true]:data-[hover=true]:data-[invalid=true]:border-stroke-danger', 'web:active:data-[readonly=true]:data-[hover=true]:data-[checked=false]:border-content-tertiary', 'web:active:data-[readonly=true]:data-[hover=true]:data-[checked=true]:border-content-tertiary', 'web:active:data-[readonly=true]:data-[hover=true]:data-[invalid=true]:data-[checked=false]:border-stroke-danger', 'web:active:data-[readonly=true]:data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-stroke-danger'].join(' '),
|
|
23
31
|
default: [
|
|
24
32
|
// Native: Uniwind only evaluates the last data-[] condition in a compound chain.
|
|
25
33
|
// Use single-condition data-[field-state=...] selectors (emitted by RadioIndicator).
|
|
26
|
-
'data-[field-state=active]:border-stroke-hover', 'data-[field-state=invalid-active]:border-surface-danger-strong-active', 'data-[field-state=checked-active]:border-surface-action-strong-active', 'data-[field-state=checked-invalid-active]:border-surface-danger-strong-active'].join(' ')
|
|
34
|
+
'data-[field-state=readonly-unchecked]:border-content-tertiary', 'data-[field-state=readonly-checked]:border-content-tertiary', 'data-[field-state=readonly-unchecked-invalid]:border-stroke-danger', 'data-[field-state=readonly-checked-invalid]:border-stroke-danger', 'data-[field-state=active]:border-stroke-hover', 'data-[field-state=invalid-active]:border-surface-danger-strong-active', 'data-[field-state=checked-active]:border-surface-action-strong-active', 'data-[field-state=checked-invalid-active]:border-surface-danger-strong-active'].join(' ')
|
|
27
35
|
})]);
|
|
28
|
-
const radioInnerDotVariants = exports.radioInnerDotVariants = (0, _utils.cva)(['rounded-[var(--border-radius-round)]', 'h-2.5 w-2.5',
|
|
36
|
+
const radioInnerDotVariants = exports.radioInnerDotVariants = (0, _utils.cva)(['rounded-[var(--border-radius-round)]', 'overflow-hidden', 'h-2.5 w-2.5',
|
|
37
|
+
// Opacity (not scale): iOS compositing of scale-0 views samples the parent ring, so the
|
|
38
|
+
// checked fill never paints and the dot looks content-tertiary instead of content-primary.
|
|
39
|
+
'opacity-0', 'data-[checked=true]:opacity-100', 'bg-surface-action-strong', 'data-[invalid=true]:bg-surface-danger-strong', _reactNative.Platform.select({
|
|
29
40
|
web: ['data-[hover=true]:bg-surface-action-strong-hover', 'data-[hover=true]:data-[invalid=true]:bg-surface-danger-strong-hover',
|
|
30
41
|
// Active via group-active on indicator (inner dot is not the :active target).
|
|
31
|
-
'web:group-active:data-[hover=true]:data-[checked=true]:bg-surface-action-strong-active', 'web:group-active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:bg-surface-danger-strong-active'
|
|
32
|
-
|
|
42
|
+
'web:group-active:data-[hover=true]:data-[checked=true]:bg-surface-action-strong-active', 'web:group-active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:bg-surface-danger-strong-active',
|
|
43
|
+
// Read-only checked — Figma: content-primary dot; invalid retains danger.
|
|
44
|
+
'data-[readonly=true]:data-[checked=true]:bg-content-primary', 'data-[readonly=true]:data-[checked=true]:data-[invalid=true]:bg-surface-danger-strong', 'web:group-active:data-[readonly=true]:data-[hover=true]:data-[checked=true]:bg-content-primary', 'web:group-active:data-[readonly=true]:data-[hover=true]:data-[checked=true]:data-[invalid=true]:bg-surface-danger-strong'].join(' '),
|
|
45
|
+
default: ['data-[field-state=checked-active]:bg-surface-action-strong-active', 'data-[field-state=checked-invalid-active]:bg-surface-danger-strong-active',
|
|
46
|
+
// `!` beats the base `bg-surface-action-strong` — Uniwind native does not cascade
|
|
47
|
+
// data-attribute backgrounds over an unconditional bg on the same View.
|
|
48
|
+
'data-[readonly=true]:bg-content-primary!', 'data-[field-state=readonly-checked]:bg-content-primary!', 'data-[field-state=readonly-checked-invalid]:bg-surface-danger-strong!'].join(' ')
|
|
33
49
|
})]);
|
|
34
|
-
const radioLabelVariants = exports.radioLabelVariants = (0, _utils.cva)(['body-md', 'text-content-primary']);
|
|
50
|
+
const radioLabelVariants = exports.radioLabelVariants = (0, _utils.cva)(['body-md', 'text-content-primary', 'data-[disabled=true]:text-content-tertiary', 'data-[readonly=true]:cursor-default']);
|
|
35
51
|
const radioGroupVariants = exports.radioGroupVariants = (0, _utils.cva)([], {
|
|
36
52
|
variants: {
|
|
37
53
|
direction: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_utils","_constants","radioRootVariants","exports","cva","DISABLED_CURSOR","radioIndicatorVariants","Platform","select","web","TRANSITION_COLORS","join","default","radioInnerDotVariants","radioLabelVariants","radioGroupVariants","variants","direction","column","row","defaultVariants"],"sourceRoot":"../../../../src","sources":["components/Radio/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AAEO,MAAMG,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,UAAG,EAAC,CACnC,6BAA6B,
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_utils","_constants","radioRootVariants","exports","cva","DISABLED_OPACITY","DISABLED_CURSOR","radioIndicatorVariants","Platform","select","web","TRANSITION_COLORS","join","default","radioInnerDotVariants","radioLabelVariants","radioGroupVariants","variants","direction","column","row","defaultVariants"],"sourceRoot":"../../../../src","sources":["components/Radio/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AAEO,MAAMG,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,UAAG,EAAC,CACnC,6BAA6B,EAC7BC,2BAAgB,EAChBC,0BAAe,EACf,qCAAqC;AACrC;AACA;AACA,wEAAwE,CACzE,CAAC;AAEK,MAAMC,sBAAsB,GAAAJ,OAAA,CAAAI,sBAAA,GAAG,IAAAH,UAAG,EAAC,CACxC,6BAA6B,EAC7B,sCAAsC,EACtC,8CAA8C,EAC9C,SAAS;AACT;AACA,gBAAgB,EAChB,+CAA+C,EAC/C,0CAA0C,EAC1C,0CAA0C,EAC1CI,qBAAQ,CAACC,MAAM,CAAC;EACdC,GAAG,EAAE,CACHC,4BAAiB,EACjB,OAAO;EACP;EACA,oEAAoE;EACpE;EACA,4FAA4F,EAC5F,0EAA0E,EAC1E,0EAA0E;EAC1E;EACA;EACA,uEAAuE,EACvE,2GAA2G,EAC3G,sFAAsF,EACtF,0GAA0G;EAC1G;EACA,4CAA4C,EAC5C,kIAAkI;EAClI;EACA;EACA;EACA,mEAAmE,EACnE,kEAAkE,EAClE,+DAA+D,EAC/D,4EAA4E,EAC5E,gGAAgG,EAChG,qFAAqF,EACrF,oFAAoF,EACpF,iFAAiF,EACjF,gGAAgG,EAChG,+FAA+F,EAC/F,iHAAiH,EACjH,gHAAgH,CACjH,CAACC,IAAI,CAAC,GAAG,CAAC;EACXC,OAAO,EAAE;EACP;EACA;EACA,+DAA+D,EAC/D,6DAA6D,EAC7D,oEAAoE,EACpE,kEAAkE,EAClE,+CAA+C,EAC/C,uEAAuE,EACvE,uEAAuE,EACvE,+EAA+E,CAChF,CAACD,IAAI,CAAC,GAAG;AACZ,CAAC,CAAC,CACH,CAAC;AAEK,MAAME,qBAAqB,GAAAX,OAAA,CAAAW,qBAAA,GAAG,IAAAV,UAAG,EAAC,CACvC,sCAAsC,EACtC,iBAAiB,EACjB,aAAa;AACb;AACA;AACA,WAAW,EACX,iCAAiC,EACjC,0BAA0B,EAC1B,8CAA8C,EAC9CI,qBAAQ,CAACC,MAAM,CAAC;EACdC,GAAG,EAAE,CACH,kDAAkD,EAClD,sEAAsE;EACtE;EACA,wFAAwF,EACxF,4GAA4G;EAC5G;EACA,6DAA6D,EAC7D,uFAAuF,EACvF,gGAAgG,EAChG,0HAA0H,CAC3H,CAACE,IAAI,CAAC,GAAG,CAAC;EACXC,OAAO,EAAE,CACP,mEAAmE,EACnE,2EAA2E;EAC3E;EACA;EACA,0CAA0C,EAC1C,yDAAyD,EACzD,uEAAuE,CACxE,CAACD,IAAI,CAAC,GAAG;AACZ,CAAC,CAAC,CACH,CAAC;AAEK,MAAMG,kBAAkB,GAAAZ,OAAA,CAAAY,kBAAA,GAAG,IAAAX,UAAG,EAAC,CACpC,SAAS,EACT,sBAAsB,EACtB,4CAA4C,EAC5C,qCAAqC,CACtC,CAAC;AAEK,MAAMY,kBAAkB,GAAAb,OAAA,CAAAa,kBAAA,GAAG,IAAAZ,UAAG,EAAC,EAAE,EAAE;EACxCa,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,MAAM,EAAE,OAAO;MACfC,GAAG,EAAE;IACP;EACF,CAAC;EACDC,eAAe,EAAE;IAAEH,SAAS,EAAE;EAAS;AACzC,CAAC,CAAC","ignoreList":[]}
|
|
@@ -9,10 +9,10 @@ var _utils = require("@cdx-ui/utils");
|
|
|
9
9
|
// NATIVE — Uniwind className bindings for RN Switch
|
|
10
10
|
// =============================================================================
|
|
11
11
|
|
|
12
|
-
const switchThumbColorVariants = exports.switchThumbColorVariants = (0, _utils.cva)(['accent-
|
|
12
|
+
const switchThumbColorVariants = exports.switchThumbColorVariants = (0, _utils.cva)(['accent-surface-primary'], {
|
|
13
13
|
variants: {
|
|
14
14
|
isDisabled: {
|
|
15
|
-
true: 'accent-
|
|
15
|
+
true: 'accent-surface-neutral-subtle',
|
|
16
16
|
false: ''
|
|
17
17
|
}
|
|
18
18
|
},
|
|
@@ -20,10 +20,10 @@ const switchThumbColorVariants = exports.switchThumbColorVariants = (0, _utils.c
|
|
|
20
20
|
isDisabled: false
|
|
21
21
|
}
|
|
22
22
|
});
|
|
23
|
-
const switchTrackOnVariants = exports.switchTrackOnVariants = (0, _utils.cva)(['accent-
|
|
23
|
+
const switchTrackOnVariants = exports.switchTrackOnVariants = (0, _utils.cva)(['accent-surface-action-strong'], {
|
|
24
24
|
variants: {
|
|
25
25
|
isInvalid: {
|
|
26
|
-
true: 'accent-
|
|
26
|
+
true: 'accent-surface-danger-strong',
|
|
27
27
|
false: ''
|
|
28
28
|
}
|
|
29
29
|
},
|
|
@@ -31,10 +31,10 @@ const switchTrackOnVariants = exports.switchTrackOnVariants = (0, _utils.cva)(['
|
|
|
31
31
|
isInvalid: false
|
|
32
32
|
}
|
|
33
33
|
});
|
|
34
|
-
const switchTrackOffVariants = exports.switchTrackOffVariants = (0, _utils.cva)(['accent-
|
|
34
|
+
const switchTrackOffVariants = exports.switchTrackOffVariants = (0, _utils.cva)(['accent-surface-neutral-subtle'], {
|
|
35
35
|
variants: {
|
|
36
36
|
isInvalid: {
|
|
37
|
-
true: 'accent-
|
|
37
|
+
true: 'accent-surface-danger-subtle',
|
|
38
38
|
false: ''
|
|
39
39
|
}
|
|
40
40
|
},
|
|
@@ -42,10 +42,10 @@ const switchTrackOffVariants = exports.switchTrackOffVariants = (0, _utils.cva)(
|
|
|
42
42
|
isInvalid: false
|
|
43
43
|
}
|
|
44
44
|
});
|
|
45
|
-
const switchIosBgVariants = exports.switchIosBgVariants = (0, _utils.cva)(['accent-
|
|
45
|
+
const switchIosBgVariants = exports.switchIosBgVariants = (0, _utils.cva)(['accent-surface-neutral-subtle'], {
|
|
46
46
|
variants: {
|
|
47
47
|
isInvalid: {
|
|
48
|
-
true: 'accent-
|
|
48
|
+
true: 'accent-surface-danger-subtle',
|
|
49
49
|
false: ''
|
|
50
50
|
}
|
|
51
51
|
},
|
|
@@ -58,7 +58,7 @@ const switchIosBgVariants = exports.switchIosBgVariants = (0, _utils.cva)(['acce
|
|
|
58
58
|
// WEB — Tailwind classes for custom Pressable toggle
|
|
59
59
|
// =============================================================================
|
|
60
60
|
|
|
61
|
-
const switchTrackVariants = exports.switchTrackVariants = (0, _utils.cva)(['flex-row items-center rounded-full cursor-pointer', 'transition-colors duration-200', 'data-[disabled=true]:opacity-50 data-[disabled=true]:cursor-not-allowed', 'web:data-[focus-visible=true]:ring-3 web:data-[focus-visible=true]:ring-
|
|
61
|
+
const switchTrackVariants = exports.switchTrackVariants = (0, _utils.cva)(['flex-row items-center rounded-full cursor-pointer', 'transition-colors duration-200', 'data-[disabled=true]:opacity-50 data-[disabled=true]:cursor-not-allowed', 'web:data-[focus-visible=true]:ring-3 web:data-[focus-visible=true]:ring-stroke-focus/50', 'web:data-[invalid=true]:data-[focus-visible=true]:ring-stroke-danger/50'], {
|
|
62
62
|
variants: {
|
|
63
63
|
size: {
|
|
64
64
|
sm: 'w-9 h-5 p-0.5',
|
|
@@ -73,8 +73,8 @@ const switchTrackVariants = exports.switchTrackVariants = (0, _utils.cva)(['flex
|
|
|
73
73
|
const switchWebTrackColorVariants = exports.switchWebTrackColorVariants = (0, _utils.cva)([], {
|
|
74
74
|
variants: {
|
|
75
75
|
isChecked: {
|
|
76
|
-
true: 'bg-
|
|
77
|
-
false: 'bg-
|
|
76
|
+
true: 'bg-surface-action-strong data-[hover=true]:bg-surface-action-strong-hover',
|
|
77
|
+
false: 'bg-surface-neutral-subtle data-[hover=true]:bg-surface-neutral-subtle-hover'
|
|
78
78
|
},
|
|
79
79
|
isInvalid: {
|
|
80
80
|
true: '',
|
|
@@ -84,18 +84,18 @@ const switchWebTrackColorVariants = exports.switchWebTrackColorVariants = (0, _u
|
|
|
84
84
|
compoundVariants: [{
|
|
85
85
|
isChecked: true,
|
|
86
86
|
isInvalid: true,
|
|
87
|
-
className: 'bg-
|
|
87
|
+
className: 'bg-surface-danger-strong data-[hover=true]:bg-surface-danger-strong-hover'
|
|
88
88
|
}, {
|
|
89
89
|
isChecked: false,
|
|
90
90
|
isInvalid: true,
|
|
91
|
-
className: 'bg-
|
|
91
|
+
className: 'bg-surface-danger-subtle data-[hover=true]:bg-surface-danger-subtle-hover'
|
|
92
92
|
}],
|
|
93
93
|
defaultVariants: {
|
|
94
94
|
isChecked: false,
|
|
95
95
|
isInvalid: false
|
|
96
96
|
}
|
|
97
97
|
});
|
|
98
|
-
const switchThumbVariants = exports.switchThumbVariants = (0, _utils.cva)(['rounded-full bg-
|
|
98
|
+
const switchThumbVariants = exports.switchThumbVariants = (0, _utils.cva)(['rounded-full bg-surface-primary shadow-sm', 'transition-transform duration-200'], {
|
|
99
99
|
variants: {
|
|
100
100
|
size: {
|
|
101
101
|
sm: 'w-4 h-4',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_utils","require","switchThumbColorVariants","exports","cva","variants","isDisabled","true","false","defaultVariants","switchTrackOnVariants","isInvalid","switchTrackOffVariants","switchIosBgVariants","switchTrackVariants","size","sm","md","lg","switchWebTrackColorVariants","isChecked","compoundVariants","className","switchThumbVariants"],"sourceRoot":"../../../../src","sources":["components/Switch/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA;AACA;AACA;;AAEO,MAAMC,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,IAAAE,UAAG,EAAC,CAAC,
|
|
1
|
+
{"version":3,"names":["_utils","require","switchThumbColorVariants","exports","cva","variants","isDisabled","true","false","defaultVariants","switchTrackOnVariants","isInvalid","switchTrackOffVariants","switchIosBgVariants","switchTrackVariants","size","sm","md","lg","switchWebTrackColorVariants","isChecked","compoundVariants","className","switchThumbVariants"],"sourceRoot":"../../../../src","sources":["components/Switch/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA;AACA;AACA;;AAEO,MAAMC,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,IAAAE,UAAG,EAAC,CAAC,wBAAwB,CAAC,EAAE;EACtEC,QAAQ,EAAE;IACRC,UAAU,EAAE;MACVC,IAAI,EAAE,+BAA+B;MACrCC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IAAEH,UAAU,EAAE;EAAM;AACvC,CAAC,CAAC;AAEK,MAAMI,qBAAqB,GAAAP,OAAA,CAAAO,qBAAA,GAAG,IAAAN,UAAG,EAAC,CAAC,8BAA8B,CAAC,EAAE;EACzEC,QAAQ,EAAE;IACRM,SAAS,EAAE;MACTJ,IAAI,EAAE,8BAA8B;MACpCC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IAAEE,SAAS,EAAE;EAAM;AACtC,CAAC,CAAC;AAEK,MAAMC,sBAAsB,GAAAT,OAAA,CAAAS,sBAAA,GAAG,IAAAR,UAAG,EAAC,CAAC,+BAA+B,CAAC,EAAE;EAC3EC,QAAQ,EAAE;IACRM,SAAS,EAAE;MACTJ,IAAI,EAAE,8BAA8B;MACpCC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IAAEE,SAAS,EAAE;EAAM;AACtC,CAAC,CAAC;AAEK,MAAME,mBAAmB,GAAAV,OAAA,CAAAU,mBAAA,GAAG,IAAAT,UAAG,EAAC,CAAC,+BAA+B,CAAC,EAAE;EACxEC,QAAQ,EAAE;IACRM,SAAS,EAAE;MACTJ,IAAI,EAAE,8BAA8B;MACpCC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IAAEE,SAAS,EAAE;EAAM;AACtC,CAAC,CAAC;;AAEF;AACA;AACA;;AAEO,MAAMG,mBAAmB,GAAAX,OAAA,CAAAW,mBAAA,GAAG,IAAAV,UAAG,EACpC,CACE,mDAAmD,EACnD,gCAAgC,EAChC,yEAAyE,EACzE,yFAAyF,EACzF,yEAAyE,CAC1E,EACD;EACEC,QAAQ,EAAE;IACRU,IAAI,EAAE;MACJC,EAAE,EAAE,eAAe;MACnBC,EAAE,EAAE,gBAAgB;MACpBC,EAAE,EAAE;IACN;EACF,CAAC;EACDT,eAAe,EAAE;IACfM,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMI,2BAA2B,GAAAhB,OAAA,CAAAgB,2BAAA,GAAG,IAAAf,UAAG,EAAC,EAAE,EAAE;EACjDC,QAAQ,EAAE;IACRe,SAAS,EAAE;MACTb,IAAI,EAAE,2EAA2E;MACjFC,KAAK,EAAE;IACT,CAAC;IACDG,SAAS,EAAE;MACTJ,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE;IACT;EACF,CAAC;EACDa,gBAAgB,EAAE,CAChB;IACED,SAAS,EAAE,IAAI;IACfT,SAAS,EAAE,IAAI;IACfW,SAAS,EAAE;EACb,CAAC,EACD;IACEF,SAAS,EAAE,KAAK;IAChBT,SAAS,EAAE,IAAI;IACfW,SAAS,EAAE;EACb,CAAC,CACF;EACDb,eAAe,EAAE;IACfW,SAAS,EAAE,KAAK;IAChBT,SAAS,EAAE;EACb;AACF,CAAC,CAAC;AAEK,MAAMY,mBAAmB,GAAApB,OAAA,CAAAoB,mBAAA,GAAG,IAAAnB,UAAG,EACpC,CAAC,2CAA2C,EAAE,mCAAmC,CAAC,EAClF;EACEC,QAAQ,EAAE;IACRU,IAAI,EAAE;MACJC,EAAE,EAAE,SAAS;MACbC,EAAE,EAAE,SAAS;MACbC,EAAE,EAAE;IACN,CAAC;IACDE,SAAS,EAAE;MACTb,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE;IACT;EACF,CAAC;EACDa,gBAAgB,EAAE,CAChB;IAAEN,IAAI,EAAE,IAAI;IAAEK,SAAS,EAAE,IAAI;IAAEE,SAAS,EAAE;EAAgB,CAAC,EAC3D;IAAEP,IAAI,EAAE,IAAI;IAAEK,SAAS,EAAE,IAAI;IAAEE,SAAS,EAAE;EAAgB,CAAC,EAC3D;IAAEP,IAAI,EAAE,IAAI;IAAEK,SAAS,EAAE,IAAI;IAAEE,SAAS,EAAE;EAAgB,CAAC,CAC5D;EACDb,eAAe,EAAE;IACfM,IAAI,EAAE,IAAI;IACVK,SAAS,EAAE;EACb;AACF,CACF,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _figma = _interopRequireDefault(require("figma"));
|
|
8
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=5531-6635
|
|
10
|
+
// source=packages/components/src/components/Field/index.tsx
|
|
11
|
+
// component=Field
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
const showLabel = instance.getBoolean('Show Label?');
|
|
15
|
+
const showHelperText = instance.getBoolean('Show Helper Text?');
|
|
16
|
+
const showErrorText = instance.getBoolean('Show Error Text?');
|
|
17
|
+
|
|
18
|
+
// Enum-as-boolean: isInvalid / isDisabled are VARIANT properties in Figma (string values "true"/"false").
|
|
19
|
+
// Map "false" to undefined so renderProp omits them from the snippet.
|
|
20
|
+
// isFocused is a runtime interaction state and is intentionally omitted.
|
|
21
|
+
const isInvalid = instance.getEnum('isInvalid', {
|
|
22
|
+
true: true,
|
|
23
|
+
false: undefined
|
|
24
|
+
});
|
|
25
|
+
const isDisabled = instance.getEnum('isDisabled', {
|
|
26
|
+
true: true,
|
|
27
|
+
false: undefined
|
|
28
|
+
});
|
|
29
|
+
const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);
|
|
30
|
+
const isDisabledProp = _figma.default.helpers.react.renderProp('isDisabled', isDisabled);
|
|
31
|
+
const labelText = instance.findText('{label}', {
|
|
32
|
+
traverseInstances: true
|
|
33
|
+
}).textContent;
|
|
34
|
+
const helperText = instance.findText('{HelperText}', {
|
|
35
|
+
traverseInstances: true
|
|
36
|
+
}).textContent;
|
|
37
|
+
const errorText = instance.findText('{ErrorText}', {
|
|
38
|
+
traverseInstances: true
|
|
39
|
+
}).textContent;
|
|
40
|
+
const radioGroup = instance.findInstance('Radio.Group');
|
|
41
|
+
let radioGroupSnippet;
|
|
42
|
+
if (radioGroup?.type === 'INSTANCE') {
|
|
43
|
+
radioGroupSnippet = radioGroup.executeTemplate().example;
|
|
44
|
+
}
|
|
45
|
+
var _default = exports.default = {
|
|
46
|
+
id: 'field-radio',
|
|
47
|
+
// Only import Field here; the nested Radio.Group template provides its own "import { Radio } …" line.
|
|
48
|
+
// Code Connect merges the two separate import statements from the same package automatically.
|
|
49
|
+
imports: ["import { Field } from '@cdx-ui/components'"],
|
|
50
|
+
example: _figma.default.code`
|
|
51
|
+
<Field${isInvalidProp}${isDisabledProp}>
|
|
52
|
+
${showLabel ? _figma.default.code`<Field.Label>${labelText}</Field.Label>` : null}
|
|
53
|
+
${radioGroupSnippet}
|
|
54
|
+
${!isInvalid && showHelperText ? _figma.default.code`<Field.Helper>${helperText}</Field.Helper>` : null}
|
|
55
|
+
${isInvalid && showErrorText ? _figma.default.code`<Field.Error>${errorText}</Field.Error>` : null}
|
|
56
|
+
</Field>`
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=Field.Radio.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","showLabel","getBoolean","showHelperText","showErrorText","isInvalid","getEnum","true","false","undefined","isDisabled","isInvalidProp","helpers","react","renderProp","isDisabledProp","labelText","findText","traverseInstances","textContent","helperText","errorText","radioGroup","findInstance","radioGroupSnippet","type","executeTemplate","example","_default","exports","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/Field.Radio.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;AAEvC,MAAMC,SAAS,GAAGH,QAAQ,CAACI,UAAU,CAAC,aAAa,CAAC;AACpD,MAAMC,cAAc,GAAGL,QAAQ,CAACI,UAAU,CAAC,mBAAmB,CAAC;AAC/D,MAAME,aAAa,GAAGN,QAAQ,CAACI,UAAU,CAAC,kBAAkB,CAAC;;AAE7D;AACA;AACA;AACA,MAAMG,SAAS,GAAGP,QAAQ,CAACQ,OAAO,CAAC,WAAW,EAAE;EAC9CC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGZ,QAAQ,CAACQ,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AAEF,MAAME,aAAa,GAAGZ,cAAK,CAACa,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAET,SAAS,CAAC;AAC5E,MAAMU,cAAc,GAAGhB,cAAK,CAACa,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEJ,UAAU,CAAC;AAE/E,MAAMM,SAAS,GACblB,QAAQ,CAACmB,QAAQ,CAAC,SAAS,EAAE;EAC3BC,iBAAiB,EAAE;AACrB,CAAC,CAAC,CACFC,WAAW;AACb,MAAMC,UAAU,GACdtB,QAAQ,CAACmB,QAAQ,CAAC,cAAc,EAAE;EAChCC,iBAAiB,EAAE;AACrB,CAAC,CAAC,CACFC,WAAW;AACb,MAAME,SAAS,GACbvB,QAAQ,CAACmB,QAAQ,CAAC,aAAa,EAAE;EAC/BC,iBAAiB,EAAE;AACrB,CAAC,CAAC,CACFC,WAAW;AAEb,MAAMG,UAAU,GAAGxB,QAAQ,CAACyB,YAAY,CAAC,aAAa,CAAC;AACvD,IAAIC,iBAA8D;AAClE,IAAIF,UAAU,EAAEG,IAAI,KAAK,UAAU,EAAE;EACnCD,iBAAiB,GAAGF,UAAU,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO;AAC1D;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GAEc;EACbiC,EAAE,EAAE,aAAa;EACjB;EACA;EACAC,OAAO,EAAE,CAAC,4CAA4C,CAAC;EACvDJ,OAAO,EAAE5B,cAAK,CAACiC,IAAI;AACrB,QAAQrB,aAAa,GAAGI,cAAc;AACtC,IAAId,SAAS,GAAGF,cAAK,CAACiC,IAAI,gBAAgBhB,SAAS,gBAAgB,GAAG,IAAI;AAC1E,IAAIQ,iBAAiB;AACrB,IAAI,CAACnB,SAAS,IAAIF,cAAc,GAAGJ,cAAK,CAACiC,IAAI,iBAAiBZ,UAAU,iBAAiB,GAAG,IAAI;AAChG,IAAIf,SAAS,IAAID,aAAa,GAAGL,cAAK,CAACiC,IAAI,gBAAgBX,SAAS,gBAAgB,GAAG,IAAI;AAC3F;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _figma = _interopRequireDefault(require("figma"));
|
|
8
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=5531-5344
|
|
10
|
+
// source=packages/components/src/components/Radio/index.tsx
|
|
11
|
+
// component=Radio.Group
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
const optionsSlot = instance.getSlot('options');
|
|
15
|
+
const optionsChildren = optionsSlot ? _figma.default.helpers.react.renderChildren(optionsSlot) : null;
|
|
16
|
+
var _default = exports.default = {
|
|
17
|
+
id: 'radio-group',
|
|
18
|
+
imports: ["import { Radio } from '@cdx-ui/components'"],
|
|
19
|
+
example: _figma.default.code`
|
|
20
|
+
<Radio.Group>
|
|
21
|
+
${optionsChildren}
|
|
22
|
+
</Radio.Group>`
|
|
23
|
+
};
|
|
24
|
+
//# sourceMappingURL=Radio.Group.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","optionsSlot","getSlot","optionsChildren","helpers","react","renderChildren","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Radio.Group.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;AAEvC,MAAMC,WAAW,GAAGH,QAAQ,CAACI,OAAO,CAAC,SAAS,CAAC;AAC/C,MAAMC,eAAe,GAAGF,WAAW,GAAGF,cAAK,CAACK,OAAO,CAACC,KAAK,CAACC,cAAc,CAACL,WAAW,CAAC,GAAG,IAAI;AAAC,IAAAM,QAAA,GAAAC,OAAA,CAAAX,OAAA,GAE9E;EACbY,EAAE,EAAE,aAAa;EACjBC,OAAO,EAAE,CAAC,4CAA4C,CAAC;EACvDC,OAAO,EAAEZ,cAAK,CAACa,IAAI;AACrB;AACA,IAAIT,eAAe;AACnB;AACA,CAAC","ignoreList":[]}
|
|
@@ -12,28 +12,34 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
|
|
|
12
12
|
|
|
13
13
|
const instance = _figma.default.selectedInstance;
|
|
14
14
|
|
|
15
|
-
// Enum-as-boolean: isDisabled and
|
|
16
|
-
//
|
|
15
|
+
// Enum-as-boolean: isDisabled, isInvalid, and isReadOnly are VARIANT properties in Figma (string values "true"/"false").
|
|
16
|
+
// Map "false" to undefined so renderProp omits them from the snippet.
|
|
17
|
+
// isChecked, isHovered, and isFocused are runtime/visual states and are intentionally omitted.
|
|
17
18
|
const isDisabled = instance.getEnum('isDisabled', {
|
|
18
19
|
true: true,
|
|
19
|
-
false:
|
|
20
|
+
false: undefined
|
|
20
21
|
});
|
|
21
22
|
const isInvalid = instance.getEnum('isInvalid', {
|
|
22
23
|
true: true,
|
|
23
|
-
false:
|
|
24
|
+
false: undefined
|
|
25
|
+
});
|
|
26
|
+
const isReadOnly = instance.getEnum('isReadOnly', {
|
|
27
|
+
true: true,
|
|
28
|
+
false: undefined
|
|
24
29
|
});
|
|
25
30
|
const isDisabledProp = _figma.default.helpers.react.renderProp('isDisabled', isDisabled);
|
|
26
31
|
const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);
|
|
32
|
+
const isReadOnlyProp = _figma.default.helpers.react.renderProp('isReadOnly', isReadOnly);
|
|
27
33
|
const showLabel = instance.getEnum('Show Label?', {
|
|
28
34
|
true: true,
|
|
29
35
|
false: false
|
|
30
36
|
});
|
|
31
|
-
const labelText = instance.findText('Label').textContent;
|
|
37
|
+
const labelText = instance.findText('Radio.Label').textContent;
|
|
32
38
|
var _default = exports.default = {
|
|
33
39
|
id: 'radio',
|
|
34
40
|
imports: ["import { Radio } from '@cdx-ui/components'"],
|
|
35
41
|
example: _figma.default.code`
|
|
36
|
-
<Radio value="option"${isDisabledProp}${isInvalidProp}>
|
|
42
|
+
<Radio value="option"${isDisabledProp}${isInvalidProp}${isReadOnlyProp}>
|
|
37
43
|
${showLabel ? _figma.default.code`<Radio.Label>${labelText}</Radio.Label>` : null}
|
|
38
44
|
</Radio>`
|
|
39
45
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","isDisabled","getEnum","true","false","isInvalid","isDisabledProp","helpers","react","renderProp","isInvalidProp","showLabel","labelText","findText","textContent","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Radio.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA;AACA,MAAMC,UAAU,GAAGH,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","isDisabled","getEnum","true","false","undefined","isInvalid","isReadOnly","isDisabledProp","helpers","react","renderProp","isInvalidProp","isReadOnlyProp","showLabel","labelText","findText","textContent","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Radio.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA;AACA;AACA,MAAMC,UAAU,GAAGH,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,SAAS,GAAGR,QAAQ,CAACI,OAAO,CAAC,WAAW,EAAE;EAC9CC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGT,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMG,cAAc,GAAGT,cAAK,CAACU,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEV,UAAU,CAAC;AAC/E,MAAMW,aAAa,GAAGb,cAAK,CAACU,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEL,SAAS,CAAC;AAC5E,MAAMO,cAAc,GAAGd,cAAK,CAACU,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEJ,UAAU,CAAC;AAE/E,MAAMO,SAAS,GAAGhB,QAAQ,CAACI,OAAO,CAAC,aAAa,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAE;AACT,CAAC,CAAC;AAEF,MAAMW,SAAS,GAAIjB,QAAQ,CAACkB,QAAQ,CAAC,aAAa,CAAC,CAAgCC,WAAW;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAtB,OAAA,GAEhF;EACbuB,EAAE,EAAE,OAAO;EACXC,OAAO,EAAE,CAAC,4CAA4C,CAAC;EACvDC,OAAO,EAAEvB,cAAK,CAACwB,IAAI;AACrB,uBAAuBf,cAAc,GAAGI,aAAa,GAAGC,cAAc;AACtE,IAAIC,SAAS,GAAGf,cAAK,CAACwB,IAAI,gBAAgBR,SAAS,gBAAgB,GAAG,IAAI;AAC1E;AACA,CAAC","ignoreList":[]}
|
|
@@ -62,7 +62,7 @@ const RadioIndicator = /*#__PURE__*/forwardRef(({
|
|
|
62
62
|
isFocusVisible
|
|
63
63
|
} = useRadioContext();
|
|
64
64
|
const checkState = isChecked ? 'checked' : 'unchecked';
|
|
65
|
-
const fieldState = INDICATOR_STATES[`${checkState}:${isInvalid ? 'true' : 'false'}:${isPressed ? 'true' : 'false'}`];
|
|
65
|
+
const fieldState = isReadOnly ? `readonly-${checkState}${isInvalid ? '-invalid' : ''}` : INDICATOR_STATES[`${checkState}:${isInvalid ? 'true' : 'false'}:${isPressed ? 'true' : 'false'}`];
|
|
66
66
|
const computedClassName = cn(radioIndicatorVariants(), className);
|
|
67
67
|
const Comp = asChild ? Slot : View;
|
|
68
68
|
return /*#__PURE__*/_jsxs(Comp, {
|
|
@@ -82,11 +82,16 @@ const RadioIndicator = /*#__PURE__*/forwardRef(({
|
|
|
82
82
|
fieldState
|
|
83
83
|
})),
|
|
84
84
|
children: [/*#__PURE__*/_jsx(View, {
|
|
85
|
-
|
|
85
|
+
collapsable: false,
|
|
86
|
+
className: cn(radioInnerDotVariants(),
|
|
87
|
+
// Native: unconditional bg so Uniwind does not have to win a data-attribute
|
|
88
|
+
// background over `bg-surface-action-strong` (web keeps compound selectors).
|
|
89
|
+
isReadOnly && isChecked && !isInvalid && 'bg-content-primary'),
|
|
86
90
|
...dataAttributes({
|
|
87
91
|
checked: isChecked,
|
|
88
92
|
invalid: isInvalid,
|
|
89
93
|
hover: isHovered,
|
|
94
|
+
readonly: isReadOnly,
|
|
90
95
|
fieldState
|
|
91
96
|
})
|
|
92
97
|
}), children]
|
|
@@ -105,6 +110,10 @@ const RadioLabel = /*#__PURE__*/forwardRef(({
|
|
|
105
110
|
style,
|
|
106
111
|
...props
|
|
107
112
|
}, ref) => {
|
|
113
|
+
const {
|
|
114
|
+
isDisabled,
|
|
115
|
+
isReadOnly
|
|
116
|
+
} = useRadioContext();
|
|
108
117
|
const computedClassName = cn(radioLabelVariants(), className);
|
|
109
118
|
const Comp = asChild ? Slot : Text;
|
|
110
119
|
return /*#__PURE__*/_jsx(Comp, {
|
|
@@ -113,7 +122,9 @@ const RadioLabel = /*#__PURE__*/forwardRef(({
|
|
|
113
122
|
style: style,
|
|
114
123
|
...props,
|
|
115
124
|
...mergeDataAttributes(props, dataAttributes({
|
|
116
|
-
slot: 'radio-label'
|
|
125
|
+
slot: 'radio-label',
|
|
126
|
+
disabled: isDisabled,
|
|
127
|
+
readonly: isReadOnly
|
|
117
128
|
})),
|
|
118
129
|
children: children
|
|
119
130
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["forwardRef","Text","View","RadioRoot","RadioRootPrimitive","RadioGroup","RadioGroupPrimitive","Slot","dataAttributes","mergeDataAttributes","useRadioContext","cn","radioGroupVariants","radioIndicatorVariants","radioInnerDotVariants","radioLabelVariants","radioRootVariants","jsx","_jsx","jsxs","_jsxs","className","children","style","props","ref","computedClassName","slot","RadioIndicator","displayName","INDICATOR_STATES","asChild","isChecked","isDisabled","isHovered","isInvalid","isReadOnly","isPressed","isFocusVisible","checkState","fieldState","Comp","hover","checked","disabled","focusVisible","invalid","readonly","active","RadioLabel","direction","value","defaultValue","onChange","isRequired","name","viewProps","Radio","Object","assign","Indicator","Label","Group"],"sourceRoot":"../../../../src","sources":["components/Radio/index.tsx"],"mappings":";;AAAA,SAASA,UAAU,QAAwB,OAAO;AAClD,SAASC,IAAI,EAAkBC,IAAI,QAAwB,cAAc;AACzE,SACEC,SAAS,IAAIC,kBAAkB,EAC/BC,UAAU,IAAIC,mBAAmB,EACjCC,IAAI,EACJC,cAAc,EACdC,mBAAmB,EACnBC,eAAe,QAEV,oBAAoB;AAC3B,SAASC,EAAE,QAAQ,eAAe;AAClC,SACEC,kBAAkB,EAClBC,sBAAsB,EACtBC,qBAAqB,EACrBC,kBAAkB,EAClBC,iBAAiB,QACZ,UAAU;;AAEjB;AACA;AACA;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAOA,MAAMjB,SAAS,gBAAGH,UAAU,CAAmB,CAAC;EAAEqB,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAChG,MAAMC,iBAAiB,GAAGf,EAAE,CAACK,iBAAiB,CAAC,CAAC,EAAEK,SAAS,CAAC;EAE5D,oBACED,KAAA,CAAChB,kBAAkB;IACjBqB,GAAG,EAAEA,GAAI;IACTJ,SAAS,EAAEK,iBAAkB;IAC7BH,KAAK,EAAEA,KAAM;IAAA,GACTC,KAAK;IAAA,GACLf,mBAAmB,CAACe,KAAK,EAAEhB,cAAc,CAAC;MAAEmB,IAAI,EAAE;IAAQ,CAAC,CAAC,CAAC;IAAAL,QAAA,gBAEjEJ,IAAA,CAACU,cAAc,IAAE,CAAC,EACjBN,QAAQ;EAAA,CACS,CAAC;AAEzB,CAAC,CAAC;AAEFnB,SAAS,CAAC0B,WAAW,GAAG,OAAO;;AAE/B;AACA;AACA;;AAEA;AACA,MAAMC,gBAAgB,GAAG;EACvB,uBAAuB,EAAE,MAAM;EAC/B,sBAAsB,EAAE,SAAS;EACjC,sBAAsB,EAAE,QAAQ;EAChC,qBAAqB,EAAE,gBAAgB;EACvC,qBAAqB,EAAE,SAAS;EAChC,oBAAoB,EAAE,iBAAiB;EACvC,oBAAoB,EAAE,gBAAgB;EACtC,mBAAmB,EAAE;AACvB,CAAU;AAQV,MAAMF,cAAc,gBAAG5B,UAAU,CAC/B,CAAC;EAAE+B,OAAO;EAAEV,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC1D,MAAM;IAAEO,SAAS;IAAEC,UAAU;IAAEC,SAAS;IAAEC,SAAS;IAAEC,UAAU;IAAEC,SAAS;IAAEC;EAAe,CAAC,GAC1F5B,eAAe,CAAC,CAAC;EAEnB,MAAM6B,UAAU,GAAGP,SAAS,GAAG,SAAS,GAAG,WAAW;EACtD,MAAMQ,UAAU,
|
|
1
|
+
{"version":3,"names":["forwardRef","Text","View","RadioRoot","RadioRootPrimitive","RadioGroup","RadioGroupPrimitive","Slot","dataAttributes","mergeDataAttributes","useRadioContext","cn","radioGroupVariants","radioIndicatorVariants","radioInnerDotVariants","radioLabelVariants","radioRootVariants","jsx","_jsx","jsxs","_jsxs","className","children","style","props","ref","computedClassName","slot","RadioIndicator","displayName","INDICATOR_STATES","asChild","isChecked","isDisabled","isHovered","isInvalid","isReadOnly","isPressed","isFocusVisible","checkState","fieldState","Comp","hover","checked","disabled","focusVisible","invalid","readonly","active","collapsable","RadioLabel","direction","value","defaultValue","onChange","isRequired","name","viewProps","Radio","Object","assign","Indicator","Label","Group"],"sourceRoot":"../../../../src","sources":["components/Radio/index.tsx"],"mappings":"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","ignoreList":[]}
|