@carrier-dpx/air-react-library 0.7.41 → 0.7.43

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.
Files changed (10) hide show
  1. package/package.json +1 -1
  2. package/src/components/Icon/icons/demo/CalendarIcon.figma.tsx +33 -0
  3. package/src/components/Icon/icons/demo/CalendarIcon.tsx +19 -0
  4. package/src/components/Icon/icons/demo/GridViewIcon.figma.tsx +33 -0
  5. package/src/components/Icon/icons/demo/GridViewIcon.tsx +22 -0
  6. package/src/components/Icon/icons/demo/calendar_outlined.svg +3 -0
  7. package/src/components/Icon/icons/demo/grid_view_outlined.svg +6 -0
  8. package/src/components/Icon/icons/demo/iconRegistry.tsx +25 -0
  9. package/src/components/Icon/icons/demo/index.ts +6 -0
  10. package/src/index.ts +4 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@carrier-dpx/air-react-library",
3
- "version": "0.7.41",
3
+ "version": "0.7.43",
4
4
  "description": "Air web React component library for Figma Make",
5
5
  "main": "src/index.ts",
6
6
  "types": "src/index.ts",
package/src/components/Icon/icons/demo/CalendarIcon.figma.tsx ADDED
@@ -0,0 +1,33 @@
1
+ /**
2
+ * Figma Code Connect Configuration for CalendarIcon
3
+ *
4
+ * Figma URL: https://www.figma.com/design/RT43n0bKuuIt7ylllD3DR0/Icon-Library?node-id=13-236
5
+ */
6
+
7
+ import figma from "@figma/code-connect";
8
+ import Icon from "../../Icon";
9
+ import { CalendarIcon } from "./CalendarIcon";
10
+
11
+ figma.connect(
12
+ CalendarIcon,
13
+ "https://www.figma.com/design/RT43n0bKuuIt7ylllD3DR0/Icon-Library?node-id=13-236",
14
+ {
15
+ props: {
16
+ /**
17
+ * STYLE/VARIANT MAPPING
18
+ * Maps Figma's "Style" property to React's "variant" prop
19
+ * Figma: Style="Outlined" → React: variant="outlined"
20
+ * Figma: Style="Filled" → React: variant="filled"
21
+ */
22
+ variant: figma.enum("Style", {
23
+ Outlined: "outlined",
24
+ Filled: "filled",
25
+ }),
26
+ },
27
+ example: ({ variant }) => (
28
+ <Icon fontSize="medium">
29
+ <CalendarIcon variant={variant} />
30
+ </Icon>
31
+ ),
32
+ }
33
+ );
package/src/components/Icon/icons/demo/CalendarIcon.tsx ADDED
@@ -0,0 +1,19 @@
1
+ import { FC, SVGProps } from "react";
2
+
3
+ export interface CalendarIconProps extends SVGProps<SVGSVGElement> {
4
+ variant?: "outlined" | "filled";
5
+ }
6
+
7
+ export const CalendarIcon: FC<CalendarIconProps> = ({ variant = "outlined", style, ...props }) => {
8
+ return (
9
+ <svg
10
+ viewBox="0 0 24 24"
11
+ fill="none"
12
+ xmlns="http://www.w3.org/2000/svg"
13
+ style={{ width: "1em", height: "1em", display: "block", ...style }}
14
+ {...props}
15
+ >
16
+ <path fillRule="evenodd" clipRule="evenodd" d="M17 2C17.5523 2 18 2.44772 18 3V4H19C20.1 4 21 4.9 21 6V20C21 21.1 20.1 22 19 22H5C3.89 22 3 21.1 3 20V6C3 4.9 3.89 4 5 4H6V3C6 2.44772 6.44772 2 7 2C7.55228 2 8 2.44772 8 3V4H16V3C16 2.44772 16.4477 2 17 2ZM5 20H19V10H5V20ZM5 8H19V6H5V8Z" fill="currentColor"/>
17
+ </svg>
18
+ );
19
+ };
package/src/components/Icon/icons/demo/GridViewIcon.figma.tsx ADDED
@@ -0,0 +1,33 @@
1
+ /**
2
+ * Figma Code Connect Configuration for GridViewIcon
3
+ *
4
+ * Figma URL: https://www.figma.com/design/RT43n0bKuuIt7ylllD3DR0/Icon-Library?node-id=346-1469
5
+ */
6
+
7
+ import figma from "@figma/code-connect";
8
+ import Icon from "../../Icon";
9
+ import { GridViewIcon } from "./GridViewIcon";
10
+
11
+ figma.connect(
12
+ GridViewIcon,
13
+ "https://www.figma.com/design/RT43n0bKuuIt7ylllD3DR0/Icon-Library?node-id=346-1469",
14
+ {
15
+ props: {
16
+ /**
17
+ * STYLE/VARIANT MAPPING
18
+ * Maps Figma's "Style" property to React's "variant" prop
19
+ * Figma: Style="Outlined" → React: variant="outlined"
20
+ * Figma: Style="Filled" → React: variant="filled"
21
+ */
22
+ variant: figma.enum("Style", {
23
+ Outlined: "outlined",
24
+ Filled: "filled",
25
+ }),
26
+ },
27
+ example: ({ variant }) => (
28
+ <Icon fontSize="medium">
29
+ <GridViewIcon variant={variant} />
30
+ </Icon>
31
+ ),
32
+ }
33
+ );
package/src/components/Icon/icons/demo/GridViewIcon.tsx ADDED
@@ -0,0 +1,22 @@
1
+ import { FC, SVGProps } from "react";
2
+
3
+ export interface GridViewIconProps extends SVGProps<SVGSVGElement> {
4
+ variant?: "outlined" | "filled";
5
+ }
6
+
7
+ export const GridViewIcon: FC<GridViewIconProps> = ({ variant = "outlined", style, ...props }) => {
8
+ return (
9
+ <svg
10
+ viewBox="0 0 24 24"
11
+ fill="none"
12
+ xmlns="http://www.w3.org/2000/svg"
13
+ style={{ width: "1em", height: "1em", display: "block", ...style }}
14
+ {...props}
15
+ >
16
+ <path fillRule="evenodd" clipRule="evenodd" d="M10 13C10.5523 13 11 13.4477 11 14V20C11 20.5523 10.5523 21 10 21H4C3.44772 21 3 20.5523 3 20V14C3 13.4477 3.44772 13 4 13H10ZM5 19H9V15H5V19Z" fill="currentColor"/>
17
+ <path fillRule="evenodd" clipRule="evenodd" d="M20 13C20.5523 13 21 13.4477 21 14V20C21 20.5523 20.5523 21 20 21H14C13.4477 21 13 20.5523 13 20V14C13 13.4477 13.4477 13 14 13H20ZM15 19H19V15H15V19Z" fill="currentColor"/>
18
+ <path fillRule="evenodd" clipRule="evenodd" d="M10 3C10.5523 3 11 3.44772 11 4V10C11 10.5523 10.5523 11 10 11H4C3.44772 11 3 10.5523 3 10V4C3 3.44772 3.44772 3 4 3H10ZM5 9H9V5H5V9Z" fill="currentColor"/>
19
+ <path fillRule="evenodd" clipRule="evenodd" d="M20 3C20.5523 3 21 3.44772 21 4V10C21 10.5523 20.5523 11 20 11H14C13.4477 11 13 10.5523 13 10V4C13 3.44772 13.4477 3 14 3H20ZM15 9H19V5H15V9Z" fill="currentColor"/>
20
+ </svg>
21
+ );
22
+ };
package/src/components/Icon/icons/demo/calendar_outlined.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M17 2C17.5523 2 18 2.44772 18 3V4H19C20.1 4 21 4.9 21 6V20C21 21.1 20.1 22 19 22H5C3.89 22 3 21.1 3 20V6C3 4.9 3.89 4 5 4H6V3C6 2.44772 6.44772 2 7 2C7.55228 2 8 2.44772 8 3V4H16V3C16 2.44772 16.4477 2 17 2ZM5 20H19V10H5V20ZM5 8H19V6H5V8Z" fill="black"/>
3
+ </svg>
package/src/components/Icon/icons/demo/grid_view_outlined.svg ADDED
@@ -0,0 +1,6 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M10 13C10.5523 13 11 13.4477 11 14V20C11 20.5523 10.5523 21 10 21H4C3.44772 21 3 20.5523 3 20V14C3 13.4477 3.44772 13 4 13H10ZM5 19H9V15H5V19Z" fill="black"/>
3
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M20 13C20.5523 13 21 13.4477 21 14V20C21 20.5523 20.5523 21 20 21H14C13.4477 21 13 20.5523 13 20V14C13 13.4477 13.4477 13 14 13H20ZM15 19H19V15H15V19Z" fill="black"/>
4
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M10 3C10.5523 3 11 3.44772 11 4V10C11 10.5523 10.5523 11 10 11H4C3.44772 11 3 10.5523 3 10V4C3 3.44772 3.44772 3 4 3H10ZM5 9H9V5H5V9Z" fill="black"/>
5
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M20 3C20.5523 3 21 3.44772 21 4V10C21 10.5523 20.5523 11 20 11H14C13.4477 11 13 10.5523 13 10V4C13 3.44772 13.4477 3 14 3H20ZM15 9H19V5H15V9Z" fill="black"/>
6
+ </svg>
package/src/components/Icon/icons/demo/iconRegistry.tsx CHANGED
@@ -81,6 +81,21 @@ const ChevronLeftSvg: FC<React.SVGProps<SVGSVGElement>> = ({ style, ...props })
81
81
  </svg>
