@cdx-ui/components 0.0.1-beta.100 → 0.0.1-beta.102
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/lib/commonjs/components/Checkbox/index.js +19 -1
- package/lib/commonjs/components/Checkbox/index.js.map +1 -1
- package/lib/commonjs/components/Checkbox/styles.js +13 -11
- package/lib/commonjs/components/Checkbox/styles.js.map +1 -1
- package/lib/commonjs/components/InsuranceDisclosure/index.js +56 -0
- package/lib/commonjs/components/InsuranceDisclosure/index.js.map +1 -0
- package/lib/commonjs/components/InsuranceDisclosure/styles.js +11 -0
- package/lib/commonjs/components/InsuranceDisclosure/styles.js.map +1 -0
- package/lib/commonjs/components/Radio/index.js +17 -2
- package/lib/commonjs/components/Radio/index.js.map +1 -1
- package/lib/commonjs/components/Radio/styles.js +17 -5
- package/lib/commonjs/components/Radio/styles.js.map +1 -1
- package/lib/commonjs/components/index.js +12 -0
- package/lib/commonjs/components/index.js.map +1 -1
- package/lib/module/components/Checkbox/index.js +19 -1
- package/lib/module/components/Checkbox/index.js.map +1 -1
- package/lib/module/components/Checkbox/styles.js +13 -11
- package/lib/module/components/Checkbox/styles.js.map +1 -1
- package/lib/module/components/InsuranceDisclosure/index.js +52 -0
- package/lib/module/components/InsuranceDisclosure/index.js.map +1 -0
- package/lib/module/components/InsuranceDisclosure/styles.js +7 -0
- package/lib/module/components/InsuranceDisclosure/styles.js.map +1 -0
- package/lib/module/components/Radio/index.js +17 -2
- package/lib/module/components/Radio/index.js.map +1 -1
- package/lib/module/components/Radio/styles.js +17 -5
- package/lib/module/components/Radio/styles.js.map +1 -1
- package/lib/module/components/index.js +1 -0
- package/lib/module/components/index.js.map +1 -1
- package/lib/typescript/components/Checkbox/index.d.ts.map +1 -1
- package/lib/typescript/components/Checkbox/styles.d.ts.map +1 -1
- package/lib/typescript/components/InsuranceDisclosure/index.d.ts +10 -0
- package/lib/typescript/components/InsuranceDisclosure/index.d.ts.map +1 -0
- package/lib/typescript/components/InsuranceDisclosure/styles.d.ts +4 -0
- package/lib/typescript/components/InsuranceDisclosure/styles.d.ts.map +1 -0
- 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/index.d.ts +1 -0
- package/lib/typescript/components/index.d.ts.map +1 -1
- package/package.json +4 -4
- package/src/components/Checkbox/index.tsx +23 -0
- package/src/components/Checkbox/styles.ts +29 -20
- package/src/components/InsuranceDisclosure/index.tsx +59 -0
- package/src/components/InsuranceDisclosure/styles.ts +12 -0
- package/src/components/Radio/index.tsx +20 -0
- package/src/components/Radio/styles.ts +26 -3
- package/src/components/index.ts +1 -0
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { forwardRef } from 'react';
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
import { dataAttributes, mergeDataAttributes } from '@cdx-ui/primitives';
|
|
6
|
+
import { cn } from '@cdx-ui/utils';
|
|
7
|
+
import { Image as ForgeImage } from '../Image/Image';
|
|
8
|
+
import { HStack } from '../Stack/HStack';
|
|
9
|
+
import { Text } from '../Text';
|
|
10
|
+
import { insuranceDisclosureLogoVariants, insuranceDisclosureRootVariants, insuranceDisclosureTextVariants } from './styles';
|
|
11
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
|
+
export const InsuranceDisclosure = /*#__PURE__*/forwardRef(function InsuranceDisclosure({
|
|
13
|
+
logoSource,
|
|
14
|
+
logoAccessibilityLabel,
|
|
15
|
+
label,
|
|
16
|
+
className,
|
|
17
|
+
style,
|
|
18
|
+
...props
|
|
19
|
+
}, ref) {
|
|
20
|
+
return /*#__PURE__*/_jsxs(HStack, {
|
|
21
|
+
ref: ref,
|
|
22
|
+
space: "md",
|
|
23
|
+
className: cn(insuranceDisclosureRootVariants(), className),
|
|
24
|
+
style: style,
|
|
25
|
+
...props,
|
|
26
|
+
...mergeDataAttributes(props, dataAttributes({
|
|
27
|
+
slot: 'insurance-disclosure'
|
|
28
|
+
})),
|
|
29
|
+
children: [/*#__PURE__*/_jsx(ForgeImage, {
|
|
30
|
+
source: logoSource,
|
|
31
|
+
accessibilityLabel: logoAccessibilityLabel,
|
|
32
|
+
accessible: true,
|
|
33
|
+
resizeMode: "contain",
|
|
34
|
+
className: insuranceDisclosureLogoVariants(),
|
|
35
|
+
...mergeDataAttributes({}, dataAttributes({
|
|
36
|
+
slot: 'insurance-disclosure-logo'
|
|
37
|
+
}))
|
|
38
|
+
}), label ? /*#__PURE__*/_jsx(View, {
|
|
39
|
+
className: "min-w-0 shrink",
|
|
40
|
+
...mergeDataAttributes({}, dataAttributes({
|
|
41
|
+
slot: 'insurance-disclosure-content'
|
|
42
|
+
})),
|
|
43
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
44
|
+
size: "xs",
|
|
45
|
+
className: insuranceDisclosureTextVariants(),
|
|
46
|
+
children: label
|
|
47
|
+
})
|
|
48
|
+
}) : null]
|
|
49
|
+
});
|
|
50
|
+
});
|
|
51
|
+
InsuranceDisclosure.displayName = 'InsuranceDisclosure';
|
|
52
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["forwardRef","View","dataAttributes","mergeDataAttributes","cn","Image","ForgeImage","HStack","Text","insuranceDisclosureLogoVariants","insuranceDisclosureRootVariants","insuranceDisclosureTextVariants","jsx","_jsx","jsxs","_jsxs","InsuranceDisclosure","logoSource","logoAccessibilityLabel","label","className","style","props","ref","space","slot","children","source","accessibilityLabel","accessible","resizeMode","size","displayName"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/index.tsx"],"mappings":";;AAAA,SAASA,UAAU,QAA2B,OAAO;AACrD,SAASC,IAAI,QAAkC,cAAc;AAC7D,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,oBAAoB;AACxE,SAASC,EAAE,QAAQ,eAAe;AAClC,SAASC,KAAK,IAAIC,UAAU,QAAQ,gBAAgB;AACpD,SAASC,MAAM,QAA0B,iBAAiB;AAC1D,SAASC,IAAI,QAAQ,SAAS;AAC9B,SACEC,+BAA+B,EAC/BC,+BAA+B,EAC/BC,+BAA+B,QAC1B,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AASlB,OAAO,MAAMC,mBAAmB,gBAAGhB,UAAU,CAG3C,SAASgB,mBAAmBA,CAC5B;EAAEC,UAAU;EAAEC,sBAAsB;EAAEC,KAAK;EAAEC,SAAS;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EACzEC,GAAG,EACH;EACA,oBACER,KAAA,CAACR,MAAM;IACLgB,GAAG,EAAEA,GAAI;IACTC,KAAK,EAAC,IAAI;IACVJ,SAAS,EAAEhB,EAAE,CAACM,+BAA+B,CAAC,CAAC,EAAEU,SAAS,CAAE;IAC5DC,KAAK,EAAEA,KAAM;IAAA,GACTC,KAAK;IAAA,GACLnB,mBAAmB,CAACmB,KAAK,EAAEpB,cAAc,CAAC;MAAEuB,IAAI,EAAE;IAAuB,CAAC,CAAC,CAAC;IAAAC,QAAA,gBAEhFb,IAAA,CAACP,UAAU;MACTqB,MAAM,EAAEV,UAAW;MACnBW,kBAAkB,EAAEV,sBAAuB;MAC3CW,UAAU;MACVC,UAAU,EAAC,SAAS;MACpBV,SAAS,EAAEX,+BAA+B,CAAC,CAAE;MAAA,GACzCN,mBAAmB,CAAC,CAAC,CAAC,EAAED,cAAc,CAAC;QAAEuB,IAAI,EAAE;MAA4B,CAAC,CAAC;IAAC,CACnF,CAAC,EACDN,KAAK,gBACJN,IAAA,CAACZ,IAAI;MACHmB,SAAS,EAAC,gBAAgB;MAAA,GACtBjB,mBAAmB,CAAC,CAAC,CAAC,EAAED,cAAc,CAAC;QAAEuB,IAAI,EAAE;MAA+B,CAAC,CAAC,CAAC;MAAAC,QAAA,eAErFb,IAAA,CAACL,IAAI;QAACuB,IAAI,EAAC,IAAI;QAACX,SAAS,EAAET,+BAA+B,CAAC,CAAE;QAAAe,QAAA,EAC1DP;MAAK,CACF;IAAC,CACH,CAAC,GACL,IAAI;EAAA,CACF,CAAC;AAEb,CAAC,CAAC;AAEFH,mBAAmB,CAACgB,WAAW,GAAG,qBAAqB","ignoreList":[]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { cva } from 'class-variance-authority';
|
|
4
|
+
export const insuranceDisclosureRootVariants = cva(['w-full max-w-full items-center justify-start', 'border border-stroke-secondary', 'rounded-[var(--border-radius-default)]', 'p-4']);
|
|
5
|
+
export const insuranceDisclosureLogoVariants = cva(['h-[23px] w-[37px]']);
|
|
6
|
+
export const insuranceDisclosureTextVariants = cva(['shrink text-content-secondary']);
|
|
7
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["cva","insuranceDisclosureRootVariants","insuranceDisclosureLogoVariants","insuranceDisclosureTextVariants"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAAQ,0BAA0B;AAE9C,OAAO,MAAMC,+BAA+B,GAAGD,GAAG,CAAC,CACjD,8CAA8C,EAC9C,gCAAgC,EAChC,wCAAwC,EACxC,KAAK,CACN,CAAC;AAEF,OAAO,MAAME,+BAA+B,GAAGF,GAAG,CAAC,CAAC,mBAAmB,CAAC,CAAC;AAEzE,OAAO,MAAMG,+BAA+B,GAAGH,GAAG,CAAC,CAAC,+BAA+B,CAAC,CAAC","ignoreList":[]}
|
|
@@ -34,6 +34,17 @@ RadioRoot.displayName = 'Radio';
|
|
|
34
34
|
// RADIO INDICATOR (styled-only, reads context for data-* styling)
|
|
35
35
|
// =============================================================================
|
|
36
36
|
|
|
37
|
+
/** Compound checked × invalid × active state for native Uniwind selectors (single data-field-state). */
|
|
38
|
+
const INDICATOR_STATES = {
|
|
39
|
+
'unchecked:false:false': 'idle',
|
|
40
|
+
'unchecked:true:false': 'invalid',
|
|
41
|
+
'unchecked:false:true': 'active',
|
|
42
|
+
'unchecked:true:true': 'invalid-active',
|
|
43
|
+
'checked:false:false': 'checked',
|
|
44
|
+
'checked:true:false': 'checked-invalid',
|
|
45
|
+
'checked:false:true': 'checked-active',
|
|
46
|
+
'checked:true:true': 'checked-invalid-active'
|
|
47
|
+
};
|
|
37
48
|
const RadioIndicator = /*#__PURE__*/forwardRef(({
|
|
38
49
|
asChild,
|
|
39
50
|
className,
|
|
@@ -50,6 +61,8 @@ const RadioIndicator = /*#__PURE__*/forwardRef(({
|
|
|
50
61
|
isPressed,
|
|
51
62
|
isFocusVisible
|
|
52
63
|
} = useRadioContext();
|
|
64
|
+
const checkState = isChecked ? 'checked' : 'unchecked';
|
|
65
|
+
const fieldState = INDICATOR_STATES[`${checkState}:${isInvalid ? 'true' : 'false'}:${isPressed ? 'true' : 'false'}`];
|
|
53
66
|
const computedClassName = cn(radioIndicatorVariants(), className);
|
|
54
67
|
const Comp = asChild ? Slot : View;
|
|
55
68
|
return /*#__PURE__*/_jsxs(Comp, {
|
|
@@ -65,14 +78,16 @@ const RadioIndicator = /*#__PURE__*/forwardRef(({
|
|
|
65
78
|
focusVisible: isFocusVisible,
|
|
66
79
|
invalid: isInvalid,
|
|
67
80
|
readonly: isReadOnly,
|
|
68
|
-
active: isPressed
|
|
81
|
+
active: isPressed,
|
|
82
|
+
fieldState
|
|
69
83
|
})),
|
|
70
84
|
children: [/*#__PURE__*/_jsx(View, {
|
|
71
85
|
className: cn(radioInnerDotVariants()),
|
|
72
86
|
...dataAttributes({
|
|
73
87
|
checked: isChecked,
|
|
74
88
|
invalid: isInvalid,
|
|
75
|
-
hover: isHovered
|
|
89
|
+
hover: isHovered,
|
|
90
|
+
fieldState
|
|
76
91
|
})
|
|
77
92
|
}), children]
|
|
78
93
|
});
|
|
@@ -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","asChild","isChecked","isDisabled","isHovered","isInvalid","isReadOnly","isPressed","isFocusVisible","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;;
|
|
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":"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","ignoreList":[]}
|
|
@@ -4,13 +4,25 @@ import { Platform } from 'react-native';
|
|
|
4
4
|
import { cva } from 'class-variance-authority';
|
|
5
5
|
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/primitives';
|
|
6
6
|
export const radioRootVariants = cva(['flex-row items-center gap-2', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', DISABLED_CURSOR]);
|
|
7
|
-
export const radioIndicatorVariants = cva(['items-center justify-center', 'rounded-[var(--border-radius-round)]', 'border-[length:var(--border-width-selected)]', 'h-5 w-5', 'bg-surface-primary', 'data-[checked=false]:border-content-secondary', 'data-[checked=true]:border-stroke-action', 'data-[invalid=true]:border-stroke-danger',
|
|
8
|
-
web: [TRANSITION_COLORS, '
|
|
9
|
-
|
|
7
|
+
export const radioIndicatorVariants = cva(['items-center justify-center', 'rounded-[var(--border-radius-round)]', 'border-[length:var(--border-width-selected)]', 'h-5 w-5', 'bg-surface-primary', 'data-[checked=false]:border-content-secondary', 'data-[checked=true]:border-stroke-action', 'data-[invalid=true]:border-stroke-danger', Platform.select({
|
|
8
|
+
web: [TRANSITION_COLORS, 'group',
|
|
9
|
+
// Hover — unchecked (Figma: border unchanged, bg overlay at opacity/hover)
|
|
10
|
+
'data-[hover=true]:data-[checked=false]:bg-content-secondary/[0.08]',
|
|
11
|
+
// Hover — unchecked + invalid (overlay uses danger token)
|
|
12
|
+
'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',
|
|
13
|
+
// Active — CSS :active (web root does not track press via data-active).
|
|
14
|
+
// data-[hover=true] guard ensures active beats hover by specificity (0,3,0 > 0,2,0).
|
|
15
|
+
'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', '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'].join(' '),
|
|
16
|
+
default: [
|
|
17
|
+
// Native: Uniwind only evaluates the last data-[] condition in a compound chain.
|
|
18
|
+
// Use single-condition data-[field-state=...] selectors (emitted by RadioIndicator).
|
|
19
|
+
'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(' ')
|
|
10
20
|
})]);
|
|
11
21
|
export const radioInnerDotVariants = cva(['rounded-[var(--border-radius-round)]', 'h-2.5 w-2.5', 'scale-0', 'data-[checked=true]:scale-100', 'bg-surface-action-strong', 'data-[invalid=true]:bg-surface-danger-strong', Platform.select({
|
|
12
|
-
web: ['data-[hover=true]:bg-surface-action-strong-hover', 'data-[hover=true]:data-[invalid=true]:bg-surface-danger-strong-hover'
|
|
13
|
-
|
|
22
|
+
web: ['data-[hover=true]:bg-surface-action-strong-hover', 'data-[hover=true]:data-[invalid=true]:bg-surface-danger-strong-hover',
|
|
23
|
+
// Active via group-active on indicator (inner dot is not the :active target).
|
|
24
|
+
'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'].join(' '),
|
|
25
|
+
default: ['data-[field-state=checked-active]:bg-surface-action-strong-active', 'data-[field-state=checked-invalid-active]:bg-surface-danger-strong-active'].join(' ')
|
|
14
26
|
})]);
|
|
15
27
|
export const radioLabelVariants = cva(['body-md', 'text-content-primary']);
|
|
16
28
|
export const radioGroupVariants = cva([], {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Platform","cva","DISABLED_CURSOR","TRANSITION_COLORS","radioRootVariants","radioIndicatorVariants","select","web","join","default","radioInnerDotVariants","radioLabelVariants","radioGroupVariants","variants","direction","column","row","defaultVariants"],"sourceRoot":"../../../../src","sources":["components/Radio/styles.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;AACvC,SAASC,GAAG,QAAQ,0BAA0B;AAC9C,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,yBAAyB;AAE5E,OAAO,MAAMC,iBAAiB,GAAGH,GAAG,CAAC,CACnC,6BAA6B,EAC7B,wDAAwD,EACxDC,eAAe,CAChB,CAAC;AAEF,OAAO,MAAMG,sBAAsB,GAAGJ,GAAG,CAAC,CACxC,6BAA6B,EAC7B,sCAAsC,EACtC,8CAA8C,EAC9C,SAAS,EACT,oBAAoB,EACpB,+CAA+C,EAC/C,0CAA0C,EAC1C,0CAA0C,
|
|
1
|
+
{"version":3,"names":["Platform","cva","DISABLED_CURSOR","TRANSITION_COLORS","radioRootVariants","radioIndicatorVariants","select","web","join","default","radioInnerDotVariants","radioLabelVariants","radioGroupVariants","variants","direction","column","row","defaultVariants"],"sourceRoot":"../../../../src","sources":["components/Radio/styles.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;AACvC,SAASC,GAAG,QAAQ,0BAA0B;AAC9C,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,yBAAyB;AAE5E,OAAO,MAAMC,iBAAiB,GAAGH,GAAG,CAAC,CACnC,6BAA6B,EAC7B,wDAAwD,EACxDC,eAAe,CAChB,CAAC;AAEF,OAAO,MAAMG,sBAAsB,GAAGJ,GAAG,CAAC,CACxC,6BAA6B,EAC7B,sCAAsC,EACtC,8CAA8C,EAC9C,SAAS,EACT,oBAAoB,EACpB,+CAA+C,EAC/C,0CAA0C,EAC1C,0CAA0C,EAC1CD,QAAQ,CAACM,MAAM,CAAC;EACdC,GAAG,EAAE,CACHJ,iBAAiB,EACjB,OAAO;EACP;EACA,oEAAoE;EACpE;EACA,4FAA4F,EAC5F,0EAA0E,EAC1E,0EAA0E;EAC1E;EACA;EACA,uEAAuE,EACvE,2GAA2G,EAC3G,sFAAsF,EACtF,0GAA0G,EAC1G,4CAA4C,EAC5C,kIAAkI,CACnI,CAACK,IAAI,CAAC,GAAG,CAAC;EACXC,OAAO,EAAE;EACP;EACA;EACA,+CAA+C,EAC/C,uEAAuE,EACvE,uEAAuE,EACvE,+EAA+E,CAChF,CAACD,IAAI,CAAC,GAAG;AACZ,CAAC,CAAC,CACH,CAAC;AAEF,OAAO,MAAME,qBAAqB,GAAGT,GAAG,CAAC,CACvC,sCAAsC,EACtC,aAAa,EACb,SAAS,EACT,+BAA+B,EAC/B,0BAA0B,EAC1B,8CAA8C,EAC9CD,QAAQ,CAACM,MAAM,CAAC;EACdC,GAAG,EAAE,CACH,kDAAkD,EAClD,sEAAsE;EACtE;EACA,wFAAwF,EACxF,4GAA4G,CAC7G,CAACC,IAAI,CAAC,GAAG,CAAC;EACXC,OAAO,EAAE,CACP,mEAAmE,EACnE,2EAA2E,CAC5E,CAACD,IAAI,CAAC,GAAG;AACZ,CAAC,CAAC,CACH,CAAC;AAEF,OAAO,MAAMG,kBAAkB,GAAGV,GAAG,CAAC,CAAC,SAAS,EAAE,sBAAsB,CAAC,CAAC;AAE1E,OAAO,MAAMW,kBAAkB,GAAGX,GAAG,CAAC,EAAE,EAAE;EACxCY,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":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,iBAAiB;AAC/B,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,eAAe;AAC7B,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,SAASA,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,iBAAiB;AAC/B,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,uBAAuB;AACrC,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,eAAe;AAC7B,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,SAASA,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Checkbox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,EAOL,KAAK,cAAc,EACpB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAQ,SAAS,EAAE,MAAM,SAAS,CAAC;AAa1C,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,YAAY,gGAoBjB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Checkbox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,EAOL,KAAK,cAAc,EACpB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAQ,SAAS,EAAE,MAAM,SAAS,CAAC;AAa1C,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,YAAY,gGAoBjB,CAAC;AAwBF,MAAM,WAAW,sBAAuB,SAAQ,SAAS;IACvD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,iBAAiB,yGAkDtB,CAAC;AAQF,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;CAAG;AAEzE,QAAA,MAAM,YAAY;qCAAoC,iBAAiB;;CAWtE,CAAC;AAwBF,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,aAAa,qGAwBlB,CAAC;AAQF,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CAC9B;AAED,QAAA,MAAM,aAAa,qGAkClB,CAAC;AAQF,KAAK,yBAAyB,GAAG,OAAO,YAAY,GAAG;IACrD,SAAS,EAAE,OAAO,iBAAiB,CAAC;IACpC,IAAI,EAAE,OAAO,YAAY,CAAC;IAC1B,KAAK,EAAE,OAAO,aAAa,CAAC;IAC5B,KAAK,EAAE,OAAO,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAKf,yBAAyB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Checkbox/styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,oBAAoB,oFAM/B,CAAC;AAEH,eAAO,MAAM,yBAAyB,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Checkbox/styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,oBAAoB,oFAM/B,CAAC;AAEH,eAAO,MAAM,yBAAyB,oFA4EpC,CAAC;AAEH,eAAO,MAAM,oBAAoB,oFAAiC,CAAC;AAEnE,eAAO,MAAM,qBAAqB,oFAGhC,CAAC;AAEH,eAAO,MAAM,qBAAqB;;8EAUhC,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { View, type ImageSourcePropType } from 'react-native';
|
|
2
|
+
import { type HStackProps } from '../Stack/HStack';
|
|
3
|
+
export interface InsuranceDisclosureProps extends Omit<HStackProps, 'children'> {
|
|
4
|
+
logoSource: string | ImageSourcePropType;
|
|
5
|
+
logoAccessibilityLabel: string;
|
|
6
|
+
label?: string;
|
|
7
|
+
className?: string;
|
|
8
|
+
}
|
|
9
|
+
export declare const InsuranceDisclosure: import("react").ForwardRefExoticComponent<InsuranceDisclosureProps & import("react").RefAttributes<View>>;
|
|
10
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/InsuranceDisclosure/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAI9D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAQ3D,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IAC7E,UAAU,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACzC,sBAAsB,EAAE,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,mBAAmB,2GAoC9B,CAAC"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const insuranceDisclosureRootVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const insuranceDisclosureLogoVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
3
|
+
export declare const insuranceDisclosureTextVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
4
|
+
//# sourceMappingURL=styles.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/InsuranceDisclosure/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,+BAA+B,oFAK1C,CAAC;AAEH,eAAO,MAAM,+BAA+B,oFAA6B,CAAC;AAE1E,eAAO,MAAM,+BAA+B,oFAAyC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Radio/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC1E,OAAO,EAOL,KAAK,WAAW,EACjB,MAAM,oBAAoB,CAAC;AAc5B,MAAM,WAAW,UAAW,SAAQ,WAAW;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,SAAS,6FAeb,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Radio/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC1E,OAAO,EAOL,KAAK,WAAW,EACjB,MAAM,oBAAoB,CAAC;AAc5B,MAAM,WAAW,UAAW,SAAQ,WAAW;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,SAAS,6FAeb,CAAC;AAoBH,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,cAAc,sGAgDnB,CAAC;AAQF,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,UAAU,kGAiBf,CAAC;AAQF,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,QAAA,MAAM,UAAU,kGA0Cf,CAAC;AAQF,KAAK,sBAAsB,GAAG,OAAO,SAAS,GAAG;IAC/C,SAAS,EAAE,OAAO,cAAc,CAAC;IACjC,KAAK,EAAE,OAAO,UAAU,CAAC;IACzB,KAAK,EAAE,OAAO,UAAU,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,KAAK,EAIZ,sBAAsB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Radio/styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,oFAI5B,CAAC;AAEH,eAAO,MAAM,sBAAsB,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Radio/styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,oFAI5B,CAAC;AAEH,eAAO,MAAM,sBAAsB,oFAqCjC,CAAC;AAEH,eAAO,MAAM,qBAAqB,oFAoBhC,CAAC;AAEH,eAAO,MAAM,kBAAkB,oFAA2C,CAAC;AAE3E,eAAO,MAAM,kBAAkB;;8EAQ7B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,uBAAuB,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cdx-ui/components",
|
|
3
|
-
"version": "0.0.1-beta.
|
|
3
|
+
"version": "0.0.1-beta.102",
|
|
4
4
|
"main": "lib/commonjs/index.js",
|
|
5
5
|
"module": "lib/module/index.js",
|
|
6
6
|
"react-native": "src/index.ts",
|
|
@@ -67,9 +67,9 @@
|
|
|
67
67
|
"@gorhom/bottom-sheet": "^5.2.6",
|
|
68
68
|
"class-variance-authority": "^0.7.1",
|
|
69
69
|
"uniwind": "1.10.0",
|
|
70
|
-
"@cdx-ui/
|
|
71
|
-
"@cdx-ui/
|
|
72
|
-
"@cdx-ui/
|
|
70
|
+
"@cdx-ui/utils": "0.0.1-beta.102",
|
|
71
|
+
"@cdx-ui/icons": "0.0.1-beta.102",
|
|
72
|
+
"@cdx-ui/primitives": "0.0.1-beta.102"
|
|
73
73
|
},
|
|
74
74
|
"devDependencies": {
|
|
75
75
|
"@react-navigation/bottom-tabs": "*",
|
|
@@ -57,6 +57,22 @@ CheckboxRoot.displayName = 'Checkbox';
|
|
|
57
57
|
// CHECKBOX INDICATOR (styled-only, reads context for data-* styling)
|
|
58
58
|
// =============================================================================
|
|
59
59
|
|
|
60
|
+
/** Compound check × invalid × active state for native Uniwind selectors (single data-field-state). */
|
|
61
|
+
const INDICATOR_STATES = {
|
|
62
|
+
'unchecked:false:false': 'idle',
|
|
63
|
+
'unchecked:true:false': 'invalid',
|
|
64
|
+
'unchecked:false:true': 'active',
|
|
65
|
+
'unchecked:true:true': 'invalid-active',
|
|
66
|
+
'checked:false:false': 'checked',
|
|
67
|
+
'checked:true:false': 'checked-invalid',
|
|
68
|
+
'checked:false:true': 'checked-active',
|
|
69
|
+
'checked:true:true': 'checked-invalid-active',
|
|
70
|
+
'indeterminate:false:false': 'indeterminate',
|
|
71
|
+
'indeterminate:true:false': 'indeterminate-invalid',
|
|
72
|
+
'indeterminate:false:true': 'indeterminate-active',
|
|
73
|
+
'indeterminate:true:true': 'indeterminate-invalid-active',
|
|
74
|
+
} as const;
|
|
75
|
+
|
|
60
76
|
export interface CheckboxIndicatorProps extends ViewProps {
|
|
61
77
|
asChild?: boolean;
|
|
62
78
|
className?: string;
|
|
@@ -77,6 +93,12 @@ const CheckboxIndicator = forwardRef<View, CheckboxIndicatorProps>(
|
|
|
77
93
|
isFocusVisible,
|
|
78
94
|
} = useCheckboxContext();
|
|
79
95
|
|
|
96
|
+
const checkState = isIndeterminate ? 'indeterminate' : isChecked ? 'checked' : 'unchecked';
|
|
97
|
+
const fieldState =
|
|
98
|
+
INDICATOR_STATES[
|
|
99
|
+
`${checkState}:${isInvalid ? 'true' : 'false'}:${isPressed ? 'true' : 'false'}`
|
|
100
|
+
];
|
|
101
|
+
|
|
80
102
|
const computedClassName = cn(checkboxIndicatorVariants(), className);
|
|
81
103
|
const Comp = asChild ? Slot : View;
|
|
82
104
|
|
|
@@ -99,6 +121,7 @@ const CheckboxIndicator = forwardRef<View, CheckboxIndicatorProps>(
|
|
|
99
121
|
active: isPressed,
|
|
100
122
|
focused: isFocused,
|
|
101
123
|
indeterminate: isIndeterminate,
|
|
124
|
+
fieldState,
|
|
102
125
|
}),
|
|
103
126
|
)}
|
|
104
127
|
>
|
|
@@ -43,40 +43,49 @@ export const checkboxIndicatorVariants = cva([
|
|
|
43
43
|
'data-[hover=true]:data-[invalid=true]:data-[checked=false]:data-[indeterminate=false]:bg-surface-danger-strong/[0.08]',
|
|
44
44
|
// Hover — checked / indeterminate (bg + border darken together)
|
|
45
45
|
'data-[hover=true]:data-[checked=true]:bg-surface-action-strong-hover',
|
|
46
|
-
'data-[hover=true]:data-[checked=true]:border-
|
|
46
|
+
'data-[hover=true]:data-[checked=true]:border-surface-action-strong-hover',
|
|
47
47
|
'data-[hover=true]:data-[indeterminate=true]:bg-surface-action-strong-hover',
|
|
48
|
-
'data-[hover=true]:data-[indeterminate=true]:border-
|
|
48
|
+
'data-[hover=true]:data-[indeterminate=true]:border-surface-action-strong-hover',
|
|
49
49
|
'data-[hover=true]:data-[checked=true]:data-[invalid=true]:bg-surface-danger-strong-hover',
|
|
50
|
-
'data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-
|
|
50
|
+
'data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-surface-danger-strong-hover',
|
|
51
51
|
'data-[hover=true]:data-[indeterminate=true]:data-[invalid=true]:bg-surface-danger-strong-hover',
|
|
52
|
-
'data-[hover=true]:data-[indeterminate=true]:data-[invalid=true]:border-
|
|
52
|
+
'data-[hover=true]:data-[indeterminate=true]:data-[invalid=true]:border-surface-danger-strong-hover',
|
|
53
53
|
// Active — CSS :active pseudo-class (web root does not track press via data-active).
|
|
54
54
|
// data-[hover=true] guard ensures active beats hover by specificity (0,3,0 > 0,2,0).
|
|
55
|
+
// Unchecked — border only (Radio pattern)
|
|
56
|
+
'web:active:data-[hover=true]:data-[checked=false]:data-[indeterminate=false]:border-stroke-hover',
|
|
57
|
+
'web:active:data-[hover=true]:data-[invalid=true]:data-[checked=false]:data-[indeterminate=false]:border-surface-danger-strong-active',
|
|
55
58
|
'web:active:data-[hover=true]:data-[checked=true]:bg-surface-action-strong-active',
|
|
56
|
-
'web:active:data-[hover=true]:data-[checked=true]:border-
|
|
59
|
+
'web:active:data-[hover=true]:data-[checked=true]:border-surface-action-strong-active',
|
|
57
60
|
'web:active:data-[hover=true]:data-[indeterminate=true]:bg-surface-action-strong-active',
|
|
58
|
-
'web:active:data-[hover=true]:data-[indeterminate=true]:border-
|
|
61
|
+
'web:active:data-[hover=true]:data-[indeterminate=true]:border-surface-action-strong-active',
|
|
59
62
|
'web:active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:bg-surface-danger-strong-active',
|
|
60
|
-
'web:active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-
|
|
63
|
+
'web:active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-surface-danger-strong-active',
|
|
61
64
|
'web:active:data-[hover=true]:data-[indeterminate=true]:data-[invalid=true]:bg-surface-danger-strong-active',
|
|
62
|
-
'web:active:data-[hover=true]:data-[indeterminate=true]:data-[invalid=true]:border-
|
|
65
|
+
'web:active:data-[hover=true]:data-[indeterminate=true]:data-[invalid=true]:border-surface-danger-strong-active',
|
|
63
66
|
// Focus ring
|
|
64
67
|
'web:data-[focus-visible=true]:outline-none',
|
|
65
68
|
'web:data-[focus-visible=true]:ring-2 web:data-[focus-visible=true]:ring-stroke-focus web:data-[focus-visible=true]:ring-offset-2',
|
|
66
69
|
].join(' '),
|
|
67
70
|
default: [
|
|
68
|
-
//
|
|
69
|
-
//
|
|
70
|
-
//
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
//
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
'data-[checked
|
|
78
|
-
'data-[checked
|
|
79
|
-
'data-[indeterminate
|
|
71
|
+
// Native: Uniwind only evaluates the last data-[] condition in a compound chain.
|
|
72
|
+
// Use single-condition data-[field-state=...] selectors (emitted by CheckboxIndicator).
|
|
73
|
+
// checked/indeterminate + invalid → danger bg
|
|
74
|
+
'data-[field-state=checked-invalid]:bg-surface-danger-strong',
|
|
75
|
+
'data-[field-state=indeterminate-invalid]:bg-surface-danger-strong',
|
|
76
|
+
// unchecked + active → border only (Radio pattern)
|
|
77
|
+
'data-[field-state=active]:border-stroke-hover',
|
|
78
|
+
'data-[field-state=invalid-active]:border-surface-danger-strong-active',
|
|
79
|
+
// checked/indeterminate + active → action active bg + matching border
|
|
80
|
+
'data-[field-state=checked-active]:bg-surface-action-strong-active',
|
|
81
|
+
'data-[field-state=checked-active]:border-surface-action-strong-active',
|
|
82
|
+
'data-[field-state=indeterminate-active]:bg-surface-action-strong-active',
|
|
83
|
+
'data-[field-state=indeterminate-active]:border-surface-action-strong-active',
|
|
84
|
+
// checked/indeterminate + invalid + active → danger active bg + matching border
|
|
85
|
+
'data-[field-state=checked-invalid-active]:bg-surface-danger-strong-active',
|
|
86
|
+
'data-[field-state=checked-invalid-active]:border-surface-danger-strong-active',
|
|
87
|
+
'data-[field-state=indeterminate-invalid-active]:bg-surface-danger-strong-active',
|
|
88
|
+
'data-[field-state=indeterminate-invalid-active]:border-surface-danger-strong-active',
|
|
80
89
|
].join(' '),
|
|
81
90
|
}),
|
|
82
91
|
]);
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { forwardRef, type ComponentRef } from 'react';
|
|
2
|
+
import { View, type ImageSourcePropType } from 'react-native';
|
|
3
|
+
import { dataAttributes, mergeDataAttributes } from '@cdx-ui/primitives';
|
|
4
|
+
import { cn } from '@cdx-ui/utils';
|
|
5
|
+
import { Image as ForgeImage } from '../Image/Image';
|
|
6
|
+
import { HStack, type HStackProps } from '../Stack/HStack';
|
|
7
|
+
import { Text } from '../Text';
|
|
8
|
+
import {
|
|
9
|
+
insuranceDisclosureLogoVariants,
|
|
10
|
+
insuranceDisclosureRootVariants,
|
|
11
|
+
insuranceDisclosureTextVariants,
|
|
12
|
+
} from './styles';
|
|
13
|
+
|
|
14
|
+
export interface InsuranceDisclosureProps extends Omit<HStackProps, 'children'> {
|
|
15
|
+
logoSource: string | ImageSourcePropType;
|
|
16
|
+
logoAccessibilityLabel: string;
|
|
17
|
+
label?: string;
|
|
18
|
+
className?: string;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export const InsuranceDisclosure = forwardRef<
|
|
22
|
+
ComponentRef<typeof HStack>,
|
|
23
|
+
InsuranceDisclosureProps
|
|
24
|
+
>(function InsuranceDisclosure(
|
|
25
|
+
{ logoSource, logoAccessibilityLabel, label, className, style, ...props },
|
|
26
|
+
ref,
|
|
27
|
+
) {
|
|
28
|
+
return (
|
|
29
|
+
<HStack
|
|
30
|
+
ref={ref}
|
|
31
|
+
space="md"
|
|
32
|
+
className={cn(insuranceDisclosureRootVariants(), className)}
|
|
33
|
+
style={style}
|
|
34
|
+
{...props}
|
|
35
|
+
{...mergeDataAttributes(props, dataAttributes({ slot: 'insurance-disclosure' }))}
|
|
36
|
+
>
|
|
37
|
+
<ForgeImage
|
|
38
|
+
source={logoSource}
|
|
39
|
+
accessibilityLabel={logoAccessibilityLabel}
|
|
40
|
+
accessible
|
|
41
|
+
resizeMode="contain"
|
|
42
|
+
className={insuranceDisclosureLogoVariants()}
|
|
43
|
+
{...mergeDataAttributes({}, dataAttributes({ slot: 'insurance-disclosure-logo' }))}
|
|
44
|
+
/>
|
|
45
|
+
{label ? (
|
|
46
|
+
<View
|
|
47
|
+
className="min-w-0 shrink"
|
|
48
|
+
{...mergeDataAttributes({}, dataAttributes({ slot: 'insurance-disclosure-content' }))}
|
|
49
|
+
>
|
|
50
|
+
<Text size="xs" className={insuranceDisclosureTextVariants()}>
|
|
51
|
+
{label}
|
|
52
|
+
</Text>
|
|
53
|
+
</View>
|
|
54
|
+
) : null}
|
|
55
|
+
</HStack>
|
|
56
|
+
);
|
|
57
|
+
});
|
|
58
|
+
|
|
59
|
+
InsuranceDisclosure.displayName = 'InsuranceDisclosure';
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { cva } from 'class-variance-authority';
|
|
2
|
+
|
|
3
|
+
export const insuranceDisclosureRootVariants = cva([
|
|
4
|
+
'w-full max-w-full items-center justify-start',
|
|
5
|
+
'border border-stroke-secondary',
|
|
6
|
+
'rounded-[var(--border-radius-default)]',
|
|
7
|
+
'p-4',
|
|
8
|
+
]);
|
|
9
|
+
|
|
10
|
+
export const insuranceDisclosureLogoVariants = cva(['h-[23px] w-[37px]']);
|
|
11
|
+
|
|
12
|
+
export const insuranceDisclosureTextVariants = cva(['shrink text-content-secondary']);
|
|
@@ -50,6 +50,18 @@ RadioRoot.displayName = 'Radio';
|
|
|
50
50
|
// RADIO INDICATOR (styled-only, reads context for data-* styling)
|
|
51
51
|
// =============================================================================
|
|
52
52
|
|
|
53
|
+
/** Compound checked × invalid × active state for native Uniwind selectors (single data-field-state). */
|
|
54
|
+
const INDICATOR_STATES = {
|
|
55
|
+
'unchecked:false:false': 'idle',
|
|
56
|
+
'unchecked:true:false': 'invalid',
|
|
57
|
+
'unchecked:false:true': 'active',
|
|
58
|
+
'unchecked:true:true': 'invalid-active',
|
|
59
|
+
'checked:false:false': 'checked',
|
|
60
|
+
'checked:true:false': 'checked-invalid',
|
|
61
|
+
'checked:false:true': 'checked-active',
|
|
62
|
+
'checked:true:true': 'checked-invalid-active',
|
|
63
|
+
} as const;
|
|
64
|
+
|
|
53
65
|
export interface RadioIndicatorProps extends ViewProps {
|
|
54
66
|
asChild?: boolean;
|
|
55
67
|
className?: string;
|
|
@@ -61,6 +73,12 @@ const RadioIndicator = forwardRef<View, RadioIndicatorProps>(
|
|
|
61
73
|
const { isChecked, isDisabled, isHovered, isInvalid, isReadOnly, isPressed, isFocusVisible } =
|
|
62
74
|
useRadioContext();
|
|
63
75
|
|
|
76
|
+
const checkState = isChecked ? 'checked' : 'unchecked';
|
|
77
|
+
const fieldState =
|
|
78
|
+
INDICATOR_STATES[
|
|
79
|
+
`${checkState}:${isInvalid ? 'true' : 'false'}:${isPressed ? 'true' : 'false'}`
|
|
80
|
+
];
|
|
81
|
+
|
|
64
82
|
const computedClassName = cn(radioIndicatorVariants(), className);
|
|
65
83
|
const Comp = asChild ? Slot : View;
|
|
66
84
|
|
|
@@ -81,6 +99,7 @@ const RadioIndicator = forwardRef<View, RadioIndicatorProps>(
|
|
|
81
99
|
invalid: isInvalid,
|
|
82
100
|
readonly: isReadOnly,
|
|
83
101
|
active: isPressed,
|
|
102
|
+
fieldState,
|
|
84
103
|
}),
|
|
85
104
|
)}
|
|
86
105
|
>
|
|
@@ -90,6 +109,7 @@ const RadioIndicator = forwardRef<View, RadioIndicatorProps>(
|
|
|
90
109
|
checked: isChecked,
|
|
91
110
|
invalid: isInvalid,
|
|
92
111
|
hover: isHovered,
|
|
112
|
+
fieldState,
|
|
93
113
|
})}
|
|
94
114
|
/>
|
|
95
115
|
{children}
|
|
@@ -17,16 +17,33 @@ export const radioIndicatorVariants = cva([
|
|
|
17
17
|
'data-[checked=false]:border-content-secondary',
|
|
18
18
|
'data-[checked=true]:border-stroke-action',
|
|
19
19
|
'data-[invalid=true]:border-stroke-danger',
|
|
20
|
-
'data-[checked=true]:data-[invalid=true]:border-stroke-danger',
|
|
21
20
|
Platform.select({
|
|
22
21
|
web: [
|
|
23
22
|
TRANSITION_COLORS,
|
|
23
|
+
'group',
|
|
24
|
+
// Hover — unchecked (Figma: border unchanged, bg overlay at opacity/hover)
|
|
25
|
+
'data-[hover=true]:data-[checked=false]:bg-content-secondary/[0.08]',
|
|
26
|
+
// Hover — unchecked + invalid (overlay uses danger token)
|
|
27
|
+
'data-[hover=true]:data-[invalid=true]:data-[checked=false]:bg-surface-danger-strong/[0.08]',
|
|
24
28
|
'data-[hover=true]:data-[checked=true]:border-surface-action-strong-hover',
|
|
25
29
|
'data-[hover=true]:data-[invalid=true]:border-surface-danger-strong-hover',
|
|
30
|
+
// Active — CSS :active (web root does not track press via data-active).
|
|
31
|
+
// data-[hover=true] guard ensures active beats hover by specificity (0,3,0 > 0,2,0).
|
|
32
|
+
'web:active:data-[hover=true]:data-[checked=false]:border-stroke-hover',
|
|
33
|
+
'web:active:data-[hover=true]:data-[invalid=true]:data-[checked=false]:border-surface-danger-strong-active',
|
|
34
|
+
'web:active:data-[hover=true]:data-[checked=true]:border-surface-action-strong-active',
|
|
35
|
+
'web:active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:border-surface-danger-strong-active',
|
|
26
36
|
'web:data-[focus-visible=true]:outline-none',
|
|
27
37
|
'web:data-[focus-visible=true]:ring-2 web:data-[focus-visible=true]:ring-stroke-focus web:data-[focus-visible=true]:ring-offset-2',
|
|
28
38
|
].join(' '),
|
|
29
|
-
default:
|
|
39
|
+
default: [
|
|
40
|
+
// Native: Uniwind only evaluates the last data-[] condition in a compound chain.
|
|
41
|
+
// Use single-condition data-[field-state=...] selectors (emitted by RadioIndicator).
|
|
42
|
+
'data-[field-state=active]:border-stroke-hover',
|
|
43
|
+
'data-[field-state=invalid-active]:border-surface-danger-strong-active',
|
|
44
|
+
'data-[field-state=checked-active]:border-surface-action-strong-active',
|
|
45
|
+
'data-[field-state=checked-invalid-active]:border-surface-danger-strong-active',
|
|
46
|
+
].join(' '),
|
|
30
47
|
}),
|
|
31
48
|
]);
|
|
32
49
|
|
|
@@ -41,8 +58,14 @@ export const radioInnerDotVariants = cva([
|
|
|
41
58
|
web: [
|
|
42
59
|
'data-[hover=true]:bg-surface-action-strong-hover',
|
|
43
60
|
'data-[hover=true]:data-[invalid=true]:bg-surface-danger-strong-hover',
|
|
61
|
+
// Active via group-active on indicator (inner dot is not the :active target).
|
|
62
|
+
'web:group-active:data-[hover=true]:data-[checked=true]:bg-surface-action-strong-active',
|
|
63
|
+
'web:group-active:data-[hover=true]:data-[checked=true]:data-[invalid=true]:bg-surface-danger-strong-active',
|
|
64
|
+
].join(' '),
|
|
65
|
+
default: [
|
|
66
|
+
'data-[field-state=checked-active]:bg-surface-action-strong-active',
|
|
67
|
+
'data-[field-state=checked-invalid-active]:bg-surface-danger-strong-active',
|
|
44
68
|
].join(' '),
|
|
45
|
-
default: '',
|
|
46
69
|
}),
|
|
47
70
|
]);
|
|
48
71
|
|
package/src/components/index.ts
CHANGED