@crystallize/design-system 1.24.41 → 1.24.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 (19) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/{chunk-UVSAFDWF.mjs → chunk-ZT2DX3UW.mjs} +1626 -1528
  3. package/dist/index.d.ts +4 -2
  4. package/dist/index.js +2269 -2138
  5. package/dist/index.mjs +16 -14
  6. package/dist/{rich-text-editor-K5YUVMCD.mjs → rich-text-editor-FTDWUJL3.mjs} +1 -1
  7. package/package.json +1 -1
  8. package/src/card/card.tsx +4 -4
  9. package/src/iconography/actions.tsx +40 -0
  10. package/src/iconography/advance.tsx +32 -0
  11. package/src/iconography/check-with-circle.tsx +6 -18
  12. package/src/iconography/clock.tsx +7 -5
  13. package/src/iconography/edit.tsx +4 -2
  14. package/src/iconography/index.ts +6 -0
  15. package/src/iconography/paths.tsx +5 -3
  16. package/src/iconography/remove.tsx +38 -0
  17. package/src/iconography/rocket.tsx +6 -4
  18. package/src/iconography/unpublish.tsx +7 -5
  19. package/src/iconography/warning.tsx +8 -16
package/dist/index.mjs CHANGED
@@ -17,10 +17,11 @@ import {
17
17
  showError,
18
18
  showInfo,
19
19
  showWarning
20
- } from "./chunk-UVSAFDWF.mjs";
20
+ } from "./chunk-ZT2DX3UW.mjs";
21
21
  import "./chunk-NIH5ZMPE.mjs";
22
22
 
23
23
  // src/card/card.tsx
24
+ import { forwardRef } from "react";
24
25
  import { cva } from "class-variance-authority";
25
26
  import { jsx } from "react/jsx-runtime";
26
27
  var cardStyles = cva("c-card", {
@@ -34,19 +35,20 @@ var cardStyles = cva("c-card", {
34
35
  variant: "default"
35
36
  }
36
37
  });
37
- function Card({ children, className, variant, ...delegated }) {
38
+ var Card = forwardRef(({ children, className, variant, ...delegated }, ref) => {
38
39
  return /* @__PURE__ */ jsx("section", {
40
+ ref,
39
41
  className: cardStyles({ variant, className }),
40
42
  ...delegated,
41
43
  children
42
44
  });
43
- }
45
+ });
44
46
 
45
47
  // src/card/index.ts
46
48
  var cardToken = "c-card";
47
49
 
48
50
  // src/avatar/avatar.tsx
49
- import { forwardRef } from "react";
51
+ import { forwardRef as forwardRef2 } from "react";
50
52
  import { cva as cva2 } from "class-variance-authority";
51
53
 
52
54
  // src/avatar/get-initials.ts
@@ -71,7 +73,7 @@ var avatarClassName = cva2(["c-avatar"], {
71
73
  size: "md"
72
74
  }
73
75
  });