82
82
  );
83
83
 
84
+ const GridViewSvg: FC<React.SVGProps<SVGSVGElement>> = ({ style, ...props }) => (
85
+ <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" style={{ width: "1em", height: "1em", display: "block", ...style }} {...props}>
86
+ <path fillRule="evenodd" clipRule="evenodd" d="M10 13C10.5523 13 11 13.4477 11 14V20C11 20.5523 10.5523 21 10 21H4C3.44772 21 3 20.5523 3 20V14C3 13.4477 3.44772 13 4 13H10ZM5 19H9V15H5V19Z" fill="currentColor"/>
87
+ <path fillRule="evenodd" clipRule="evenodd" d="M20 13C20.5523 13 21 13.4477 21 14V20C21 20.5523 20.5523 21 20 21H14C13.4477 21 13 20.5523 13 20V14C13 13.4477 13.4477 13 14 13H20ZM15 19H19V15H15V19Z" fill="currentColor"/>
88
+ <path fillRule="evenodd" clipRule="evenodd" d="M10 3C10.5523 3 11 3.44772 11 4V10C11 10.5523 10.5523 11 10 11H4C3.44772 11 3 10.5523 3 10V4C3 3.44772 3.44772 3 4 3H10ZM5 9H9V5H5V9Z" fill="currentColor"/>
89
+ <path fillRule="evenodd" clipRule="evenodd" d="M20 3C20.5523 3 21 3.44772 21 4V10C21 10.5523 20.5523 11 20 11H14C13.4477 11 13 10.5523 13 10V4C13 3.44772 13.4477 3 14 3H20ZM15 9H19V5H15V9Z" fill="currentColor"/>
90
+ </svg>
91
+ );
92
+
93
+ const CalendarSvg: FC<React.SVGProps<SVGSVGElement>> = ({ style, ...props }) => (
94
+ <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" style={{ width: "1em", height: "1em", display: "block", ...style }} {...props}>
95
+ <path fillRule="evenodd" clipRule="evenodd" d="M17 2C17.5523 2 18 2.44772 18 3V4H19C20.1 4 21 4.9 21 6V20C21 21.1 20.1 22 19 22H5C3.89 22 3 21.1 3 20V6C3 4.9 3.89 4 5 4H6V3C6 2.44772 6.44772 2 7 2C7.55228 2 8 2.44772 8 3V4H16V3C16 2.44772 16.4477 2 17 2ZM5 20H19V10H5V20ZM5 8H19V6H5V8Z" fill="currentColor"/>
96
+ </svg>
97
+ );
98
+
84
99
  // WarningTriangle SVG (previously WarningIcon)
