@cdx-ui/components 0.1.4 → 0.1.5

package/README.md

@@ -18,7 +18,7 @@ pnpm add @cdx-ui/components
 - `react-native` >= 0.76.0 _(optional — for native targets)_
 - `react-native-web` >= 0.19.0 _(optional — for web targets)_
 - `react-native-safe-area-context` >= 4.0.0 — required for `SafeAreaView` and `useSafeAreaInsets` re-exports
-- `react-native-reanimated` >= 4.0.0 _(optional — required for `BottomSheet`, `Skeleton`, `Carousel`, `Dialog`, and `AlertDialog`)_
+- `react-native-reanimated` >= 4.0.0 _(optional — required by animated components such as `Dialog`, `Drawer`, `BottomSheet`, and `Carousel`)_
 - `react-native-worklets` >= 0.4.0 _(optional — required alongside `react-native-reanimated` for animated components such as `Dialog`)_
 - `react-native-gesture-handler` >= 2.0.0 _(optional — required for `Dialog`/`AlertDialog` swipe-to-dismiss)_
 - `@shopify/flash-list` >= 2.0.0 _(optional — required for `VirtualizedList`)_

package/lib/commonjs/figma/Calendar.figma.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11954-3139
+// source=packages/components/src/components/Calendar/index.tsx
+// component=Calendar
+
+const instance = _figma.default.selectedInstance;
+
+// `view` (day / year) is internal navigation state toggled from the header at runtime. The code
+// header always includes the year-picker toggle, so hiding it in Figma is flagged in the snippet.
+const hidesYearPicker = instance.getEnum('Show Year Picker?', {
+  true: false,
+  false: true
+});
+var _default = exports.default = {
+  id: 'calendar',
+  imports: ["import { Calendar } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+${hidesYearPicker ? _figma.default.code`{/* Calendar always shows the year-picker toggle; Figma "Show Year Picker?=false" has no code equivalent. */}` : null}
+<Calendar value={value} onValueChange={setValue} aria-label="Date" />`
+};
+//# sourceMappingURL=Calendar.figma.js.map

package/lib/commonjs/figma/Calendar.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","hidesYearPicker","getEnum","true","false","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Calendar.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA;AACA,MAAMC,eAAe,GAAGH,QAAQ,CAACI,OAAO,CAAC,mBAAmB,EAAE;EAC5DC,IAAI,EAAE,KAAK;EACXC,KAAK,EAAE;AACT,CAAC,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAT,OAAA,GAEY;EACbU,EAAE,EAAE,UAAU;EACdC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEV,cAAK,CAACW,IAAI;AACrB,EAAET,eAAe,GAAGF,cAAK,CAACW,IAAI,+GAA+G,GAAG,IAAI;AACpJ;AACA,CAAC","ignoreList":[]}

package/lib/commonjs/figma/Carousel.NextButton.figma.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11445-15033
+// source=packages/components/src/components/Carousel/navButton.tsx
+// component=Carousel.NextButton
+
+const instance = _figma.default.selectedInstance;
+const isDisabled = instance.getEnum('isDisabled', {
+  true: true,
+  false: undefined
+});
+const disabledProp = _figma.default.helpers.react.renderProp('disabled', isDisabled);
+var _default = exports.default = {
+  id: 'carousel-next-button',
+  imports: ["import { Carousel } from '@cdx-ui/components'"],
+  example: _figma.default.code`<Carousel.NextButton${disabledProp} />`,
+  metadata: {
+    nestable: true
+  }
+};
+//# sourceMappingURL=Carousel.NextButton.figma.js.map

package/lib/commonjs/figma/Carousel.NextButton.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","isDisabled","getEnum","true","false","undefined","disabledProp","helpers","react","renderProp","_default","exports","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/Carousel.NextButton.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,UAAU,GAAGH,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,YAAY,GAAGP,cAAK,CAACQ,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,UAAU,EAAER,UAAU,CAAC;AAAC,IAAAS,QAAA,GAAAC,OAAA,CAAAd,OAAA,GAE7D;EACbe,EAAE,EAAE,sBAAsB;EAC1BC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEf,cAAK,CAACgB,IAAI,uBAAuBT,YAAY,KAAK;EAC3DU,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}

package/lib/commonjs/figma/Carousel.Pagination.figma.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=8999-5430
+// source=packages/components/src/components/Carousel/index.tsx
+// component=Carousel.Pagination
+// Figma `segments` is the length of `data`, and `current` is the carousel's runtime position
+// (tracked through the shared progress), so neither maps to a prop.
+var _default = exports.default = {
+  id: 'carousel-pagination',
+  imports: ["import { Carousel } from '@cdx-ui/components'"],
+  example: _figma.default.code`<Carousel.Pagination data={slides} />`,
+  metadata: {
+    nestable: true
+  }
+};
+//# sourceMappingURL=Carousel.Pagination.figma.js.map

package/lib/commonjs/figma/Carousel.Pagination.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","_default","exports","id","imports","example","figma","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/Carousel.Pagination.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;AACA;AAAA,IAAAG,QAAA,GAAAC,OAAA,CAAAF,OAAA,GACe;EACbG,EAAE,EAAE,qBAAqB;EACzBC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEC,cAAK,CAACC,IAAI,uCAAuC;EAC1DC,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}

package/lib/commonjs/figma/Carousel.PrevButton.figma.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11445-15045
+// source=packages/components/src/components/Carousel/navButton.tsx
+// component=Carousel.PrevButton
+
+const instance = _figma.default.selectedInstance;
+const isDisabled = instance.getEnum('isDisabled', {
+  true: true,
+  false: undefined
+});
+const disabledProp = _figma.default.helpers.react.renderProp('disabled', isDisabled);
+var _default = exports.default = {
+  id: 'carousel-prev-button',
+  imports: ["import { Carousel } from '@cdx-ui/components'"],
+  example: _figma.default.code`<Carousel.PrevButton${disabledProp} />`,
+  metadata: {
+    nestable: true
+  }
+};
+//# sourceMappingURL=Carousel.PrevButton.figma.js.map

package/lib/commonjs/figma/Carousel.PrevButton.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","isDisabled","getEnum","true","false","undefined","disabledProp","helpers","react","renderProp","_default","exports","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/Carousel.PrevButton.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,UAAU,GAAGH,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,YAAY,GAAGP,cAAK,CAACQ,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,UAAU,EAAER,UAAU,CAAC;AAAC,IAAAS,QAAA,GAAAC,OAAA,CAAAd,OAAA,GAE7D;EACbe,EAAE,EAAE,sBAAsB;EAC1BC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEf,cAAK,CAACgB,IAAI,uBAAuBT,YAAY,KAAK;EAC3DU,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}

package/lib/commonjs/figma/Carousel.figma.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11619-607
+// source=packages/components/src/components/Carousel/index.tsx
+// component=Carousel
+
+const instance = _figma.default.selectedInstance;
+const mode = instance.getEnum('mode', {
+  default: undefined,
+  parallax: 'parallax'
+});
+const modeProp = _figma.default.helpers.react.renderProp('mode', mode);
+
+// The code carousel is data-driven: every slide comes from `renderItem`, so the Figma
+// `Previous Slide` / `Next Slide` swaps (parallax peeks) render through the same template as the
+// current slide.
+const currentSlide = instance.getInstanceSwap('Current Slide');
+const slideSnippet = currentSlide?.type === 'INSTANCE' ? currentSlide.executeTemplate().example : null;
+var _default = exports.default = {
+  id: 'carousel',
+  imports: ["import { Carousel } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+<Carousel
+  data={slides}
+  style={{ width: 300, height: 200 }}${modeProp}
+  renderItem={({ item }) => (
+    ${slideSnippet}
+  )}
+/>`
+};
+//# sourceMappingURL=Carousel.figma.js.map

package/lib/commonjs/figma/Carousel.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","mode","getEnum","undefined","parallax","modeProp","helpers","react","renderProp","currentSlide","getInstanceSwap","slideSnippet","type","executeTemplate","example","_default","exports","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/Carousel.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,IAAI,GAAGH,QAAQ,CAACI,OAAO,CAAC,MAAM,EAAE;EACpCL,OAAO,EAAEM,SAAS;EAClBC,QAAQ,EAAE;AACZ,CAAC,CAAC;AACF,MAAMC,QAAQ,GAAGN,cAAK,CAACO,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAEP,IAAI,CAAC;;AAE7D;AACA;AACA;AACA,MAAMQ,YAAY,GAAGX,QAAQ,CAACY,eAAe,CAAC,eAAe,CAAC;AAC9D,MAAMC,YAAY,GAChBF,YAAY,EAAEG,IAAI,KAAK,UAAU,GAAGH,YAAY,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAnB,OAAA,GAErE;EACboB,EAAE,EAAE,UAAU;EACdC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DJ,OAAO,EAAEf,cAAK,CAACoB,IAAI;AACrB;AACA;AACA,uCAAuCd,QAAQ;AAC/C;AACA,MAAMM,YAAY;AAClB;AACA;AACA,CAAC","ignoreList":[]}

package/lib/commonjs/figma/Checkbox.Group.figma.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=5541-5967
+// source=packages/components/src/components/Checkbox/index.tsx
+// component=Checkbox.Group
+
+const instance = _figma.default.selectedInstance;
+const optionsSlot = instance.getSlot('options');
+const optionsChildren = optionsSlot ? _figma.default.helpers.react.renderChildren(optionsSlot) : null;
+var _default = exports.default = {
+  id: 'checkbox-group',
+  imports: ["import { Checkbox } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+<Checkbox.Group>
+  ${optionsChildren}
+</Checkbox.Group>`
+};
+//# sourceMappingURL=Checkbox.Group.figma.js.map

package/lib/commonjs/figma/Checkbox.Group.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","optionsSlot","getSlot","optionsChildren","helpers","react","renderChildren","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Checkbox.Group.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;AAEvC,MAAMC,WAAW,GAAGH,QAAQ,CAACI,OAAO,CAAC,SAAS,CAAC;AAC/C,MAAMC,eAAe,GAAGF,WAAW,GAAGF,cAAK,CAACK,OAAO,CAACC,KAAK,CAACC,cAAc,CAACL,WAAW,CAAC,GAAG,IAAI;AAAC,IAAAM,QAAA,GAAAC,OAAA,CAAAX,OAAA,GAE9E;EACbY,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEZ,cAAK,CAACa,IAAI;AACrB;AACA,IAAIT,eAAe;AACnB;AACA,CAAC","ignoreList":[]}

package/lib/commonjs/figma/CurrencyInput.figma.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=10803-8259
+// source=packages/components/src/components/CurrencyInput/index.tsx
+// component=CurrencyInput
+
+const instance = _figma.default.selectedInstance;
+
+// Figma names this component AmountInput. CurrencyInput is the large centered amount entry, which
+// matches `variant=hero`; the bordered `outlined` variant and the trailing slot have no code
+// equivalent, so the snippet flags them rather than substituting another component.
+// `Viewport` only previews responsive type sizes.
+const isOutlined = instance.getEnum('variant', {
+  outlined: true,
+  hero: false
+});
+const showTrailingSlot = instance.getBoolean('Show TrailingSlot?');
+const isInvalid = instance.getEnum('isInvalid', {
+  true: true,
+  false: undefined
+});
+const isReadOnly = instance.getEnum('isReadOnly', {
+  true: true,
+  false: undefined
+});
+const isDisabled = instance.getEnum('isDisabled', {
+  true: true,
+  false: undefined
+});
+const currencySymbol = instance.getString('currencySymbol');
+const amount = Number(instance.getString('value').replace(/[^0-9.]/g, ''));
+const valueProp = _figma.default.helpers.react.renderProp('value', Number.isFinite(amount) ? amount : 0);
+const currencySymbolProp = _figma.default.helpers.react.renderProp('currencySymbol', currencySymbol === '$' ? undefined : currencySymbol);
+const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);
+const isReadOnlyProp = _figma.default.helpers.react.renderProp('isReadOnly', isReadOnly);
+const isDisabledProp = _figma.default.helpers.react.renderProp('isDisabled', isDisabled);
+var _default = exports.default = {
+  id: 'currency-input',
+  imports: ["import { CurrencyInput } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+${isOutlined ? _figma.default.code`{/* Figma variant "outlined" has no code equivalent; CurrencyInput renders the "hero" style. */}` : null}
+${showTrailingSlot ? _figma.default.code`{/* The Figma trailing slot has no CurrencyInput equivalent. */}` : null}
+<CurrencyInput
+  accessibilityLabel="Amount"${valueProp}${currencySymbolProp}${isInvalidProp}${isReadOnlyProp}${isDisabledProp}
+  onChangeValue={setAmount}
+/>`
+};
+//# sourceMappingURL=CurrencyInput.figma.js.map

package/lib/commonjs/figma/CurrencyInput.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","isOutlined","getEnum","outlined","hero","showTrailingSlot","getBoolean","isInvalid","true","false","undefined","isReadOnly","isDisabled","currencySymbol","getString","amount","Number","replace","valueProp","helpers","react","renderProp","isFinite","currencySymbolProp","isInvalidProp","isReadOnlyProp","isDisabledProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/CurrencyInput.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA;AACA;AACA;AACA,MAAMC,UAAU,GAAGH,QAAQ,CAACI,OAAO,CAAC,SAAS,EAAE;EAC7CC,QAAQ,EAAE,IAAI;EACdC,IAAI,EAAE;AACR,CAAC,CAAC;AACF,MAAMC,gBAAgB,GAAGP,QAAQ,CAACQ,UAAU,CAAC,oBAAoB,CAAC;AAElE,MAAMC,SAAS,GAAGT,QAAQ,CAACI,OAAO,CAAC,WAAW,EAAE;EAC9CM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGb,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGd,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AAEF,MAAMG,cAAc,GAAGf,QAAQ,CAACgB,SAAS,CAAC,gBAAgB,CAAC;AAC3D,MAAMC,MAAM,GAAGC,MAAM,CAAClB,QAAQ,CAACgB,SAAS,CAAC,OAAO,CAAC,CAACG,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1E,MAAMC,SAAS,GAAGnB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEL,MAAM,CAACM,QAAQ,CAACP,MAAM,CAAC,GAAGA,MAAM,GAAG,CAAC,CAAC;AAC/F,MAAMQ,kBAAkB,GAAGxB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CACvD,gBAAgB,EAChBR,cAAc,KAAK,GAAG,GAAGH,SAAS,GAAGG,cACvC,CAAC;AACD,MAAMW,aAAa,GAAGzB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEd,SAAS,CAAC;AAC5E,MAAMkB,cAAc,GAAG1B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEV,UAAU,CAAC;AAC/E,MAAMe,cAAc,GAAG3B,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAET,UAAU,CAAC;AAAC,IAAAe,QAAA,GAAAC,OAAA,CAAA/B,OAAA,GAEjE;EACbgC,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAEhC,cAAK,CAACiC,IAAI;AACrB,EAAE/B,UAAU,GAAGF,cAAK,CAACiC,IAAI,kGAAkG,GAAG,IAAI;AAClI,EAAE3B,gBAAgB,GAAGN,cAAK,CAACiC,IAAI,kEAAkE,GAAG,IAAI;AACxG;AACA,+BAA+Bd,SAAS,GAAGK,kBAAkB,GAAGC,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC/G;AACA;AACA,CAAC","ignoreList":[]}

package/lib/commonjs/figma/DateField.figma.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11787-9802
+// source=packages/components/src/components/DateField/index.tsx
+// component=DateField
+
+const instance = _figma.default.selectedInstance;
+const isInvalid = instance.getEnum('isInvalid', {
+  true: true,
+  false: undefined
+});
+const isReadOnly = instance.getEnum('isReadOnly', {
+  true: true,
+  false: undefined
+});
+const isDisabled = instance.getEnum('isDisabled', {
+  true: true,
+  false: undefined
+});
+const showPrefixSlot = instance.getBoolean('Show Prefix Slot?');
+const showPickerTrigger = instance.getBoolean('Show Picker Trigger?');
+const modeByFormat = {
+  'MM/DD/YYYY': undefined,
+  'MM/YYYY': 'month'
+};
+const value = instance.findInstance('DateField.Value');
+const format = value.type === 'INSTANCE' ? value.getPropertyValue('format') : undefined;
+const mode = typeof format === 'string' ? modeByFormat[format] : undefined;
+const modeProp = _figma.default.helpers.react.renderProp('mode', mode);
+const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);
+const isReadOnlyProp = _figma.default.helpers.react.renderProp('isReadOnly', isReadOnly);
+const isDisabledProp = _figma.default.helpers.react.renderProp('isDisabled', isDisabled);
+
+// DateField has no prefix slot, and the picker trigger only works inside DatePicker (see
+// DatePicker.figma.ts), so both are flagged rather than rendered.
+var _default = exports.default = {
+  id: 'date-field',
+  imports: ["import { DateField } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+${showPrefixSlot ? _figma.default.code`{/* The Figma prefix slot has no DateField equivalent. */}` : null}
+${showPickerTrigger ? _figma.default.code`{/* A picker trigger needs DatePicker; see the DatePicker component. */}` : null}
+<DateField
+  value={value}
+  onValueChange={setValue}
+  aria-label="Date"${modeProp}${isInvalidProp}${isReadOnlyProp}${isDisabledProp}
+>
+  <DateField.Group>
+    <DateField.Input />
+  </DateField.Group>
+</DateField>`
+};
+//# sourceMappingURL=DateField.figma.js.map

package/lib/commonjs/figma/DateField.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","isInvalid","getEnum","true","false","undefined","isReadOnly","isDisabled","showPrefixSlot","getBoolean","showPickerTrigger","modeByFormat","value","findInstance","format","type","getPropertyValue","mode","modeProp","helpers","react","renderProp","isInvalidProp","isReadOnlyProp","isDisabledProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/DateField.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;AAEvC,MAAMC,SAAS,GAAGH,QAAQ,CAACI,OAAO,CAAC,WAAW,EAAE;EAC9CC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGR,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGT,QAAQ,CAACI,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMG,cAAc,GAAGV,QAAQ,CAACW,UAAU,CAAC,mBAAmB,CAAC;AAC/D,MAAMC,iBAAiB,GAAGZ,QAAQ,CAACW,UAAU,CAAC,sBAAsB,CAAC;AAErE,MAAME,YAAgD,GAAG;EACvD,YAAY,EAAEN,SAAS;EACvB,SAAS,EAAE;AACb,CAAC;AACD,MAAMO,KAAK,GAAGd,QAAQ,CAACe,YAAY,CAAC,iBAAiB,CAAC;AACtD,MAAMC,MAAM,GAAGF,KAAK,CAACG,IAAI,KAAK,UAAU,GAAGH,KAAK,CAACI,gBAAgB,CAAC,QAAQ,CAAC,GAAGX,SAAS;AACvF,MAAMY,IAAI,GAAG,OAAOH,MAAM,KAAK,QAAQ,GAAGH,YAAY,CAACG,MAAM,CAAC,GAAGT,SAAS;AAE1E,MAAMa,QAAQ,GAAGnB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAEJ,IAAI,CAAC;AAC7D,MAAMK,aAAa,GAAGvB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEpB,SAAS,CAAC;AAC5E,MAAMsB,cAAc,GAAGxB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEf,UAAU,CAAC;AAC/E,MAAMkB,cAAc,GAAGzB,cAAK,CAACoB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEd,UAAU,CAAC;;AAE/E;AACA;AAAA,IAAAkB,QAAA,GAAAC,OAAA,CAAA7B,OAAA,GACe;EACb8B,EAAE,EAAE,YAAY;EAChBC,OAAO,EAAE,CAAC,gDAAgD,CAAC;EAC3DC,OAAO,EAAE9B,cAAK,CAAC+B,IAAI;AACrB,EAAEtB,cAAc,GAAGT,cAAK,CAAC+B,IAAI,4DAA4D,GAAG,IAAI;AAChG,EAAEpB,iBAAiB,GAAGX,cAAK,CAAC+B,IAAI,0EAA0E,GAAG,IAAI;AACjH;AACA;AACA;AACA,qBAAqBZ,QAAQ,GAAGI,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC/E;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/commonjs/figma/DatePicker.figma.js

@@ -0,0 +1,88 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=12349-9879
+// source=packages/components/src/components/DatePicker/index.tsx
+// component=DatePicker
+
+const instance = _figma.default.selectedInstance;
+
+// `isOpen` only previews the open surface; the picker opens from its trigger at runtime.
+const surface = instance.getEnum('Picker Type', {
+  Popover: 'DatePicker.Popover',
+  Dialog: 'DatePicker.Dialog',
+  BottomSheet: 'DatePicker.BottomSheet'
+});
+
+// DatePicker replaces the DateField root in code, so the nested Field (DateField) and DateField
+// properties are read here rather than delegating to their templates.
+const field = instance.findInstance('Field (DateField)');
+const dateField = instance.findInstance('DateField', {
+  traverseInstances: true
+});
+const hasField = field.type === 'INSTANCE';
+const hasDateField = dateField.type === 'INSTANCE';
+const showLabel = hasField && field.getBoolean('Show Label?');
+const showHelperText = hasField && field.getBoolean('Show Helper Text?');
+const showErrorText = hasField && field.getBoolean('Show Error Text?');
+const isInvalid = hasField ? field.getEnum('isInvalid', {
+  true: true,
+  false: undefined
+}) : undefined;
+const isReadOnly = hasField ? field.getEnum('isReadOnly', {
+  true: true,
+  false: undefined
+}) : undefined;
+const isDisabled = hasField ? field.getEnum('isDisabled', {
+  true: true,
+  false: undefined
+}) : undefined;
+const showPickerTrigger = hasDateField && dateField.getBoolean('Show Picker Trigger?');
+const showPrefixSlot = hasDateField && dateField.getBoolean('Show Prefix Slot?');
+const dateFieldValue = instance.findInstance('DateField.Value', {
+  traverseInstances: true
+});
+const isMonthFormat = dateFieldValue.type === 'INSTANCE' && dateFieldValue.getPropertyValue('format') === 'MM/YYYY';
+const labelText = instance.findText('{label}', {
+  traverseInstances: true
+}).textContent;
+const helperText = instance.findText('{HelperText}', {
+  traverseInstances: true
+}).textContent;
+const errorText = instance.findText('{ErrorText}', {
+  traverseInstances: true
+}).textContent;
+const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);
+const isReadOnlyProp = _figma.default.helpers.react.renderProp('isReadOnly', isReadOnly);
+const isDisabledProp = _figma.default.helpers.react.renderProp('isDisabled', isDisabled);
+var _default = exports.default = {
+  id: 'date-picker',
+  imports: ["import { DateField, DatePicker, Field } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+${isMonthFormat ? _figma.default.code`{/* DatePicker selects a full date; the Figma MM/YYYY format has no DatePicker equivalent. */}` : null}
+${showPrefixSlot ? _figma.default.code`{/* The Figma prefix slot has no DateField equivalent. */}` : null}
+<Field${isInvalidProp}${isReadOnlyProp}${isDisabledProp}>
+  <DatePicker value={value} onValueChange={setValue}>
+    ${showLabel ? _figma.default.code`<Field.Label>${labelText}</Field.Label>` : null}
+    <DateField.Group fullWidth>
+      <DateField.Input />
+      ${showPickerTrigger ? _figma.default.code`<DateField.Suffix>
+        <DatePicker.Trigger>
+          <DatePicker.TriggerIndicator />
+        </DatePicker.Trigger>
+      </DateField.Suffix>` : null}
+    </DateField.Group>
+    ${!isInvalid && showHelperText ? _figma.default.code`<Field.Helper>${helperText}</Field.Helper>` : null}
+    ${isInvalid && showErrorText ? _figma.default.code`<Field.Error>${errorText}</Field.Error>` : null}
+    <${surface}>
+      <DatePicker.Calendar aria-label="${labelText}" />
+    </${surface}>
+  </DatePicker>
+</Field>`
+};
+//# sourceMappingURL=DatePicker.figma.js.map

package/lib/commonjs/figma/DatePicker.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","surface","getEnum","Popover","Dialog","BottomSheet","field","findInstance","dateField","traverseInstances","hasField","type","hasDateField","showLabel","getBoolean","showHelperText","showErrorText","isInvalid","true","false","undefined","isReadOnly","isDisabled","showPickerTrigger","showPrefixSlot","dateFieldValue","isMonthFormat","getPropertyValue","labelText","findText","textContent","helperText","errorText","isInvalidProp","helpers","react","renderProp","isReadOnlyProp","isDisabledProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/DatePicker.figma.ts"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/figma/DateRangePicker.figma.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=12449-28564
+// source=packages/components/src/components/DateRangePicker/index.tsx
+// component=DateRangePicker
+
+const instance = _figma.default.selectedInstance;
+
+// `isOpen` only previews the open surface; the picker opens from its trigger at runtime.
+const surface = instance.getEnum('Picker Type', {
+  Popover: 'DateRangePicker.Popover',
+  Dialog: 'DateRangePicker.Dialog',
+  BottomSheet: 'DateRangePicker.BottomSheet'
+});
+
+// The nested Figma Field (DateRangeField) has no standalone code component; in code the range
+// input is composed from DateField parts inside DateRangePicker, so its properties are read here.
+const field = instance.findInstance('Field (DateRangeField)');
+const rangeField = instance.findInstance('DateRangeField', {
+  traverseInstances: true
+});
+const hasField = field.type === 'INSTANCE';
+const hasRangeField = rangeField.type === 'INSTANCE';
+const showLabel = hasField && field.getBoolean('Show Label?');
+const showHelperText = hasField && field.getBoolean('Show Helper Text?');
+const showErrorText = hasField && field.getBoolean('Show Error Text?');
+const isInvalid = hasField ? field.getEnum('isInvalid', {
+  true: true,
+  false: undefined
+}) : undefined;
+const isReadOnly = hasField ? field.getEnum('isReadOnly', {
+  true: true,
+  false: undefined
+}) : undefined;
+const isDisabled = hasField ? field.getEnum('isDisabled', {
+  true: true,
+  false: undefined
+}) : undefined;
+const showPickerTrigger = hasRangeField && rangeField.getBoolean('Show Picker Trigger?');
+const showPrefixSlot = hasRangeField && rangeField.getBoolean('Show Prefix Slot?');
+const labelText = instance.findText('{label}', {
+  traverseInstances: true
+}).textContent;
+const helperText = instance.findText('{HelperText}', {
+  traverseInstances: true
+}).textContent;
+const errorText = instance.findText('{ErrorText}', {
+  traverseInstances: true
+}).textContent;
+const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);
+const isReadOnlyProp = _figma.default.helpers.react.renderProp('isReadOnly', isReadOnly);
+const isDisabledProp = _figma.default.helpers.react.renderProp('isDisabled', isDisabled);
+var _default = exports.default = {
+  id: 'date-range-picker',
+  imports: ["import { DateField, DateRangePicker, Field } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+${showPrefixSlot ? _figma.default.code`{/* The Figma prefix slot has no DateField equivalent. */}` : null}
+<Field${isInvalidProp}${isReadOnlyProp}${isDisabledProp}>
+  <DateRangePicker value={value} onValueChange={setValue}>
+    ${showLabel ? _figma.default.code`<Field.Label>${labelText}</Field.Label>` : null}
+    <DateRangePicker.Trigger className="w-full">
+      <DateField.Group fullWidth>
+        <DateField.Input slot="start" />
+        <DateRangePicker.RangeSeparator />
+        <DateField.Input slot="end" />
+        ${showPickerTrigger ? _figma.default.code`<DateField.Suffix>
+          <DateRangePicker.TriggerIndicator />
+        </DateField.Suffix>` : null}
+      </DateField.Group>
+    </DateRangePicker.Trigger>
+    ${!isInvalid && showHelperText ? _figma.default.code`<Field.Helper>${helperText}</Field.Helper>` : null}
+    ${isInvalid && showErrorText ? _figma.default.code`<Field.Error>${errorText}</Field.Error>` : null}
+    <${surface}>
+      <DateRangePicker.Calendar accessibilityLabel="${labelText}" />
+    </${surface}>
+  </DateRangePicker>
+</Field>`
+};
+//# sourceMappingURL=DateRangePicker.figma.js.map

package/lib/commonjs/figma/DateRangePicker.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","surface","getEnum","Popover","Dialog","BottomSheet","field","findInstance","rangeField","traverseInstances","hasField","type","hasRangeField","showLabel","getBoolean","showHelperText","showErrorText","isInvalid","true","false","undefined","isReadOnly","isDisabled","showPickerTrigger","showPrefixSlot","labelText","findText","textContent","helperText","errorText","isInvalidProp","helpers","react","renderProp","isReadOnlyProp","isDisabledProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/DateRangePicker.figma.ts"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/figma/DateTimeField.figma.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11787-10754
+// source=packages/components/src/components/DateTimeField/index.tsx
+// component=DateTimeField
+
+const instance = _figma.default.selectedInstance;
+const isInvalid = instance.getEnum('isInvalid', {
+  true: true,
+  false: undefined
+});
+const isReadOnly = instance.getEnum('isReadOnly', {
+  true: true,
+  false: undefined
+});
+const isDisabled = instance.getEnum('isDisabled', {
+  true: true,
+  false: undefined
+});
+const showPrefixSlot = instance.getBoolean('Show Prefix Slot?');
+const showPickerTrigger = instance.getBoolean('Show Picker Trigger?');
+
+// The nested DateTimeField.Value `format` encodes both the smallest segment and the clock style.
+const granularityByFormat = {
+  'MM/DD/YYYY hh:mm A': undefined,
+  'MM/DD/YYYY hh:mm:ss A': 'second',
+  'MM/DD/YYYY HH:mm (24-hour)': undefined,
+  'MM/DD/YYYY HH:mm:ss (24-hour)': 'second'
+};
+const hour12ByFormat = {
+  'MM/DD/YYYY hh:mm A': true,
+  'MM/DD/YYYY hh:mm:ss A': true,
+  'MM/DD/YYYY HH:mm (24-hour)': false,
+  'MM/DD/YYYY HH:mm:ss (24-hour)': false
+};
+const value = instance.findInstance('DateTimeField.Value');
+const format = value.type === 'INSTANCE' ? value.getPropertyValue('format') : undefined;
+const granularity = typeof format === 'string' ? granularityByFormat[format] : undefined;
+const hour12 = typeof format === 'string' ? hour12ByFormat[format] : undefined;
+const granularityProp = _figma.default.helpers.react.renderProp('granularity', granularity);
+const hour12Prop = _figma.default.helpers.react.renderProp('hour12', hour12);
+const isInvalidProp = _figma.default.helpers.react.renderProp('isInvalid', isInvalid);
+const isReadOnlyProp = _figma.default.helpers.react.renderProp('isReadOnly', isReadOnly);
+const isDisabledProp = _figma.default.helpers.react.renderProp('isDisabled', isDisabled);
+var _default = exports.default = {
+  id: 'date-time-field',
+  imports: ["import { DateTimeField } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+${showPrefixSlot ? _figma.default.code`{/* The Figma prefix slot has no DateTimeField equivalent. */}` : null}
+${showPickerTrigger ? _figma.default.code`{/* A picker trigger needs DateTimePicker; DateTimeField has no trigger of its own. */}` : null}
+<DateTimeField
+  value={value}
+  onValueChange={setValue}
+  aria-label="Date and time"${granularityProp}${hour12Prop}${isInvalidProp}${isReadOnlyProp}${isDisabledProp}
+>
+  <DateTimeField.Group>
+    <DateTimeField.Input>
+      {(segment) => <DateTimeField.Segment segment={segment} />}
+    </DateTimeField.Input>
+  </DateTimeField.Group>
+</DateTimeField>`
+};
+//# sourceMappingURL=DateTimeField.figma.js.map

package/lib/commonjs/figma/DateTimeField.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","isInvalid","getEnum","true","false","undefined","isReadOnly","isDisabled","showPrefixSlot","getBoolean","showPickerTrigger","granularityByFormat","hour12ByFormat","value","findInstance","format","type","getPropertyValue","granularity","hour12","granularityProp","helpers","react","renderProp","hour12Prop","isInvalidProp","isReadOnlyProp","isDisabledProp","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/DateTimeField.figma.ts"],"mappings":"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","ignoreList":[]}