74
- var Avatar = forwardRef(({ name, size, className, ...delegated }, ref) => {
76
+ var Avatar = forwardRef2(({ name, size, className, ...delegated }, ref) => {
75
77
  return /* @__PURE__ */ jsx2("div", {
76
78
  ref,
77
79
  ...delegated,
@@ -86,10 +88,10 @@ var Avatar = forwardRef(({ name, size, className, ...delegated }, ref) => {
86
88
  Avatar.displayName = "Avatar";
87
89
 
88
90
  // src/checkbox/checkbox.tsx
89
- import { forwardRef as forwardRef2 } from "react";
91
+ import { forwardRef as forwardRef3 } from "react";
90
92
  import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
91
93
  import { jsx as jsx3, jsxs } from "react/jsx-runtime";
92
- var Checkbox = forwardRef2((props, ref) => {
94
+ var Checkbox = forwardRef3((props, ref) => {
93
95
  return /* @__PURE__ */ jsx3(CheckboxPrimitive.Root, {
94
96
  ...props,
95
97
  ref,
@@ -294,11 +296,11 @@ var Radio = {
294
296
  };
295
297
 
296
298
  // src/select/select-item.tsx
297
- import { forwardRef as forwardRef3 } from "react";
299
+ import { forwardRef as forwardRef4 } from "react";
298
300
  import { cx as cx5 } from "class-variance-authority";
299
301
  import * as SelectPrimitives from "@radix-ui/react-select";
300
302
  import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
301
- var SelectItem = forwardRef3((props, ref) => {
303
+ var SelectItem = forwardRef4((props, ref) => {
302
304
  const { children, className, ...delegated } = props;
303
305
  return /* @__PURE__ */ jsxs4(SelectPrimitives.Item, {
304
306
  className: cx5("c-select-item", className),
@@ -315,7 +317,7 @@ var SelectItem = forwardRef3((props, ref) => {
315
317
  SelectItem.displayName = "SelectItem";
316
318
 
317
319
  // src/select/select-root.tsx
318
- import { forwardRef as forwardRef4 } from "react";
320
+ import { forwardRef as forwardRef5 } from "react";
319
321
  import { cva as cva4 } from "class-variance-authority";
320
322
  import * as SelectPrimitives2 from "@radix-ui/react-select";
321
323
  import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
@@ -332,7 +334,7 @@ var selectTriggerStyles = cva4("c-select-trigger", {
332
334
  size: "sm"
333
335
  }
334
336
  });
335
- var SelectContainer = forwardRef4(
337
+ var SelectContainer = forwardRef5(
336
338
  ({ children, id, placeholder, disabled, size, triggerClassName, ...delegated }, ref) => {
337
339
  return /* @__PURE__ */ jsxs5(SelectPrimitives2.Root, {
338
340
  ...delegated,
@@ -378,11 +380,11 @@ var Select = {
378
380
  };
379
381
 
380
382
  // src/slider/slider.tsx
381
- import { forwardRef as forwardRef5 } from "react";
383
+ import { forwardRef as forwardRef6 } from "react";
382
384
  import { cx as cx6 } from "class-variance-authority";
383
385
  import * as SliderPrimitive from "@radix-ui/react-slider";
384
386
  import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
385
- var Slider = forwardRef5(({ className, transparentRange, ...delegated }, ref) => {
387
+ var Slider = forwardRef6(({ className, transparentRange, ...delegated }, ref) => {
386
388
  return /* @__PURE__ */ jsxs6(SliderPrimitive.Root, {
387
389
  className: cx6("c-slider-root", className),
388
390
  ref,
@@ -486,7 +488,7 @@ function Tag({
486
488
  // src/rich-text-editor/index.tsx
487
489
  import { lazy, Suspense } from "react";
488
490
  import { jsx as jsx15 } from "react/jsx-runtime";
489
- var LazyRichTextEditor = lazy(() => import("./rich-text-editor-K5YUVMCD.mjs"));
491
+ var LazyRichTextEditor = lazy(() => import("./rich-text-editor-FTDWUJL3.mjs"));
490
492
  var RichTextEditor = (props) => {
491
493
  return /* @__PURE__ */ jsx15(Suspense, {
492
494
  fallback: null,
package/dist/{rich-text-editor-K5YUVMCD.mjs → rich-text-editor-FTDWUJL3.mjs} RENAMED
@@ -6,7 +6,7 @@ import {
6
6
  Icon,
7
7
  IconButton,
8
8
  InputWithLabel
9
- } from "./chunk-UVSAFDWF.mjs";
9
+ } from "./chunk-ZT2DX3UW.mjs";
10
10
  import "./chunk-NIH5ZMPE.mjs";
11
11
 
12
12
  // src/rich-text-editor/rich-text-editor.tsx
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@crystallize/design-system",
3
- "version": "1.24.41",
3
+ "version": "1.24.43",
4
4
  "types": "./dist/index.d.ts",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
package/src/card/card.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import type { HTMLAttributes } from 'react';
1
+ import { forwardRef, type HTMLAttributes } from 'react';
2
2
  import { cva, VariantProps } from 'class-variance-authority';
3
3
 
4
4
  import './card.css';
@@ -18,10 +18,10 @@ const cardStyles = cva('c-card', {
18
18
 
19
19
  type CardProps = HTMLAttributes<HTMLDivElement> & CardStylesProps;
20
20
 
21
- export function Card({ children, className, variant, ...delegated }: CardProps) {
21
+ export const Card = forwardRef<HTMLSelectElement, CardProps>(({ children, className, variant, ...delegated }, ref) => {
22
22
  return (
23
- <section className={cardStyles({ variant, className })} {...delegated}>
23
+ <section ref={ref} className={cardStyles({ variant, className })} {...delegated}>
24
24
  {children}
25
25
  </section>
26
26
  );
27
- }
27
+ });
package/src/iconography/actions.tsx ADDED
@@ -0,0 +1,40 @@
1
+ import { forwardRef, SVGProps } from 'react';
2
+
3
+ import { fill, stroke } from './variables';
4
+
5
+ type ActionsProps = SVGProps<SVGSVGElement>;
6
+
7
+ type ActionsRef = SVGSVGElement;
8
+
9
+ export const Actions = forwardRef<ActionsRef, ActionsProps>((delegated, ref) => {
10
+ return (
11
+ <svg ref={ref} width="22" height="22" viewBox="0 0 22 22" fill="none" {...delegated}>
12
+ <path
13
+ fill={fill}
14
+ d="m12.61 3.394-1.055 1.647a5.935 5.935 0 0 0-1.204.008l-1.09-1.642a.413.413 0 0 0-.485-.146l-1.787.756a.413.413 0 0 0-.233.45l.42 1.926c-.316.262-.605.56-.864.887l-1.907-.386a.413.413 0 0 0-.448.24L3.23 8.932c-.069.17 0 .386.154.484l1.653 1.061c-.035.4-.032.8.013 1.192l-1.621 1.076a.413.413 0 0 0-.147.487l.757 1.786a.413.413 0 0 0 .45.234l1.913-.418c.252.303.537.58.85.832l-.389 1.917a.413.413 0 0 0 .24.447l1.798.728c.17.069.386 0 .485-.153l1.055-1.645c.407.038.814.037 1.213-.008l1.07 1.614c.101.152.32.217.487.146l1.786-.756a.413.413 0 0 0 .234-.451l-.414-1.891a5.97 5.97 0 0 0 .83-.839l1.926.39a.413.413 0 0 0 .447-.241l.728-1.798a.413.413 0 0 0-.153-.484l-1.639-1.05c.041-.412.041-.822-.002-1.226l1.634-1.084a.413.413 0 0 0 .146-.486l-.756-1.786a.413.413 0 0 0-.45-.233l-1.905.416a5.95 5.95 0 0 0-.876-.862l.387-1.915a.413.413 0 0 0-.24-.447l-1.798-.729a.414.414 0 0 0-.484.154Z"
15
+ />
16
+ <path
17
+ fill={stroke}
18
+ d="M8.966 18.777a.417.417 0 0 0 .419-.172l1.055-1.645a5.95 5.95 0 0 0 1.213-.008l1.07 1.613c.102.152.32.218.487.146l1.786-.755a.416.416 0 0 0 .242-.383l-.008-.068-.414-1.891c.301-.249.579-.53.83-.839l1.926.39a.417.417 0 0 0 .415-.18l.032-.061.729-1.798a.417.417 0 0 0-.1-.442l-.054-.042-1.638-1.05c.04-.412.04-.822-.003-1.226l1.634-1.084a.415.415 0 0 0 .166-.421l-.02-.065-.756-1.786a.414.414 0 0 0-.451-.234l-1.904.416a5.948 5.948 0 0 0-.876-.861l.388-1.915a.417.417 0 0 0-.18-.416l-.061-.032-1.798-.728a.415.415 0 0 0-.484.154L11.555 5.04a5.938 5.938 0 0 0-1.204.009l-1.09-1.642a.415.415 0 0 0-.42-.166l-.065.02-1.787.756a.414.414 0 0 0-.233.451l.42 1.925-.231.203c-.227.21-.439.438-.634.683l-1.906-.385a.414.414 0 0 0-.448.24l-.433-.175a.883.883 0 0 1 .898-.535l.075.011 1.634.331c.166-.192.343-.373.53-.543l-.362-1.656a.88.88 0 0 1 .508-.98l1.786-.757a.88.88 0 0 1 1.058.319l.936 1.41a6.4 6.4 0 0 1 .723-.004l.907-1.414h.001a.88.88 0 0 1 1.053-.334l1.797.728a.88.88 0 0 1 .524.973l-.333 1.646c.188.164.366.338.533.523l1.634-.358a.88.88 0 0 1 .982.509l.755 1.785a.88.88 0 0 1-.318 1.06l-1.405.931c.015.247.016.496.002.744l1.404.9h.001c.341.22.487.676.334 1.054l-.729 1.798a.88.88 0 0 1-.972.523h-.001l-1.657-.335a6.43 6.43 0 0 1-.49.497l.355 1.62a.88.88 0 0 1-.509.981l-1.786.756a.88.88 0 0 1-1.058-.318l-.918-1.382a6.416 6.416 0 0 1-.732.004l-.905 1.411-.002.001a.88.88 0 0 1-1.052.334l-1.798-.729a.88.88 0 0 1-.523-.972v-.001l.333-1.645a6.431 6.431 0 0 1-.506-.495l-1.643.359a.88.88 0 0 1-.981-.508l-.756-1.786-.026-.072a.882.882 0 0 1 .344-.987l1.39-.923a6.399 6.399 0 0 1-.008-.71L3.13 9.81a.88.88 0 0 1-.334-1.053l.433.175c-.069.17 0 .386.153.485l1.654 1.06c-.035.4-.032.8.013 1.192l-1.622 1.077a.413.413 0 0 0-.146.486l.757 1.786a.413.413 0 0 0 .45.234l1.913-.418c.252.303.537.58.849.832l-.388 1.917a.414.414 0 0 0 .24.447l1.798.728.066.02ZM3.524 6.96l.433.176-.728 1.797-.433-.175.728-1.798Z"
19
+ />
20
+ <path
21
+ fill="#fff"
22
+ d="M13.632 10.655c.194.18.195.488 0 .669l-3.316 3.09a.457.457 0 0 1-.768-.333v-1.883l-4.694-.284s-1.779.092-1.779-.903c0-1.024 1.162-1.042 1.78-1.042l4.693-.097V7.92c0-.398.474-.605.767-.334l3.317 3.069Z"
23
+ />
24
+ <path
25
+ fill={stroke}
26
+ d="M13.95 10.312c.369.342.393.91.07 1.282l-.068.072-3.317 3.091c-.591.551-1.555.131-1.555-.677v-1.442l-4.223-.256H4.85a3.098 3.098 0 0 1-.293-.002 3.919 3.919 0 0 1-.696-.089c-.253-.057-.552-.16-.797-.352a1.153 1.153 0 0 1-.457-.929c0-.35.102-.651.296-.89.189-.23.436-.369.672-.454.45-.162.97-.164 1.27-.164l4.235-.089V7.921c0-.807.96-1.226 1.553-.679l3.316 3.07Zm-.317 1.012a.457.457 0 0 0-.002-.67l-3.316-3.068-.057-.046a.457.457 0 0 0-.71.38v1.952l-4.694.097c-.617 0-1.778.018-1.779 1.041 0 .995 1.78.904 1.78.904l4.693.284v1.882c0 .4.476.607.768.335l3.317-3.091Z"
27
+ />
28
+ <path
29
+ fill="#fff"
30
+ d="M15.047 10.96c0-.724.632-1.287 1.352-1.204l1.389.161a1.036 1.036 0 0 1 .022 2.055l-1.385.19a1.213 1.213 0 0 1-1.378-1.201Z"
31
+ />
32
+ <path
33
+ fill={stroke}
34
+ d="M18.704 10.946c0-.493-.346-.912-.82-1.013l-.096-.016-1.389-.16a1.212 1.212 0 1 0-.11 2.416l.136-.011 1.385-.19c.48-.066.846-.455.89-.93l.004-.096Zm.468 0c0 .751-.555 1.387-1.3 1.49l-1.384.19a1.68 1.68 0 1 1-.035-3.335l1.389.162c.758.088 1.33.73 1.33 1.493Z"
35
+ />
36
+ </svg>
37
+ );
38
+ });
39
+
40
+ Actions.displayName = 'ActionsIcon';
package/src/iconography/advance.tsx ADDED
@@ -0,0 +1,32 @@
1
+ import { forwardRef, SVGProps } from 'react';
2
+
3
+ import { fill, stroke } from './variables';
4
+
5
+ type AdvanceProps = SVGProps<SVGSVGElement>;
6
+
7
+ type AdvanceRef = SVGSVGElement;
8
+
9
+ export const Advance = forwardRef<AdvanceRef, AdvanceProps>((delegated, ref) => {
10
+ return (
11
+ <svg ref={ref} width="22" height="22" viewBox="0 0 22 22" fill="none" {...delegated}>
12
+ <path
13
+ stroke="#F98107"
14
+ strokeDasharray="1 2"
15
+ strokeLinecap="round"
16
+ strokeMiterlimit="16"
17
+ strokeWidth=".6"
18
+ d="M3 3.6c0-.331.35-.6.783-.6h4.961c.433 0 .784.269.784.6v14.8c0 .331-.351.6-.784.6h-4.96C3.35 19 3 18.731 3 18.4V3.6Z"
19
+ />
20
+ <path
21
+ fill={fill}
22
+ d="M12.101 3.6c0-.331.351-.6.784-.6h4.96c.433 0 .784.269.784.6v14.8c0 .331-.35.6-.783.6h-4.961c-.433 0-.784-.269-.784-.6V3.6Z"
23
+ />
24
+ <path
25
+ fill={stroke}
26
+ d="M18.329 3.6c0-.053-.027-.121-.111-.186a.618.618 0 0 0-.372-.114h-4.962a.616.616 0 0 0-.37.114c-.085.065-.113.133-.113.186v14.8c0 .053.028.121.112.186a.615.615 0 0 0 .371.114h4.962c.156 0 .287-.049.372-.114.084-.065.11-.133.11-.186V3.6Zm.6 14.8c0 .279-.148.51-.347.663-.199.152-.46.237-.736.237h-4.962c-.276 0-.537-.085-.736-.238a.838.838 0 0 1-.346-.662V3.6c0-.279.148-.51.346-.663.199-.152.46-.237.736-.237h4.962c.276 0 .537.085.736.237a.838.838 0 0 1 .346.663v14.8Z"
27
+ />
28
+ </svg>
29
+ );
30
+ });
31
+
32
+ Advance.displayName = 'AdvanceIcon';
package/src/iconography/check-with-circle.tsx CHANGED
@@ -1,36 +1,24 @@
1
1
  import { forwardRef, SVGProps } from 'react';
2
2
 
3
+ import { fill, stroke } from './variables';
4
+
3
5
  type CheckWithCircleProps = SVGProps<SVGSVGElement>;
4
6
  type CheckWithCircleRef = SVGSVGElement;
5
7
 
6
8
  export const CheckWithCircle = forwardRef<CheckWithCircleRef, CheckWithCircleProps>((delegated, ref) => {
7
9
  return (
8
- <svg
9
- ref={ref}
10
- xmlns="http://www.w3.org/2000/svg"
11
- width="22"
12
- height="22"
13
- fill="none"
14
- viewBox="0 0 22 22"
15
- {...delegated}
16
- >
17
- <path fill="#BFF6F8" d="M19.152 11a8.152 8.152 0 1 1-16.304 0 8.152 8.152 0 0 1 16.304 0Z" />
10
+ <svg ref={ref} width="22" height="22" fill="none" viewBox="0 0 22 22" {...delegated}>
11
+ <path fill={fill} d="M19.152 11a8.152 8.152 0 1 1-16.304 0 8.152 8.152 0 0 1 16.304 0Z" />
18
12
  <path
19
- fill="#528693"
13
+ fill={stroke}
20
14
  fillRule="evenodd"
21
15
  d="M11 18.637a7.637 7.637 0 1 0 0-15.274 7.637 7.637 0 0 0 0 15.274Zm0 .515a8.152 8.152 0 1 0 0-16.304 8.152 8.152 0 0 0 0 16.304Z"
22
16
  clipRule="evenodd"
23
17
  />
24
18
  <path
25
- fill="#fff"
19
+ fill={stroke}
26
20
  d="m6.536 12.863 2.703 2.34c.183.231.432.382.705.426.064.01.13.014.194.013.353-.009.694-.191.936-.501l4.637-5.925a1.64 1.64 0 0 0 .34-1.048 1.458 1.458 0 0 0-.386-.983 1.107 1.107 0 0 0-.625-.335c-.417-.067-.84.115-1.13.488l-3.772 4.805-1.727-1.273a1.129 1.129 0 0 0-.698-.417c-.369-.059-.745.078-1.031.375-.523.542-.588 1.455-.146 2.035Z"
27
21
  />
28
- <path
29
- fill="#528693"
30
- fillRule="evenodd"
31
- d="M13.707 7.179c.34-.435.852-.667 1.374-.583.293.047.56.19.77.41.29.303.448.716.458 1.156.01.441-.128.872-.395 1.213l-4.637 5.924c-.284.363-.694.59-1.133.6a1.313 1.313 0 0 1-.24-.016 1.385 1.385 0 0 1-.851-.5L6.348 13.04l-.016-.022c-.524-.686-.442-1.74.164-2.37.338-.35.796-.524 1.258-.45.325.052.618.225.836.483l1.5 1.105 3.617-4.608Zm1.292-.075c-.311-.05-.645.083-.887.392l-3.926 5.002-1.954-1.44-.021-.027a.872.872 0 0 0-.538-.324c-.277-.044-.571.056-.806.3-.432.448-.487 1.204-.141 1.68l2.7 2.337.015.02c.145.183.34.298.544.33a.803.803 0 0 0 .146.01c.267-.006.54-.145.74-.402l4.638-5.925c.19-.243.293-.556.286-.883a1.201 1.201 0 0 0-.316-.811M15 7.104a.85.85 0 0 1 .48.259Z"
32
- clipRule="evenodd"
33
- />
34
22
  </svg>
35
23
  );
36
24
  });
package/src/iconography/clock.tsx CHANGED
@@ -1,5 +1,7 @@
1
1
  import { forwardRef, SVGProps } from 'react';
2
2
 
3
+ import { fill, stroke } from './variables';
4
+
3
5
  type ClockProps = SVGProps<SVGSVGElement>;
4
6
 
5
7
  type ClockRef = SVGSVGElement;
@@ -9,15 +11,15 @@ export const Clock = forwardRef<ClockRef, ClockProps>((delegated, ref) => {
9
11
  <svg ref={ref} width="34" height="34" viewBox="0 0 34 34" fill="none" {...delegated}>
10
12
  <path
11
13
  d="M27.1672 14.3782a10.4298 10.4298 0 0 0-6.5199-7.5964A10.753 10.753 0 0 0 9.3006 9.4745a11.0723 11.0723 0 0 0-2.6168 10.1483 10.3947 10.3947 0 0 0 3.6423 5.9131 10.3941 10.3941 0 0 0 6.5529 2.3 10.6706 10.6706 0 0 0 7.7624-3.3204 11.024 11.024 0 0 0 2.5258-10.1373Zm-3.3314 9.3236a9.4471 9.4471 0 0 1-6.8608 2.9247 9.0968 9.0968 0 0 1-2.8916-.4618 9.5526 9.5526 0 0 1-6.1461-6.8608 9.6173 9.6173 0 0 1 2.1549-9.0157 9.5057 9.5057 0 0 1 6.8718-2.9137 9.1582 9.1582 0 0 1 2.8916.4728 9.475 9.475 0 0 1 6.1461 6.8458 9.5724 9.5724 0 0 1-2.1659 9.0087Z"
12
- fill="#528693"
14
+ fill={stroke}
13
15
  />
14
16
  <path
15
17
  d="M18.6682 2.3389a13.9219 13.9219 0 0 0-1.8991-.121 13.7 13.7 0 0 0-4.0901.6158A14.6931 14.6931 0 0 0 2.4618 17.4348c.4838 7.2786 5.3435 13.2048 12.743 14.2163.6587.0883 1.3225.133 1.9871.1339a13.215 13.215 0 0 0 4.0681-.6157 15.1484 15.1484 0 0 0 10.2691-14.5131A14.6527 14.6527 0 0 0 18.6682 2.3389Zm8.1032 24.0237a13.5041 13.5041 0 0 1-9.8184 4.233 13.18 13.18 0 0 1-4.3869-.7477 13.3995 13.3995 0 0 1-8.396-9.6314A13.5489 13.5489 0 0 1 7.1685 7.6384a13.4416 13.4416 0 0 1 9.8184-4.233 13.1827 13.1827 0 0 1 4.3869.7476 13.4214 13.4214 0 0 1 8.4211 9.6405 13.58 13.58 0 0 1-3.0236 12.5691Z"
16
- fill="#528693"
18
+ fill={stroke}
17
19
  />
18
20
  <path
19
21
  d="M29.795 13.7935a13.4203 13.4203 0 0 0-8.4221-9.6425 13.1825 13.1825 0 0 0-4.3869-.7476 13.4417 13.4417 0 0 0-9.8184 4.235A13.5483 13.5483 0 0 0 4.169 20.2165a13.3995 13.3995 0 0 0 8.3961 9.6315 13.1829 13.1829 0 0 0 4.3869.7476 13.5026 13.5026 0 0 0 9.8184-4.233 13.5794 13.5794 0 0 0 3.0246-12.5691Zm-5.1566 10.722a10.6692 10.6692 0 0 1-7.7623 3.3204 10.3949 10.3949 0 0 1-10.1952-8.2131A11.0727 11.0727 0 0 1 9.3006 9.4745a10.7529 10.7529 0 0 1 11.3467-2.6937 10.4292 10.4292 0 0 1 6.5199 7.5964 11.0245 11.0245 0 0 1-2.5288 10.1383Z"
20
- fill="#BFF6F8"
22
+ fill={fill}
21
23
  />
22
24
  <path
23
25
  d="M23.8358 23.7018a9.4471 9.4471 0 0 1-6.8608 2.9247 9.0968 9.0968 0 0 1-2.8916-.4618 9.5523 9.5523 0 0 1-6.1461-6.8608 9.6174 9.6174 0 0 1 2.155-9.0157 9.5035 9.5035 0 0 1 6.8717-2.9137 9.1593 9.1593 0 0 1 2.8917.4728 9.4746 9.4746 0 0 1 6.1461 6.8458 9.5731 9.5731 0 0 1-2.166 9.0087Z"
@@ -25,11 +27,11 @@ export const Clock = forwardRef<ClockRef, ClockProps>((delegated, ref) => {
25
27
  />
26
28
  <path
27
29
  d="m17.6467 17.8276.114-3.7832c.024-.7716-1.1755-.7716-1.1995 0l-.1139 3.7832c-.023.7717 1.1764.7717 1.1994 0Z"
28
- fill="#528693"
30
+ fill={stroke}
29
31
  />
30
32
  <path
31
33
  d="m16.6232 18.2514 3.9911 4.1521c.5358.5577 1.3834-.2919.8476-.8486l-3.9901-4.1511c-.5358-.5577-1.3834.2909-.8486.8476Z"
32
- fill="#528693"
34
+ fill={stroke}
33
35
  />
34
36
  </svg>
35
37
  );
package/src/iconography/edit.tsx CHANGED
@@ -1,5 +1,7 @@
1
1
  import { forwardRef, SVGProps } from 'react';
2
2
 
3
+ import { fill, stroke } from './variables';
4
+
3
5
  type EditProps = SVGProps<SVGSVGElement>;
4
6
 
5
7
  type EditRef = SVGSVGElement;
@@ -8,11 +10,11 @@ export const Edit = forwardRef<EditRef, EditProps>((delegated, ref) => {
8
10
  return (
9
11
  <svg ref={ref} width="22" height="22" viewBox="0 0 22 22" fill="none" {...delegated}>
10
12
  <path
11
- fill="#BFF6F8"
13
+ fill={fill}
12
14
  d="M18.293 7.112c.005-.014.02-.01.03-.02-1.313-1.319-2.12-2.09-3.428-3.416L4.764 13.916 3.6 18.5l4.665-1.588L12.335 13c2.803-2.733 3.16-3.136 5.957-5.888Z"
13
15
  />
14
16
  <path
15
- fill="#528693"
17
+ fill={stroke}
16
18
  fillRule="evenodd"
17
19
  d="M18.748 6.67a.6.6 0 0 1-.075.91c-1.204 1.184-1.955 1.932-2.653 2.628a359.59 359.59 0 0 1-3.265 3.222l-.004.003-4.07 3.912a.6.6 0 0 1-.223.135l-4.665 1.588a.6.6 0 0 1-.775-.716l1.164-4.584a.6.6 0 0 1 .155-.274L14.47 3.254a.6.6 0 0 1 .854 0c.73.741 1.294 1.3 1.88 1.879.47.464.953.941 1.545 1.537Zm-.85-.002-.006-.006c-.398-.398-.755-.75-1.105-1.097a216.01 216.01 0 0 1-1.892-1.89L4.764 13.917 3.6 18.5l4.665-1.588L12.335 13c1.565-1.526 2.367-2.325 3.258-3.213.624-.623 1.292-1.288 2.297-2.278l.402-.397c.003-.008.01-.01.016-.012.005-.002.01-.003.014-.007l-.424-.425Z"
18
20
  clipRule="evenodd"
package/src/iconography/index.ts CHANGED
@@ -1,4 +1,6 @@
1
+ import { Actions } from './actions';
1
2
  import { Add } from './add';
3
+ import { Advance } from './advance';
2
4
  import { App } from './app';
3
5
  import { Archive } from './archive';
4
6
  import { Arrow } from './arrow';
@@ -93,6 +95,7 @@ import { ProductShortcut } from './product-shortcut';
93
95
  import { Promotion } from './promotion';
94
96
  import { PropertyTable } from './property-table';
95
97
  import { Relation } from './relation';
98
+ import { Remove } from './remove';
96
99
  import { Renew } from './renew';
97
100
  import { RestrictedCatalogue } from './restricted-catalogue';
98
101
  import { RichText } from './rich-text';
@@ -126,7 +129,9 @@ import { Warning } from './warning';
126
129
  import { XForY } from './x-for-y';
127
130
 
128
131
  export const Icon = {
132
+ Actions,
129
133
  Add,
134
+ Advance,
130
135
  Archive,
131
136
  App,
132
137
  Battery,
@@ -201,6 +206,7 @@ export const Icon = {
201
206
  Promotion,
202
207
  PipelineDashed,
203
208
  RestrictedCatalogue,
209
+ Remove,
204
210
  Renew,
205
211
  Rocket,
206
212
  Search,
package/src/iconography/paths.tsx CHANGED
@@ -1,5 +1,7 @@
1
1
  import { forwardRef, SVGProps } from 'react';
2
2
 
3
+ import { fill, stroke } from './variables';
4
+
3
5
  type PathsProps = SVGProps<SVGSVGElement>;
4
6
  type PathsRef = SVGSVGElement;
5
7
 
@@ -14,17 +16,17 @@ export const Paths = forwardRef<PathsRef, PathsProps>((delegated, ref) => {
14
16
  fillRule="evenodd"
15
17
  clipRule="evenodd"
16
18
  d="M5.789 5.36a.626.626 0 00-1.014-.49L1.111 7.773a.626.626 0 00.01.99l3.665 2.768a.626.626 0 001.003-.5v-.78a3.466 3.466 0 013.153 3.45v5.857c0 .345.28.625.625.625h2.945c.3 0 .542-.242.542-.542v-5.76A7.578 7.578 0 005.79 6.308V5.36zm-4.29 2.903L5.163 5.36v1.568h.313a6.952 6.952 0 016.953 6.952v5.678H9.567v-5.856a4.091 4.091 0 00-4.09-4.091h-.314v1.42L1.5 8.264z"
17
- fill="#528693"
19
+ fill={stroke}
18
20
  />
19
21
  <path
20
22
  d="M9.259 10.963a7.265 7.265 0 017.265-7.265V2.443c0-.262.302-.408.507-.245L20.695 5.1a.313.313 0 01-.005.495l-3.665 2.768a.313.313 0 01-.501-.25V7.006a3.778 3.778 0 00-3.779 3.778v8.668c0 .173-.14.313-.312.313H9.537a.279.279 0 01-.278-.279v-8.523z"
21
- fill="#BFF6F8"
23
+ fill={fill}
22
24
  />
23
25
  <path
24
26
  fillRule="evenodd"
25
27
  clipRule="evenodd"
26
28
  d="M16.211 2.443a.626.626 0 011.014-.49l3.665 2.903a.625.625 0 01-.012.99l-3.664 2.768a.626.626 0 01-1.003-.5v-.781a3.466 3.466 0 00-3.153 3.452v8.668c0 .345-.28.625-.625.625H9.537a.591.591 0 01-.591-.591v-8.524a7.578 7.578 0 017.265-7.571v-.949zm4.29 2.903l-3.664-2.903v1.568h-.313a6.952 6.952 0 00-6.953 6.952v8.49h2.862v-8.668a4.091 4.091 0 014.09-4.091h.314v1.42L20.5 5.347z"
27
- fill="#528693"
29
+ fill={stroke}
28
30
  />
29
31
  </svg>
30
32
  );
package/src/iconography/remove.tsx ADDED
@@ -0,0 +1,38 @@
1
+ import { forwardRef, SVGProps } from 'react';
2
+
3
+ import { fill, stroke } from './variables';
4
+
5
+ type RemoveProps = SVGProps<SVGSVGElement>;
6
+
7
+ type RemoveRef = SVGSVGElement;
8
+
9
+ export const Remove = forwardRef<RemoveRef, RemoveProps>((delegated, ref) => {
10
+ return (
11
+ <svg ref={ref} width="22" height="22" viewBox="0 0 22 22" fill="none" {...delegated}>
12
+ <path
13
+ fill={fill}
14
+ d="M4.445 19.252A1.445 1.445 0 0 1 3 17.807V4.445C3 3.647 3.647 3 4.445 3h3.178c.798 0 1.444.647 1.444 1.445v13.362c0 .798-.646 1.445-1.444 1.445H4.445Z"
15
+ />
16
+ <path
17
+ fill={stroke}
18
+ d="M8.85 18.62a.281.281 0 0 1-.152-.367 1.16 1.16 0 0 0 .088-.446v-.556a.281.281 0 1 1 .562 0v.556c0 .234-.046.457-.131.66a.281.281 0 0 1-.367.153Zm-.064-3.597a.28.28 0 0 1 .562 0v1.114a.281.281 0 1 1-.562 0v-1.114Zm0-2.226a.281.281 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0v-1.113Zm0-2.228a.28.28 0 0 1 .562 0v1.113a.281.281 0 1 1-.562 0V10.57Zm0-2.227a.281.281 0 0 1 .562 0v1.114a.28.28 0 1 1-.562 0V8.342Zm0-2.227a.28.28 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0V6.115Zm-.088-2.116a.28.28 0 0 1 .519-.215c.085.204.13.428.13.661v.557a.28.28 0 0 1-.56 0v-.557c0-.158-.032-.31-.089-.446ZM7.623 19.532h-.795a.28.28 0 1 1 0-.56h.795c.158 0 .309-.033.446-.09a.28.28 0 0 1 .214.52 1.72 1.72 0 0 1-.66.13Zm0-16.25h-.795a.28.28 0 0 1 0-.562h.795c.234 0 .457.046.66.13a.28.28 0 0 1-.214.519 1.16 1.16 0 0 0-.446-.088ZM5.24 19.531h-.794a1.72 1.72 0 0 1-.66-.13.28.28 0 1 1 .214-.52c.137.057.287.09.446.09h.794a.28.28 0 1 1 0 .56Zm0-16.25h-.794a1.16 1.16 0 0 0-.446.087.281.281 0 1 1-.215-.519c.204-.084.427-.13.66-.13h.795a.28.28 0 0 1 0 .561ZM2.72 17.25a.28.28 0 1 1 .56 0v.556c0 .159.033.309.09.446a.28.28 0 1 1-.519.215 1.72 1.72 0 0 1-.131-.66v-.557Zm0-12.806c0-.233.046-.457.13-.661a.28.28 0 0 1 .52.215 1.164 1.164 0 0 0-.09.446v.557a.28.28 0 1 1-.56 0v-.557Zm0 10.578a.28.28 0 1 1 .56 0v1.114a.28.28 0 1 1-.56 0v-1.114Zm0-2.226a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0v-1.113Zm0-2.228a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V10.57Zm0-2.227a.28.28 0 0 1 .56 0v1.114a.28.28 0 1 1-.56 0V8.342Zm0-2.227a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V6.115Z"
19
+ />
20
+ <path
21
+ fill={fill}
22
+ d="M13.104 19.252a1.445 1.445 0 0 1-1.445-1.445V4.445c0-.798.647-1.445 1.445-1.445h3.178c.798 0 1.445.647 1.445 1.445v13.362c0 .798-.647 1.445-1.445 1.445h-3.178Z"
23
+ />
24
+ <path
25
+ fill={stroke}
26
+ d="M17.509 18.62a.281.281 0 0 1-.151-.367c.056-.137.087-.287.087-.446v-.556a.281.281 0 1 1 .562 0v.556c0 .234-.046.457-.13.66a.281.281 0 0 1-.368.153Zm-.064-3.597a.28.28 0 0 1 .562 0v1.114a.281.281 0 1 1-.562 0v-1.114Zm0-2.226a.281.281 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0v-1.113Zm0-2.228a.28.28 0 0 1 .562 0v1.113a.281.281 0 1 1-.562 0V10.57Zm0-2.227a.281.281 0 0 1 .562 0v1.114a.28.28 0 1 1-.562 0V8.342Zm0-2.227a.28.28 0 1 1 .562 0v1.113a.28.28 0 1 1-.562 0V6.115Zm-.087-2.116a.28.28 0 0 1 .518-.215c.085.204.131.428.131.661v.557a.28.28 0 0 1-.562 0v-.557c0-.158-.03-.31-.087-.446Zm-1.076 15.533h-.794a.28.28 0 1 1 0-.56h.794c.159 0 .309-.033.446-.09a.28.28 0 0 1 .214.52 1.72 1.72 0 0 1-.66.13Zm0-16.25h-.794a.28.28 0 0 1 0-.562h.794c.234 0 .457.046.66.13a.28.28 0 0 1-.214.519 1.16 1.16 0 0 0-.446-.088ZM13.9 19.531h-.795a1.72 1.72 0 0 1-.66-.13.28.28 0 1 1 .214-.52c.137.057.287.09.446.09h.795a.28.28 0 1 1 0 .56Zm0-16.25h-.795a1.16 1.16 0 0 0-.446.087.281.281 0 1 1-.214-.519c.203-.084.426-.13.66-.13h.795a.28.28 0 0 1 0 .561Zm-2.52 13.969a.28.28 0 1 1 .56 0v.556c0 .159.033.309.09.446a.28.28 0 1 1-.519.215 1.72 1.72 0 0 1-.13-.66v-.557Zm0-12.806c0-.233.046-.457.13-.661a.28.28 0 0 1 .52.215 1.163 1.163 0 0 0-.09.446v.557a.28.28 0 1 1-.56 0v-.557Zm0 10.578a.28.28 0 1 1 .56 0v1.114a.28.28 0 1 1-.56 0v-1.114Zm0-2.226a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0v-1.113Zm0-2.228a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V10.57Zm0-2.227a.28.28 0 1 1 .56 0v1.114a.28.28 0 1 1-.56 0V8.342Zm0-2.227a.28.28 0 1 1 .56 0v1.113a.28.28 0 1 1-.56 0V6.115Z"
27
+ />
28
+ <path
29
+ fill={stroke}
30
+ fillRule="evenodd"
31
+ d="m18.813 8.112 2.424 2.424a.381.381 0 0 1 0 .539l-2.424 2.424a.38.38 0 1 1-.539-.539l1.774-1.774h-4.667a.38.38 0 0 1 0-.762h4.667L18.274 8.65a.38.38 0 1 1 .539-.538Z"
32
+ clipRule="evenodd"
33
+ />
34
+ </svg>
35
+ );
36
+ });
37
+
38
+ Remove.displayName = 'RemoveIcon';
package/src/iconography/rocket.tsx CHANGED
@@ -1,5 +1,7 @@
1
1
  import { forwardRef, SVGProps } from 'react';
2
2
 
3
+ import { fill, stroke } from './variables';
4
+
3
5
  type RocketProps = SVGProps<SVGSVGElement>;
4
6
 
5
7
  type RocketRef = SVGSVGElement;
@@ -13,11 +15,11 @@ export const Rocket = forwardRef<RocketRef, RocketProps>((delegated, ref) => {
13
15
  />
14
16
  <path
15
17
  d="M10.1129 7.427a1.7704 1.7704 0 0 1-1.1712-.602 1.5881 1.5881 0 0 1-.2493-.3998c-.0047-.0047-.0047-.0094-.0094-.0141a2.0301 2.0301 0 0 1-.1035-.2822c0-.0141-.0047-.0235-.0047-.033a1.3365 1.3365 0 0 1-.047-.268.8705.8705 0 0 1-.0047-.1082c0-.047-.0095-.0941-.0047-.1364 0-.0189.0046-.033.0046-.047.0069-.092.021-.1832.0424-.2729v-.0141c.0541-.2502.167-.484.3292-.682a.197.197 0 0 1 .0753-.0565 1.0763 1.0763 0 0 1 .0988-.1082.7403.7403 0 0 1 .0893-.0705c.0048-.0047.0048-.0141.0095-.0188a.9361.9361 0 0 1 .0893-.0565 1.7606 1.7606 0 0 1 1.3406-.3434c.4418.0721.8383.3134 1.1053.6727a1.7648 1.7648 0 0 1-.1505 2.3048 1.7054 1.7054 0 0 1-.1411.1176.2888.2888 0 0 1-.0329.047c-.0329.0235-.0706.0423-.1035.0658a1.7602 1.7602 0 0 1-1.1618.3058Zm-.809-2.5352a1.2474 1.2474 0 0 0 .1646 1.6933c.1723.1592.3887.2625.6209.2964a.0172.0172 0 0 0 .0141.0047c.0654.0093.1314.014.1975.014h.0565c.0423-.0046.0846-.0093.1317-.0187a.646.646 0 0 0 .1317-.0236.1103.1103 0 0 1 .0376-.0094 1.2248 1.2248 0 0 0 .3951-.207.0539.0539 0 0 1 .0377-.014c.0329-.0283.0705-.0565.1034-.0847.033-.0282.0518-.0611.08-.0894a1.3067 1.3067 0 0 0 .2352-1.0207 1.2592 1.2592 0 0 0-2.0931-.6726 1.2939 1.2939 0 0 0-.1082.127.0047.0047 0 0 1-.0047.0047Z"
16
- fill="#528693"
18
+ fill={stroke}
17
19
  />
18
20
  <path
19
21
  d="M8.8005 12.1025a5.1403 5.1403 0 0 1-.682 1.2794l-.1082.1458c-.0329.033-.0987.1176-.0893.0988-.0094.0047-.0141.0094-.0236.0047-.0094-.0047 0-.0141 0-.0188.0047.0188-.0282-.1787-.0517-.2916a4.5174 4.5174 0 0 0-.4798-1.2982l.0565-.0188c.1317-.0471.2634-.1035.3904-.1553.254-.1128.5033-.2304.7385-.3621.1834-.1035.3621-.2164.5409-.3293a7.3196 7.3196 0 0 1-.2917.9454Zm.4563-7.8457a.9349.9349 0 0 0-.0894.0565c-.0047.0047-.0047.014-.0094.0188a.7411.7411 0 0 0-.0893.0705 1.0777 1.0777 0 0 0-.0988.1082.197.197 0 0 0-.0753.0565 1.6147 1.6147 0 0 0-.3292.682v.0141a1.7343 1.7343 0 0 0-.0424.2728c0 .0141-.0047.0282-.0047.047-.0047.0424.0047.0894.0047.1365a.8667.8667 0 0 0 .0047.1081c.0066.0908.0223.1806.047.2682 0 .0094.0048.0188.0048.0329.0274.0965.062.1908.1035.2822.0047.0047.0047.0094.0094.0141a1.588 1.588 0 0 0 .2493.3998 1.7592 1.7592 0 0 0 2.333.2963c.0329-.0235.0705-.0423.1035-.0658a.2888.2888 0 0 0 .0329-.047 1.7054 1.7054 0 0 0 .1411-.1176 1.765 1.765 0 0 0 .1505-2.3048 1.723 1.723 0 0 0-1.1053-.6726 1.7607 1.7607 0 0 0-1.3406.3433Zm-4.412 5.4516a7.1694 7.1694 0 0 1-.2681-.3904c-.0424-.0659-.08-.1317-.1176-.1929l-.0612-.1082.0282-.094.0612-.1882c.047-.1223.0988-.2446.1505-.3669.1082-.2446.2305-.4845.3575-.7196.265-.4654.562-.9117.889-1.3359a14.419 14.419 0 0 1 2.173-2.3 8.19 8.19 0 0 1 2.6906-1.5288c.0658-.0188.1317-.0329.1975-.0517a5.4617 5.4617 0 0 0 1.1054 1.5428c.4187.448.931.798 1.5005 1.0254-.0142.0564-.0236.1176-.0424.174a8.2196 8.2196 0 0 1-1.5381 2.747 14.7123 14.7123 0 0 1-2.3189 2.206 12.2821 12.2821 0 0 1-1.3311.8796 9.8702 9.8702 0 0 1-.7056.3528c-.1223.047-.2446.0987-.3621.1411l-.1835.0611-.08.0235-.08-.0423-.1692-.1035a12.9658 12.9658 0 0 1-.3246-.2163 1.0463 1.0463 0 0 0-.2916-.1553c.127-.127.254-.254.3857-.381.141-.1411.2822-.2869.428-.4374l1.2888-1.2841a.6352.6352 0 0 0 .0706-.094.522.522 0 0 0 .0329-.1365h-.0047a.3654.3654 0 0 0-.1035-.3434c-.0282-.0282-.0705-.0658-.1176-.1128a.0047.0047 0 0 0-.0047-.0047l-.2493-.2587-.1223-.127a1.1108 1.1108 0 0 0-.2352-.1976.3927.3927 0 0 0-.301-.0047.389.389 0 0 0-.1082.0705.0363.0363 0 0 0-.0141.0094l-.0141.0142a.0103.0103 0 0 0-.0094.0094l-.0423.0423c-.0047 0-.0047 0-.0047.0047-.5645.5645-1.1101 1.1054-1.6652 1.6604l-.3904.3904a.76.76 0 0 0-.0987-.1787Z"
20
- fill="#BFF6F8"
22
+ fill={fill}
21
23
  />
22
24
  <path
23
25
  d="m4.8448 11.5992-.1976.1929c-.0047.0094-.0094.0047-.014 0-.1365-.1411-.2776-.2822-.4234-.428l.5644-.5645c.3998-.3998.795-.7902 1.2042-1.1994.094-.094.1928-.1929.2869-.2916L7.3518 8.222l.0236.0235a.0047.0047 0 0 0 .0046.0047c.1365.1411.2682.2775.3952.4046a.0141.0141 0 0 1 0 .0188 730.2544 730.2544 0 0 0-1.9144 1.9097c-.334.3339-.6727.6679-1.016 1.0159Z"
@@ -25,11 +27,11 @@ export const Rocket = forwardRef<RocketRef, RocketProps>((delegated, ref) => {
25
27
  />
26
28
  <path
27
29
  d="M3.8335 7.2625a6.6494 6.6494 0 0 1 1.0254-.3622c-.0565.0894-.1176.1693-.174.2634a8.6195 8.6195 0 0 0-.447.856c-.0705.1506-.1316.3058-.1928.4704a6.6217 6.6217 0 0 0-.0564.1646 4.2294 4.2294 0 0 0-1.0348-.4186c-.1035-.0282-.2117-.0564-.3152-.0752-.0846-.0189-.1693-.033-.2492-.0518-.0236 0-.0283-.0094-.0142-.0188l.0047-.0047h.0048l.047-.0376c.0564-.047.1317-.094.2022-.1458a7.0379 7.0379 0 0 1 1.1995-.6397Z"
28
- fill="#BFF6F8"
30
+ fill={fill}
29
31
  />
30
32
  <path
31
33
  d="M11.4675 2.2954c.2528.4785.5658.9227.9314 1.3217a4.1843 4.1843 0 0 0 1.2794.8937 6.9501 6.9501 0 0 0 .1223-.8796c.0172-.26.0156-.521-.0047-.7808-.0095-.1317-.0283-.2587-.0471-.3904l-.0282-.16c0-.0093 0-.0187-.0094-.0234l-.1035-.0188a2.7475 2.7475 0 0 0-.1928-.033 3.4826 3.4826 0 0 0-.381-.0376 4.6927 4.6927 0 0 0-.7714 0 6.3397 6.3397 0 0 0-.795.1082Zm-4.1016 9.7272c.2257.4055.3875.8434.4798 1.2982.0235.1129.0565.3104.0518.2916 0 .0047-.0047.0141 0 .0188.0047.0047.014 0 .0235-.0047-.0094.0188.0564-.0658.0893-.0988l.1082-.1458a5.1404 5.1404 0 0 0 .682-1.2794 7.3195 7.3195 0 0 0 .2917-.9454c-.1788.1129-.3575.2258-.541.3293-.2351.1317-.4844.2492-.7384.3621-.127.0518-.2587.1082-.3904.1553l-.0565.0188ZM4.9953 7.6482c-.127.2351-.2493.475-.3575.7196-.0517.1223-.1035.2446-.1505.367l-.0612.188-.0282.0941.0612.1082c.0376.0612.0752.127.1176.1929.0846.1317.174.2634.268.3904a.7599.7599 0 0 1 .0989.1787l.3903-.3904c.555-.555 1.1007-1.096 1.6652-1.6604 0-.0047 0-.0047.0046-.0047l.0424-.0423a.0104.0104 0 0 1 .0094-.0094l.0141-.0141a.0362.0362 0 0 1 .0141-.0095.3888.3888 0 0 1 .1082-.0705.3928.3928 0 0 1 .301.0047 1.111 1.111 0 0 1 .2352.1975l.1223.127.2493.2587a.0046.0046 0 0 1 .0033.0014.0046.0046 0 0 1 .0014.0033c.047.047.0894.0847.1176.113a.3655.3655 0 0 1 .1035.3433h.0047a.5214.5214 0 0 1-.033.1364.636.636 0 0 1-.0705.094L6.938 10.2494c-.1458.1505-.287.2963-.428.4374-.1317.127-.2587.254-.3857.381.1048.036.2032.0884.2916.1552.1082.0753.2164.1459.3246.2164l.1693.1035.08.0423.08-.0235.1833-.0611c.1176-.0424.24-.0941.3622-.1411a9.8702 9.8702 0 0 0 .7056-.3528 12.297 12.297 0 0 0 1.3311-.8796 14.712 14.712 0 0 0 2.3189-2.206 8.2195 8.2195 0 0 0 1.5381-2.747c.0188-.0564.0283-.1176.0424-.174a4.171 4.171 0 0 1-1.5005-1.0254 5.4617 5.4617 0 0 1-1.1054-1.5428c-.0658.0188-.1317.033-.1975.0517a8.1898 8.1898 0 0 0-2.6905 1.5287 14.419 14.419 0 0 0-2.1731 2.3001c-.327.4242-.624.8705-.889 1.3359ZM4.633 11.792c.0047.0047.0094.0094.0141 0l.1976-.1929c.3433-.348.682-.682 1.016-1.016.635-.635 1.2605-1.2605 1.9144-1.9096a.0141.0141 0 0 0 0-.0189c-.127-.127-.2588-.2634-.3952-.4045a.0047.0047 0 0 1-.0047-.0047l-.0235-.0235-1.0865 1.0866c-.0941.0987-.1929.1975-.287.2916-.4092.4092-.8043.7996-1.204 1.1994l-.5645.5645c.1458.1458.2869.2869.4233.428ZM2.954 8.2361c.362.0932.7099.234 1.0348.4186.0188-.0564.0376-.1128.0564-.1646.0612-.1646.1223-.3198.1929-.4703a8.6185 8.6185 0 0 1 .4468-.8561c.0565-.094.1176-.174.174-.2634a6.65 6.65 0 0 0-1.0253.3622 7.0371 7.0371 0 0 0-1.1995.6397c-.0705.0517-.1458.0987-.2022.1458l-.047.0376H2.38l-.0048.0047c-.014.0094-.0094.0188.0141.0188.08.0188.1647.033.2493.0518.1035.0188.2117.047.3152.0752Zm-.6068.3998-.2493-.0423a.589.589 0 0 1-.254-.0894.333.333 0 0 1-.1364-.1693.3712.3712 0 0 1-.014-.2352 2.3128 2.3128 0 0 1 .1222-.2023 3.545 3.545 0 0 1 .5315-.4045 10.695 10.695 0 0 1 1.3688-.7384 4.7461 4.7461 0 0 1 1.5146-.4234c.1599-.2257.3198-.4374.4844-.6444A14.4656 14.4656 0 0 1 8.0103 3.396a8.5346 8.5346 0 0 1 2.7141-1.4252 7.2105 7.2105 0 0 1 1.5428-.2822 5.814 5.814 0 0 1 .809.0047c.1364.0047.2728.0235.4092.0376.0706.0094.1364.0189.207.033l.1129.0235a.6198.6198 0 0 1 .1834.047.4205.4205 0 0 1 .2211.3387l.0423.2446c.0188.1552.047.3057.0517.461.022.3022.0204.6057-.0047.9078a6.9537 6.9537 0 0 1-.3527 1.7215 8.9022 8.9022 0 0 1-1.6839 2.8833 15.0926 15.0926 0 0 1-2.3519 2.2061c-.0846.0611-.174.1176-.2587.1787a5.0622 5.0622 0 0 1-.4139 1.604 6.8242 6.8242 0 0 1-.7055 1.2888l-.1318.174-.0658.0847a4.2152 4.2152 0 0 1-.1129.1364c-.1787.1411-.3292.3245-.5362.2351a.3498.3498 0 0 1-.2023-.1693.2957.2957 0 0 1-.0517-.1458c-.0141-.0611-.0235-.1176-.033-.1693l-.0423-.2399-.0376-.1741a3.8788 3.8788 0 0 0-.508-1.2794.0798.0798 0 0 1-.0047-.0329l-.0658-.0329-.0988-.0611-.1835-.1082a5.7683 5.7683 0 0 1-.348-.2399.8514.8514 0 0 1-.2729-.2916l-.1693.1693a36.5512 36.5512 0 0 1-.428.4233c-.0753.0753-.1505.1458-.2258.2211a.4467.4467 0 0 1-.508.1834.3962.3962 0 0 1-.1693-.1176l-.1176-.1129c-.0518-.0564-.0988-.1081-.1505-.1552-.1176-.1176-.2258-.2257-.3199-.3245a.3934.3934 0 0 1-.0235-.5362l.287-.287c.1551-.1552.301-.3057.4515-.4515l.1975-.1976a.607.607 0 0 1-.207-.174c-.1222-.1646-.2398-.334-.3339-.4845-.047-.0705-.0894-.1411-.127-.1975a1.225 1.225 0 0 0-.0611-.113.0697.0697 0 0 1-.0612 0 3.5599 3.5599 0 0 0-1.0771-.4562l-.2964-.0752-.1505-.033Z"
32
- fill="#528693"
34
+ fill={stroke}
33
35
  />
34
36
  </svg>
35
37
  );
package/src/iconography/unpublish.tsx CHANGED
@@ -1,5 +1,7 @@
1
1
  import { forwardRef, SVGProps } from 'react';
2
2
 
3
+ import { fill, stroke } from './variables';
4
+
3
5
  type UnpublishProps = SVGProps<SVGSVGElement>;
4
6
 
5
7
  type UnpublishRef = SVGSVGElement;
@@ -12,26 +14,26 @@ export const Unpublish = forwardRef<UnpublishRef, UnpublishProps>((delegated, re
12
14
  d="M19.055 13.054c-.595 1.263-1.441 1.553-3.22 1.553-3.734 0-5.845-.123-9.562-.123-1.725 0-3.546-.242-4.082-1.92-.34-1.064-.153-2.123.496-2.817.473-.493 1.014-.699 1.76-.763.563-.048 1.429.226 1.429.226s-.324-2.173.61-2.764c.37-.234.64-.306 1.078-.308.343-.003.86.18.86.18l.911.642s1.164-2.957 3.686-2.957c.217 0 .434.022.647.067 1.136.242 2.228.971 2.757 2.259.405.986.05 2.729.05 2.729s1.887.405 2.454 1.338c.54.888.57 1.718.126 2.658Z"
13
15
  />
14
16
  <path
15
- fill="#528693"
17
+ fill={stroke}
16
18
  fillRule="evenodd"
17
19
  d="M2.254 9.331c.6-.625 1.294-.872 2.143-.944.27-.023.568.008.825.052a6.314 6.314 0 0 1 .01-.424c.02-.339.072-.727.199-1.087.125-.357.344-.742.734-.989.219-.138.432-.244.671-.311a2.67 2.67 0 0 1 .724-.09c.255-.002.534.061.715.109a5.195 5.195 0 0 1 .317.094l.022.008.006.002h.002l.001.001-.2.566s-.516-.183-.86-.18c-.437.002-.707.074-1.077.308-.607.384-.683 1.436-.662 2.125.012.372.052.639.052.639s-.279-.088-.622-.156c-.263-.05-.563-.09-.806-.07-.747.064-1.288.27-1.76.763-.65.694-.837 1.753-.497 2.817.536 1.678 2.357 1.92 4.082 1.92 1.856 0 3.312.03 4.77.062 1.46.03 2.923.061 4.793.061 1.778 0 2.624-.29 3.22-1.553.442-.94.412-1.77-.127-2.658-.567-.933-2.455-1.338-2.455-1.338s.357-1.743-.049-2.73c-.529-1.287-1.621-2.016-2.757-2.258a3.144 3.144 0 0 0-.647-.067c-1.83 0-2.945 1.557-3.419 2.411-.18.324-.267.546-.267.546l-.911-.642.2-.566a.602.602 0 0 1 .146.075l.34.24c.158-.28.376-.622.658-.966.66-.805 1.735-1.698 3.252-1.698.26 0 .517.026.77.08h.003C15.09 3.759 16.364 4.6 16.98 6.1c.26.63.26 1.432.22 2.003-.013.19-.031.365-.05.517.166.051.36.118.562.2.552.22 1.336.615 1.73 1.263.311.513.493 1.04.518 1.594.025.554-.109 1.094-.362 1.632-.342.725-.792 1.237-1.461 1.54-.632.287-1.399.357-2.301.357-1.875 0-3.342-.03-4.801-.061h-.004c-1.458-.031-2.908-.062-4.758-.062-.876 0-1.851-.059-2.693-.367-.87-.319-1.624-.916-1.96-1.97-.393-1.228-.197-2.527.629-3.41l.005-.006Z"
18
20
  clipRule="evenodd"
19
21
  />
20
- <path fill="#BFF6F8" d="M14.8 14.25a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0Z" />
22
+ <path fill={fill} d="M14.8 14.25a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0Z" />
21
23
  <path
22
- fill="#528693"
24
+ fill={stroke}
23
25
  fillRule="evenodd"
24
26
  d="M15.4 14.25a4.35 4.35 0 1 1-8.7 0 4.35 4.35 0 0 1 8.7 0ZM11.05 18a3.75 3.75 0 1 0 0-7.5 3.75 3.75 0 0 0 0 7.5Z"
25
27
  clipRule="evenodd"
26
28
  />
27
29
  <path
28
- fill="#528693"
30
+ fill={stroke}
29
31
  fillRule="evenodd"
30
32
  d="M9.088 12.288a.3.3 0 0 1 .424 0l3.5 3.5a.3.3 0 1 1-.424.424l-3.5-3.5a.3.3 0 0 1 0-.424Z"
31
33
  clipRule="evenodd"
32
34
  />
33
35
  <path
34
- fill="#528693"
36
+ fill={stroke}
35
37
  fillRule="evenodd"
36
38
  d="M9.088 16.212a.3.3 0 0 1 0-.424l3.5-3.5a.3.3 0 1 1 .424.424l-3.5 3.5a.3.3 0 0 1-.424 0Z"
37
39
  clipRule="evenodd"
package/src/iconography/warning.tsx CHANGED
@@ -1,5 +1,9 @@
1
1
  import { forwardRef, SVGProps } from 'react';
2
2
 
3
+ import { stroke } from './variables';
4
+
5
+ const fill = 'var(--c-icon-fill, #FFDE99)';
6
+
3
7
  type WarningProps = SVGProps<SVGSVGElement>;
4
8
  type WarningRef = SVGSVGElement;
5
9
 
@@ -8,34 +12,22 @@ export const Warning = forwardRef<WarningRef, WarningProps>((delegated, ref) =>
8
12
  <svg ref={ref} width="22" height="22" fill="none" viewBox="0 0 22 22" {...delegated}>
9
13
  <path
10
14
  d="M9.67541 3.72993C10.2804 2.68198 11.793 2.68198 12.398 3.72993L19.8853 16.6982C20.4903 17.7462 19.734 19.0561 18.524 19.0561H3.54948C2.33942 19.0561 1.58313 17.7462 2.18816 16.6982L9.67541 3.72993Z"
11
- fill="#FFDE99"
15
+ fill={fill}
12
16
  className="c-icon-fill"
13
17
  />
14
18
  <path
15
19
  fillRule="evenodd"
16
20
  clipRule="evenodd"
17
21
  d="M19.3657 16.9982L11.8784 4.02993C11.5043 3.38198 10.5691 3.38198 10.195 4.02993L2.70778 16.9982C2.33369 17.6462 2.8013 18.4561 3.54948 18.4561H18.524C19.2722 18.4561 19.7398 17.6462 19.3657 16.9982ZM12.398 3.72993C11.793 2.68198 10.2804 2.68198 9.67541 3.72993L2.18816 16.6982C1.58313 17.7462 2.33942 19.0561 3.54948 19.0561H18.524C19.734 19.0561 20.4903 17.7462 19.8853 16.6982L12.398 3.72993Z"
18
- fill="#528693"
22
+ fill={stroke}
19
23
  />
20
24
  <path
21
25
  d="M10.4293 8.73822C10.4293 8.33098 10.7595 8.00085 11.1667 8.00085V8.00085C11.5739 8.00085 11.9041 8.33098 11.9041 8.73822V12.3883C11.9041 12.7956 11.5739 13.1257 11.1667 13.1257V13.1257C10.7595 13.1257 10.4293 12.7956 10.4293 12.3883V8.73822Z"
22
- fill="white"
23
- />
24
- <path
25
- fillRule="evenodd"
26
- clipRule="evenodd"
27
- d="M12.504 8.73824V12.3883C12.504 13.127 11.9053 13.7257 11.1667 13.7257C10.4281 13.7257 9.82932 13.127 9.82932 12.3883V8.73825C9.82932 7.99964 10.4281 7.40088 11.1667 7.40088C11.9053 7.40088 12.504 7.99964 12.504 8.73824ZM11.1667 8.00088C10.7594 8.00088 10.4293 8.33101 10.4293 8.73825V12.3883C10.4293 12.7956 10.7594 13.1257 11.1667 13.1257C11.5739 13.1257 11.904 12.7956 11.904 12.3883V8.73824C11.904 8.33101 11.5739 8.00088 11.1667 8.00088Z"
28
- fill="#528693"
26
+ fill={stroke}
29
27
  />
30
28
  <path
31
29
  d="M11.9041 15.7807C11.9041 16.1879 11.5739 16.5181 11.1667 16.5181C10.7595 16.5181 10.4293 16.1879 10.4293 15.7807C10.4293 15.3735 10.7595 15.0433 11.1667 15.0433C11.5739 15.0433 11.9041 15.3735 11.9041 15.7807Z"
32
- fill="white"
33
- />
34
- <path
35
- fillRule="evenodd"
36
- clipRule="evenodd"
37
- d="M12.504 15.7807C12.504 16.5193 11.9053 17.1181 11.1667 17.1181C10.4281 17.1181 9.82932 16.5193 9.82932 15.7807C9.82932 15.0421 10.4281 14.4434 11.1667 14.4434C11.9053 14.4434 12.504 15.0421 12.504 15.7807ZM11.1667 16.5181C11.5739 16.5181 11.904 16.188 11.904 15.7807C11.904 15.3735 11.5739 15.0434 11.1667 15.0434C10.7594 15.0434 10.4293 15.3735 10.4293 15.7807C10.4293 16.188 10.7594 16.5181 11.1667 16.5181Z"
38
- fill="#528693"
30
+ fill={stroke}
39
31
  />
40
32
  </svg>
41
33
  );