@cdx-ui/components 0.1.0 → 0.1.1
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 +1 -1
- package/lib/commonjs/components/Input/styles.js +12 -4
- package/lib/commonjs/components/Input/styles.js.map +1 -1
- package/lib/commonjs/components/InsuranceDisclosure/FdicLockup.js +31 -0
- package/lib/commonjs/components/InsuranceDisclosure/FdicLockup.js.map +1 -0
- package/lib/commonjs/components/InsuranceDisclosure/index.js +22 -4
- package/lib/commonjs/components/InsuranceDisclosure/index.js.map +1 -1
- package/lib/commonjs/components/InsuranceDisclosure/styles.js +13 -3
- package/lib/commonjs/components/InsuranceDisclosure/styles.js.map +1 -1
- package/lib/commonjs/components/Select/styles.js +11 -3
- package/lib/commonjs/components/Select/styles.js.map +1 -1
- package/lib/commonjs/components/Textarea/styles.js +4 -2
- package/lib/commonjs/components/Textarea/styles.js.map +1 -1
- package/lib/commonjs/figma/InsuranceDisclosure.figma.js +26 -0
- package/lib/commonjs/figma/InsuranceDisclosure.figma.js.map +1 -0
- package/lib/commonjs/styles/constants.js +5 -1
- package/lib/commonjs/styles/constants.js.map +1 -1
- package/lib/module/components/Input/styles.js +13 -5
- package/lib/module/components/Input/styles.js.map +1 -1
- package/lib/module/components/InsuranceDisclosure/FdicLockup.js +27 -0
- package/lib/module/components/InsuranceDisclosure/FdicLockup.js.map +1 -0
- package/lib/module/components/InsuranceDisclosure/index.js +22 -4
- package/lib/module/components/InsuranceDisclosure/index.js.map +1 -1
- package/lib/module/components/InsuranceDisclosure/styles.js +13 -3
- package/lib/module/components/InsuranceDisclosure/styles.js.map +1 -1
- package/lib/module/components/Select/styles.js +12 -4
- package/lib/module/components/Select/styles.js.map +1 -1
- package/lib/module/components/Textarea/styles.js +5 -3
- package/lib/module/components/Textarea/styles.js.map +1 -1
- package/lib/module/figma/InsuranceDisclosure.figma.js +20 -0
- package/lib/module/figma/InsuranceDisclosure.figma.js.map +1 -0
- package/lib/module/styles/constants.js +4 -0
- package/lib/module/styles/constants.js.map +1 -1
- package/lib/typescript/components/Input/styles.d.ts.map +1 -1
- package/lib/typescript/components/InsuranceDisclosure/FdicLockup.d.ts +2 -0
- package/lib/typescript/components/InsuranceDisclosure/FdicLockup.d.ts.map +1 -0
- package/lib/typescript/components/InsuranceDisclosure/index.d.ts +24 -3
- package/lib/typescript/components/InsuranceDisclosure/index.d.ts.map +1 -1
- package/lib/typescript/components/InsuranceDisclosure/styles.d.ts +5 -1
- package/lib/typescript/components/InsuranceDisclosure/styles.d.ts.map +1 -1
- package/lib/typescript/components/Select/styles.d.ts.map +1 -1
- package/lib/typescript/components/Textarea/styles.d.ts.map +1 -1
- package/lib/typescript/figma/InsuranceDisclosure.figma.d.ts +8 -0
- package/lib/typescript/figma/InsuranceDisclosure.figma.d.ts.map +1 -0
- package/lib/typescript/styles/constants.d.ts +1 -0
- package/lib/typescript/styles/constants.d.ts.map +1 -1
- package/package.json +5 -5
- package/src/components/Input/styles.ts +11 -3
- package/src/components/InsuranceDisclosure/FdicLockup.tsx +23 -0
- package/src/components/InsuranceDisclosure/index.tsx +54 -14
- package/src/components/InsuranceDisclosure/styles.ts +28 -9
- package/src/components/Select/styles.ts +11 -3
- package/src/components/Textarea/styles.ts +5 -3
- package/src/styles/constants.ts +4 -0
package/README.md
CHANGED
|
@@ -44,7 +44,7 @@ Component stories live in [`apps/storybook`](../../apps/storybook/). See the ful
|
|
|
44
44
|
|
|
45
45
|
### Components
|
|
46
46
|
|
|
47
|
-
Accordion, Alert, AlertDialog, Avatar, Badge, BottomSheet, Breadcrumbs, Button, Calendar, Card, Carousel, Checkbox, Chip, CurrencyInput, DateField, DatePicker, DateRangePicker, DateTimeField, DateTimeList, DateTimePicker, Dialog, Divider, Field, Form, Heading, HStack / VStack, Icon, IconButton, Image, Input, InsuranceDisclosure, Link, ListItem, Menu, MonthCalendar, MonthPicker, OtpInput, ProgressBar, ProgressCircle, ProgressSegmented, QuickActionButton, Radio, RangeCalendar, ScopedTheme, ScrollShadow, Select, Skeleton, Slider, Switch, Tabs, Text, Textarea, Tile, Toast, Tooltip, VirtualizedList.
|
|
47
|
+
Accordion, Alert, AlertDialog, Avatar, Badge, BottomSheet, Breadcrumbs, Button, Calendar, Card, Carousel, Checkbox, Chip, CurrencyInput, DateField, DatePicker, DateRangePicker, DateTimeField, DateTimeList, DateTimePicker, Dialog, Divider, Field, Form, Heading, HStack / VStack, Icon, IconButton, Image, Input, InsuranceDisclosure, Link, ListItem, Menu, MonthCalendar, MonthPicker, OtpInput, ProgressBar, ProgressCircle, ProgressSegmented, QuickActionButton, Radio, RangeCalendar, ScopedTheme, ScrollShadow, Select, Skeleton, Slider, Switch, Table, TablePagination, Tabs, Text, Textarea, Tile, Toast, Tooltip, VirtualizedList.
|
|
48
48
|
|
|
49
49
|
> `Box` is exported but deprecated — use React Native's `View` directly.
|
|
50
50
|
|
|
@@ -19,8 +19,14 @@ const inputRootVariants = exports.inputRootVariants = (0, _utils.cva)(['w-full f
|
|
|
19
19
|
outline: []
|
|
20
20
|
},
|
|
21
21
|
size: {
|
|
22
|
-
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
23
|
-
|
|
22
|
+
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
23
|
+
// Web <600px: trim vertical padding so 16px / leading-normal (24px line box) fits
|
|
24
|
+
// in h-11. Native and web ≥600px keep py-3 at 14px text (Figma Viewport=Wide).
|
|
25
|
+
'web:max-[600px]:py-2', 'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
26
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
27
|
+
// Web <600px: grow shell to h-9 so 16px text fits. Native and web ≥600px stay
|
|
28
|
+
// h-8 at 12px text.
|
|
29
|
+
'web:max-[600px]:h-9 web:max-[600px]:min-h-9 web:max-[600px]:py-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
24
30
|
}
|
|
25
31
|
},
|
|
26
32
|
defaultVariants: {
|
|
@@ -38,8 +44,10 @@ const inputFieldVariants = exports.inputFieldVariants = (0, _utils.cva)([
|
|
|
38
44
|
'flex-1 min-w-0 justify-center bg-transparent p-0', 'text-content-primary', 'placeholder:text-content-tertiary', 'web:outline-none', 'tracking-normal'], {
|
|
39
45
|
variants: {
|
|
40
46
|
size: {
|
|
41
|
-
|
|
42
|
-
|
|
47
|
+
// Web <600px: 16px prevents iOS Safari focus-zoom. Native and web ≥600px keep
|
|
48
|
+
// 14px / 12px (Figma Viewport=Wide).
|
|
49
|
+
default: ['text-[0.875rem]', _constants.WEB_NARROW_FIELD_TEXT],
|
|
50
|
+
small: ['text-[0.75rem]', _constants.WEB_NARROW_FIELD_TEXT]
|
|
43
51
|
}
|
|
44
52
|
},
|
|
45
53
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_utils","require","_constants","inputRootVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEO,MAAME,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,UAAG,EAClC,CACE,8CAA8C,EAC9C,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCC,4BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,0BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,0CAA0C,CAC3C,EACD;EACEC,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B
|
|
1
|
+
{"version":3,"names":["_utils","require","_constants","inputRootVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","WEB_NARROW_FIELD_TEXT","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEO,MAAME,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,UAAG,EAClC,CACE,8CAA8C,EAC9C,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCC,4BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,0BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,0CAA0C,CAC3C,EACD;EACEC,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B;MAC/B;MACA;MACA,sBAAsB,EACtB,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,+BAA+B;MAC/B;MACA;MACA,oEAAoE,EACpE,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMI,kBAAkB,GAAAX,OAAA,CAAAW,kBAAA,GAAG,IAAAV,UAAG,EACnC;AACE;AACA;AACA;AACA;AACA;AACA;AACA,kDAAkD,EAClD,sBAAsB,EACtB,mCAAmC,EACnC,kBAAkB,EAClB,iBAAiB,CAClB,EACD;EACEG,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJ;MACA;MACAC,OAAO,EAAE,CAAC,iBAAiB,EAAEI,gCAAqB,CAAC;MACnDH,KAAK,EAAE,CAAC,gBAAgB,EAAEG,gCAAqB;IACjD;EACF,CAAC;EACDF,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMM,iBAAiB,GAAAb,OAAA,CAAAa,iBAAA,GAAG,IAAAZ,UAAG,EAAC,CAAC,kDAAkD,CAAC,CAAC;AAEnF,MAAMa,iBAAiB,GAAAd,OAAA,CAAAc,iBAAA,GAAG,IAAAb,UAAG,EAAC,CAAC,uBAAuB,CAAC,EAAE;EAC9DG,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,QAAQ;MACjBC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CAAC,CAAC;AAEK,MAAMQ,6BAA6B,GAAAf,OAAA,CAAAe,6BAAA,GAAG,IAAAd,UAAG,EAAC,CAAC,yBAAyB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.FdicLockup = FdicLockup;
|
|
7
|
+
var _reactNativeSvg = require("react-native-svg");
|
|
8
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
+
const FDIC_NAVY = '#003366';
|
|
10
|
+
function FdicLockup() {
|
|
11
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.Svg, {
|
|
12
|
+
width: "100%",
|
|
13
|
+
height: "100%",
|
|
14
|
+
viewBox: "0 0 44 20",
|
|
15
|
+
fill: "none",
|
|
16
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
|
|
17
|
+
d: "M5.39953 18.3086H0.896923V1.73399H10.1587V6.06628H5.39953V8.7493H9.88382V13.0821H5.39953V18.3086Z",
|
|
18
|
+
fill: FDIC_NAVY
|
|
19
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
|
|
20
|
+
d: "M30.228 1.69895H25.7254V18.308H30.228V1.69895Z",
|
|
21
|
+
fill: FDIC_NAVY
|
|
22
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
|
|
23
|
+
d: "M39.4208 13.924C37.2579 13.924 35.4679 12.1616 35.4679 10.0003C35.4679 7.83897 37.2579 6.07598 39.4208 6.07598C41.3929 6.07598 42.424 7.12483 43.1031 8.50623V2.55916C43.1031 2.55916 41.1094 1.665 39.2516 1.665C35.1252 1.665 30.6543 5.46047 30.6543 10.0003C30.6543 15.5582 34.9187 18.335 39.2516 18.335C41.1089 18.335 43.1031 17.4419 43.1031 17.4419V11.5466C42.2903 12.9479 41.3821 13.924 39.4208 13.924Z",
|
|
24
|
+
fill: FDIC_NAVY
|
|
25
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
|
|
26
|
+
d: "M15.3172 1.73399C18.1366 1.73399 24.946 2.42118 24.946 10.0132C24.946 17.6209 18.8254 18.2935 15.3172 18.293H10.7785V1.73399H15.3172ZM20.4752 9.98679C20.4752 7.02943 18.1027 5.99783 15.3102 5.99783V13.9758C18.1027 13.9758 20.4752 12.9436 20.4752 9.98679Z",
|
|
27
|
+
fill: FDIC_NAVY
|
|
28
|
+
})]
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
//# sourceMappingURL=FdicLockup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNativeSvg","require","_jsxRuntime","FDIC_NAVY","FdicLockup","jsxs","Svg","width","height","viewBox","fill","children","jsx","Path","d"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/FdicLockup.tsx"],"mappings":";;;;;;AAAA,IAAAA,eAAA,GAAAC,OAAA;AAA6C,IAAAC,WAAA,GAAAD,OAAA;AAE7C,MAAME,SAAS,GAAG,SAAS;AAEpB,SAASC,UAAUA,CAAA,EAAG;EAC3B,oBACE,IAAAF,WAAA,CAAAG,IAAA,EAACL,eAAA,CAAAM,GAAG;IAACC,KAAK,EAAC,MAAM;IAACC,MAAM,EAAC,MAAM;IAACC,OAAO,EAAC,WAAW;IAACC,IAAI,EAAC,MAAM;IAAAC,QAAA,gBAC7D,IAAAT,WAAA,CAAAU,GAAA,EAACZ,eAAA,CAAAa,IAAI;MACHC,CAAC,EAAC,mGAAmG;MACrGJ,IAAI,EAAEP;IAAU,CACjB,CAAC,eACF,IAAAD,WAAA,CAAAU,GAAA,EAACZ,eAAA,CAAAa,IAAI;MAACC,CAAC,EAAC,gDAAgD;MAACJ,IAAI,EAAEP;IAAU,CAAE,CAAC,eAC5E,IAAAD,WAAA,CAAAU,GAAA,EAACZ,eAAA,CAAAa,IAAI;MACHC,CAAC,EAAC,qZAAqZ;MACvZJ,IAAI,EAAEP;IAAU,CACjB,CAAC,eACF,IAAAD,WAAA,CAAAU,GAAA,EAACZ,eAAA,CAAAa,IAAI;MACHC,CAAC,EAAC,gQAAgQ;MAClQJ,IAAI,EAAEP;IAAU,CACjB,CAAC;EAAA,CACC,CAAC;AAEV","ignoreList":[]}
|
|
@@ -11,9 +11,15 @@ var _utils = require("@cdx-ui/utils");
|
|
|
11
11
|
var _Image = require("../Image/Image");
|
|
12
12
|
var _HStack = require("../Stack/HStack");
|
|
13
13
|
var _Text = require("../Text");
|
|
14
|
+
var _FdicLockup = require("./FdicLockup");
|
|
14
15
|
var _styles = require("./styles");
|
|
15
16
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
|
+
/** Bundled official FDIC lockup — omit `logoSource` to use the default mark. */
|
|
18
|
+
|
|
19
|
+
/** Custom logo override — `logoAccessibilityLabel` is required. */
|
|
20
|
+
|
|
16
21
|
const InsuranceDisclosure = exports.InsuranceDisclosure = /*#__PURE__*/(0, _react.forwardRef)(function InsuranceDisclosure({
|
|
22
|
+
framed = false,
|
|
17
23
|
logoSource,
|
|
18
24
|
logoAccessibilityLabel,
|
|
19
25
|
label,
|
|
@@ -21,31 +27,43 @@ const InsuranceDisclosure = exports.InsuranceDisclosure = /*#__PURE__*/(0, _reac
|
|
|
21
27
|
style,
|
|
22
28
|
...props
|
|
23
29
|
}, ref) {
|
|
30
|
+
const useCustomLogo = logoSource != null;
|
|
24
31
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_HStack.HStack, {
|
|
25
32
|
ref: ref,
|
|
26
33
|
space: "md",
|
|
27
|
-
className: (0, _utils.cn)((0, _styles.insuranceDisclosureRootVariants)(
|
|
34
|
+
className: (0, _utils.cn)((0, _styles.insuranceDisclosureRootVariants)({
|
|
35
|
+
framed
|
|
36
|
+
}), className),
|
|
28
37
|
style: style,
|
|
29
38
|
...props,
|
|
30
39
|
...(0, _primitives.mergeDataAttributes)(props, (0, _primitives.dataAttributes)({
|
|
31
40
|
slot: 'insurance-disclosure'
|
|
32
41
|
})),
|
|
33
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Image.Image, {
|
|
42
|
+
children: [useCustomLogo ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Image.Image, {
|
|
34
43
|
source: logoSource,
|
|
35
44
|
accessibilityLabel: logoAccessibilityLabel,
|
|
36
|
-
accessible:
|
|
45
|
+
accessible: logoAccessibilityLabel != null,
|
|
37
46
|
resizeMode: "contain",
|
|
38
47
|
className: (0, _styles.insuranceDisclosureLogoVariants)(),
|
|
39
48
|
...(0, _primitives.mergeDataAttributes)({}, (0, _primitives.dataAttributes)({
|
|
40
49
|
slot: 'insurance-disclosure-logo'
|
|
41
50
|
}))
|
|
51
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
52
|
+
accessible: true,
|
|
53
|
+
accessibilityRole: "image",
|
|
54
|
+
accessibilityLabel: "FDIC",
|
|
55
|
+
className: (0, _styles.insuranceDisclosureLogoVariants)(),
|
|
56
|
+
...(0, _primitives.mergeDataAttributes)({}, (0, _primitives.dataAttributes)({
|
|
57
|
+
slot: 'insurance-disclosure-logo'
|
|
58
|
+
})),
|
|
59
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FdicLockup.FdicLockup, {})
|
|
42
60
|
}), label ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
43
61
|
className: "min-w-0 shrink",
|
|
44
62
|
...(0, _primitives.mergeDataAttributes)({}, (0, _primitives.dataAttributes)({
|
|
45
63
|
slot: 'insurance-disclosure-content'
|
|
46
64
|
})),
|
|
47
65
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
|
|
48
|
-
size: "
|
|
66
|
+
size: "sm",
|
|
49
67
|
className: (0, _styles.insuranceDisclosureTextVariants)(),
|
|
50
68
|
children: label
|
|
51
69
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_reactNative","_primitives","_utils","_Image","_HStack","_Text","_styles","_jsxRuntime","InsuranceDisclosure","exports","forwardRef","logoSource","logoAccessibilityLabel","label","className","style","props","ref","jsxs","HStack","space","cn","insuranceDisclosureRootVariants","mergeDataAttributes","dataAttributes","slot","children","jsx","Image","source","accessibilityLabel","accessible","resizeMode","insuranceDisclosureLogoVariants","View","Text","size","insuranceDisclosureTextVariants","displayName"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,KAAA,GAAAN,OAAA;AACA,IAAAO,
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_primitives","_utils","_Image","_HStack","_Text","_FdicLockup","_styles","_jsxRuntime","InsuranceDisclosure","exports","forwardRef","framed","logoSource","logoAccessibilityLabel","label","className","style","props","ref","useCustomLogo","jsxs","HStack","space","cn","insuranceDisclosureRootVariants","mergeDataAttributes","dataAttributes","slot","children","jsx","Image","source","accessibilityLabel","accessible","resizeMode","insuranceDisclosureLogoVariants","View","accessibilityRole","FdicLockup","Text","size","insuranceDisclosureTextVariants","displayName"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,KAAA,GAAAN,OAAA;AACA,IAAAO,WAAA,GAAAP,OAAA;AACA,IAAAQ,OAAA,GAAAR,OAAA;AAIkB,IAAAS,WAAA,GAAAT,OAAA;AAelB;;AAOA;;AAYO,MAAMU,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,gBAAG,IAAAE,iBAAU,EAG3C,SAASF,mBAAmBA,CAC5B;EAAEG,MAAM,GAAG,KAAK;EAAEC,UAAU;EAAEC,sBAAsB;EAAEC,KAAK;EAAEC,SAAS;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EACzFC,GAAG,EACH;EACA,MAAMC,aAAa,GAAGP,UAAU,IAAI,IAAI;EAExC,oBACE,IAAAL,WAAA,CAAAa,IAAA,EAACjB,OAAA,CAAAkB,MAAM;IACLH,GAAG,EAAEA,GAAI;IACTI,KAAK,EAAC,IAAI;IACVP,SAAS,EAAE,IAAAQ,SAAE,EAAC,IAAAC,uCAA+B,EAAC;MAAEb;IAAO,CAAC,CAAC,EAAEI,SAAS,CAAE;IACtEC,KAAK,EAAEA,KAAM;IAAA,GACTC,KAAK;IAAA,GACL,IAAAQ,+BAAmB,EAACR,KAAK,EAAE,IAAAS,0BAAc,EAAC;MAAEC,IAAI,EAAE;IAAuB,CAAC,CAAC,CAAC;IAAAC,QAAA,GAE/ET,aAAa,gBACZ,IAAAZ,WAAA,CAAAsB,GAAA,EAAC3B,MAAA,CAAA4B,KAAU;MACTC,MAAM,EAAEnB,UAAW;MACnBoB,kBAAkB,EAAEnB,sBAAuB;MAC3CoB,UAAU,EAAEpB,sBAAsB,IAAI,IAAK;MAC3CqB,UAAU,EAAC,SAAS;MACpBnB,SAAS,EAAE,IAAAoB,uCAA+B,EAAC,CAAE;MAAA,GACzC,IAAAV,+BAAmB,EAAC,CAAC,CAAC,EAAE,IAAAC,0BAAc,EAAC;QAAEC,IAAI,EAAE;MAA4B,CAAC,CAAC;IAAC,CACnF,CAAC,gBAEF,IAAApB,WAAA,CAAAsB,GAAA,EAAC9B,YAAA,CAAAqC,IAAI;MACHH,UAAU;MACVI,iBAAiB,EAAC,OAAO;MACzBL,kBAAkB,EAAC,MAAM;MACzBjB,SAAS,EAAE,IAAAoB,uCAA+B,EAAC,CAAE;MAAA,GACzC,IAAAV,+BAAmB,EAAC,CAAC,CAAC,EAAE,IAAAC,0BAAc,EAAC;QAAEC,IAAI,EAAE;MAA4B,CAAC,CAAC,CAAC;MAAAC,QAAA,eAElF,IAAArB,WAAA,CAAAsB,GAAA,EAACxB,WAAA,CAAAiC,UAAU,IAAE;IAAC,CACV,CACP,EACAxB,KAAK,gBACJ,IAAAP,WAAA,CAAAsB,GAAA,EAAC9B,YAAA,CAAAqC,IAAI;MACHrB,SAAS,EAAC,gBAAgB;MAAA,GACtB,IAAAU,+BAAmB,EAAC,CAAC,CAAC,EAAE,IAAAC,0BAAc,EAAC;QAAEC,IAAI,EAAE;MAA+B,CAAC,CAAC,CAAC;MAAAC,QAAA,eAErF,IAAArB,WAAA,CAAAsB,GAAA,EAACzB,KAAA,CAAAmC,IAAI;QAACC,IAAI,EAAC,IAAI;QAACzB,SAAS,EAAE,IAAA0B,uCAA+B,EAAC,CAAE;QAAAb,QAAA,EAC1Dd;MAAK,CACF;IAAC,CACH,CAAC,GACL,IAAI;EAAA,CACF,CAAC;AAEb,CAAC,CAAC;AAEFN,mBAAmB,CAACkC,WAAW,GAAG,qBAAqB","ignoreList":[]}
|
|
@@ -5,7 +5,17 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.insuranceDisclosureTextVariants = exports.insuranceDisclosureRootVariants = exports.insuranceDisclosureLogoVariants = void 0;
|
|
7
7
|
var _utils = require("@cdx-ui/utils");
|
|
8
|
-
const insuranceDisclosureRootVariants = exports.insuranceDisclosureRootVariants = (0, _utils.cva)(['w-full max-w-full items-center justify-start'
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
const insuranceDisclosureRootVariants = exports.insuranceDisclosureRootVariants = (0, _utils.cva)(['w-full max-w-full items-center justify-start'], {
|
|
9
|
+
variants: {
|
|
10
|
+
framed: {
|
|
11
|
+
true: ['bg-surface-primary', 'border border-stroke-secondary', 'rounded-[var(--border-radius-default)]', 'px-3 py-2'],
|
|
12
|
+
false: ''
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
defaultVariants: {
|
|
16
|
+
framed: false
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
const insuranceDisclosureLogoVariants = exports.insuranceDisclosureLogoVariants = (0, _utils.cva)(['h-5 w-11 shrink-0']);
|
|
20
|
+
const insuranceDisclosureTextVariants = exports.insuranceDisclosureTextVariants = (0, _utils.cva)(['shrink text-content-primary italic [font-family:var(--font-body-italic)]']);
|
|
11
21
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_utils","require","insuranceDisclosureRootVariants","exports","cva","insuranceDisclosureLogoVariants","insuranceDisclosureTextVariants"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEO,MAAMC,+BAA+B,GAAAC,OAAA,CAAAD,+BAAA,GAAG,IAAAE,UAAG,
|
|
1
|
+
{"version":3,"names":["_utils","require","insuranceDisclosureRootVariants","exports","cva","variants","framed","true","false","defaultVariants","insuranceDisclosureLogoVariants","insuranceDisclosureTextVariants"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEO,MAAMC,+BAA+B,GAAAC,OAAA,CAAAD,+BAAA,GAAG,IAAAE,UAAG,EAChD,CAAC,8CAA8C,CAAC,EAChD;EACEC,QAAQ,EAAE;IACRC,MAAM,EAAE;MACNC,IAAI,EAAE,CACJ,oBAAoB,EACpB,gCAAgC,EAChC,wCAAwC,EACxC,WAAW,CACZ;MACDC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,MAAM,EAAE;EACV;AACF,CACF,CAAC;AAMM,MAAMI,+BAA+B,GAAAP,OAAA,CAAAO,+BAAA,GAAG,IAAAN,UAAG,EAAC,CAAC,mBAAmB,CAAC,CAAC;AAElE,MAAMO,+BAA+B,GAAAR,OAAA,CAAAQ,+BAAA,GAAG,IAAAP,UAAG,EAAC,CACjD,0EAA0E,CAC3E,CAAC","ignoreList":[]}
|
|
@@ -21,9 +21,15 @@ const selectTriggerVariants = exports.selectTriggerVariants = (0, _utils.cva)(['
|
|
|
21
21
|
},
|
|
22
22
|
size: {
|
|
23
23
|
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
24
|
+
// Web <600px: trim vertical padding so 16px / leading-normal (24px line box) fits
|
|
25
|
+
// in h-11. Native and web ≥600px keep py-3 at 14px text (Figma Viewport=Wide).
|
|
26
|
+
'web:max-[600px]:py-2',
|
|
24
27
|
// Native only: subtract one hairline so the wider focus border doesn't shift layout.
|
|
25
28
|
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
26
|
-
small: ['h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
29
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
30
|
+
// Web <600px: grow shell to h-9 so 16px text fits. Native and web ≥600px stay
|
|
31
|
+
// h-8 at 12px text.
|
|
32
|
+
'web:max-[600px]:h-9 web:max-[600px]:min-h-9 web:max-[600px]:py-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
27
33
|
}
|
|
28
34
|
},
|
|
29
35
|
defaultVariants: {
|
|
@@ -37,8 +43,10 @@ const selectTriggerVariants = exports.selectTriggerVariants = (0, _utils.cva)(['
|
|
|
37
43
|
const selectValueVariants = exports.selectValueVariants = (0, _utils.cva)(['min-w-0 flex-1 text-start', 'text-content-primary', 'data-[placeholder=true]:text-content-tertiary', 'data-[invalid=true]:text-content-danger'], {
|
|
38
44
|
variants: {
|
|
39
45
|
size: {
|
|
40
|
-
|
|
41
|
-
|
|
46
|
+
// Web <600px: 16px matches Input/Textarea and prevents iOS Safari focus-zoom.
|
|
47
|
+
// Native and web ≥600px keep 14px / 12px (Figma Viewport=Wide).
|
|
48
|
+
default: ['text-[0.875rem]', _constants.WEB_NARROW_FIELD_TEXT],
|
|
49
|
+
small: ['text-[0.75rem]', _constants.WEB_NARROW_FIELD_TEXT]
|
|
42
50
|
}
|
|
43
51
|
},
|
|
44
52
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_utils","require","_constants","selectTriggerVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","selectIconVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEA;;AAEO,MAAME,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG,IAAAE,UAAG,EACtC,CACE,sEAAsE,EACtE,oBAAoB,EACpB,8BAA8B,EAC9B,wCAAwC,EACxCC,4BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,0BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE,EAChE,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,sEAAsE,EACtE,0CAA0C,CAC3C,EACD;EACEC,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B;MAC/B;MACA,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,+BAA+B
|
|
1
|
+
{"version":3,"names":["_utils","require","_constants","selectTriggerVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","WEB_NARROW_FIELD_TEXT","selectIconVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEA;;AAEO,MAAME,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG,IAAAE,UAAG,EACtC,CACE,sEAAsE,EACtE,oBAAoB,EACpB,8BAA8B,EAC9B,wCAAwC,EACxCC,4BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,0BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE,EAChE,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,sEAAsE,EACtE,0CAA0C,CAC3C,EACD;EACEC,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B;MAC/B;MACA;MACA,sBAAsB;MACtB;MACA,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,+BAA+B;MAC/B;MACA;MACA,oEAAoE,EACpE,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;;AAED;;AAEO,MAAMI,mBAAmB,GAAAX,OAAA,CAAAW,mBAAA,GAAG,IAAAV,UAAG,EACpC,CACE,2BAA2B,EAC3B,sBAAsB,EACtB,+CAA+C,EAC/C,yCAAyC,CAC1C,EACD;EACEG,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJ;MACA;MACAC,OAAO,EAAE,CAAC,iBAAiB,EAAEI,gCAAqB,CAAC;MACnDH,KAAK,EAAE,CAAC,gBAAgB,EAAEG,gCAAqB;IACjD;EACF,CAAC;EACDF,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;;AAED;;AAEO,MAAMM,kBAAkB,GAAAb,OAAA,CAAAa,kBAAA,GAAG,IAAAZ,UAAG,EACnC,CACE,kDAAkD,EAClD,uBAAuB,EACvB,yCAAyC,CAC1C,EACD;EACEG,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,QAAQ;MACjBC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC","ignoreList":[]}
|
|
@@ -37,8 +37,10 @@ const textareaFieldVariants = exports.textareaFieldVariants = (0, _utils.cva)([
|
|
|
37
37
|
'flex-1 min-w-0 bg-transparent p-0', 'text-content-primary', 'placeholder:text-content-tertiary', 'web:outline-none', 'tracking-normal'], {
|
|
38
38
|
variants: {
|
|
39
39
|
size: {
|
|
40
|
-
|
|
41
|
-
|
|
40
|
+
// Web <600px: 16px prevents iOS Safari focus-zoom. Native and web ≥600px keep
|
|
41
|
+
// 14px / 12px (Figma Viewport=Wide).
|
|
42
|
+
default: ['text-[0.875rem]', _constants.WEB_NARROW_FIELD_TEXT],
|
|
43
|
+
small: ['text-[0.75rem]', _constants.WEB_NARROW_FIELD_TEXT]
|
|
42
44
|
}
|
|
43
45
|
},
|
|
44
46
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_utils","require","_constants","textareaRootVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","textareaFieldVariants","textareaFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Textarea/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEO,MAAME,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,GAAG,IAAAE,UAAG,EACrC;AACE;AACA;AACA,+BAA+B,EAC/B,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCC,4BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,0BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,0CAA0C,CAC3C,EACD;EACEC,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,iBAAiB,EACjB,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,mBAAmB,EACnB,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMI,qBAAqB,GAAAX,OAAA,CAAAW,qBAAA,GAAG,IAAAV,UAAG,EACtC;AACE;AACA;AACA,mCAAmC,EACnC,sBAAsB,EACtB,mCAAmC,EACnC,kBAAkB,EAClB,iBAAiB,CAClB,EACD;EACEG,QAAQ,EAAE;IACRG,IAAI,EAAE;
|
|
1
|
+
{"version":3,"names":["_utils","require","_constants","textareaRootVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","textareaFieldVariants","WEB_NARROW_FIELD_TEXT","textareaFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Textarea/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAEO,MAAME,oBAAoB,GAAAC,OAAA,CAAAD,oBAAA,GAAG,IAAAE,UAAG,EACrC;AACE;AACA;AACA,+BAA+B,EAC/B,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCC,4BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,0BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,0CAA0C,CAC3C,EACD;EACEC,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,iBAAiB,EACjB,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,mBAAmB,EACnB,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMI,qBAAqB,GAAAX,OAAA,CAAAW,qBAAA,GAAG,IAAAV,UAAG,EACtC;AACE;AACA;AACA,mCAAmC,EACnC,sBAAsB,EACtB,mCAAmC,EACnC,kBAAkB,EAClB,iBAAiB,CAClB,EACD;EACEG,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJ;MACA;MACAC,OAAO,EAAE,CAAC,iBAAiB,EAAEI,gCAAqB,CAAC;MACnDH,KAAK,EAAE,CAAC,gBAAgB,EAAEG,gCAAqB;IACjD;EACF,CAAC;EACDF,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMM,gCAAgC,GAAAb,OAAA,CAAAa,gCAAA,GAAG,IAAAZ,UAAG,EAAC,CAAC,yBAAyB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,26 @@
|
|
|
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=8550-3291
|
|
10
|
+
// source=packages/components/src/components/InsuranceDisclosure/index.tsx
|
|
11
|
+
// component=InsuranceDisclosure
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
const framed = instance.getEnum('framed', {
|
|
15
|
+
true: true,
|
|
16
|
+
false: undefined
|
|
17
|
+
});
|
|
18
|
+
const framedProp = _figma.default.helpers.react.renderProp('framed', framed);
|
|
19
|
+
const label = instance.findText('Statement').textContent;
|
|
20
|
+
var _default = exports.default = {
|
|
21
|
+
id: 'insurance-disclosure',
|
|
22
|
+
imports: ["import { InsuranceDisclosure } from '@cdx-ui/components'"],
|
|
23
|
+
example: _figma.default.code`
|
|
24
|
+
<InsuranceDisclosure label="${label}"${framedProp} />`
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=InsuranceDisclosure.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","framed","getEnum","true","false","undefined","framedProp","helpers","react","renderProp","label","findText","textContent","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/InsuranceDisclosure.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,MAAM,GAAGH,QAAQ,CAACI,OAAO,CAAC,QAAQ,EAAE;EACxCC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGP,cAAK,CAACQ,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,QAAQ,EAAER,MAAM,CAAC;AAEnE,MAAMS,KAAK,GAAIZ,QAAQ,CAACa,QAAQ,CAAC,WAAW,CAAC,CAAgCC,WAAW;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAjB,OAAA,GAE1E;EACbkB,EAAE,EAAE,sBAAsB;EAC1BC,OAAO,EAAE,CAAC,0DAA0D,CAAC;EACrEC,OAAO,EAAElB,cAAK,CAACmB,IAAI;AACrB,8BAA8BR,KAAK,IAAIJ,UAAU;AACjD,CAAC","ignoreList":[]}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.TRANSITION_COLORS = exports.DISABLED_OPACITY = exports.DISABLED_CURSOR = void 0;
|
|
6
|
+
exports.WEB_NARROW_FIELD_TEXT = exports.TRANSITION_COLORS = exports.DISABLED_OPACITY = exports.DISABLED_CURSOR = void 0;
|
|
7
7
|
// packages/components/src/styles/constants.ts
|
|
8
8
|
// Semantic constants for Forge UI component styling.
|
|
9
9
|
|
|
@@ -13,4 +13,8 @@ const TRANSITION_COLORS = exports.TRANSITION_COLORS = 'transition-colors duratio
|
|
|
13
13
|
// ─── Disabled ────────────────────────────────────────────
|
|
14
14
|
const DISABLED_OPACITY = exports.DISABLED_OPACITY = 'data-[disabled=true]:opacity-50';
|
|
15
15
|
const DISABLED_CURSOR = exports.DISABLED_CURSOR = 'data-[disabled=true]:cursor-not-allowed data-[disabled=true]:pointer-events-none';
|
|
16
|
+
|
|
17
|
+
// Web-only iOS Safari focus-zoom guard. Figma Viewport=Narrow (<600px) uses body/lg
|
|
18
|
+
// (16px / 24px); Viewport=Wide (≥600px) keeps the size variant's original px size.
|
|
19
|
+
const WEB_NARROW_FIELD_TEXT = exports.WEB_NARROW_FIELD_TEXT = 'web:max-[600px]:text-base web:max-[600px]:leading-normal';
|
|
16
20
|
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["TRANSITION_COLORS","exports","DISABLED_OPACITY","DISABLED_CURSOR"],"sourceRoot":"../../../src","sources":["styles/constants.ts"],"mappings":";;;;;;AAAA;AACA;;AAEA;AACO,MAAMA,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,gCAAgC;;AAEjE;AACO,MAAME,gBAAgB,GAAAD,OAAA,CAAAC,gBAAA,GAAG,iCAAiC;AAC1D,MAAMC,eAAe,GAAAF,OAAA,CAAAE,eAAA,GAC1B,kFAAkF","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["TRANSITION_COLORS","exports","DISABLED_OPACITY","DISABLED_CURSOR","WEB_NARROW_FIELD_TEXT"],"sourceRoot":"../../../src","sources":["styles/constants.ts"],"mappings":";;;;;;AAAA;AACA;;AAEA;AACO,MAAMA,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,gCAAgC;;AAEjE;AACO,MAAME,gBAAgB,GAAAD,OAAA,CAAAC,gBAAA,GAAG,iCAAiC;AAC1D,MAAMC,eAAe,GAAAF,OAAA,CAAAE,eAAA,GAC1B,kFAAkF;;AAEpF;AACA;AACO,MAAMC,qBAAqB,GAAAH,OAAA,CAAAG,qBAAA,GAAG,0DAA0D","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { cva } from '@cdx-ui/utils';
|
|
4
|
-
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/constants';
|
|
4
|
+
import { DISABLED_CURSOR, TRANSITION_COLORS, WEB_NARROW_FIELD_TEXT } from '../../styles/constants';
|
|
5
5
|
export const inputRootVariants = cva(['w-full flex-row items-center overflow-hidden', 'bg-surface-primary', 'border-solid border-stroke-primary', 'web:border-default native:border-[length:var(--border-width-default)]', 'rounded-[var(--border-radius-default)]', TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
6
6
|
// Web: inset ring avoids a border-width change so the shell never shifts on focus and
|
|
7
7
|
// no per-size padding compensation is required. Recolor the border to match the ring so
|
|
@@ -15,8 +15,14 @@ export const inputRootVariants = cva(['w-full flex-row items-center overflow-hid
|
|
|
15
15
|
outline: []
|
|
16
16
|
},
|
|
17
17
|
size: {
|
|
18
|
-
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
19
|
-
|
|
18
|
+
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
19
|
+
// Web <600px: trim vertical padding so 16px / leading-normal (24px line box) fits
|
|
20
|
+
// in h-11. Native and web ≥600px keep py-3 at 14px text (Figma Viewport=Wide).
|
|
21
|
+
'web:max-[600px]:py-2', 'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
22
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
23
|
+
// Web <600px: grow shell to h-9 so 16px text fits. Native and web ≥600px stay
|
|
24
|
+
// h-8 at 12px text.
|
|
25
|
+
'web:max-[600px]:h-9 web:max-[600px]:min-h-9 web:max-[600px]:py-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
20
26
|
}
|
|
21
27
|
},
|
|
22
28
|
defaultVariants: {
|
|
@@ -34,8 +40,10 @@ export const inputFieldVariants = cva([
|
|
|
34
40
|
'flex-1 min-w-0 justify-center bg-transparent p-0', 'text-content-primary', 'placeholder:text-content-tertiary', 'web:outline-none', 'tracking-normal'], {
|
|
35
41
|
variants: {
|
|
36
42
|
size: {
|
|
37
|
-
|
|
38
|
-
|
|
43
|
+
// Web <600px: 16px prevents iOS Safari focus-zoom. Native and web ≥600px keep
|
|
44
|
+
// 14px / 12px (Figma Viewport=Wide).
|
|
45
|
+
default: ['text-[0.875rem]', WEB_NARROW_FIELD_TEXT],
|
|
46
|
+
small: ['text-[0.75rem]', WEB_NARROW_FIELD_TEXT]
|
|
39
47
|
}
|
|
40
48
|
},
|
|
41
49
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","inputRootVariants","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;AACtD,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,wBAAwB;
|
|
1
|
+
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","WEB_NARROW_FIELD_TEXT","inputRootVariants","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;AACtD,SAASC,eAAe,EAAEC,iBAAiB,EAAEC,qBAAqB,QAAQ,wBAAwB;AAElG,OAAO,MAAMC,iBAAiB,GAAGJ,GAAG,CAClC,CACE,8CAA8C,EAC9C,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCE,iBAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDD,eAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,0CAA0C,CAC3C,EACD;EACEI,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B;MAC/B;MACA;MACA,sBAAsB,EACtB,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,+BAA+B;MAC/B;MACA;MACA,oEAAoE,EACpE,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAED,OAAO,MAAMI,kBAAkB,GAAGZ,GAAG,CACnC;AACE;AACA;AACA;AACA;AACA;AACA;AACA,kDAAkD,EAClD,sBAAsB,EACtB,mCAAmC,EACnC,kBAAkB,EAClB,iBAAiB,CAClB,EACD;EACEK,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJ;MACA;MACAC,OAAO,EAAE,CAAC,iBAAiB,EAAEN,qBAAqB,CAAC;MACnDO,KAAK,EAAE,CAAC,gBAAgB,EAAEP,qBAAqB;IACjD;EACF,CAAC;EACDQ,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAED,OAAO,MAAMK,iBAAiB,GAAGb,GAAG,CAAC,CAAC,kDAAkD,CAAC,CAAC;AAE1F,OAAO,MAAMc,iBAAiB,GAAGd,GAAG,CAAC,CAAC,uBAAuB,CAAC,EAAE;EAC9DK,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,QAAQ;MACjBC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CAAC,CAAC;AAEF,OAAO,MAAMO,6BAA6B,GAAGf,GAAG,CAAC,CAAC,yBAAyB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { Path, Svg } from 'react-native-svg';
|
|
4
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
+
const FDIC_NAVY = '#003366';
|
|
6
|
+
export function FdicLockup() {
|
|
7
|
+
return /*#__PURE__*/_jsxs(Svg, {
|
|
8
|
+
width: "100%",
|
|
9
|
+
height: "100%",
|
|
10
|
+
viewBox: "0 0 44 20",
|
|
11
|
+
fill: "none",
|
|
12
|
+
children: [/*#__PURE__*/_jsx(Path, {
|
|
13
|
+
d: "M5.39953 18.3086H0.896923V1.73399H10.1587V6.06628H5.39953V8.7493H9.88382V13.0821H5.39953V18.3086Z",
|
|
14
|
+
fill: FDIC_NAVY
|
|
15
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
16
|
+
d: "M30.228 1.69895H25.7254V18.308H30.228V1.69895Z",
|
|
17
|
+
fill: FDIC_NAVY
|
|
18
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
19
|
+
d: "M39.4208 13.924C37.2579 13.924 35.4679 12.1616 35.4679 10.0003C35.4679 7.83897 37.2579 6.07598 39.4208 6.07598C41.3929 6.07598 42.424 7.12483 43.1031 8.50623V2.55916C43.1031 2.55916 41.1094 1.665 39.2516 1.665C35.1252 1.665 30.6543 5.46047 30.6543 10.0003C30.6543 15.5582 34.9187 18.335 39.2516 18.335C41.1089 18.335 43.1031 17.4419 43.1031 17.4419V11.5466C42.2903 12.9479 41.3821 13.924 39.4208 13.924Z",
|
|
20
|
+
fill: FDIC_NAVY
|
|
21
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
22
|
+
d: "M15.3172 1.73399C18.1366 1.73399 24.946 2.42118 24.946 10.0132C24.946 17.6209 18.8254 18.2935 15.3172 18.293H10.7785V1.73399H15.3172ZM20.4752 9.98679C20.4752 7.02943 18.1027 5.99783 15.3102 5.99783V13.9758C18.1027 13.9758 20.4752 12.9436 20.4752 9.98679Z",
|
|
23
|
+
fill: FDIC_NAVY
|
|
24
|
+
})]
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
//# sourceMappingURL=FdicLockup.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Path","Svg","jsx","_jsx","jsxs","_jsxs","FDIC_NAVY","FdicLockup","width","height","viewBox","fill","children","d"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/FdicLockup.tsx"],"mappings":";;AAAA,SAASA,IAAI,EAAEC,GAAG,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE7C,MAAMC,SAAS,GAAG,SAAS;AAE3B,OAAO,SAASC,UAAUA,CAAA,EAAG;EAC3B,oBACEF,KAAA,CAACJ,GAAG;IAACO,KAAK,EAAC,MAAM;IAACC,MAAM,EAAC,MAAM;IAACC,OAAO,EAAC,WAAW;IAACC,IAAI,EAAC,MAAM;IAAAC,QAAA,gBAC7DT,IAAA,CAACH,IAAI;MACHa,CAAC,EAAC,mGAAmG;MACrGF,IAAI,EAAEL;IAAU,CACjB,CAAC,eACFH,IAAA,CAACH,IAAI;MAACa,CAAC,EAAC,gDAAgD;MAACF,IAAI,EAAEL;IAAU,CAAE,CAAC,eAC5EH,IAAA,CAACH,IAAI;MACHa,CAAC,EAAC,qZAAqZ;MACvZF,IAAI,EAAEL;IAAU,CACjB,CAAC,eACFH,IAAA,CAACH,IAAI;MACHa,CAAC,EAAC,gQAAgQ;MAClQF,IAAI,EAAEL;IAAU,CACjB,CAAC;EAAA,CACC,CAAC;AAEV","ignoreList":[]}
|
|
@@ -7,9 +7,15 @@ import { cn } from '@cdx-ui/utils';
|
|
|
7
7
|
import { Image as ForgeImage } from '../Image/Image';
|
|
8
8
|
import { HStack } from '../Stack/HStack';
|
|
9
9
|
import { Text } from '../Text';
|
|
10
|
+
import { FdicLockup } from './FdicLockup';
|
|
10
11
|
import { insuranceDisclosureLogoVariants, insuranceDisclosureRootVariants, insuranceDisclosureTextVariants } from './styles';
|
|
12
|
+
|
|
13
|
+
/** Bundled official FDIC lockup — omit `logoSource` to use the default mark. */
|
|
14
|
+
|
|
15
|
+
/** Custom logo override — `logoAccessibilityLabel` is required. */
|
|
11
16
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
17
|
export const InsuranceDisclosure = /*#__PURE__*/forwardRef(function InsuranceDisclosure({
|
|
18
|
+
framed = false,
|
|
13
19
|
logoSource,
|
|
14
20
|
logoAccessibilityLabel,
|
|
15
21
|
label,
|
|
@@ -17,31 +23,43 @@ export const InsuranceDisclosure = /*#__PURE__*/forwardRef(function InsuranceDis
|
|
|
17
23
|
style,
|
|
18
24
|
...props
|
|
19
25
|
}, ref) {
|
|
26
|
+
const useCustomLogo = logoSource != null;
|
|
20
27
|
return /*#__PURE__*/_jsxs(HStack, {
|
|
21
28
|
ref: ref,
|
|
22
29
|
space: "md",
|
|
23
|
-
className: cn(insuranceDisclosureRootVariants(
|
|
30
|
+
className: cn(insuranceDisclosureRootVariants({
|
|
31
|
+
framed
|
|
32
|
+
}), className),
|
|
24
33
|
style: style,
|
|
25
34
|
...props,
|
|
26
35
|
...mergeDataAttributes(props, dataAttributes({
|
|
27
36
|
slot: 'insurance-disclosure'
|
|
28
37
|
})),
|
|
29
|
-
children: [/*#__PURE__*/_jsx(ForgeImage, {
|
|
38
|
+
children: [useCustomLogo ? /*#__PURE__*/_jsx(ForgeImage, {
|
|
30
39
|
source: logoSource,
|
|
31
40
|
accessibilityLabel: logoAccessibilityLabel,
|
|
32
|
-
accessible:
|
|
41
|
+
accessible: logoAccessibilityLabel != null,
|
|
33
42
|
resizeMode: "contain",
|
|
34
43
|
className: insuranceDisclosureLogoVariants(),
|
|
35
44
|
...mergeDataAttributes({}, dataAttributes({
|
|
36
45
|
slot: 'insurance-disclosure-logo'
|
|
37
46
|
}))
|
|
47
|
+
}) : /*#__PURE__*/_jsx(View, {
|
|
48
|
+
accessible: true,
|
|
49
|
+
accessibilityRole: "image",
|
|
50
|
+
accessibilityLabel: "FDIC",
|
|
51
|
+
className: insuranceDisclosureLogoVariants(),
|
|
52
|
+
...mergeDataAttributes({}, dataAttributes({
|
|
53
|
+
slot: 'insurance-disclosure-logo'
|
|
54
|
+
})),
|
|
55
|
+
children: /*#__PURE__*/_jsx(FdicLockup, {})
|
|
38
56
|
}), label ? /*#__PURE__*/_jsx(View, {
|
|
39
57
|
className: "min-w-0 shrink",
|
|
40
58
|
...mergeDataAttributes({}, dataAttributes({
|
|
41
59
|
slot: 'insurance-disclosure-content'
|
|
42
60
|
})),
|
|
43
61
|
children: /*#__PURE__*/_jsx(Text, {
|
|
44
|
-
size: "
|
|
62
|
+
size: "sm",
|
|
45
63
|
className: insuranceDisclosureTextVariants(),
|
|
46
64
|
children: label
|
|
47
65
|
})
|
|
@@ -1 +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;
|
|
1
|
+
{"version":3,"names":["forwardRef","View","dataAttributes","mergeDataAttributes","cn","Image","ForgeImage","HStack","Text","FdicLockup","insuranceDisclosureLogoVariants","insuranceDisclosureRootVariants","insuranceDisclosureTextVariants","jsx","_jsx","jsxs","_jsxs","InsuranceDisclosure","framed","logoSource","logoAccessibilityLabel","label","className","style","props","ref","useCustomLogo","space","slot","children","source","accessibilityLabel","accessible","resizeMode","accessibilityRole","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,SAASC,UAAU,QAAQ,cAAc;AACzC,SACEC,+BAA+B,EAC/BC,+BAA+B,EAC/BC,+BAA+B,QAC1B,UAAU;;AAejB;;AAOA;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAYA,OAAO,MAAMC,mBAAmB,gBAAGjB,UAAU,CAG3C,SAASiB,mBAAmBA,CAC5B;EAAEC,MAAM,GAAG,KAAK;EAAEC,UAAU;EAAEC,sBAAsB;EAAEC,KAAK;EAAEC,SAAS;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EACzFC,GAAG,EACH;EACA,MAAMC,aAAa,GAAGP,UAAU,IAAI,IAAI;EAExC,oBACEH,KAAA,CAACT,MAAM;IACLkB,GAAG,EAAEA,GAAI;IACTE,KAAK,EAAC,IAAI;IACVL,SAAS,EAAElB,EAAE,CAACO,+BAA+B,CAAC;MAAEO;IAAO,CAAC,CAAC,EAAEI,SAAS,CAAE;IACtEC,KAAK,EAAEA,KAAM;IAAA,GACTC,KAAK;IAAA,GACLrB,mBAAmB,CAACqB,KAAK,EAAEtB,cAAc,CAAC;MAAE0B,IAAI,EAAE;IAAuB,CAAC,CAAC,CAAC;IAAAC,QAAA,GAE/EH,aAAa,gBACZZ,IAAA,CAACR,UAAU;MACTwB,MAAM,EAAEX,UAAW;MACnBY,kBAAkB,EAAEX,sBAAuB;MAC3CY,UAAU,EAAEZ,sBAAsB,IAAI,IAAK;MAC3Ca,UAAU,EAAC,SAAS;MACpBX,SAAS,EAAEZ,+BAA+B,CAAC,CAAE;MAAA,GACzCP,mBAAmB,CAAC,CAAC,CAAC,EAAED,cAAc,CAAC;QAAE0B,IAAI,EAAE;MAA4B,CAAC,CAAC;IAAC,CACnF,CAAC,gBAEFd,IAAA,CAACb,IAAI;MACH+B,UAAU;MACVE,iBAAiB,EAAC,OAAO;MACzBH,kBAAkB,EAAC,MAAM;MACzBT,SAAS,EAAEZ,+BAA+B,CAAC,CAAE;MAAA,GACzCP,mBAAmB,CAAC,CAAC,CAAC,EAAED,cAAc,CAAC;QAAE0B,IAAI,EAAE;MAA4B,CAAC,CAAC,CAAC;MAAAC,QAAA,eAElFf,IAAA,CAACL,UAAU,IAAE;IAAC,CACV,CACP,EACAY,KAAK,gBACJP,IAAA,CAACb,IAAI;MACHqB,SAAS,EAAC,gBAAgB;MAAA,GACtBnB,mBAAmB,CAAC,CAAC,CAAC,EAAED,cAAc,CAAC;QAAE0B,IAAI,EAAE;MAA+B,CAAC,CAAC,CAAC;MAAAC,QAAA,eAErFf,IAAA,CAACN,IAAI;QAAC2B,IAAI,EAAC,IAAI;QAACb,SAAS,EAAEV,+BAA+B,CAAC,CAAE;QAAAiB,QAAA,EAC1DR;MAAK,CACF;IAAC,CACH,CAAC,GACL,IAAI;EAAA,CACF,CAAC;AAEb,CAAC,CAAC;AAEFJ,mBAAmB,CAACmB,WAAW,GAAG,qBAAqB","ignoreList":[]}
|
|
@@ -1,7 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { cva } from '@cdx-ui/utils';
|
|
4
|
-
export const insuranceDisclosureRootVariants = cva(['w-full max-w-full items-center justify-start'
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
export const insuranceDisclosureRootVariants = cva(['w-full max-w-full items-center justify-start'], {
|
|
5
|
+
variants: {
|
|
6
|
+
framed: {
|
|
7
|
+
true: ['bg-surface-primary', 'border border-stroke-secondary', 'rounded-[var(--border-radius-default)]', 'px-3 py-2'],
|
|
8
|
+
false: ''
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
defaultVariants: {
|
|
12
|
+
framed: false
|
|
13
|
+
}
|
|
14
|
+
});
|
|
15
|
+
export const insuranceDisclosureLogoVariants = cva(['h-5 w-11 shrink-0']);
|
|
16
|
+
export const insuranceDisclosureTextVariants = cva(['shrink text-content-primary italic [font-family:var(--font-body-italic)]']);
|
|
7
17
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["cva","insuranceDisclosureRootVariants","insuranceDisclosureLogoVariants","insuranceDisclosureTextVariants"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,
|
|
1
|
+
{"version":3,"names":["cva","insuranceDisclosureRootVariants","variants","framed","true","false","defaultVariants","insuranceDisclosureLogoVariants","insuranceDisclosureTextVariants"],"sourceRoot":"../../../../src","sources":["components/InsuranceDisclosure/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;AAEtD,OAAO,MAAMC,+BAA+B,GAAGD,GAAG,CAChD,CAAC,8CAA8C,CAAC,EAChD;EACEE,QAAQ,EAAE;IACRC,MAAM,EAAE;MACNC,IAAI,EAAE,CACJ,oBAAoB,EACpB,gCAAgC,EAChC,wCAAwC,EACxC,WAAW,CACZ;MACDC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,MAAM,EAAE;EACV;AACF,CACF,CAAC;AAMD,OAAO,MAAMI,+BAA+B,GAAGP,GAAG,CAAC,CAAC,mBAAmB,CAAC,CAAC;AAEzE,OAAO,MAAMQ,+BAA+B,GAAGR,GAAG,CAAC,CACjD,0EAA0E,CAC3E,CAAC","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { cva } from '@cdx-ui/utils';
|
|
4
|
-
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/constants';
|
|
4
|
+
import { DISABLED_CURSOR, TRANSITION_COLORS, WEB_NARROW_FIELD_TEXT } from '../../styles/constants';
|
|
5
5
|
|
|
6
6
|
// ── Trigger ─────────────────────────────────────────────────
|
|
7
7
|
|
|
@@ -18,9 +18,15 @@ export const selectTriggerVariants = cva(['flex w-full min-w-0 flex-row items-ce
|
|
|
18
18
|
},
|
|
19
19
|
size: {
|
|
20
20
|
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
21
|
+
// Web <600px: trim vertical padding so 16px / leading-normal (24px line box) fits
|
|
22
|
+
// in h-11. Native and web ≥600px keep py-3 at 14px text (Figma Viewport=Wide).
|
|
23
|
+
'web:max-[600px]:py-2',
|
|
21
24
|
// Native only: subtract one hairline so the wider focus border doesn't shift layout.
|
|
22
25
|
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
23
|
-
small: ['h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
26
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
27
|
+
// Web <600px: grow shell to h-9 so 16px text fits. Native and web ≥600px stay
|
|
28
|
+
// h-8 at 12px text.
|
|
29
|
+
'web:max-[600px]:h-9 web:max-[600px]:min-h-9 web:max-[600px]:py-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
24
30
|
}
|
|
25
31
|
},
|
|
26
32
|
defaultVariants: {
|
|
@@ -34,8 +40,10 @@ export const selectTriggerVariants = cva(['flex w-full min-w-0 flex-row items-ce
|
|
|
34
40
|
export const selectValueVariants = cva(['min-w-0 flex-1 text-start', 'text-content-primary', 'data-[placeholder=true]:text-content-tertiary', 'data-[invalid=true]:text-content-danger'], {
|
|
35
41
|
variants: {
|
|
36
42
|
size: {
|
|
37
|
-
|
|
38
|
-
|
|
43
|
+
// Web <600px: 16px matches Input/Textarea and prevents iOS Safari focus-zoom.
|
|
44
|
+
// Native and web ≥600px keep 14px / 12px (Figma Viewport=Wide).
|
|
45
|
+
default: ['text-[0.875rem]', WEB_NARROW_FIELD_TEXT],
|
|
46
|
+
small: ['text-[0.75rem]', WEB_NARROW_FIELD_TEXT]
|
|
39
47
|
}
|
|
40
48
|
},
|
|
41
49
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","selectTriggerVariants","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","selectIconVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;AACtD,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,wBAAwB;;
|
|
1
|
+
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","WEB_NARROW_FIELD_TEXT","selectTriggerVariants","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","selectIconVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;AACtD,SAASC,eAAe,EAAEC,iBAAiB,EAAEC,qBAAqB,QAAQ,wBAAwB;;AAElG;;AAEA,OAAO,MAAMC,qBAAqB,GAAGJ,GAAG,CACtC,CACE,sEAAsE,EACtE,oBAAoB,EACpB,8BAA8B,EAC9B,wCAAwC,EACxCE,iBAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDD,eAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE,EAChE,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,sEAAsE,EACtE,0CAA0C,CAC3C,EACD;EACEI,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B;MAC/B;MACA;MACA,sBAAsB;MACtB;MACA,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,+BAA+B;MAC/B;MACA;MACA,oEAAoE,EACpE,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;;AAED;;AAEA,OAAO,MAAMI,mBAAmB,GAAGZ,GAAG,CACpC,CACE,2BAA2B,EAC3B,sBAAsB,EACtB,+CAA+C,EAC/C,yCAAyC,CAC1C,EACD;EACEK,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJ;MACA;MACAC,OAAO,EAAE,CAAC,iBAAiB,EAAEN,qBAAqB,CAAC;MACnDO,KAAK,EAAE,CAAC,gBAAgB,EAAEP,qBAAqB;IACjD;EACF,CAAC;EACDQ,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;;AAED;;AAEA,OAAO,MAAMK,kBAAkB,GAAGb,GAAG,CACnC,CACE,kDAAkD,EAClD,uBAAuB,EACvB,yCAAyC,CAC1C,EACD;EACEK,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,QAAQ;MACjBC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { cva } from '@cdx-ui/utils';
|
|
4
|
-
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/constants';
|
|
4
|
+
import { DISABLED_CURSOR, TRANSITION_COLORS, WEB_NARROW_FIELD_TEXT } from '../../styles/constants';
|
|
5
5
|
export const textareaRootVariants = cva([
|
|
6
6
|
// Multiline shell: stretch the field to full width and let the shell grow with it
|
|
7
7
|
// (no fixed height, no overflow-hidden so a web resize handle is never clipped).
|
|
@@ -33,8 +33,10 @@ export const textareaFieldVariants = cva([
|
|
|
33
33
|
'flex-1 min-w-0 bg-transparent p-0', 'text-content-primary', 'placeholder:text-content-tertiary', 'web:outline-none', 'tracking-normal'], {
|
|
34
34
|
variants: {
|
|
35
35
|
size: {
|
|
36
|
-
|
|
37
|
-
|
|
36
|
+
// Web <600px: 16px prevents iOS Safari focus-zoom. Native and web ≥600px keep
|
|
37
|
+
// 14px / 12px (Figma Viewport=Wide).
|
|
38
|
+
default: ['text-[0.875rem]', WEB_NARROW_FIELD_TEXT],
|
|
39
|
+
small: ['text-[0.75rem]', WEB_NARROW_FIELD_TEXT]
|
|
38
40
|
}
|
|
39
41
|
},
|
|
40
42
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","textareaRootVariants","variants","variant","outline","size","default","small","defaultVariants","textareaFieldVariants","textareaFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Textarea/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;AACtD,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,wBAAwB;
|
|
1
|
+
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","WEB_NARROW_FIELD_TEXT","textareaRootVariants","variants","variant","outline","size","default","small","defaultVariants","textareaFieldVariants","textareaFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Textarea/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;AACtD,SAASC,eAAe,EAAEC,iBAAiB,EAAEC,qBAAqB,QAAQ,wBAAwB;AAElG,OAAO,MAAMC,oBAAoB,GAAGJ,GAAG,CACrC;AACE;AACA;AACA,+BAA+B,EAC/B,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCE,iBAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDD,eAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,iEAAiE,EACjE,8DAA8D,EAC9D,gEAAgE;AAChE;AACA;AACA,sEAAsE,EACtE,wDAAwD,EACxD,gEAAgE,EAChE,0CAA0C,CAC3C,EACD;EACEI,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,iBAAiB,EACjB,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,mBAAmB,EACnB,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAED,OAAO,MAAMI,qBAAqB,GAAGZ,GAAG,CACtC;AACE;AACA;AACA,mCAAmC,EACnC,sBAAsB,EACtB,mCAAmC,EACnC,kBAAkB,EAClB,iBAAiB,CAClB,EACD;EACEK,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJ;MACA;MACAC,OAAO,EAAE,CAAC,iBAAiB,EAAEN,qBAAqB,CAAC;MACnDO,KAAK,EAAE,CAAC,gBAAgB,EAAEP,qBAAqB;IACjD;EACF,CAAC;EACDQ,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAED,OAAO,MAAMK,gCAAgC,GAAGb,GAAG,CAAC,CAAC,yBAAyB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=8550-3291
|
|
4
|
+
// source=packages/components/src/components/InsuranceDisclosure/index.tsx
|
|
5
|
+
// component=InsuranceDisclosure
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
const framed = instance.getEnum('framed', {
|
|
9
|
+
true: true,
|
|
10
|
+
false: undefined
|
|
11
|
+
});
|
|
12
|
+
const framedProp = figma.helpers.react.renderProp('framed', framed);
|
|
13
|
+
const label = instance.findText('Statement').textContent;
|
|
14
|
+
export default {
|
|
15
|
+
id: 'insurance-disclosure',
|
|
16
|
+
imports: ["import { InsuranceDisclosure } from '@cdx-ui/components'"],
|
|
17
|
+
example: figma.code`
|
|
18
|
+
<InsuranceDisclosure label="${label}"${framedProp} />`
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=InsuranceDisclosure.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","framed","getEnum","true","false","undefined","framedProp","helpers","react","renderProp","label","findText","textContent","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/InsuranceDisclosure.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,MAAM,GAAGF,QAAQ,CAACG,OAAO,CAAC,QAAQ,EAAE;EACxCC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGR,KAAK,CAACS,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,QAAQ,EAAER,MAAM,CAAC;AAEnE,MAAMS,KAAK,GAAIX,QAAQ,CAACY,QAAQ,CAAC,WAAW,CAAC,CAAgCC,WAAW;AAExF,eAAe;EACbC,EAAE,EAAE,sBAAsB;EAC1BC,OAAO,EAAE,CAAC,0DAA0D,CAAC;EACrEC,OAAO,EAAEjB,KAAK,CAACkB,IAAI;AACrB,8BAA8BN,KAAK,IAAIJ,UAAU;AACjD,CAAC","ignoreList":[]}
|
|
@@ -9,4 +9,8 @@ export const TRANSITION_COLORS = 'transition-colors duration-150';
|
|
|
9
9
|
// ─── Disabled ────────────────────────────────────────────
|
|
10
10
|
export const DISABLED_OPACITY = 'data-[disabled=true]:opacity-50';
|
|
11
11
|
export const DISABLED_CURSOR = 'data-[disabled=true]:cursor-not-allowed data-[disabled=true]:pointer-events-none';
|
|
12
|
+
|
|
13
|
+
// Web-only iOS Safari focus-zoom guard. Figma Viewport=Narrow (<600px) uses body/lg
|
|
14
|
+
// (16px / 24px); Viewport=Wide (≥600px) keeps the size variant's original px size.
|
|
15
|
+
export const WEB_NARROW_FIELD_TEXT = 'web:max-[600px]:text-base web:max-[600px]:leading-normal';
|
|
12
16
|
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["TRANSITION_COLORS","DISABLED_OPACITY","DISABLED_CURSOR"],"sourceRoot":"../../../src","sources":["styles/constants.ts"],"mappings":";;AAAA;AACA;;AAEA;AACA,OAAO,MAAMA,iBAAiB,GAAG,gCAAgC;;AAEjE;AACA,OAAO,MAAMC,gBAAgB,GAAG,iCAAiC;AACjE,OAAO,MAAMC,eAAe,GAC1B,kFAAkF","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["TRANSITION_COLORS","DISABLED_OPACITY","DISABLED_CURSOR","WEB_NARROW_FIELD_TEXT"],"sourceRoot":"../../../src","sources":["styles/constants.ts"],"mappings":";;AAAA;AACA;;AAEA;AACA,OAAO,MAAMA,iBAAiB,GAAG,gCAAgC;;AAEjE;AACA,OAAO,MAAMC,gBAAgB,GAAG,iCAAiC;AACjE,OAAO,MAAMC,eAAe,GAC1B,kFAAkF;;AAEpF;AACA;AACA,OAAO,MAAMC,qBAAqB,GAAG,0DAA0D","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAGvD,eAAO,MAAM,iBAAiB;;;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAGvD,eAAO,MAAM,iBAAiB;;;8EA2D7B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;8EA2B9B,CAAC;AAEF,eAAO,MAAM,iBAAiB,oFAA4D,CAAC;AAE3F,eAAO,MAAM,iBAAiB;;8EAU5B,CAAC;AAEH,eAAO,MAAM,6BAA6B,oFAAmC,CAAC;AAE9E,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FdicLockup.d.ts","sourceRoot":"","sources":["../../../../src/components/InsuranceDisclosure/FdicLockup.tsx"],"names":[],"mappings":"AAIA,wBAAgB,UAAU,4CAkBzB"}
|
|
@@ -1,10 +1,31 @@
|
|
|
1
1
|
import { View, type ImageSourcePropType } from 'react-native';
|
|
2
2
|
import { type HStackProps } from '../Stack/HStack';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
type InsuranceDisclosureSharedProps = Omit<HStackProps, 'children'> & {
|
|
4
|
+
/**
|
|
5
|
+
* When `true`, renders surface chrome (background, border, radius, padding).
|
|
6
|
+
* Defaults to `false` — unframed disclosures have no border or padding.
|
|
7
|
+
*
|
|
8
|
+
* @breakingChange Prior versions always rendered a bordered container with `p-4`.
|
|
9
|
+
* Pass `framed` to restore chrome; padding is now `px-3 py-2`.
|
|
10
|
+
*/
|
|
11
|
+
framed?: boolean;
|
|
6
12
|
label?: string;
|
|
7
13
|
className?: string;
|
|
14
|
+
};
|
|
15
|
+
/** Bundled official FDIC lockup — omit `logoSource` to use the default mark. */
|
|
16
|
+
export interface InsuranceDisclosureBundledLogoProps extends InsuranceDisclosureSharedProps {
|
|
17
|
+
logoSource?: undefined;
|
|
18
|
+
/** Ignored when the bundled FDIC lockup is used. */
|
|
19
|
+
logoAccessibilityLabel?: string;
|
|
20
|
+
}
|
|
21
|
+
/** Custom logo override — `logoAccessibilityLabel` is required. */
|
|
22
|
+
export interface InsuranceDisclosureCustomLogoProps extends InsuranceDisclosureSharedProps {
|
|
23
|
+
/** Logo image — a remote URI string or a React Native image source. */
|
|
24
|
+
logoSource: string | ImageSourcePropType;
|
|
25
|
+
/** Accessible label for the custom logo, announced by assistive technology. */
|
|
26
|
+
logoAccessibilityLabel: string;
|
|
8
27
|
}
|
|
28
|
+
export type InsuranceDisclosureProps = InsuranceDisclosureBundledLogoProps | InsuranceDisclosureCustomLogoProps;
|
|
9
29
|
export declare const InsuranceDisclosure: import("react").ForwardRefExoticComponent<InsuranceDisclosureProps & import("react").RefAttributes<View>>;
|
|
30
|
+
export {};
|
|
10
31
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +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;
|
|
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;AAS3D,KAAK,8BAA8B,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC,GAAG;IACpE;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,gFAAgF;AAChF,MAAM,WAAW,mCAAoC,SAAQ,8BAA8B;IACzF,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,oDAAoD;IACpD,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC;AAED,mEAAmE;AACnE,MAAM,WAAW,kCAAmC,SAAQ,8BAA8B;IACxF,uEAAuE;IACvE,UAAU,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACzC,+EAA+E;IAC/E,sBAAsB,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,MAAM,wBAAwB,GAChC,mCAAmC,GACnC,kCAAkC,CAAC;AAEvC,eAAO,MAAM,mBAAmB,2GAkD9B,CAAC"}
|
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
import { type VariantProps } from '@cdx-ui/utils';
|
|
2
|
+
export declare const insuranceDisclosureRootVariants: (props?: ({
|
|
3
|
+
framed?: boolean | null | undefined;
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export type InsuranceDisclosureRootVariantProps = VariantProps<typeof insuranceDisclosureRootVariants>;
|
|
2
6
|
export declare const insuranceDisclosureLogoVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
3
7
|
export declare const insuranceDisclosureTextVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
4
8
|
//# sourceMappingURL=styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/InsuranceDisclosure/styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/InsuranceDisclosure/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAEvD,eAAO,MAAM,+BAA+B;;8EAkB3C,CAAC;AAEF,MAAM,MAAM,mCAAmC,GAAG,YAAY,CAC5D,OAAO,+BAA+B,CACvC,CAAC;AAEF,eAAO,MAAM,+BAA+B,oFAA6B,CAAC;AAE1E,eAAO,MAAM,+BAA+B,oFAE1C,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAKvD,eAAO,MAAM,qBAAqB;;;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAKvD,eAAO,MAAM,qBAAqB;;;8EAqEjC,CAAC;AAIF,eAAO,MAAM,mBAAmB;;8EAoB/B,CAAC;AAIF,eAAO,MAAM,kBAAkB;;8EAiB9B,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Textarea/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAGvD,eAAO,MAAM,oBAAoB;;;8EAuDhC,CAAC;AAEF,eAAO,MAAM,qBAAqB;;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Textarea/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAGvD,eAAO,MAAM,oBAAoB;;;8EAuDhC,CAAC;AAEF,eAAO,MAAM,qBAAqB;;8EAuBjC,CAAC;AAEF,eAAO,MAAM,gCAAgC,oFAAmC,CAAC;AAEjF,MAAM,MAAM,oBAAoB,GAAG,YAAY,CAAC,OAAO,oBAAoB,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InsuranceDisclosure.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/InsuranceDisclosure.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AAY1B,wBAKE"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export declare const TRANSITION_COLORS = "transition-colors duration-150";
|
|
2
2
|
export declare const DISABLED_OPACITY = "data-[disabled=true]:opacity-50";
|
|
3
3
|
export declare const DISABLED_CURSOR = "data-[disabled=true]:cursor-not-allowed data-[disabled=true]:pointer-events-none";
|
|
4
|
+
export declare const WEB_NARROW_FIELD_TEXT = "web:max-[600px]:text-base web:max-[600px]:leading-normal";
|
|
4
5
|
//# sourceMappingURL=constants.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/styles/constants.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,mCAAmC,CAAC;AAGlE,eAAO,MAAM,gBAAgB,oCAAoC,CAAC;AAClE,eAAO,MAAM,eAAe,qFACwD,CAAC"}
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/styles/constants.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,mCAAmC,CAAC;AAGlE,eAAO,MAAM,gBAAgB,oCAAoC,CAAC;AAClE,eAAO,MAAM,eAAe,qFACwD,CAAC;AAIrF,eAAO,MAAM,qBAAqB,6DAA6D,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cdx-ui/components",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -81,10 +81,10 @@
|
|
|
81
81
|
"@marceloterreiro/flash-calendar": "2.0.0",
|
|
82
82
|
"react-native-reanimated-carousel": "5.0.0-beta.5",
|
|
83
83
|
"uniwind": "1.10.0",
|
|
84
|
-
"@cdx-ui/
|
|
85
|
-
"@cdx-ui/
|
|
86
|
-
"@cdx-ui/
|
|
87
|
-
"@cdx-ui/formatters": "0.1.
|
|
84
|
+
"@cdx-ui/icons": "0.1.1",
|
|
85
|
+
"@cdx-ui/primitives": "0.1.1",
|
|
86
|
+
"@cdx-ui/utils": "0.1.1",
|
|
87
|
+
"@cdx-ui/formatters": "0.1.1"
|
|
88
88
|
},
|
|
89
89
|
"devDependencies": {
|
|
90
90
|
"@react-navigation/bottom-tabs": "*",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { cva, type VariantProps } from '@cdx-ui/utils';
|
|
2
|
-
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/constants';
|
|
2
|
+
import { DISABLED_CURSOR, TRANSITION_COLORS, WEB_NARROW_FIELD_TEXT } from '../../styles/constants';
|
|
3
3
|
|
|
4
4
|
export const inputRootVariants = cva(
|
|
5
5
|
[
|
|
@@ -39,11 +39,17 @@ export const inputRootVariants = cva(
|
|
|
39
39
|
size: {
|
|
40
40
|
default: [
|
|
41
41
|
'h-11 min-h-11 px-4 py-3 gap-4',
|
|
42
|
+
// Web <600px: trim vertical padding so 16px / leading-normal (24px line box) fits
|
|
43
|
+
// in h-11. Native and web ≥600px keep py-3 at 14px text (Figma Viewport=Wide).
|
|
44
|
+
'web:max-[600px]:py-2',
|
|
42
45
|
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]',
|
|
43
46
|
'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
44
47
|
],
|
|
45
48
|
small: [
|
|
46
49
|
'h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
50
|
+
// Web <600px: grow shell to h-9 so 16px text fits. Native and web ≥600px stay
|
|
51
|
+
// h-8 at 12px text.
|
|
52
|
+
'web:max-[600px]:h-9 web:max-[600px]:min-h-9 web:max-[600px]:py-1.5',
|
|
47
53
|
'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
48
54
|
'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
49
55
|
],
|
|
@@ -73,8 +79,10 @@ export const inputFieldVariants = cva(
|
|
|
73
79
|
{
|
|
74
80
|
variants: {
|
|
75
81
|
size: {
|
|
76
|
-
|
|
77
|
-
|
|
82
|
+
// Web <600px: 16px prevents iOS Safari focus-zoom. Native and web ≥600px keep
|
|
83
|
+
// 14px / 12px (Figma Viewport=Wide).
|
|
84
|
+
default: ['text-[0.875rem]', WEB_NARROW_FIELD_TEXT],
|
|
85
|
+
small: ['text-[0.75rem]', WEB_NARROW_FIELD_TEXT],
|
|
78
86
|
},
|
|
79
87
|
},
|
|
80
88
|
defaultVariants: {
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Path, Svg } from 'react-native-svg';
|
|
2
|
+
|
|
3
|
+
const FDIC_NAVY = '#003366';
|
|
4
|
+
|
|
5
|
+
export function FdicLockup() {
|
|
6
|
+
return (
|
|
7
|
+
<Svg width="100%" height="100%" viewBox="0 0 44 20" fill="none">
|
|
8
|
+
<Path
|
|
9
|
+
d="M5.39953 18.3086H0.896923V1.73399H10.1587V6.06628H5.39953V8.7493H9.88382V13.0821H5.39953V18.3086Z"
|
|
10
|
+
fill={FDIC_NAVY}
|
|
11
|
+
/>
|
|
12
|
+
<Path d="M30.228 1.69895H25.7254V18.308H30.228V1.69895Z" fill={FDIC_NAVY} />
|
|
13
|
+
<Path
|
|
14
|
+
d="M39.4208 13.924C37.2579 13.924 35.4679 12.1616 35.4679 10.0003C35.4679 7.83897 37.2579 6.07598 39.4208 6.07598C41.3929 6.07598 42.424 7.12483 43.1031 8.50623V2.55916C43.1031 2.55916 41.1094 1.665 39.2516 1.665C35.1252 1.665 30.6543 5.46047 30.6543 10.0003C30.6543 15.5582 34.9187 18.335 39.2516 18.335C41.1089 18.335 43.1031 17.4419 43.1031 17.4419V11.5466C42.2903 12.9479 41.3821 13.924 39.4208 13.924Z"
|
|
15
|
+
fill={FDIC_NAVY}
|
|
16
|
+
/>
|
|
17
|
+
<Path
|
|
18
|
+
d="M15.3172 1.73399C18.1366 1.73399 24.946 2.42118 24.946 10.0132C24.946 17.6209 18.8254 18.2935 15.3172 18.293H10.7785V1.73399H15.3172ZM20.4752 9.98679C20.4752 7.02943 18.1027 5.99783 15.3102 5.99783V13.9758C18.1027 13.9758 20.4752 12.9436 20.4752 9.98679Z"
|
|
19
|
+
fill={FDIC_NAVY}
|
|
20
|
+
/>
|
|
21
|
+
</Svg>
|
|
22
|
+
);
|
|
23
|
+
}
|
|
@@ -5,49 +5,89 @@ import { cn } from '@cdx-ui/utils';
|
|
|
5
5
|
import { Image as ForgeImage } from '../Image/Image';
|
|
6
6
|
import { HStack, type HStackProps } from '../Stack/HStack';
|
|
7
7
|
import { Text } from '../Text';
|
|
8
|
+
import { FdicLockup } from './FdicLockup';
|
|
8
9
|
import {
|
|
9
10
|
insuranceDisclosureLogoVariants,
|
|
10
11
|
insuranceDisclosureRootVariants,
|
|
11
12
|
insuranceDisclosureTextVariants,
|
|
12
13
|
} from './styles';
|
|
13
14
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
15
|
+
type InsuranceDisclosureSharedProps = Omit<HStackProps, 'children'> & {
|
|
16
|
+
/**
|
|
17
|
+
* When `true`, renders surface chrome (background, border, radius, padding).
|
|
18
|
+
* Defaults to `false` — unframed disclosures have no border or padding.
|
|
19
|
+
*
|
|
20
|
+
* @breakingChange Prior versions always rendered a bordered container with `p-4`.
|
|
21
|
+
* Pass `framed` to restore chrome; padding is now `px-3 py-2`.
|
|
22
|
+
*/
|
|
23
|
+
framed?: boolean;
|
|
17
24
|
label?: string;
|
|
18
25
|
className?: string;
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
/** Bundled official FDIC lockup — omit `logoSource` to use the default mark. */
|
|
29
|
+
export interface InsuranceDisclosureBundledLogoProps extends InsuranceDisclosureSharedProps {
|
|
30
|
+
logoSource?: undefined;
|
|
31
|
+
/** Ignored when the bundled FDIC lockup is used. */
|
|
32
|
+
logoAccessibilityLabel?: string;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
/** Custom logo override — `logoAccessibilityLabel` is required. */
|
|
36
|
+
export interface InsuranceDisclosureCustomLogoProps extends InsuranceDisclosureSharedProps {
|
|
37
|
+
/** Logo image — a remote URI string or a React Native image source. */
|
|
38
|
+
logoSource: string | ImageSourcePropType;
|
|
39
|
+
/** Accessible label for the custom logo, announced by assistive technology. */
|
|
40
|
+
logoAccessibilityLabel: string;
|
|
19
41
|
}
|
|
20
42
|
|
|
43
|
+
export type InsuranceDisclosureProps =
|
|
44
|
+
| InsuranceDisclosureBundledLogoProps
|
|
45
|
+
| InsuranceDisclosureCustomLogoProps;
|
|
46
|
+
|
|
21
47
|
export const InsuranceDisclosure = forwardRef<
|
|
22
48
|
ComponentRef<typeof HStack>,
|
|
23
49
|
InsuranceDisclosureProps
|
|
24
50
|
>(function InsuranceDisclosure(
|
|
25
|
-
{ logoSource, logoAccessibilityLabel, label, className, style, ...props },
|
|
51
|
+
{ framed = false, logoSource, logoAccessibilityLabel, label, className, style, ...props },
|
|
26
52
|
ref,
|
|
27
53
|
) {
|
|
54
|
+
const useCustomLogo = logoSource != null;
|
|
55
|
+
|
|
28
56
|
return (
|
|
29
57
|
<HStack
|
|
30
58
|
ref={ref}
|
|
31
59
|
space="md"
|
|
32
|
-
className={cn(insuranceDisclosureRootVariants(), className)}
|
|
60
|
+
className={cn(insuranceDisclosureRootVariants({ framed }), className)}
|
|
33
61
|
style={style}
|
|
34
62
|
{...props}
|
|
35
63
|
{...mergeDataAttributes(props, dataAttributes({ slot: 'insurance-disclosure' }))}
|
|
36
64
|
>
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
65
|
+
{useCustomLogo ? (
|
|
66
|
+
<ForgeImage
|
|
67
|
+
source={logoSource}
|
|
68
|
+
accessibilityLabel={logoAccessibilityLabel}
|
|
69
|
+
accessible={logoAccessibilityLabel != null}
|
|
70
|
+
resizeMode="contain"
|
|
71
|
+
className={insuranceDisclosureLogoVariants()}
|
|
72
|
+
{...mergeDataAttributes({}, dataAttributes({ slot: 'insurance-disclosure-logo' }))}
|
|
73
|
+
/>
|
|
74
|
+
) : (
|
|
75
|
+
<View
|
|
76
|
+
accessible
|
|
77
|
+
accessibilityRole="image"
|
|
78
|
+
accessibilityLabel="FDIC"
|
|
79
|
+
className={insuranceDisclosureLogoVariants()}
|
|
80
|
+
{...mergeDataAttributes({}, dataAttributes({ slot: 'insurance-disclosure-logo' }))}
|
|
81
|
+
>
|
|
82
|
+
<FdicLockup />
|
|
83
|
+
</View>
|
|
84
|
+
)}
|
|
45
85
|
{label ? (
|
|
46
86
|
<View
|
|
47
87
|
className="min-w-0 shrink"
|
|
48
88
|
{...mergeDataAttributes({}, dataAttributes({ slot: 'insurance-disclosure-content' }))}
|
|
49
89
|
>
|
|
50
|
-
<Text size="
|
|
90
|
+
<Text size="sm" className={insuranceDisclosureTextVariants()}>
|
|
51
91
|
{label}
|
|
52
92
|
</Text>
|
|
53
93
|
</View>
|
|
@@ -1,12 +1,31 @@
|
|
|
1
|
-
import { cva } from '@cdx-ui/utils';
|
|
1
|
+
import { cva, type VariantProps } from '@cdx-ui/utils';
|
|
2
2
|
|
|
3
|
-
export const insuranceDisclosureRootVariants = cva(
|
|
4
|
-
'w-full max-w-full items-center justify-start',
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
3
|
+
export const insuranceDisclosureRootVariants = cva(
|
|
4
|
+
['w-full max-w-full items-center justify-start'],
|
|
5
|
+
{
|
|
6
|
+
variants: {
|
|
7
|
+
framed: {
|
|
8
|
+
true: [
|
|
9
|
+
'bg-surface-primary',
|
|
10
|
+
'border border-stroke-secondary',
|
|
11
|
+
'rounded-[var(--border-radius-default)]',
|
|
12
|
+
'px-3 py-2',
|
|
13
|
+
],
|
|
14
|
+
false: '',
|
|
15
|
+
},
|
|
16
|
+
},
|
|
17
|
+
defaultVariants: {
|
|
18
|
+
framed: false,
|
|
19
|
+
},
|
|
20
|
+
},
|
|
21
|
+
);
|
|
22
|
+
|
|
23
|
+
export type InsuranceDisclosureRootVariantProps = VariantProps<
|
|
24
|
+
typeof insuranceDisclosureRootVariants
|
|
25
|
+
>;
|
|
9
26
|
|
|
10
|
-
export const insuranceDisclosureLogoVariants = cva(['h-
|
|
27
|
+
export const insuranceDisclosureLogoVariants = cva(['h-5 w-11 shrink-0']);
|
|
11
28
|
|
|
12
|
-
export const insuranceDisclosureTextVariants = cva([
|
|
29
|
+
export const insuranceDisclosureTextVariants = cva([
|
|
30
|
+
'shrink text-content-primary italic [font-family:var(--font-body-italic)]',
|
|
31
|
+
]);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { cva, type VariantProps } from '@cdx-ui/utils';
|
|
2
|
-
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/constants';
|
|
2
|
+
import { DISABLED_CURSOR, TRANSITION_COLORS, WEB_NARROW_FIELD_TEXT } from '../../styles/constants';
|
|
3
3
|
|
|
4
4
|
// ── Trigger ─────────────────────────────────────────────────
|
|
5
5
|
|
|
@@ -46,6 +46,9 @@ export const selectTriggerVariants = cva(
|
|
|
46
46
|
size: {
|
|
47
47
|
default: [
|
|
48
48
|
'h-11 min-h-11 px-4 py-3 gap-4',
|
|
49
|
+
// Web <600px: trim vertical padding so 16px / leading-normal (24px line box) fits
|
|
50
|
+
// in h-11. Native and web ≥600px keep py-3 at 14px text (Figma Viewport=Wide).
|
|
51
|
+
'web:max-[600px]:py-2',
|
|
49
52
|
// Native only: subtract one hairline so the wider focus border doesn't shift layout.
|
|
50
53
|
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]',
|
|
51
54
|
'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
@@ -54,6 +57,9 @@ export const selectTriggerVariants = cva(
|
|
|
54
57
|
],
|
|
55
58
|
small: [
|
|
56
59
|
'h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
60
|
+
// Web <600px: grow shell to h-9 so 16px text fits. Native and web ≥600px stay
|
|
61
|
+
// h-8 at 12px text.
|
|
62
|
+
'web:max-[600px]:h-9 web:max-[600px]:min-h-9 web:max-[600px]:py-1.5',
|
|
57
63
|
'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
58
64
|
'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
59
65
|
'native:data-[state=open]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
@@ -80,8 +86,10 @@ export const selectValueVariants = cva(
|
|
|
80
86
|
{
|
|
81
87
|
variants: {
|
|
82
88
|
size: {
|
|
83
|
-
|
|
84
|
-
|
|
89
|
+
// Web <600px: 16px matches Input/Textarea and prevents iOS Safari focus-zoom.
|
|
90
|
+
// Native and web ≥600px keep 14px / 12px (Figma Viewport=Wide).
|
|
91
|
+
default: ['text-[0.875rem]', WEB_NARROW_FIELD_TEXT],
|
|
92
|
+
small: ['text-[0.75rem]', WEB_NARROW_FIELD_TEXT],
|
|
85
93
|
},
|
|
86
94
|
},
|
|
87
95
|
defaultVariants: {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { cva, type VariantProps } from '@cdx-ui/utils';
|
|
2
|
-
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/constants';
|
|
2
|
+
import { DISABLED_CURSOR, TRANSITION_COLORS, WEB_NARROW_FIELD_TEXT } from '../../styles/constants';
|
|
3
3
|
|
|
4
4
|
export const textareaRootVariants = cva(
|
|
5
5
|
[
|
|
@@ -71,8 +71,10 @@ export const textareaFieldVariants = cva(
|
|
|
71
71
|
{
|
|
72
72
|
variants: {
|
|
73
73
|
size: {
|
|
74
|
-
|
|
75
|
-
|
|
74
|
+
// Web <600px: 16px prevents iOS Safari focus-zoom. Native and web ≥600px keep
|
|
75
|
+
// 14px / 12px (Figma Viewport=Wide).
|
|
76
|
+
default: ['text-[0.875rem]', WEB_NARROW_FIELD_TEXT],
|
|
77
|
+
small: ['text-[0.75rem]', WEB_NARROW_FIELD_TEXT],
|
|
76
78
|
},
|
|
77
79
|
},
|
|
78
80
|
defaultVariants: {
|
package/src/styles/constants.ts
CHANGED
|
@@ -8,3 +8,7 @@ export const TRANSITION_COLORS = 'transition-colors duration-150';
|
|
|
8
8
|
export const DISABLED_OPACITY = 'data-[disabled=true]:opacity-50';
|
|
9
9
|
export const DISABLED_CURSOR =
|
|
10
10
|
'data-[disabled=true]:cursor-not-allowed data-[disabled=true]:pointer-events-none';
|
|
11
|
+
|
|
12
|
+
// Web-only iOS Safari focus-zoom guard. Figma Viewport=Narrow (<600px) uses body/lg
|
|
13
|
+
// (16px / 24px); Viewport=Wide (≥600px) keeps the size variant's original px size.
|
|
14
|
+
export const WEB_NARROW_FIELD_TEXT = 'web:max-[600px]:text-base web:max-[600px]:leading-normal';
|