@cdx-ui/components 0.1.4 → 0.1.5
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/figma/Calendar.figma.js +28 -0
- package/lib/commonjs/figma/Calendar.figma.js.map +1 -0
- package/lib/commonjs/figma/Carousel.NextButton.figma.js +27 -0
- package/lib/commonjs/figma/Carousel.NextButton.figma.js.map +1 -0
- package/lib/commonjs/figma/Carousel.Pagination.figma.js +22 -0
- package/lib/commonjs/figma/Carousel.Pagination.figma.js.map +1 -0
- package/lib/commonjs/figma/Carousel.PrevButton.figma.js +27 -0
- package/lib/commonjs/figma/Carousel.PrevButton.figma.js.map +1 -0
- package/lib/commonjs/figma/Carousel.figma.js +37 -0
- package/lib/commonjs/figma/Carousel.figma.js.map +1 -0
- package/lib/commonjs/figma/Checkbox.Group.figma.js +24 -0
- package/lib/commonjs/figma/Checkbox.Group.figma.js.map +1 -0
- package/lib/commonjs/figma/CurrencyInput.figma.js +54 -0
- package/lib/commonjs/figma/CurrencyInput.figma.js.map +1 -0
- package/lib/commonjs/figma/DateField.figma.js +58 -0
- package/lib/commonjs/figma/DateField.figma.js.map +1 -0
- package/lib/commonjs/figma/DatePicker.figma.js +88 -0
- package/lib/commonjs/figma/DatePicker.figma.js.map +1 -0
- package/lib/commonjs/figma/DateRangePicker.figma.js +85 -0
- package/lib/commonjs/figma/DateRangePicker.figma.js.map +1 -0
- package/lib/commonjs/figma/DateTimeField.figma.js +69 -0
- package/lib/commonjs/figma/DateTimeField.figma.js.map +1 -0
- package/lib/commonjs/figma/Field.Checkbox.figma.js +52 -0
- package/lib/commonjs/figma/Field.Checkbox.figma.js.map +1 -0
- package/lib/commonjs/figma/Field.DateField.figma.js +57 -0
- package/lib/commonjs/figma/Field.DateField.figma.js.map +1 -0
- package/lib/commonjs/figma/Field.DateTimeField.figma.js +57 -0
- package/lib/commonjs/figma/Field.DateTimeField.figma.js.map +1 -0
- package/lib/commonjs/figma/Image.figma.js +22 -0
- package/lib/commonjs/figma/Image.figma.js.map +1 -0
- package/lib/commonjs/figma/MonthCalendar.figma.js +18 -0
- package/lib/commonjs/figma/MonthCalendar.figma.js.map +1 -0
- package/lib/commonjs/figma/ProgressBar.figma.js +54 -0
- package/lib/commonjs/figma/ProgressBar.figma.js.map +1 -0
- package/lib/commonjs/figma/ProgressCircle.figma.js +73 -0
- package/lib/commonjs/figma/ProgressCircle.figma.js.map +1 -0
- package/lib/commonjs/figma/RangeCalendar.figma.js +36 -0
- package/lib/commonjs/figma/RangeCalendar.figma.js.map +1 -0
- package/lib/commonjs/figma/Skeleton.figma.js +31 -0
- package/lib/commonjs/figma/Skeleton.figma.js.map +1 -0
- package/lib/commonjs/figma/Slider.Marker.figma.js +21 -0
- package/lib/commonjs/figma/Slider.Marker.figma.js.map +1 -0
- package/lib/commonjs/figma/Slider.MarkerGroup.figma.js +22 -0
- package/lib/commonjs/figma/Slider.MarkerGroup.figma.js.map +1 -0
- package/lib/commonjs/figma/Slider.Thumb.figma.js +22 -0
- package/lib/commonjs/figma/Slider.Thumb.figma.js.map +1 -0
- package/lib/commonjs/figma/Slider.figma.js +69 -0
- package/lib/commonjs/figma/Slider.figma.js.map +1 -0
- package/lib/commonjs/figma/Switch.figma.js +36 -0
- package/lib/commonjs/figma/Switch.figma.js.map +1 -0
- package/lib/commonjs/figma/Tabs.SegmentedControl.Segment.figma.js +34 -0
- package/lib/commonjs/figma/Tabs.SegmentedControl.Segment.figma.js.map +1 -0
- package/lib/commonjs/figma/Tabs.SegmentedControl.figma.js +43 -0
- package/lib/commonjs/figma/Tabs.SegmentedControl.figma.js.map +1 -0
- package/lib/commonjs/figma/Tabs.Tab.figma.js +34 -0
- package/lib/commonjs/figma/Tabs.Tab.figma.js.map +1 -0
- package/lib/commonjs/figma/Tabs.figma.js +39 -0
- package/lib/commonjs/figma/Tabs.figma.js.map +1 -0
- package/lib/commonjs/figma/Tile.Description.figma.js +23 -0
- package/lib/commonjs/figma/Tile.Description.figma.js.map +1 -0
- package/lib/commonjs/figma/Tile.Group.figma.js +45 -0
- package/lib/commonjs/figma/Tile.Group.figma.js.map +1 -0
- package/lib/commonjs/figma/Tile.LeadingSlot.figma.js +23 -0
- package/lib/commonjs/figma/Tile.LeadingSlot.figma.js.map +1 -0
- package/lib/commonjs/figma/Tile.Title.figma.js +23 -0
- package/lib/commonjs/figma/Tile.Title.figma.js.map +1 -0
- package/lib/commonjs/figma/Tile.TrailingSlot.figma.js +23 -0
- package/lib/commonjs/figma/Tile.TrailingSlot.figma.js.map +1 -0
- package/lib/commonjs/figma/Tile.figma.js +57 -0
- package/lib/commonjs/figma/Tile.figma.js.map +1 -0
- package/lib/commonjs/figma/Toast.Button.figma.js +32 -0
- package/lib/commonjs/figma/Toast.Button.figma.js.map +1 -0
- package/lib/commonjs/figma/Toast.Close.figma.js +20 -0
- package/lib/commonjs/figma/Toast.Close.figma.js.map +1 -0
- package/lib/commonjs/figma/Toast.figma.js +81 -0
- package/lib/commonjs/figma/Toast.figma.js.map +1 -0
- package/lib/commonjs/figma/Tooltip.Content.figma.js +30 -0
- package/lib/commonjs/figma/Tooltip.Content.figma.js.map +1 -0
- package/lib/commonjs/figma/Tooltip.figma.js +46 -0
- package/lib/commonjs/figma/Tooltip.figma.js.map +1 -0
- package/lib/commonjs/figma/VirtualizedList.figma.js +31 -0
- package/lib/commonjs/figma/VirtualizedList.figma.js.map +1 -0
- package/lib/module/figma/Calendar.figma.js +22 -0
- package/lib/module/figma/Calendar.figma.js.map +1 -0
- package/lib/module/figma/Carousel.NextButton.figma.js +21 -0
- package/lib/module/figma/Carousel.NextButton.figma.js.map +1 -0
- package/lib/module/figma/Carousel.Pagination.figma.js +18 -0
- package/lib/module/figma/Carousel.Pagination.figma.js.map +1 -0
- package/lib/module/figma/Carousel.PrevButton.figma.js +21 -0
- package/lib/module/figma/Carousel.PrevButton.figma.js.map +1 -0
- package/lib/module/figma/Carousel.figma.js +31 -0
- package/lib/module/figma/Carousel.figma.js.map +1 -0
- package/lib/module/figma/Checkbox.Group.figma.js +18 -0
- package/lib/module/figma/Checkbox.Group.figma.js.map +1 -0
- package/lib/module/figma/CurrencyInput.figma.js +48 -0
- package/lib/module/figma/CurrencyInput.figma.js.map +1 -0
- package/lib/module/figma/DateField.figma.js +52 -0
- package/lib/module/figma/DateField.figma.js.map +1 -0
- package/lib/module/figma/DatePicker.figma.js +82 -0
- package/lib/module/figma/DatePicker.figma.js.map +1 -0
- package/lib/module/figma/DateRangePicker.figma.js +79 -0
- package/lib/module/figma/DateRangePicker.figma.js.map +1 -0
- package/lib/module/figma/DateTimeField.figma.js +63 -0
- package/lib/module/figma/DateTimeField.figma.js.map +1 -0
- package/lib/module/figma/Field.Checkbox.figma.js +46 -0
- package/lib/module/figma/Field.Checkbox.figma.js.map +1 -0
- package/lib/module/figma/Field.DateField.figma.js +51 -0
- package/lib/module/figma/Field.DateField.figma.js.map +1 -0
- package/lib/module/figma/Field.DateTimeField.figma.js +51 -0
- package/lib/module/figma/Field.DateTimeField.figma.js.map +1 -0
- package/lib/module/figma/Image.figma.js +18 -0
- package/lib/module/figma/Image.figma.js.map +1 -0
- package/lib/module/figma/MonthCalendar.figma.js +14 -0
- package/lib/module/figma/MonthCalendar.figma.js.map +1 -0
- package/lib/module/figma/ProgressBar.figma.js +48 -0
- package/lib/module/figma/ProgressBar.figma.js.map +1 -0
- package/lib/module/figma/ProgressCircle.figma.js +67 -0
- package/lib/module/figma/ProgressCircle.figma.js.map +1 -0
- package/lib/module/figma/RangeCalendar.figma.js +30 -0
- package/lib/module/figma/RangeCalendar.figma.js.map +1 -0
- package/lib/module/figma/Skeleton.figma.js +25 -0
- package/lib/module/figma/Skeleton.figma.js.map +1 -0
- package/lib/module/figma/Slider.Marker.figma.js +17 -0
- package/lib/module/figma/Slider.Marker.figma.js.map +1 -0
- package/lib/module/figma/Slider.MarkerGroup.figma.js +18 -0
- package/lib/module/figma/Slider.MarkerGroup.figma.js.map +1 -0
- package/lib/module/figma/Slider.Thumb.figma.js +18 -0
- package/lib/module/figma/Slider.Thumb.figma.js.map +1 -0
- package/lib/module/figma/Slider.figma.js +63 -0
- package/lib/module/figma/Slider.figma.js.map +1 -0
- package/lib/module/figma/Switch.figma.js +30 -0
- package/lib/module/figma/Switch.figma.js.map +1 -0
- package/lib/module/figma/Tabs.SegmentedControl.Segment.figma.js +28 -0
- package/lib/module/figma/Tabs.SegmentedControl.Segment.figma.js.map +1 -0
- package/lib/module/figma/Tabs.SegmentedControl.figma.js +37 -0
- package/lib/module/figma/Tabs.SegmentedControl.figma.js.map +1 -0
- package/lib/module/figma/Tabs.Tab.figma.js +28 -0
- package/lib/module/figma/Tabs.Tab.figma.js.map +1 -0
- package/lib/module/figma/Tabs.figma.js +33 -0
- package/lib/module/figma/Tabs.figma.js.map +1 -0
- package/lib/module/figma/Tile.Description.figma.js +17 -0
- package/lib/module/figma/Tile.Description.figma.js.map +1 -0
- package/lib/module/figma/Tile.Group.figma.js +39 -0
- package/lib/module/figma/Tile.Group.figma.js.map +1 -0
- package/lib/module/figma/Tile.LeadingSlot.figma.js +17 -0
- package/lib/module/figma/Tile.LeadingSlot.figma.js.map +1 -0
- package/lib/module/figma/Tile.Title.figma.js +17 -0
- package/lib/module/figma/Tile.Title.figma.js.map +1 -0
- package/lib/module/figma/Tile.TrailingSlot.figma.js +17 -0
- package/lib/module/figma/Tile.TrailingSlot.figma.js.map +1 -0
- package/lib/module/figma/Tile.figma.js +51 -0
- package/lib/module/figma/Tile.figma.js.map +1 -0
- package/lib/module/figma/Toast.Button.figma.js +26 -0
- package/lib/module/figma/Toast.Button.figma.js.map +1 -0
- package/lib/module/figma/Toast.Close.figma.js +15 -0
- package/lib/module/figma/Toast.Close.figma.js.map +1 -0
- package/lib/module/figma/Toast.figma.js +75 -0
- package/lib/module/figma/Toast.figma.js.map +1 -0
- package/lib/module/figma/Tooltip.Content.figma.js +24 -0
- package/lib/module/figma/Tooltip.Content.figma.js.map +1 -0
- package/lib/module/figma/Tooltip.figma.js +40 -0
- package/lib/module/figma/Tooltip.figma.js.map +1 -0
- package/lib/module/figma/VirtualizedList.figma.js +25 -0
- package/lib/module/figma/VirtualizedList.figma.js.map +1 -0
- package/lib/typescript/figma/Calendar.figma.d.ts +8 -0
- package/lib/typescript/figma/Calendar.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Carousel.NextButton.figma.d.ts +11 -0
- package/lib/typescript/figma/Carousel.NextButton.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Carousel.Pagination.figma.d.ts +11 -0
- package/lib/typescript/figma/Carousel.Pagination.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Carousel.PrevButton.figma.d.ts +11 -0
- package/lib/typescript/figma/Carousel.PrevButton.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Carousel.figma.d.ts +8 -0
- package/lib/typescript/figma/Carousel.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Checkbox.Group.figma.d.ts +8 -0
- package/lib/typescript/figma/Checkbox.Group.figma.d.ts.map +1 -0
- package/lib/typescript/figma/CurrencyInput.figma.d.ts +8 -0
- package/lib/typescript/figma/CurrencyInput.figma.d.ts.map +1 -0
- package/lib/typescript/figma/DateField.figma.d.ts +8 -0
- package/lib/typescript/figma/DateField.figma.d.ts.map +1 -0
- package/lib/typescript/figma/DatePicker.figma.d.ts +8 -0
- package/lib/typescript/figma/DatePicker.figma.d.ts.map +1 -0
- package/lib/typescript/figma/DateRangePicker.figma.d.ts +8 -0
- package/lib/typescript/figma/DateRangePicker.figma.d.ts.map +1 -0
- package/lib/typescript/figma/DateTimeField.figma.d.ts +8 -0
- package/lib/typescript/figma/DateTimeField.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Field.Checkbox.figma.d.ts +8 -0
- package/lib/typescript/figma/Field.Checkbox.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Field.DateField.figma.d.ts +8 -0
- package/lib/typescript/figma/Field.DateField.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Field.DateTimeField.figma.d.ts +8 -0
- package/lib/typescript/figma/Field.DateTimeField.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Image.figma.d.ts +11 -0
- package/lib/typescript/figma/Image.figma.d.ts.map +1 -0
- package/lib/typescript/figma/MonthCalendar.figma.d.ts +8 -0
- package/lib/typescript/figma/MonthCalendar.figma.d.ts.map +1 -0
- package/lib/typescript/figma/ProgressBar.figma.d.ts +8 -0
- package/lib/typescript/figma/ProgressBar.figma.d.ts.map +1 -0
- package/lib/typescript/figma/ProgressCircle.figma.d.ts +11 -0
- package/lib/typescript/figma/ProgressCircle.figma.d.ts.map +1 -0
- package/lib/typescript/figma/RangeCalendar.figma.d.ts +8 -0
- package/lib/typescript/figma/RangeCalendar.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Skeleton.figma.d.ts +11 -0
- package/lib/typescript/figma/Skeleton.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Slider.Marker.figma.d.ts +11 -0
- package/lib/typescript/figma/Slider.Marker.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Slider.MarkerGroup.figma.d.ts +8 -0
- package/lib/typescript/figma/Slider.MarkerGroup.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Slider.Thumb.figma.d.ts +11 -0
- package/lib/typescript/figma/Slider.Thumb.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Slider.figma.d.ts +8 -0
- package/lib/typescript/figma/Slider.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Switch.figma.d.ts +8 -0
- package/lib/typescript/figma/Switch.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tabs.SegmentedControl.Segment.figma.d.ts +8 -0
- package/lib/typescript/figma/Tabs.SegmentedControl.Segment.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tabs.SegmentedControl.figma.d.ts +8 -0
- package/lib/typescript/figma/Tabs.SegmentedControl.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tabs.Tab.figma.d.ts +8 -0
- package/lib/typescript/figma/Tabs.Tab.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tabs.figma.d.ts +8 -0
- package/lib/typescript/figma/Tabs.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tile.Description.figma.d.ts +11 -0
- package/lib/typescript/figma/Tile.Description.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tile.Group.figma.d.ts +8 -0
- package/lib/typescript/figma/Tile.Group.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tile.LeadingSlot.figma.d.ts +8 -0
- package/lib/typescript/figma/Tile.LeadingSlot.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tile.Title.figma.d.ts +11 -0
- package/lib/typescript/figma/Tile.Title.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tile.TrailingSlot.figma.d.ts +8 -0
- package/lib/typescript/figma/Tile.TrailingSlot.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tile.figma.d.ts +8 -0
- package/lib/typescript/figma/Tile.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Toast.Button.figma.d.ts +14 -0
- package/lib/typescript/figma/Toast.Button.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Toast.Close.figma.d.ts +11 -0
- package/lib/typescript/figma/Toast.Close.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Toast.figma.d.ts +8 -0
- package/lib/typescript/figma/Toast.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tooltip.Content.figma.d.ts +8 -0
- package/lib/typescript/figma/Tooltip.Content.figma.d.ts.map +1 -0
- package/lib/typescript/figma/Tooltip.figma.d.ts +8 -0
- package/lib/typescript/figma/Tooltip.figma.d.ts.map +1 -0
- package/lib/typescript/figma/VirtualizedList.figma.d.ts +8 -0
- package/lib/typescript/figma/VirtualizedList.figma.d.ts.map +1 -0
- package/package.json +6 -6
|
@@ -0,0 +1,30 @@
|
|
|
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=12980-8437
|
|
10
|
+
// source=packages/components/src/components/Tooltip/index.tsx
|
|
11
|
+
// component=Tooltip.Content
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
|
|
15
|
+
// `placement` is set on the parent Tooltip in code (see Tooltip.figma.ts); the content only
|
|
16
|
+
// mirrors it in Figma so the arrow points the right way.
|
|
17
|
+
const showArrow = instance.getBoolean('Show Arrow?');
|
|
18
|
+
const textLayer = instance.findText('{text}');
|
|
19
|
+
const contentSlot = instance.getSlot('content');
|
|
20
|
+
const children = textLayer.type === 'TEXT' ? textLayer.textContent : contentSlot ? _figma.default.helpers.react.renderChildren(contentSlot) : null;
|
|
21
|
+
var _default = exports.default = {
|
|
22
|
+
id: 'tooltip-content',
|
|
23
|
+
imports: ["import { Tooltip } from '@cdx-ui/components'"],
|
|
24
|
+
example: _figma.default.code`
|
|
25
|
+
<Tooltip.Content>
|
|
26
|
+
${showArrow ? _figma.default.code`<Tooltip.Arrow />` : null}
|
|
27
|
+
${children}
|
|
28
|
+
</Tooltip.Content>`
|
|
29
|
+
};
|
|
30
|
+
//# sourceMappingURL=Tooltip.Content.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","showArrow","getBoolean","textLayer","findText","contentSlot","getSlot","children","type","textContent","helpers","react","renderChildren","_default","exports","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Tooltip.Content.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,SAAS,GAAGH,QAAQ,CAACI,UAAU,CAAC,aAAa,CAAC;AAEpD,MAAMC,SAAS,GAAGL,QAAQ,CAACM,QAAQ,CAAC,QAAQ,CAAC;AAC7C,MAAMC,WAAW,GAAGP,QAAQ,CAACQ,OAAO,CAAC,SAAS,CAAC;AAC/C,MAAMC,QAAQ,GACZJ,SAAS,CAACK,IAAI,KAAK,MAAM,GACrBL,SAAS,CAACM,WAAW,GACrBJ,WAAW,GACTN,cAAK,CAACW,OAAO,CAACC,KAAK,CAACC,cAAc,CAACP,WAAW,CAAC,GAC/C,IAAI;AAAC,IAAAQ,QAAA,GAAAC,OAAA,CAAAjB,OAAA,GAEE;EACbkB,EAAE,EAAE,iBAAiB;EACrBC,OAAO,EAAE,CAAC,8CAA8C,CAAC;EACzDC,OAAO,EAAElB,cAAK,CAACmB,IAAI;AACrB;AACA,IAAIjB,SAAS,GAAGF,cAAK,CAACmB,IAAI,mBAAmB,GAAG,IAAI;AACpD,IAAIX,QAAQ;AACZ;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,46 @@
|
|
|
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=12996-1099
|
|
10
|
+
// source=packages/components/src/components/Tooltip/index.tsx
|
|
11
|
+
// component=Tooltip
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
|
|
15
|
+
// `isOpen` only previews the open state in Figma; the tooltip opens from its trigger at runtime.
|
|
16
|
+
const placement = instance.getEnum('placement', {
|
|
17
|
+
top: undefined,
|
|
18
|
+
'top-start': 'top-start',
|
|
19
|
+
'top-end': 'top-end',
|
|
20
|
+
bottom: 'bottom',
|
|
21
|
+
'bottom-start': 'bottom-start',
|
|
22
|
+
'bottom-end': 'bottom-end',
|
|
23
|
+
left: 'left',
|
|
24
|
+
'left-start': 'left-start',
|
|
25
|
+
'left-end': 'left-end',
|
|
26
|
+
right: 'right',
|
|
27
|
+
'right-start': 'right-start',
|
|
28
|
+
'right-end': 'right-end'
|
|
29
|
+
});
|
|
30
|
+
const placementProp = _figma.default.helpers.react.renderProp('placement', placement);
|
|
31
|
+
const trigger = instance.getInstanceSwap('Instance');
|
|
32
|
+
const triggerSnippet = trigger?.type === 'INSTANCE' ? trigger.executeTemplate().example : null;
|
|
33
|
+
const content = instance.findInstance('Tooltip.Content');
|
|
34
|
+
const contentSnippet = content.type === 'INSTANCE' ? content.executeTemplate().example : null;
|
|
35
|
+
var _default = exports.default = {
|
|
36
|
+
id: 'tooltip',
|
|
37
|
+
imports: ["import { Tooltip } from '@cdx-ui/components'"],
|
|
38
|
+
example: _figma.default.code`
|
|
39
|
+
<Tooltip${placementProp}>
|
|
40
|
+
<Tooltip.Trigger asChild>
|
|
41
|
+
${triggerSnippet}
|
|
42
|
+
</Tooltip.Trigger>
|
|
43
|
+
${contentSnippet}
|
|
44
|
+
</Tooltip>`
|
|
45
|
+
};
|
|
46
|
+
//# sourceMappingURL=Tooltip.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","placement","getEnum","top","undefined","bottom","left","right","placementProp","helpers","react","renderProp","trigger","getInstanceSwap","triggerSnippet","type","executeTemplate","example","content","findInstance","contentSnippet","_default","exports","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/Tooltip.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,GAAG,EAAEC,SAAS;EACd,WAAW,EAAE,WAAW;EACxB,SAAS,EAAE,SAAS;EACpBC,MAAM,EAAE,QAAQ;EAChB,cAAc,EAAE,cAAc;EAC9B,YAAY,EAAE,YAAY;EAC1BC,IAAI,EAAE,MAAM;EACZ,YAAY,EAAE,YAAY;EAC1B,UAAU,EAAE,UAAU;EACtBC,KAAK,EAAE,OAAO;EACd,aAAa,EAAE,aAAa;EAC5B,WAAW,EAAE;AACf,CAAC,CAAC;AACF,MAAMC,aAAa,GAAGT,cAAK,CAACU,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEV,SAAS,CAAC;AAE5E,MAAMW,OAAO,GAAGd,QAAQ,CAACe,eAAe,CAAC,UAAU,CAAC;AACpD,MAAMC,cAAc,GAAGF,OAAO,EAAEG,IAAI,KAAK,UAAU,GAAGH,OAAO,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAE9F,MAAMC,OAAO,GAAGpB,QAAQ,CAACqB,YAAY,CAAC,iBAAiB,CAAC;AACxD,MAAMC,cAAc,GAAGF,OAAO,CAACH,IAAI,KAAK,UAAU,GAAGG,OAAO,CAACF,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAAC,IAAAI,QAAA,GAAAC,OAAA,CAAAzB,OAAA,GAE/E;EACb0B,EAAE,EAAE,SAAS;EACbC,OAAO,EAAE,CAAC,8CAA8C,CAAC;EACzDP,OAAO,EAAElB,cAAK,CAAC0B,IAAI;AACrB,UAAUjB,aAAa;AACvB;AACA,MAAMM,cAAc;AACpB;AACA,IAAIM,cAAc;AAClB;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,31 @@
|
|
|
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=4040-4933
|
|
10
|
+
// source=packages/components/src/components/VirtualizedList/index.tsx
|
|
11
|
+
// component=VirtualizedList
|
|
12
|
+
|
|
13
|
+
const instance = _figma.default.selectedInstance;
|
|
14
|
+
|
|
15
|
+
// Figma names this component FlatList. VirtualizedList is data-driven, so the `items` slot's
|
|
16
|
+
// first row is rendered once through `renderItem`.
|
|
17
|
+
const firstItem = instance.findInstance('ListItem');
|
|
18
|
+
const itemSnippet = firstItem.type === 'INSTANCE' ? firstItem.executeTemplate().example : null;
|
|
19
|
+
var _default = exports.default = {
|
|
20
|
+
id: 'virtualized-list',
|
|
21
|
+
imports: ["import { VirtualizedList } from '@cdx-ui/components'"],
|
|
22
|
+
example: _figma.default.code`
|
|
23
|
+
<VirtualizedList
|
|
24
|
+
data={items}
|
|
25
|
+
keyExtractor={(item) => item.id}
|
|
26
|
+
renderItem={({ item }) => (
|
|
27
|
+
${itemSnippet}
|
|
28
|
+
)}
|
|
29
|
+
/>`
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=VirtualizedList.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","firstItem","findInstance","itemSnippet","type","executeTemplate","example","_default","exports","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/VirtualizedList.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,SAAS,GAAGH,QAAQ,CAACI,YAAY,CAAC,UAAU,CAAC;AACnD,MAAMC,WAAW,GAAGF,SAAS,CAACG,IAAI,KAAK,UAAU,GAAGH,SAAS,CAACI,eAAe,CAAC,CAAC,CAACC,OAAO,GAAG,IAAI;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAX,OAAA,GAEhF;EACbY,EAAE,EAAE,kBAAkB;EACtBC,OAAO,EAAE,CAAC,sDAAsD,CAAC;EACjEJ,OAAO,EAAEP,cAAK,CAACY,IAAI;AACrB;AACA;AACA;AACA;AACA,MAAMR,WAAW;AACjB;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11954-3139
|
|
4
|
+
// source=packages/components/src/components/Calendar/index.tsx
|
|
5
|
+
// component=Calendar
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
|
|
9
|
+
// `view` (day / year) is internal navigation state toggled from the header at runtime. The code
|
|
10
|
+
// header always includes the year-picker toggle, so hiding it in Figma is flagged in the snippet.
|
|
11
|
+
const hidesYearPicker = instance.getEnum('Show Year Picker?', {
|
|
12
|
+
true: false,
|
|
13
|
+
false: true
|
|
14
|
+
});
|
|
15
|
+
export default {
|
|
16
|
+
id: 'calendar',
|
|
17
|
+
imports: ["import { Calendar } from '@cdx-ui/components'"],
|
|
18
|
+
example: figma.code`
|
|
19
|
+
${hidesYearPicker ? figma.code`{/* Calendar always shows the year-picker toggle; Figma "Show Year Picker?=false" has no code equivalent. */}` : null}
|
|
20
|
+
<Calendar value={value} onValueChange={setValue} aria-label="Date" />`
|
|
21
|
+
};
|
|
22
|
+
//# sourceMappingURL=Calendar.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","hidesYearPicker","getEnum","true","false","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Calendar.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA;AACA,MAAMC,eAAe,GAAGF,QAAQ,CAACG,OAAO,CAAC,mBAAmB,EAAE;EAC5DC,IAAI,EAAE,KAAK;EACXC,KAAK,EAAE;AACT,CAAC,CAAC;AAEF,eAAe;EACbC,EAAE,EAAE,UAAU;EACdC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAET,KAAK,CAACU,IAAI;AACrB,EAAEP,eAAe,GAAGH,KAAK,CAACU,IAAI,+GAA+G,GAAG,IAAI;AACpJ;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11445-15033
|
|
4
|
+
// source=packages/components/src/components/Carousel/navButton.tsx
|
|
5
|
+
// component=Carousel.NextButton
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
const isDisabled = instance.getEnum('isDisabled', {
|
|
9
|
+
true: true,
|
|
10
|
+
false: undefined
|
|
11
|
+
});
|
|
12
|
+
const disabledProp = figma.helpers.react.renderProp('disabled', isDisabled);
|
|
13
|
+
export default {
|
|
14
|
+
id: 'carousel-next-button',
|
|
15
|
+
imports: ["import { Carousel } from '@cdx-ui/components'"],
|
|
16
|
+
example: figma.code`<Carousel.NextButton${disabledProp} />`,
|
|
17
|
+
metadata: {
|
|
18
|
+
nestable: true
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=Carousel.NextButton.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","isDisabled","getEnum","true","false","undefined","disabledProp","helpers","react","renderProp","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/Carousel.NextButton.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,UAAU,GAAGF,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,YAAY,GAAGR,KAAK,CAACS,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,UAAU,EAAER,UAAU,CAAC;AAE3E,eAAe;EACbS,EAAE,EAAE,sBAAsB;EAC1BC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEd,KAAK,CAACe,IAAI,uBAAuBP,YAAY,KAAK;EAC3DQ,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=8999-5430
|
|
4
|
+
// source=packages/components/src/components/Carousel/index.tsx
|
|
5
|
+
// component=Carousel.Pagination
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
|
|
8
|
+
// Figma `segments` is the length of `data`, and `current` is the carousel's runtime position
|
|
9
|
+
// (tracked through the shared progress), so neither maps to a prop.
|
|
10
|
+
export default {
|
|
11
|
+
id: 'carousel-pagination',
|
|
12
|
+
imports: ["import { Carousel } from '@cdx-ui/components'"],
|
|
13
|
+
example: figma.code`<Carousel.Pagination data={slides} />`,
|
|
14
|
+
metadata: {
|
|
15
|
+
nestable: true
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
//# sourceMappingURL=Carousel.Pagination.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/Carousel.Pagination.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;AACA;AACA,eAAe;EACbC,EAAE,EAAE,qBAAqB;EACzBC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEH,KAAK,CAACI,IAAI,uCAAuC;EAC1DC,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11445-15045
|
|
4
|
+
// source=packages/components/src/components/Carousel/navButton.tsx
|
|
5
|
+
// component=Carousel.PrevButton
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
const isDisabled = instance.getEnum('isDisabled', {
|
|
9
|
+
true: true,
|
|
10
|
+
false: undefined
|
|
11
|
+
});
|
|
12
|
+
const disabledProp = figma.helpers.react.renderProp('disabled', isDisabled);
|
|
13
|
+
export default {
|
|
14
|
+
id: 'carousel-prev-button',
|
|
15
|
+
imports: ["import { Carousel } from '@cdx-ui/components'"],
|
|
16
|
+
example: figma.code`<Carousel.PrevButton${disabledProp} />`,
|
|
17
|
+
metadata: {
|
|
18
|
+
nestable: true
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=Carousel.PrevButton.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","isDisabled","getEnum","true","false","undefined","disabledProp","helpers","react","renderProp","id","imports","example","code","metadata","nestable"],"sourceRoot":"../../../src","sources":["figma/Carousel.PrevButton.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,UAAU,GAAGF,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,YAAY,GAAGR,KAAK,CAACS,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,UAAU,EAAER,UAAU,CAAC;AAE3E,eAAe;EACbS,EAAE,EAAE,sBAAsB;EAC1BC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEd,KAAK,CAACe,IAAI,uBAAuBP,YAAY,KAAK;EAC3DQ,QAAQ,EAAE;IAAEC,QAAQ,EAAE;EAAK;AAC7B,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11619-607
|
|
4
|
+
// source=packages/components/src/components/Carousel/index.tsx
|
|
5
|
+
// component=Carousel
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
const mode = instance.getEnum('mode', {
|
|
9
|
+
default: undefined,
|
|
10
|
+
parallax: 'parallax'
|
|
11
|
+
});
|
|
12
|
+
const modeProp = figma.helpers.react.renderProp('mode', mode);
|
|
13
|
+
|
|
14
|
+
// The code carousel is data-driven: every slide comes from `renderItem`, so the Figma
|
|
15
|
+
// `Previous Slide` / `Next Slide` swaps (parallax peeks) render through the same template as the
|
|
16
|
+
// current slide.
|
|
17
|
+
const currentSlide = instance.getInstanceSwap('Current Slide');
|
|
18
|
+
const slideSnippet = currentSlide?.type === 'INSTANCE' ? currentSlide.executeTemplate().example : null;
|
|
19
|
+
export default {
|
|
20
|
+
id: 'carousel',
|
|
21
|
+
imports: ["import { Carousel } from '@cdx-ui/components'"],
|
|
22
|
+
example: figma.code`
|
|
23
|
+
<Carousel
|
|
24
|
+
data={slides}
|
|
25
|
+
style={{ width: 300, height: 200 }}${modeProp}
|
|
26
|
+
renderItem={({ item }) => (
|
|
27
|
+
${slideSnippet}
|
|
28
|
+
)}
|
|
29
|
+
/>`
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=Carousel.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","mode","getEnum","default","undefined","parallax","modeProp","helpers","react","renderProp","currentSlide","getInstanceSwap","slideSnippet","type","executeTemplate","example","id","imports","code"],"sourceRoot":"../../../src","sources":["figma/Carousel.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,IAAI,GAAGF,QAAQ,CAACG,OAAO,CAAC,MAAM,EAAE;EACpCC,OAAO,EAAEC,SAAS;EAClBC,QAAQ,EAAE;AACZ,CAAC,CAAC;AACF,MAAMC,QAAQ,GAAGR,KAAK,CAACS,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAER,IAAI,CAAC;;AAE7D;AACA;AACA;AACA,MAAMS,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;AAEnF,eAAe;EACbC,EAAE,EAAE,UAAU;EACdC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DF,OAAO,EAAEjB,KAAK,CAACoB,IAAI;AACrB;AACA;AACA,uCAAuCZ,QAAQ;AAC/C;AACA,MAAMM,YAAY;AAClB;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=5541-5967
|
|
4
|
+
// source=packages/components/src/components/Checkbox/index.tsx
|
|
5
|
+
// component=Checkbox.Group
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
const optionsSlot = instance.getSlot('options');
|
|
9
|
+
const optionsChildren = optionsSlot ? figma.helpers.react.renderChildren(optionsSlot) : null;
|
|
10
|
+
export default {
|
|
11
|
+
id: 'checkbox-group',
|
|
12
|
+
imports: ["import { Checkbox } from '@cdx-ui/components'"],
|
|
13
|
+
example: figma.code`
|
|
14
|
+
<Checkbox.Group>
|
|
15
|
+
${optionsChildren}
|
|
16
|
+
</Checkbox.Group>`
|
|
17
|
+
};
|
|
18
|
+
//# sourceMappingURL=Checkbox.Group.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","selectedInstance","optionsSlot","getSlot","optionsChildren","helpers","react","renderChildren","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Checkbox.Group.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,WAAW,GAAGF,QAAQ,CAACG,OAAO,CAAC,SAAS,CAAC;AAC/C,MAAMC,eAAe,GAAGF,WAAW,GAAGH,KAAK,CAACM,OAAO,CAACC,KAAK,CAACC,cAAc,CAACL,WAAW,CAAC,GAAG,IAAI;AAE5F,eAAe;EACbM,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,+CAA+C,CAAC;EAC1DC,OAAO,EAAEX,KAAK,CAACY,IAAI;AACrB;AACA,IAAIP,eAAe;AACnB;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=10803-8259
|
|
4
|
+
// source=packages/components/src/components/CurrencyInput/index.tsx
|
|
5
|
+
// component=CurrencyInput
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
|
|
9
|
+
// Figma names this component AmountInput. CurrencyInput is the large centered amount entry, which
|
|
10
|
+
// matches `variant=hero`; the bordered `outlined` variant and the trailing slot have no code
|
|
11
|
+
// equivalent, so the snippet flags them rather than substituting another component.
|
|
12
|
+
// `Viewport` only previews responsive type sizes.
|
|
13
|
+
const isOutlined = instance.getEnum('variant', {
|
|
14
|
+
outlined: true,
|
|
15
|
+
hero: false
|
|
16
|
+
});
|
|
17
|
+
const showTrailingSlot = instance.getBoolean('Show TrailingSlot?');
|
|
18
|
+
const isInvalid = instance.getEnum('isInvalid', {
|
|
19
|
+
true: true,
|
|
20
|
+
false: undefined
|
|
21
|
+
});
|
|
22
|
+
const isReadOnly = instance.getEnum('isReadOnly', {
|
|
23
|
+
true: true,
|
|
24
|
+
false: undefined
|
|
25
|
+
});
|
|
26
|
+
const isDisabled = instance.getEnum('isDisabled', {
|
|
27
|
+
true: true,
|
|
28
|
+
false: undefined
|
|
29
|
+
});
|
|
30
|
+
const currencySymbol = instance.getString('currencySymbol');
|
|
31
|
+
const amount = Number(instance.getString('value').replace(/[^0-9.]/g, ''));
|
|
32
|
+
const valueProp = figma.helpers.react.renderProp('value', Number.isFinite(amount) ? amount : 0);
|
|
33
|
+
const currencySymbolProp = figma.helpers.react.renderProp('currencySymbol', currencySymbol === '$' ? undefined : currencySymbol);
|
|
34
|
+
const isInvalidProp = figma.helpers.react.renderProp('isInvalid', isInvalid);
|
|
35
|
+
const isReadOnlyProp = figma.helpers.react.renderProp('isReadOnly', isReadOnly);
|
|
36
|
+
const isDisabledProp = figma.helpers.react.renderProp('isDisabled', isDisabled);
|
|
37
|
+
export default {
|
|
38
|
+
id: 'currency-input',
|
|
39
|
+
imports: ["import { CurrencyInput } from '@cdx-ui/components'"],
|
|
40
|
+
example: figma.code`
|
|
41
|
+
${isOutlined ? figma.code`{/* Figma variant "outlined" has no code equivalent; CurrencyInput renders the "hero" style. */}` : null}
|
|
42
|
+
${showTrailingSlot ? figma.code`{/* The Figma trailing slot has no CurrencyInput equivalent. */}` : null}
|
|
43
|
+
<CurrencyInput
|
|
44
|
+
accessibilityLabel="Amount"${valueProp}${currencySymbolProp}${isInvalidProp}${isReadOnlyProp}${isDisabledProp}
|
|
45
|
+
onChangeValue={setAmount}
|
|
46
|
+
/>`
|
|
47
|
+
};
|
|
48
|
+
//# sourceMappingURL=CurrencyInput.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","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","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/CurrencyInput.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;;AAEvC;AACA;AACA;AACA;AACA,MAAMC,UAAU,GAAGF,QAAQ,CAACG,OAAO,CAAC,SAAS,EAAE;EAC7CC,QAAQ,EAAE,IAAI;EACdC,IAAI,EAAE;AACR,CAAC,CAAC;AACF,MAAMC,gBAAgB,GAAGN,QAAQ,CAACO,UAAU,CAAC,oBAAoB,CAAC;AAElE,MAAMC,SAAS,GAAGR,QAAQ,CAACG,OAAO,CAAC,WAAW,EAAE;EAC9CM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGZ,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGb,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDM,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AAEF,MAAMG,cAAc,GAAGd,QAAQ,CAACe,SAAS,CAAC,gBAAgB,CAAC;AAC3D,MAAMC,MAAM,GAAGC,MAAM,CAACjB,QAAQ,CAACe,SAAS,CAAC,OAAO,CAAC,CAACG,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;AAE1E,MAAMC,SAAS,GAAGpB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEL,MAAM,CAACM,QAAQ,CAACP,MAAM,CAAC,GAAGA,MAAM,GAAG,CAAC,CAAC;AAC/F,MAAMQ,kBAAkB,GAAGzB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CACvD,gBAAgB,EAChBR,cAAc,KAAK,GAAG,GAAGH,SAAS,GAAGG,cACvC,CAAC;AACD,MAAMW,aAAa,GAAG1B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEd,SAAS,CAAC;AAC5E,MAAMkB,cAAc,GAAG3B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEV,UAAU,CAAC;AAC/E,MAAMe,cAAc,GAAG5B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAET,UAAU,CAAC;AAE/E,eAAe;EACbe,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CAAC,oDAAoD,CAAC;EAC/DC,OAAO,EAAE/B,KAAK,CAACgC,IAAI;AACrB,EAAE7B,UAAU,GAAGH,KAAK,CAACgC,IAAI,kGAAkG,GAAG,IAAI;AAClI,EAAEzB,gBAAgB,GAAGP,KAAK,CAACgC,IAAI,kEAAkE,GAAG,IAAI;AACxG;AACA,+BAA+BZ,SAAS,GAAGK,kBAAkB,GAAGC,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC/G;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=11787-9802
|
|
4
|
+
// source=packages/components/src/components/DateField/index.tsx
|
|
5
|
+
// component=DateField
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
const isInvalid = instance.getEnum('isInvalid', {
|
|
9
|
+
true: true,
|
|
10
|
+
false: undefined
|
|
11
|
+
});
|
|
12
|
+
const isReadOnly = instance.getEnum('isReadOnly', {
|
|
13
|
+
true: true,
|
|
14
|
+
false: undefined
|
|
15
|
+
});
|
|
16
|
+
const isDisabled = instance.getEnum('isDisabled', {
|
|
17
|
+
true: true,
|
|
18
|
+
false: undefined
|
|
19
|
+
});
|
|
20
|
+
const showPrefixSlot = instance.getBoolean('Show Prefix Slot?');
|
|
21
|
+
const showPickerTrigger = instance.getBoolean('Show Picker Trigger?');
|
|
22
|
+
const modeByFormat = {
|
|
23
|
+
'MM/DD/YYYY': undefined,
|
|
24
|
+
'MM/YYYY': 'month'
|
|
25
|
+
};
|
|
26
|
+
const value = instance.findInstance('DateField.Value');
|
|
27
|
+
const format = value.type === 'INSTANCE' ? value.getPropertyValue('format') : undefined;
|
|
28
|
+
const mode = typeof format === 'string' ? modeByFormat[format] : undefined;
|
|
29
|
+
const modeProp = figma.helpers.react.renderProp('mode', mode);
|
|
30
|
+
const isInvalidProp = figma.helpers.react.renderProp('isInvalid', isInvalid);
|
|
31
|
+
const isReadOnlyProp = figma.helpers.react.renderProp('isReadOnly', isReadOnly);
|
|
32
|
+
const isDisabledProp = figma.helpers.react.renderProp('isDisabled', isDisabled);
|
|
33
|
+
|
|
34
|
+
// DateField has no prefix slot, and the picker trigger only works inside DatePicker (see
|
|
35
|
+
// DatePicker.figma.ts), so both are flagged rather than rendered.
|
|
36
|
+
export default {
|
|
37
|
+
id: 'date-field',
|
|
38
|
+
imports: ["import { DateField } from '@cdx-ui/components'"],
|
|
39
|
+
example: figma.code`
|
|
40
|
+
${showPrefixSlot ? figma.code`{/* The Figma prefix slot has no DateField equivalent. */}` : null}
|
|
41
|
+
${showPickerTrigger ? figma.code`{/* A picker trigger needs DatePicker; see the DatePicker component. */}` : null}
|
|
42
|
+
<DateField
|
|
43
|
+
value={value}
|
|
44
|
+
onValueChange={setValue}
|
|
45
|
+
aria-label="Date"${modeProp}${isInvalidProp}${isReadOnlyProp}${isDisabledProp}
|
|
46
|
+
>
|
|
47
|
+
<DateField.Group>
|
|
48
|
+
<DateField.Input />
|
|
49
|
+
</DateField.Group>
|
|
50
|
+
</DateField>`
|
|
51
|
+
};
|
|
52
|
+
//# sourceMappingURL=DateField.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","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","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/DateField.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,SAAS,GAAGF,QAAQ,CAACG,OAAO,CAAC,WAAW,EAAE;EAC9CC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,UAAU,GAAGP,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGR,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMG,cAAc,GAAGT,QAAQ,CAACU,UAAU,CAAC,mBAAmB,CAAC;AAC/D,MAAMC,iBAAiB,GAAGX,QAAQ,CAACU,UAAU,CAAC,sBAAsB,CAAC;AAErE,MAAME,YAAgD,GAAG;EACvD,YAAY,EAAEN,SAAS;EACvB,SAAS,EAAE;AACb,CAAC;AACD,MAAMO,KAAK,GAAGb,QAAQ,CAACc,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,GAAGpB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,MAAM,EAAEJ,IAAI,CAAC;AAC7D,MAAMK,aAAa,GAAGxB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEpB,SAAS,CAAC;AAC5E,MAAMsB,cAAc,GAAGzB,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEf,UAAU,CAAC;AAC/E,MAAMkB,cAAc,GAAG1B,KAAK,CAACqB,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,YAAY,EAAEd,UAAU,CAAC;;AAE/E;AACA;AACA,eAAe;EACbkB,EAAE,EAAE,YAAY;EAChBC,OAAO,EAAE,CAAC,gDAAgD,CAAC;EAC3DC,OAAO,EAAE7B,KAAK,CAAC8B,IAAI;AACrB,EAAEpB,cAAc,GAAGV,KAAK,CAAC8B,IAAI,4DAA4D,GAAG,IAAI;AAChG,EAAElB,iBAAiB,GAAGZ,KAAK,CAAC8B,IAAI,0EAA0E,GAAG,IAAI;AACjH;AACA;AACA;AACA,qBAAqBV,QAAQ,GAAGI,aAAa,GAAGC,cAAc,GAAGC,cAAc;AAC/E;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=12349-9879
|
|
4
|
+
// source=packages/components/src/components/DatePicker/index.tsx
|
|
5
|
+
// component=DatePicker
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
|
|
9
|
+
// `isOpen` only previews the open surface; the picker opens from its trigger at runtime.
|
|
10
|
+
const surface = instance.getEnum('Picker Type', {
|
|
11
|
+
Popover: 'DatePicker.Popover',
|
|
12
|
+
Dialog: 'DatePicker.Dialog',
|
|
13
|
+
BottomSheet: 'DatePicker.BottomSheet'
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
// DatePicker replaces the DateField root in code, so the nested Field (DateField) and DateField
|
|
17
|
+
// properties are read here rather than delegating to their templates.
|
|
18
|
+
const field = instance.findInstance('Field (DateField)');
|
|
19
|
+
const dateField = instance.findInstance('DateField', {
|
|
20
|
+
traverseInstances: true
|
|
21
|
+
});
|
|
22
|
+
const hasField = field.type === 'INSTANCE';
|
|
23
|
+
const hasDateField = dateField.type === 'INSTANCE';
|
|
24
|
+
const showLabel = hasField && field.getBoolean('Show Label?');
|
|
25
|
+
const showHelperText = hasField && field.getBoolean('Show Helper Text?');
|
|
26
|
+
const showErrorText = hasField && field.getBoolean('Show Error Text?');
|
|
27
|
+
const isInvalid = hasField ? field.getEnum('isInvalid', {
|
|
28
|
+
true: true,
|
|
29
|
+
false: undefined
|
|
30
|
+
}) : undefined;
|
|
31
|
+
const isReadOnly = hasField ? field.getEnum('isReadOnly', {
|
|
32
|
+
true: true,
|
|
33
|
+
false: undefined
|
|
34
|
+
}) : undefined;
|
|
35
|
+
const isDisabled = hasField ? field.getEnum('isDisabled', {
|
|
36
|
+
true: true,
|
|
37
|
+
false: undefined
|
|
38
|
+
}) : undefined;
|
|
39
|
+
const showPickerTrigger = hasDateField && dateField.getBoolean('Show Picker Trigger?');
|
|
40
|
+
const showPrefixSlot = hasDateField && dateField.getBoolean('Show Prefix Slot?');
|
|
41
|
+
const dateFieldValue = instance.findInstance('DateField.Value', {
|
|
42
|
+
traverseInstances: true
|
|
43
|
+
});
|
|
44
|
+
const isMonthFormat = dateFieldValue.type === 'INSTANCE' && dateFieldValue.getPropertyValue('format') === 'MM/YYYY';
|
|
45
|
+
const labelText = instance.findText('{label}', {
|
|
46
|
+
traverseInstances: true
|
|
47
|
+
}).textContent;
|
|
48
|
+
const helperText = instance.findText('{HelperText}', {
|
|
49
|
+
traverseInstances: true
|
|
50
|
+
}).textContent;
|
|
51
|
+
const errorText = instance.findText('{ErrorText}', {
|
|
52
|
+
traverseInstances: true
|
|
53
|
+
}).textContent;
|
|
54
|
+
const isInvalidProp = figma.helpers.react.renderProp('isInvalid', isInvalid);
|
|
55
|
+
const isReadOnlyProp = figma.helpers.react.renderProp('isReadOnly', isReadOnly);
|
|
56
|
+
const isDisabledProp = figma.helpers.react.renderProp('isDisabled', isDisabled);
|
|
57
|
+
export default {
|
|
58
|
+
id: 'date-picker',
|
|
59
|
+
imports: ["import { DateField, DatePicker, Field } from '@cdx-ui/components'"],
|
|
60
|
+
example: figma.code`
|
|
61
|
+
${isMonthFormat ? figma.code`{/* DatePicker selects a full date; the Figma MM/YYYY format has no DatePicker equivalent. */}` : null}
|
|
62
|
+
${showPrefixSlot ? figma.code`{/* The Figma prefix slot has no DateField equivalent. */}` : null}
|
|
63
|
+
<Field${isInvalidProp}${isReadOnlyProp}${isDisabledProp}>
|
|
64
|
+
<DatePicker value={value} onValueChange={setValue}>
|
|
65
|
+
${showLabel ? figma.code`<Field.Label>${labelText}</Field.Label>` : null}
|
|
66
|
+
<DateField.Group fullWidth>
|
|
67
|
+
<DateField.Input />
|
|
68
|
+
${showPickerTrigger ? figma.code`<DateField.Suffix>
|
|
69
|
+
<DatePicker.Trigger>
|
|
70
|
+
<DatePicker.TriggerIndicator />
|
|
71
|
+
</DatePicker.Trigger>
|
|
72
|
+
</DateField.Suffix>` : null}
|
|
73
|
+
</DateField.Group>
|
|
74
|
+
${!isInvalid && showHelperText ? figma.code`<Field.Helper>${helperText}</Field.Helper>` : null}
|
|
75
|
+
${isInvalid && showErrorText ? figma.code`<Field.Error>${errorText}</Field.Error>` : null}
|
|
76
|
+
<${surface}>
|
|
77
|
+
<DatePicker.Calendar aria-label="${labelText}" />
|
|
78
|
+
</${surface}>
|
|
79
|
+
</DatePicker>
|
|
80
|
+
</Field>`
|
|
81
|
+
};
|
|
82
|
+
//# sourceMappingURL=DatePicker.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","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","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/DatePicker.figma.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=12449-28564
|
|
4
|
+
// source=packages/components/src/components/DateRangePicker/index.tsx
|
|
5
|
+
// component=DateRangePicker
|
|
6
|
+
import figma from 'figma';
|
|
7
|
+
const instance = figma.selectedInstance;
|
|
8
|
+
|
|
9
|
+
// `isOpen` only previews the open surface; the picker opens from its trigger at runtime.
|
|
10
|
+
const surface = instance.getEnum('Picker Type', {
|
|
11
|
+
Popover: 'DateRangePicker.Popover',
|
|
12
|
+
Dialog: 'DateRangePicker.Dialog',
|
|
13
|
+
BottomSheet: 'DateRangePicker.BottomSheet'
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
// The nested Figma Field (DateRangeField) has no standalone code component; in code the range
|
|
17
|
+
// input is composed from DateField parts inside DateRangePicker, so its properties are read here.
|
|
18
|
+
const field = instance.findInstance('Field (DateRangeField)');
|
|
19
|
+
const rangeField = instance.findInstance('DateRangeField', {
|
|
20
|
+
traverseInstances: true
|
|
21
|
+
});
|
|
22
|
+
const hasField = field.type === 'INSTANCE';
|
|
23
|
+
const hasRangeField = rangeField.type === 'INSTANCE';
|
|
24
|
+
const showLabel = hasField && field.getBoolean('Show Label?');
|
|
25
|
+
const showHelperText = hasField && field.getBoolean('Show Helper Text?');
|
|
26
|
+
const showErrorText = hasField && field.getBoolean('Show Error Text?');
|
|
27
|
+
const isInvalid = hasField ? field.getEnum('isInvalid', {
|
|
28
|
+
true: true,
|
|
29
|
+
false: undefined
|
|
30
|
+
}) : undefined;
|
|
31
|
+
const isReadOnly = hasField ? field.getEnum('isReadOnly', {
|
|
32
|
+
true: true,
|
|
33
|
+
false: undefined
|
|
34
|
+
}) : undefined;
|
|
35
|
+
const isDisabled = hasField ? field.getEnum('isDisabled', {
|
|
36
|
+
true: true,
|
|
37
|
+
false: undefined
|
|
38
|
+
}) : undefined;
|
|
39
|
+
const showPickerTrigger = hasRangeField && rangeField.getBoolean('Show Picker Trigger?');
|
|
40
|
+
const showPrefixSlot = hasRangeField && rangeField.getBoolean('Show Prefix Slot?');
|
|
41
|
+
const labelText = instance.findText('{label}', {
|
|
42
|
+
traverseInstances: true
|
|
43
|
+
}).textContent;
|
|
44
|
+
const helperText = instance.findText('{HelperText}', {
|
|
45
|
+
traverseInstances: true
|
|
46
|
+
}).textContent;
|
|
47
|
+
const errorText = instance.findText('{ErrorText}', {
|
|
48
|
+
traverseInstances: true
|
|
49
|
+
}).textContent;
|
|
50
|
+
const isInvalidProp = figma.helpers.react.renderProp('isInvalid', isInvalid);
|
|
51
|
+
const isReadOnlyProp = figma.helpers.react.renderProp('isReadOnly', isReadOnly);
|
|
52
|
+
const isDisabledProp = figma.helpers.react.renderProp('isDisabled', isDisabled);
|
|
53
|
+
export default {
|
|
54
|
+
id: 'date-range-picker',
|
|
55
|
+
imports: ["import { DateField, DateRangePicker, Field } from '@cdx-ui/components'"],
|
|
56
|
+
example: figma.code`
|
|
57
|
+
${showPrefixSlot ? figma.code`{/* The Figma prefix slot has no DateField equivalent. */}` : null}
|
|
58
|
+
<Field${isInvalidProp}${isReadOnlyProp}${isDisabledProp}>
|
|
59
|
+
<DateRangePicker value={value} onValueChange={setValue}>
|
|
60
|
+
${showLabel ? figma.code`<Field.Label>${labelText}</Field.Label>` : null}
|
|
61
|
+
<DateRangePicker.Trigger className="w-full">
|
|
62
|
+
<DateField.Group fullWidth>
|
|
63
|
+
<DateField.Input slot="start" />
|
|
64
|
+
<DateRangePicker.RangeSeparator />
|
|
65
|
+
<DateField.Input slot="end" />
|
|
66
|
+
${showPickerTrigger ? figma.code`<DateField.Suffix>
|
|
67
|
+
<DateRangePicker.TriggerIndicator />
|
|
68
|
+
</DateField.Suffix>` : null}
|
|
69
|
+
</DateField.Group>
|
|
70
|
+
</DateRangePicker.Trigger>
|
|
71
|
+
${!isInvalid && showHelperText ? figma.code`<Field.Helper>${helperText}</Field.Helper>` : null}
|
|
72
|
+
${isInvalid && showErrorText ? figma.code`<Field.Error>${errorText}</Field.Error>` : null}
|
|
73
|
+
<${surface}>
|
|
74
|
+
<DateRangePicker.Calendar accessibilityLabel="${labelText}" />
|
|
75
|
+
</${surface}>
|
|
76
|
+
</DateRangePicker>
|
|
77
|
+
</Field>`
|
|
78
|
+
};
|
|
79
|
+
//# sourceMappingURL=DateRangePicker.figma.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["figma","instance","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","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/DateRangePicker.figma.ts"],"mappings":"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","ignoreList":[]}
|