@crystallize/design-system 1.24.40 → 1.24.42

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 (14) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/{chunk-UVSAFDWF.mjs → chunk-3HUBTZND.mjs} +1534 -1492
  3. package/dist/index.d.ts +2 -2
  4. package/dist/index.js +2163 -2107
  5. package/dist/index.mjs +16 -14
  6. package/dist/{rich-text-editor-K5YUVMCD.mjs → rich-text-editor-W6DYNBJ6.mjs} +1 -1
  7. package/package.json +5 -1
  8. package/src/card/card.tsx +4 -4
  9. package/src/iconography/actions.tsx +40 -0
  10. package/src/iconography/clock.tsx +7 -5
  11. package/src/iconography/edit.tsx +4 -2
  12. package/src/iconography/index.ts +2 -0
  13. package/src/iconography/paths.tsx +5 -3
  14. package/src/iconography/unpublish.tsx +7 -5
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-3HUBTZND.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-W6DYNBJ6.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-W6DYNBJ6.mjs} RENAMED
@@ -6,7 +6,7 @@ import {
6
6
  Icon,
7
7
  IconButton,
8
8
  InputWithLabel
9
- } from "./chunk-UVSAFDWF.mjs";
9
+ } from "./chunk-3HUBTZND.mjs";
10
10
  import "./chunk-NIH5ZMPE.mjs";
11
11
 
12
12
  // src/rich-text-editor/rich-text-editor.tsx
package/package.json CHANGED
@@ -1,12 +1,16 @@
1
1
  {
2
2
  "name": "@crystallize/design-system",
3
- "version": "1.24.40",
3
+ "version": "1.24.42",
4
4
  "types": "./dist/index.d.ts",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
7
7
  "publishConfig": {
8
8
  "access": "public"
9
9
  },
10
+ "engines": {
11
+ "node": ">=22.19.0"
12
+ },
13
+ "packageManager": "pnpm@10.15.0",
10
14
  "exports": {
11
15
  ".": {
12
16
  "types": "./dist/index.d.ts",
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/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,3 +1,4 @@
1
+ import { Actions } from './actions';
1
2
  import { Add } from './add';
2
3
  import { App } from './app';
3
4
  import { Archive } from './archive';
@@ -126,6 +127,7 @@ import { Warning } from './warning';
126
127
  import { XForY } from './x-for-y';
127
128
 
128
129
  export const Icon = {
130
+ Actions,
129
131
  Add,
130
132
  Archive,
131
133
  App,
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/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"