85
100
 
86
101
  export interface IconInfo {
@@ -135,6 +150,16 @@ export const iconRegistry: Record<string, IconInfo> = {
135
150
  component: ChevronLeftSvg,
136
151
  variant: "outlined",
137
152
  },
153
+ gridview: {
154
+ name: "gridview",
155
+ component: GridViewSvg,
156
+ variant: "outlined",
157
+ },
158
+ calendar: {
159
+ name: "calendar",
160
+ component: CalendarSvg,
161
+ variant: "outlined",
162
+ },
138
163
  };
139
164
 
140
165
  /**
package/src/components/Icon/icons/demo/index.ts CHANGED
@@ -33,3 +33,9 @@ export type { AccountCircleIconProps } from "./AccountCircleIcon";
33
33
 
34
34
  export { ChevronLeftIcon } from "./ChevronLeftIcon";
35
35
  export type { ChevronLeftIconProps } from "./ChevronLeftIcon";
36
+
37
+ export { GridViewIcon } from "./GridViewIcon";
38
+ export type { GridViewIconProps } from "./GridViewIcon";
39
+
40
+ export { CalendarIcon } from "./CalendarIcon";
41
+ export type { CalendarIconProps } from "./CalendarIcon";
package/src/index.ts CHANGED
@@ -85,6 +85,8 @@ export {
85
85
  NotificationsIcon,
86
86
  AccountCircleIcon,
87
87
  ChevronLeftIcon,
88
+ GridViewIcon,
89
+ CalendarIcon,
88
90
  SvgIcon,
89
91
  iconRegistry,
90
92
  getIcon,
@@ -100,6 +102,8 @@ export type {
100
102
  NotificationsIconProps,
101
103
  AccountCircleIconProps,
102
104
  ChevronLeftIconProps,
105
+ GridViewIconProps,
106
+ CalendarIconProps,
103
107
  SvgIconProps,
104
108
  IconInfo,
105
109
  } from "./components/Icon/icons/demo";