@cdx-ui/components 0.0.1-beta.23 → 0.0.1-beta.24
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/Card/index.js +7 -1
- package/lib/commonjs/components/Card/index.js.map +1 -1
- package/lib/commonjs/components/Card/styles.js +12 -2
- package/lib/commonjs/components/Card/styles.js.map +1 -1
- package/lib/commonjs/figma/Card.Header.figma.js +28 -0
- package/lib/commonjs/figma/Card.Header.figma.js.map +1 -0
- package/lib/commonjs/figma/Card.figma.js +42 -0
- package/lib/commonjs/figma/Card.figma.js.map +1 -0
- package/lib/module/components/Card/index.js +7 -1
- package/lib/module/components/Card/index.js.map +1 -1
- package/lib/module/components/Card/styles.js +12 -2
- package/lib/module/components/Card/styles.js.map +1 -1
- package/lib/module/figma/Card.Header.figma.js +22 -0
- package/lib/module/figma/Card.Header.figma.js.map +1 -0
- package/lib/module/figma/Card.figma.js +36 -0
- package/lib/module/figma/Card.figma.js.map +1 -0
- package/lib/typescript/components/Card/index.d.ts +2 -2
- package/lib/typescript/components/Card/index.d.ts.map +1 -1
- package/lib/typescript/components/Card/styles.d.ts +4 -1
- package/lib/typescript/components/Card/styles.d.ts.map +1 -1
- package/lib/typescript/figma/Card.Header.figma.d.ts +8 -0
- package/lib/typescript/figma/Card.Header.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Card.figma.d.ts +8 -0
- package/lib/typescript/figma/Card.figma.d.ts.map +1 -0
- package/package.json +4 -4
- package/src/components/Card/index.tsx +9 -4
- package/src/components/Card/styles.ts +15 -3
|
@@ -92,9 +92,15 @@ const CardFooter = /*#__PURE__*/(0, _react.forwardRef)(({
|
|
|
92
92
|
className,
|
|
93
93
|
children,
|
|
94
94
|
style,
|
|
95
|
+
fullBleed,
|
|
95
96
|
...props
|
|
96
97
|
}, ref) => {
|
|
97
|
-
const
|
|
98
|
+
const {
|
|
99
|
+
fullBleed: fullBleedFromContext
|
|
100
|
+
} = useCardStyleContext();
|
|
101
|
+
const computedClassName = (0, _utils.cn)((0, _styles.cardFooterVariants)({
|
|
102
|
+
fullBleed: fullBleed ?? fullBleedFromContext
|
|
103
|
+
}), className);
|
|
98
104
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
99
105
|
ref: ref,
|
|
100
106
|
className: computedClassName,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_reactNative","_utils","_styles","_jsxRuntime","SCOPE","Root","withStyleContext","View","useCardStyleContext","useStyleContext","CardRoot","forwardRef","className","children","style","fullBleed","props","ref","computedClassName","cn","cardRootVariants","jsx","context","displayName","CardHeader","cardHeaderVariants","CardContent","fullBleedFromContext","cardContentVariants","CardFooter","cardFooterVariants","Card","exports","Header","Content","Footer"],"sourceRoot":"../../../../src","sources":["components/Card/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_utils","_styles","_jsxRuntime","SCOPE","Root","withStyleContext","View","useCardStyleContext","useStyleContext","CardRoot","forwardRef","className","children","style","fullBleed","props","ref","computedClassName","cn","cardRootVariants","jsx","context","displayName","CardHeader","cardHeaderVariants","CardContent","fullBleedFromContext","cardContentVariants","CardFooter","cardFooterVariants","Card","exports","Header","Content","Footer"],"sourceRoot":"../../../../src","sources":["components/Card/index.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AAQkB,IAAAI,WAAA,GAAAJ,OAAA;AAElB;AACA;AACA;AAEA,MAAMK,KAAK,GAAG,MAAM;AAEpB,MAAMC,IAAI,GAAG,IAAAC,uBAAgB,EAACC,iBAAI,EAAEH,KAAK,CAAC;AAE1C,MAAMI,mBAAmB,GAAGA,CAAA,KAAM,IAAAC,sBAAe,EAACL,KAAK,CAAqB;AAO5E,MAAMM,QAAQ,gBAAG,IAAAC,iBAAU,EACzB,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAEC,SAAS;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC5D,MAAMC,iBAAiB,GAAG,IAAAC,SAAE,EAAC,IAAAC,wBAAgB,EAAC,CAAC,EAAER,SAAS,CAAC;EAE3D,oBACE,IAAAT,WAAA,CAAAkB,GAAA,EAAChB,IAAI;IACHY,GAAG,EAAEA,GAAI;IACTL,SAAS,EAAEM,iBAAkB;IAC7BJ,KAAK,EAAEA,KAAM;IACbQ,OAAO,EAAE;MAAEP;IAAU,CAAE;IAAA,GACnBC,KAAK;IAAAH,QAAA,EAERA;EAAQ,CACL,CAAC;AAEX,CACF,CAAC;AAEDH,QAAQ,CAACa,WAAW,GAAG,MAAM;;AAE7B;AACA;AACA;;AAOA,MAAMC,UAAU,gBAAG,IAAAb,iBAAU,EAC3B,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAE,GAAGE;AAAM,CAAC,EAAEC,GAAG,KAAK;EACjD,MAAMC,iBAAiB,GAAG,IAAAC,SAAE,EAAC,IAAAM,0BAAkB,EAAC,CAAC,EAAEb,SAAS,CAAC;EAE7D,oBACE,IAAAT,WAAA,CAAAkB,GAAA,EAACrB,YAAA,CAAAO,IAAI;IAACU,GAAG,EAAEA,GAAI;IAACL,SAAS,EAAEM,iBAAkB;IAACJ,KAAK,EAAEA,KAAM;IAAA,GAAKE,KAAK;IAAAH,QAAA,EAClEA;EAAQ,CACL,CAAC;AAEX,CACF,CAAC;AAEDW,UAAU,CAACD,WAAW,GAAG,aAAa;;AAEtC;AACA;AACA;;AAOA,MAAMG,WAAW,gBAAG,IAAAf,iBAAU,EAC5B,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAEC,SAAS;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC5D,MAAM;IAAEF,SAAS,EAAEY;EAAqB,CAAC,GAAGnB,mBAAmB,CAAC,CAAC;EACjE,MAAMU,iBAAiB,GAAG,IAAAC,SAAE,EAC1B,IAAAS,2BAAmB,EAAC;IAAEb,SAAS,EAAEA,SAAS,IAAIY;EAAqB,CAAC,CAAC,EACrEf,SACF,CAAC;EAED,oBACE,IAAAT,WAAA,CAAAkB,GAAA,EAACrB,YAAA,CAAAO,IAAI;IAACU,GAAG,EAAEA,GAAI;IAACL,SAAS,EAAEM,iBAAkB;IAACJ,KAAK,EAAEA,KAAM;IAAA,GAAKE,KAAK;IAAAH,QAAA,EAClEA;EAAQ,CACL,CAAC;AAEX,CACF,CAAC;AAEDa,WAAW,CAACH,WAAW,GAAG,cAAc;;AAExC;AACA;AACA;;AAOA,MAAMM,UAAU,gBAAG,IAAAlB,iBAAU,EAC3B,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAEC,SAAS;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC5D,MAAM;IAAEF,SAAS,EAAEY;EAAqB,CAAC,GAAGnB,mBAAmB,CAAC,CAAC;EACjE,MAAMU,iBAAiB,GAAG,IAAAC,SAAE,EAC1B,IAAAW,0BAAkB,EAAC;IAAEf,SAAS,EAAEA,SAAS,IAAIY;EAAqB,CAAC,CAAC,EACpEf,SACF,CAAC;EAED,oBACE,IAAAT,WAAA,CAAAkB,GAAA,EAACrB,YAAA,CAAAO,IAAI;IAACU,GAAG,EAAEA,GAAI;IAACL,SAAS,EAAEM,iBAAkB;IAACJ,KAAK,EAAEA,KAAM;IAAA,GAAKE,KAAK;IAAAH,QAAA,EAClEA;EAAQ,CACL,CAAC;AAEX,CACF,CAAC;AAEDgB,UAAU,CAACN,WAAW,GAAG,aAAa;;AAEtC;AACA;AACA;;AAQO,MAAMQ,IAAI,GAAAC,OAAA,CAAAD,IAAA,GAAGrB,QAAiC;AAErDqB,IAAI,CAACE,MAAM,GAAGT,UAAU;AACxBO,IAAI,CAACG,OAAO,GAAGR,WAAW;AAC1BK,IAAI,CAACI,MAAM,GAAGN,UAAU","ignoreList":[]}
|
|
@@ -18,7 +18,7 @@ const cardRootVariants = exports.cardRootVariants = (0, _classVarianceAuthority.
|
|
|
18
18
|
|
|
19
19
|
// ── Header ──────────────────────────────────────────────────
|
|
20
20
|
|
|
21
|
-
const cardHeaderVariants = exports.cardHeaderVariants = (0, _classVarianceAuthority.cva)(['
|
|
21
|
+
const cardHeaderVariants = exports.cardHeaderVariants = (0, _classVarianceAuthority.cva)(['border-t-8 border-t-surface-brand-strong', 'border-b border-solid border-b-stroke-secondary', 'flex-row items-center justify-between gap-0.5', 'px-5 py-3']);
|
|
22
22
|
|
|
23
23
|
// ── Title ───────────────────────────────────────────────────
|
|
24
24
|
|
|
@@ -36,5 +36,15 @@ const cardContentVariants = exports.cardContentVariants = (0, _classVarianceAuth
|
|
|
36
36
|
|
|
37
37
|
// ── Footer ──────────────────────────────────────────────────
|
|
38
38
|
|
|
39
|
-
const cardFooterVariants = exports.cardFooterVariants = (0, _classVarianceAuthority.cva)(['
|
|
39
|
+
const cardFooterVariants = exports.cardFooterVariants = (0, _classVarianceAuthority.cva)(['flex-col items-stretch gap-2'], {
|
|
40
|
+
variants: {
|
|
41
|
+
fullBleed: {
|
|
42
|
+
true: 'p-5',
|
|
43
|
+
false: 'px-5 pb-5 pt-0'
|
|
44
|
+
}
|
|
45
|
+
},
|
|
46
|
+
defaultVariants: {
|
|
47
|
+
fullBleed: false
|
|
48
|
+
}
|
|
49
|
+
});
|
|
40
50
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_classVarianceAuthority","require","cardRootVariants","exports","cva","variants","fullBleed","true","false","cardHeaderVariants","cardTitleVariants","cardContentVariants","cardFooterVariants"],"sourceRoot":"../../../../src","sources":["components/Card/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,uBAAA,GAAAC,OAAA;AAEA;;AAEO,MAAMC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,IAAAE,2BAAG,EACjC,CACE,oBAAoB,EACpB,gCAAgC,EAChC,wCAAwC,EACxC,iBAAiB,CAClB,EACD;EACEC,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE;IACT;EACF;AACF,CACF,CAAC;;AAED;;AAEO,MAAMC,kBAAkB,GAAAN,OAAA,CAAAM,kBAAA,GAAG,IAAAL,2BAAG,EAAC,CACpC,iDAAiD,EACjD,
|
|
1
|
+
{"version":3,"names":["_classVarianceAuthority","require","cardRootVariants","exports","cva","variants","fullBleed","true","false","cardHeaderVariants","cardTitleVariants","cardContentVariants","cardFooterVariants","defaultVariants"],"sourceRoot":"../../../../src","sources":["components/Card/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,uBAAA,GAAAC,OAAA;AAEA;;AAEO,MAAMC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,IAAAE,2BAAG,EACjC,CACE,oBAAoB,EACpB,gCAAgC,EAChC,wCAAwC,EACxC,iBAAiB,CAClB,EACD;EACEC,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE;IACT;EACF;AACF,CACF,CAAC;;AAED;;AAEO,MAAMC,kBAAkB,GAAAN,OAAA,CAAAM,kBAAA,GAAG,IAAAL,2BAAG,EAAC,CACpC,0CAA0C,EAC1C,iDAAiD,EACjD,+CAA+C,EAC/C,WAAW,CACZ,CAAC;;AAEF;;AAEO,MAAMM,iBAAiB,GAAAP,OAAA,CAAAO,iBAAA,GAAG,IAAAN,2BAAG,EAAC,CAAC,QAAQ,CAAC,CAAC;;AAEhD;;AAEO,MAAMO,mBAAmB,GAAAR,OAAA,CAAAQ,mBAAA,GAAG,IAAAP,2BAAG,EAAC,CAAC,sBAAsB,EAAE,KAAK,CAAC,EAAE;EACtEC,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE;IACR;EACF;AACF,CAAC,CAAC;;AAEF;;AAEO,MAAMK,kBAAkB,GAAAT,OAAA,CAAAS,kBAAA,GAAG,IAAAR,2BAAG,EAAC,CAAC,8BAA8B,CAAC,EAAE;EACtEC,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE,KAAK;MACXC,KAAK,EAAE;IACT;EACF,CAAC;EACDK,eAAe,EAAE;IACfP,SAAS,EAAE;EACb;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,28 @@
|
|
|
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--React-Native-Components?node-id=455-178
|
|
10
|
+
// source=packages/components/src/components/Card/index.tsx
|
|
11
|
+
// component=Card.Header
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
const showActions = instance.getBoolean('Show Actions?');
|
|
15
|
+
const actionsSlot = instance.getSlot('Actions');
|
|
16
|
+
const title = instance.findText('{Title}').textContent;
|
|
17
|
+
const actions = showActions && actionsSlot ? _figma.default.helpers.react.renderChildren(actionsSlot) : null;
|
|
18
|
+
var _default = exports.default = {
|
|
19
|
+
id: 'card-header',
|
|
20
|
+
// Must match Card.figma.ts when the card nests this template (identical strings → deduped imports).
|
|
21
|
+
imports: ["import { Card, Heading } from '@cdx-ui/components'"],
|
|
22
|
+
example: _figma.default.code`
|
|
23
|
+
<Card.Header>
|
|
24
|
+
<Heading size="sm">${title}</Heading>
|
|
25
|
+
${actions}
|
|
26
|
+
</Card.Header>`
|
|
27
|
+
};
|
|
28
|
+
//# sourceMappingURL=Card.Header.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","showActions","getBoolean","actionsSlot","getSlot","title","findText","textContent","actions","helpers","react","renderChildren","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Card.Header.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;AAEvC,MAAMC,WAAW,GAAGH,QAAQ,CAACI,UAAU,CAAC,eAAe,CAAC;AACxD,MAAMC,WAAW,GAAGL,QAAQ,CAACM,OAAO,CAAC,SAAS,CAAC;AAC/C,MAAMC,KAAK,GAAIP,QAAQ,CAACQ,QAAQ,CAAC,SAAS,CAAC,CAAgCC,WAAW;AAEtF,MAAMC,OAAO,GAAGP,WAAW,IAAIE,WAAW,GAAGJ,cAAK,CAACU,OAAO,CAACC,KAAK,CAACC,cAAc,CAACR,WAAW,CAAC,GAAG,IAAI;AAAC,IAAAS,QAAA,GAAAC,OAAA,CAAAhB,OAAA,GAErF;EACbiB,EAAE,EAAE,aAAa;EACjB;EACAC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAEjB,cAAK,CAACkB,IAAI;AACrB;AACA,uBAAuBZ,KAAK;AAC5B,IAAIG,OAAO;AACX;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,42 @@
|
|
|
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--React-Native-Components?node-id=456-14
|
|
10
|
+
// source=packages/components/src/components/Card/index.tsx
|
|
11
|
+
// component=Card
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
|
|
15
|
+
// VARIANT property uses "true" / "false" strings — omit prop when not full bleed.
|
|
16
|
+
const fullBleed = instance.getEnum('fullBleed', {
|
|
17
|
+
true: true,
|
|
18
|
+
false: undefined
|
|
19
|
+
});
|
|
20
|
+
const showHeader = instance.getBoolean('Show Header?');
|
|
21
|
+
const showFooter = instance.getBoolean('Show Footer?');
|
|
22
|
+
const headerLayer = instance.findInstance('Card.Header');
|
|
23
|
+
const headerSnippet = showHeader && headerLayer?.type === 'INSTANCE' ? headerLayer.executeTemplate().example : null;
|
|
24
|
+
const contentSlot = instance.getSlot('Card.Content');
|
|
25
|
+
const footerSlot = instance.getSlot('Card.Footer');
|
|
26
|
+
const contentChildren = contentSlot ? _figma.default.helpers.react.renderChildren(contentSlot) : null;
|
|
27
|
+
const footerChildren = footerSlot ? _figma.default.helpers.react.renderChildren(footerSlot) : null;
|
|
28
|
+
|
|
29
|
+
// When the header shows: use the exact same import string as Card.Header.figma.ts (Code Connect
|
|
30
|
+
// allows only `import … from 'figma'` in template files; duplicate literals are required for dedupe).
|
|
31
|
+
const componentImport = showHeader ? "import { Card, Heading } from '@cdx-ui/components'" : `import { Card } from '@cdx-ui/components'`;
|
|
32
|
+
var _default = exports.default = {
|
|
33
|
+
id: 'card',
|
|
34
|
+
imports: [componentImport],
|
|
35
|
+
example: _figma.default.code`
|
|
36
|
+
<Card fullBleed={${fullBleed}}>
|
|
37
|
+
${headerSnippet}
|
|
38
|
+
<Card.Content>${contentChildren}</Card.Content>
|
|
39
|
+
${showFooter ? _figma.default.code`<Card.Footer>${footerChildren}</Card.Footer>` : null}
|
|
40
|
+
</Card>`
|
|
41
|
+
};
|
|
42
|
+
//# sourceMappingURL=Card.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","fullBleed","getEnum","true","false","undefined","showHeader","getBoolean","showFooter","headerLayer","findInstance","headerSnippet","type","executeTemplate","example","contentSlot","getSlot","footerSlot","contentChildren","helpers","react","renderChildren","footerChildren","componentImport","_default","exports","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/Card.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA,MAAMC,SAAS,GAAGH,QAAQ,CAACI,OAAO,CAAC,WAAW,EAAE;EAC9CC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AAEF,MAAMC,UAAU,GAAGR,QAAQ,CAACS,UAAU,CAAC,cAAc,CAAC;AACtD,MAAMC,UAAU,GAAGV,QAAQ,CAACS,UAAU,CAAC,cAAc,CAAC;AAEtD,MAAME,WAAW,GAAGX,QAAQ,CAACY,YAAY,CAAC,aAAa,CAAC;AACxD,MAAMC,aAAa,GACjBL,UAAU,IAAIG,WAAW,EAAEG,IAAI,KAAK,UAAU,GAAGH,WAAW,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAE/F,MAAMC,WAAW,GAAGjB,QAAQ,CAACkB,OAAO,CAAC,cAAc,CAAC;AACpD,MAAMC,UAAU,GAAGnB,QAAQ,CAACkB,OAAO,CAAC,aAAa,CAAC;AAElD,MAAME,eAAe,GAAGH,WAAW,GAAGhB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,cAAc,CAACN,WAAW,CAAC,GAAG,IAAI;AAE5F,MAAMO,cAAc,GAAGL,UAAU,GAAGlB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,cAAc,CAACJ,UAAU,CAAC,GAAG,IAAI;;AAEzF;AACA;AACA,MAAMM,eAAe,GAAGjB,UAAU,GAC9B,oDAAoD,GACpD,2CAA2C;AAAC,IAAAkB,QAAA,GAAAC,OAAA,CAAA5B,OAAA,GAEjC;EACb6B,EAAE,EAAE,MAAM;EACVC,OAAO,EAAE,CAACJ,eAAe,CAAC;EAC1BT,OAAO,EAAEf,cAAK,CAAC6B,IAAI;AACrB,mBAAmB3B,SAAS;AAC5B,IAAIU,aAAa;AACjB,kBAAkBO,eAAe;AACjC,IAAIV,UAAU,GAAGT,cAAK,CAAC6B,IAAI,gBAAgBN,cAAc,gBAAgB,GAAG,IAAI;AAChF;AACA,CAAC","ignoreList":[]}
|
|
@@ -89,9 +89,15 @@ const CardFooter = /*#__PURE__*/forwardRef(({
|
|
|
89
89
|
className,
|
|
90
90
|
children,
|
|
91
91
|
style,
|
|
92
|
+
fullBleed,
|
|
92
93
|
...props
|
|
93
94
|
}, ref) => {
|
|
94
|
-
const
|
|
95
|
+
const {
|
|
96
|
+
fullBleed: fullBleedFromContext
|
|
97
|
+
} = useCardStyleContext();
|
|
98
|
+
const computedClassName = cn(cardFooterVariants({
|
|
99
|
+
fullBleed: fullBleed ?? fullBleedFromContext
|
|
100
|
+
}), className);
|
|
95
101
|
return /*#__PURE__*/_jsx(View, {
|
|
96
102
|
ref: ref,
|
|
97
103
|
className: computedClassName,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["forwardRef","View","cn","useStyleContext","withStyleContext","cardContentVariants","cardFooterVariants","cardHeaderVariants","cardRootVariants","jsx","_jsx","SCOPE","Root","useCardStyleContext","CardRoot","className","children","style","fullBleed","props","ref","computedClassName","context","displayName","CardHeader","CardContent","fullBleedFromContext","CardFooter","Card","Header","Content","Footer"],"sourceRoot":"../../../../src","sources":["components/Card/index.tsx"],"mappings":";;AAAA,SAASA,UAAU,QAAwB,OAAO;AAClD,SAASC,IAAI,QAAwB,cAAc;AACnD,SAASC,EAAE,EAAEC,eAAe,EAAEC,gBAAgB,QAAQ,eAAe;AACrE,SACEC,mBAAmB,EACnBC,kBAAkB,EAClBC,kBAAkB,EAClBC,gBAAgB,
|
|
1
|
+
{"version":3,"names":["forwardRef","View","cn","useStyleContext","withStyleContext","cardContentVariants","cardFooterVariants","cardHeaderVariants","cardRootVariants","jsx","_jsx","SCOPE","Root","useCardStyleContext","CardRoot","className","children","style","fullBleed","props","ref","computedClassName","context","displayName","CardHeader","CardContent","fullBleedFromContext","CardFooter","Card","Header","Content","Footer"],"sourceRoot":"../../../../src","sources":["components/Card/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -15,7 +15,7 @@ export const cardRootVariants = cva(['bg-surface-primary', 'border border-stroke
|
|
|
15
15
|
|
|
16
16
|
// ── Header ──────────────────────────────────────────────────
|
|
17
17
|
|
|
18
|
-
export const cardHeaderVariants = cva(['
|
|
18
|
+
export const cardHeaderVariants = cva(['border-t-8 border-t-surface-brand-strong', 'border-b border-solid border-b-stroke-secondary', 'flex-row items-center justify-between gap-0.5', 'px-5 py-3']);
|
|
19
19
|
|
|
20
20
|
// ── Title ───────────────────────────────────────────────────
|
|
21
21
|
|
|
@@ -33,5 +33,15 @@ export const cardContentVariants = cva(['text-content-primary', 'p-5'], {
|
|
|
33
33
|
|
|
34
34
|
// ── Footer ──────────────────────────────────────────────────
|
|
35
35
|
|
|
36
|
-
export const cardFooterVariants = cva(['
|
|
36
|
+
export const cardFooterVariants = cva(['flex-col items-stretch gap-2'], {
|
|
37
|
+
variants: {
|
|
38
|
+
fullBleed: {
|
|
39
|
+
true: 'p-5',
|
|
40
|
+
false: 'px-5 pb-5 pt-0'
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
defaultVariants: {
|
|
44
|
+
fullBleed: false
|
|
45
|
+
}
|
|
46
|
+
});
|
|
37
47
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["cva","cardRootVariants","variants","fullBleed","true","false","cardHeaderVariants","cardTitleVariants","cardContentVariants","cardFooterVariants"],"sourceRoot":"../../../../src","sources":["components/Card/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAAsB,0BAA0B;;AAE5D;;AAEA,OAAO,MAAMC,gBAAgB,GAAGD,GAAG,CACjC,CACE,oBAAoB,EACpB,gCAAgC,EAChC,wCAAwC,EACxC,iBAAiB,CAClB,EACD;EACEE,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE;IACT;EACF;AACF,CACF,CAAC;;AAED;;AAEA,OAAO,MAAMC,kBAAkB,GAAGN,GAAG,CAAC,CACpC,iDAAiD,EACjD,
|
|
1
|
+
{"version":3,"names":["cva","cardRootVariants","variants","fullBleed","true","false","cardHeaderVariants","cardTitleVariants","cardContentVariants","cardFooterVariants","defaultVariants"],"sourceRoot":"../../../../src","sources":["components/Card/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAAsB,0BAA0B;;AAE5D;;AAEA,OAAO,MAAMC,gBAAgB,GAAGD,GAAG,CACjC,CACE,oBAAoB,EACpB,gCAAgC,EAChC,wCAAwC,EACxC,iBAAiB,CAClB,EACD;EACEE,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE,EAAE;MACRC,KAAK,EAAE;IACT;EACF;AACF,CACF,CAAC;;AAED;;AAEA,OAAO,MAAMC,kBAAkB,GAAGN,GAAG,CAAC,CACpC,0CAA0C,EAC1C,iDAAiD,EACjD,+CAA+C,EAC/C,WAAW,CACZ,CAAC;;AAEF;;AAEA,OAAO,MAAMO,iBAAiB,GAAGP,GAAG,CAAC,CAAC,QAAQ,CAAC,CAAC;;AAEhD;;AAEA,OAAO,MAAMQ,mBAAmB,GAAGR,GAAG,CAAC,CAAC,sBAAsB,EAAE,KAAK,CAAC,EAAE;EACtEE,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE;IACR;EACF;AACF,CAAC,CAAC;;AAEF;;AAEA,OAAO,MAAMK,kBAAkB,GAAGT,GAAG,CAAC,CAAC,8BAA8B,CAAC,EAAE;EACtEE,QAAQ,EAAE;IACRC,SAAS,EAAE;MACTC,IAAI,EAAE,KAAK;MACXC,KAAK,EAAE;IACT;EACF,CAAC;EACDK,eAAe,EAAE;IACfP,SAAS,EAAE;EACb;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--React-Native-Components?node-id=455-178
|
|
4
|
+
// source=packages/components/src/components/Card/index.tsx
|
|
5
|
+
// component=Card.Header
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
const showActions = instance.getBoolean('Show Actions?');
|
|
9
|
+
const actionsSlot = instance.getSlot('Actions');
|
|
10
|
+
const title = instance.findText('{Title}').textContent;
|
|
11
|
+
const actions = showActions && actionsSlot ? figma.helpers.react.renderChildren(actionsSlot) : null;
|
|
12
|
+
export default {
|
|
13
|
+
id: 'card-header',
|
|
14
|
+
// Must match Card.figma.ts when the card nests this template (identical strings → deduped imports).
|
|
15
|
+
imports: ["import { Card, Heading } from '@cdx-ui/components'"],
|
|
16
|
+
example: figma.code`
|
|
17
|
+
<Card.Header>
|
|
18
|
+
<Heading size="sm">${title}</Heading>
|
|
19
|
+
${actions}
|
|
20
|
+
</Card.Header>`
|
|
21
|
+
};
|
|
22
|
+
//# sourceMappingURL=Card.Header.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","showActions","getBoolean","actionsSlot","getSlot","title","findText","textContent","actions","helpers","react","renderChildren","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Card.Header.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,WAAW,GAAGF,QAAQ,CAACG,UAAU,CAAC,eAAe,CAAC;AACxD,MAAMC,WAAW,GAAGJ,QAAQ,CAACK,OAAO,CAAC,SAAS,CAAC;AAC/C,MAAMC,KAAK,GAAIN,QAAQ,CAACO,QAAQ,CAAC,SAAS,CAAC,CAAgCC,WAAW;AAEtF,MAAMC,OAAO,GAAGP,WAAW,IAAIE,WAAW,GAAGL,KAAK,CAACW,OAAO,CAACC,KAAK,CAACC,cAAc,CAACR,WAAW,CAAC,GAAG,IAAI;AAEnG,eAAe;EACbS,EAAE,EAAE,aAAa;EACjB;EACAC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAEhB,KAAK,CAACiB,IAAI;AACrB;AACA,uBAAuBV,KAAK;AAC5B,IAAIG,OAAO;AACX;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--React-Native-Components?node-id=456-14
|
|
4
|
+
// source=packages/components/src/components/Card/index.tsx
|
|
5
|
+
// component=Card
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
|
|
9
|
+
// VARIANT property uses "true" / "false" strings — omit prop when not full bleed.
|
|
10
|
+
const fullBleed = instance.getEnum('fullBleed', {
|
|
11
|
+
true: true,
|
|
12
|
+
false: undefined
|
|
13
|
+
});
|
|
14
|
+
const showHeader = instance.getBoolean('Show Header?');
|
|
15
|
+
const showFooter = instance.getBoolean('Show Footer?');
|
|
16
|
+
const headerLayer = instance.findInstance('Card.Header');
|
|
17
|
+
const headerSnippet = showHeader && headerLayer?.type === 'INSTANCE' ? headerLayer.executeTemplate().example : null;
|
|
18
|
+
const contentSlot = instance.getSlot('Card.Content');
|
|
19
|
+
const footerSlot = instance.getSlot('Card.Footer');
|
|
20
|
+
const contentChildren = contentSlot ? figma.helpers.react.renderChildren(contentSlot) : null;
|
|
21
|
+
const footerChildren = footerSlot ? figma.helpers.react.renderChildren(footerSlot) : null;
|
|
22
|
+
|
|
23
|
+
// When the header shows: use the exact same import string as Card.Header.figma.ts (Code Connect
|
|
24
|
+
// allows only `import … from 'figma'` in template files; duplicate literals are required for dedupe).
|
|
25
|
+
const componentImport = showHeader ? "import { Card, Heading } from '@cdx-ui/components'" : `import { Card } from '@cdx-ui/components'`;
|
|
26
|
+
export default {
|
|
27
|
+
id: 'card',
|
|
28
|
+
imports: [componentImport],
|
|
29
|
+
example: figma.code`
|
|
30
|
+
<Card fullBleed={${fullBleed}}>
|
|
31
|
+
${headerSnippet}
|
|
32
|
+
<Card.Content>${contentChildren}</Card.Content>
|
|
33
|
+
${showFooter ? figma.code`<Card.Footer>${footerChildren}</Card.Footer>` : null}
|
|
34
|
+
</Card>`
|
|
35
|
+
};
|
|
36
|
+
//# sourceMappingURL=Card.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","fullBleed","getEnum","true","false","undefined","showHeader","getBoolean","showFooter","headerLayer","findInstance","headerSnippet","type","executeTemplate","example","contentSlot","getSlot","footerSlot","contentChildren","helpers","react","renderChildren","footerChildren","componentImport","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/Card.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA,MAAMC,SAAS,GAAGF,QAAQ,CAACG,OAAO,CAAC,WAAW,EAAE;EAC9CC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AAEF,MAAMC,UAAU,GAAGP,QAAQ,CAACQ,UAAU,CAAC,cAAc,CAAC;AACtD,MAAMC,UAAU,GAAGT,QAAQ,CAACQ,UAAU,CAAC,cAAc,CAAC;AAEtD,MAAME,WAAW,GAAGV,QAAQ,CAACW,YAAY,CAAC,aAAa,CAAC;AACxD,MAAMC,aAAa,GACjBL,UAAU,IAAIG,WAAW,EAAEG,IAAI,KAAK,UAAU,GAAGH,WAAW,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAE/F,MAAMC,WAAW,GAAGhB,QAAQ,CAACiB,OAAO,CAAC,cAAc,CAAC;AACpD,MAAMC,UAAU,GAAGlB,QAAQ,CAACiB,OAAO,CAAC,aAAa,CAAC;AAElD,MAAME,eAAe,GAAGH,WAAW,GAAGjB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,cAAc,CAACN,WAAW,CAAC,GAAG,IAAI;AAE5F,MAAMO,cAAc,GAAGL,UAAU,GAAGnB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,cAAc,CAACJ,UAAU,CAAC,GAAG,IAAI;;AAEzF;AACA;AACA,MAAMM,eAAe,GAAGjB,UAAU,GAC9B,oDAAoD,GACpD,2CAA2C;AAE/C,eAAe;EACbkB,EAAE,EAAE,MAAM;EACVC,OAAO,EAAE,CAACF,eAAe,CAAC;EAC1BT,OAAO,EAAEhB,KAAK,CAAC4B,IAAI;AACrB,mBAAmBzB,SAAS;AAC5B,IAAIU,aAAa;AACjB,kBAAkBO,eAAe;AACjC,IAAIV,UAAU,GAAGV,KAAK,CAAC4B,IAAI,gBAAgBJ,cAAc,gBAAgB,GAAG,IAAI;AAChF;AACA,CAAC","ignoreList":[]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { type ReactNode } from 'react';
|
|
2
2
|
import { View, type ViewProps } from 'react-native';
|
|
3
|
-
import { type
|
|
3
|
+
import { type CardContentVariantProps, type CardFooterVariantProps, type CardVariantProps } from './styles';
|
|
4
4
|
export interface CardProps extends ViewProps, CardVariantProps {
|
|
5
5
|
className?: string;
|
|
6
6
|
children?: ReactNode;
|
|
@@ -16,7 +16,7 @@ export interface CardContentProps extends ViewProps, CardContentVariantProps {
|
|
|
16
16
|
children?: ReactNode;
|
|
17
17
|
}
|
|
18
18
|
declare const CardContent: import("react").ForwardRefExoticComponent<CardContentProps & import("react").RefAttributes<View>>;
|
|
19
|
-
export interface CardFooterProps extends ViewProps {
|
|
19
|
+
export interface CardFooterProps extends ViewProps, CardFooterVariantProps {
|
|
20
20
|
className?: string;
|
|
21
21
|
children?: ReactNode;
|
|
22
22
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,OAAO,EAKL,KAAK,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,OAAO,EAKL,KAAK,uBAAuB,EAC5B,KAAK,sBAAsB,EAC3B,KAAK,gBAAgB,EACtB,MAAM,UAAU,CAAC;AAYlB,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,gBAAgB;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,QAAQ,4FAgBb,CAAC;AAQF,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,UAAU,kGAUf,CAAC;AAQF,MAAM,WAAW,gBAAiB,SAAQ,SAAS,EAAE,uBAAuB;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,WAAW,mGAchB,CAAC;AAQF,MAAM,WAAW,eAAgB,SAAQ,SAAS,EAAE,sBAAsB;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,QAAA,MAAM,UAAU,kGAcf,CAAC;AAQF,KAAK,qBAAqB,GAAG,OAAO,QAAQ,GAAG;IAC7C,MAAM,EAAE,OAAO,UAAU,CAAC;IAC1B,OAAO,EAAE,OAAO,WAAW,CAAC;IAC5B,MAAM,EAAE,OAAO,UAAU,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,IAAI,EAAe,qBAAqB,CAAC"}
|
|
@@ -7,7 +7,10 @@ export declare const cardTitleVariants: (props?: import("class-variance-authorit
|
|
|
7
7
|
export declare const cardContentVariants: (props?: ({
|
|
8
8
|
fullBleed?: boolean | null | undefined;
|
|
9
9
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
|
-
export declare const cardFooterVariants: (props?:
|
|
10
|
+
export declare const cardFooterVariants: (props?: ({
|
|
11
|
+
fullBleed?: boolean | null | undefined;
|
|
12
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
13
|
export type CardVariantProps = VariantProps<typeof cardRootVariants>;
|
|
12
14
|
export type CardContentVariantProps = VariantProps<typeof cardContentVariants>;
|
|
15
|
+
export type CardFooterVariantProps = VariantProps<typeof cardFooterVariants>;
|
|
13
16
|
//# sourceMappingURL=styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAI7D,eAAO,MAAM,gBAAgB;;8EAe5B,CAAC;AAIF,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAI7D,eAAO,MAAM,gBAAgB;;8EAe5B,CAAC;AAIF,eAAO,MAAM,kBAAkB,oFAK7B,CAAC;AAIH,eAAO,MAAM,iBAAiB,oFAAkB,CAAC;AAIjD,eAAO,MAAM,mBAAmB;;8EAM9B,CAAC;AAIH,eAAO,MAAM,kBAAkB;;8EAU7B,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC;AACrE,MAAM,MAAM,uBAAuB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAC/E,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card.Header.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/Card.Header.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AAU1B,wBASE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card.figma.d.ts","sourceRoot":"","sources":["../../../src/figma/Card.figma.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AA8B1B,wBASE"}
|
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.24",
|
|
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.6.1",
|
|
70
|
-
"@cdx-ui/primitives": "0.0.1-beta.
|
|
71
|
-
"@cdx-ui/utils": "0.0.1-beta.
|
|
72
|
-
"@cdx-ui/icons": "0.0.1-beta.
|
|
70
|
+
"@cdx-ui/primitives": "0.0.1-beta.24",
|
|
71
|
+
"@cdx-ui/utils": "0.0.1-beta.24",
|
|
72
|
+
"@cdx-ui/icons": "0.0.1-beta.24"
|
|
73
73
|
},
|
|
74
74
|
"devDependencies": {
|
|
75
75
|
"@types/react": "*",
|
|
@@ -6,8 +6,9 @@ import {
|
|
|
6
6
|
cardFooterVariants,
|
|
7
7
|
cardHeaderVariants,
|
|
8
8
|
cardRootVariants,
|
|
9
|
-
type CardVariantProps,
|
|
10
9
|
type CardContentVariantProps,
|
|
10
|
+
type CardFooterVariantProps,
|
|
11
|
+
type CardVariantProps,
|
|
11
12
|
} from './styles';
|
|
12
13
|
|
|
13
14
|
// =============================================================================
|
|
@@ -99,14 +100,18 @@ CardContent.displayName = 'Card.Content';
|
|
|
99
100
|
// STYLED FOOTER COMPONENT
|
|
100
101
|
// =============================================================================
|
|
101
102
|
|
|
102
|
-
export interface CardFooterProps extends ViewProps {
|
|
103
|
+
export interface CardFooterProps extends ViewProps, CardFooterVariantProps {
|
|
103
104
|
className?: string;
|
|
104
105
|
children?: ReactNode;
|
|
105
106
|
}
|
|
106
107
|
|
|
107
108
|
const CardFooter = forwardRef<View, CardFooterProps>(
|
|
108
|
-
({ className, children, style, ...props }, ref) => {
|
|
109
|
-
const
|
|
109
|
+
({ className, children, style, fullBleed, ...props }, ref) => {
|
|
110
|
+
const { fullBleed: fullBleedFromContext } = useCardStyleContext();
|
|
111
|
+
const computedClassName = cn(
|
|
112
|
+
cardFooterVariants({ fullBleed: fullBleed ?? fullBleedFromContext }),
|
|
113
|
+
className,
|
|
114
|
+
);
|
|
110
115
|
|
|
111
116
|
return (
|
|
112
117
|
<View ref={ref} className={computedClassName} style={style} {...props}>
|
|
@@ -22,9 +22,10 @@ export const cardRootVariants = cva(
|
|
|
22
22
|
// ── Header ──────────────────────────────────────────────────
|
|
23
23
|
|
|
24
24
|
export const cardHeaderVariants = cva([
|
|
25
|
-
'flex-row items-center justify-between px-5 py-3',
|
|
26
25
|
'border-t-8 border-t-surface-brand-strong',
|
|
27
|
-
'border-b border-
|
|
26
|
+
'border-b border-solid border-b-stroke-secondary',
|
|
27
|
+
'flex-row items-center justify-between gap-0.5',
|
|
28
|
+
'px-5 py-3',
|
|
28
29
|
]);
|
|
29
30
|
|
|
30
31
|
// ── Title ───────────────────────────────────────────────────
|
|
@@ -43,7 +44,18 @@ export const cardContentVariants = cva(['text-content-primary', 'p-5'], {
|
|
|
43
44
|
|
|
44
45
|
// ── Footer ──────────────────────────────────────────────────
|
|
45
46
|
|
|
46
|
-
export const cardFooterVariants = cva(['
|
|
47
|
+
export const cardFooterVariants = cva(['flex-col items-stretch gap-2'], {
|
|
48
|
+
variants: {
|
|
49
|
+
fullBleed: {
|
|
50
|
+
true: 'p-5',
|
|
51
|
+
false: 'px-5 pb-5 pt-0',
|
|
52
|
+
},
|
|
53
|
+
},
|
|
54
|
+
defaultVariants: {
|
|
55
|
+
fullBleed: false,
|
|
56
|
+
},
|
|
57
|
+
});
|
|
47
58
|
|
|
48
59
|
export type CardVariantProps = VariantProps<typeof cardRootVariants>;
|
|
49
60
|
export type CardContentVariantProps = VariantProps<typeof cardContentVariants>;
|
|
61
|
+
export type CardFooterVariantProps = VariantProps<typeof cardFooterVariants>;
|