asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

chore(ui-preset,icons,dashboard) (#11734)

Browse Source 
* update icons

* update ui-preset

* chore(ui-preset,icons): Sync with Figma 5/3/2025

* chore(ui-preset,icons): Sync with Figma
This commit is contained in:
Kasper Fabricius Kristensen
2025-03-17 16:51:57 +01:00
committed by GitHub
parent 1db48a4490
commit cc4c5c86e2
41 changed files with 1007 additions and 356 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/design-system/icons/src/components/__tests__/ai-assistent-luminosity.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import AiAssistentLuminosity from "../ai-assistent-luminosity"
describe("AiAssistentLuminosity", () => {
it("should render the icon without errors", async () => {
render(<AiAssistentLuminosity data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/arrrow-right.spec.tsx → packages/design-system/icons/src/components/__tests__/arrow-right.spec.tsx
+3 -3
View File
@@ -1,11 +1,11 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import ArrrowRight from "../arrrow-right"
import ArrowRight from "../arrow-right"
describe("ArrrowRight", () => {
describe("ArrowRight", () => {
it("should render the icon without errors", async () => {
render(<ArrrowRight data-testid="icon" />)
render(<ArrowRight data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
packages/design-system/icons/src/components/__tests__/arrows-reduce-diagonal.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import ArrowsReduceDiagonal from "../arrows-reduce-diagonal"
describe("ArrowsReduceDiagonal", () => {
it("should render the icon without errors", async () => {
render(<ArrowsReduceDiagonal data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/brackets.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import Brackets from "../brackets"
describe("Brackets", () => {
it("should render the icon without errors", async () => {
render(<Brackets data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/circle-minus.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import CircleMinus from "../circle-minus"
describe("CircleMinus", () => {
it("should render the icon without errors", async () => {
render(<CircleMinus data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/code-commit.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import CodeCommit from "../code-commit"
describe("CodeCommit", () => {
it("should render the icon without errors", async () => {
render(<CodeCommit data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/code-merge.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import CodeMerge from "../code-merge"
describe("CodeMerge", () => {
it("should render the icon without errors", async () => {
render(<CodeMerge data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/drop-cap.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import DropCap from "../drop-cap"
describe("DropCap", () => {
it("should render the icon without errors", async () => {
render(<DropCap data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/expand.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import Expand from "../expand"
describe("Expand", () => {
it("should render the icon without errors", async () => {
render(<Expand data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/party.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import Party from "../party"
describe("Party", () => {
it("should render the icon without errors", async () => {
render(<Party data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/__tests__/reduce.spec.tsx
+17
View File
@@ -0,0 +1,17 @@
import * as React from "react"
import { cleanup, render, screen } from "@testing-library/react"
import Reduce from "../reduce"
describe("Reduce", () => {
it("should render the icon without errors", async () => {
render(<Reduce data-testid="icon" />)
const svgElement = screen.getByTestId("icon")
expect(svgElement).toBeInTheDocument()
cleanup()
})
})
packages/design-system/icons/src/components/ai-assistent-luminosity.tsx
+382
View File
@@ -0,0 +1,382 @@
import * as React from "react"
import type { IconProps } from "../types"
const AiAssistentLuminosity = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={16}
fill="none"
ref={ref}
{...props}
>
<g filter="url(#a)">
<circle cx={7.5} cy={7.5} r={7.11} fill="url(#b)" />
<circle cx={7.5} cy={7.5} r={7.11} fill="url(#c)" />
</g>
<g
filter="url(#d)"
opacity={0.8}
style={{
mixBlendMode: "plus-lighter",
}}
>
<circle cx={7.5} cy={5} r={4} fill="url(#e)" />
<circle cx={7.5} cy={5} r={3.9} stroke="url(#f)" strokeWidth={0.2} />
</g>
<g
filter="url(#g)"
opacity={0.8}
style={{
mixBlendMode: "plus-lighter",
}}
>
<circle cx={10} cy={8.5} r={4} fill="url(#h)" />
<circle cx={10} cy={8.5} r={3.9} stroke="url(#i)" strokeWidth={0.2} />
</g>
<g
filter="url(#j)"
opacity={0.8}
style={{
mixBlendMode: "plus-lighter",
}}
transform="matrix(-1 0 0 1 9 2.5)"
>
<circle cx={4} cy={4} r={4} fill="url(#k)" />
<circle cx={4} cy={4} r={3.9} stroke="url(#l)" strokeWidth={0.2} />
</g>
<g
filter="url(#m)"
opacity={0.8}
style={{
mixBlendMode: "plus-lighter",
}}
transform="matrix(0 -1 -1 0 11.5 11.5)"
>
<circle cx={4} cy={4} r={4} fill="url(#n)" />
<circle cx={4} cy={4} r={3.9} stroke="url(#o)" strokeWidth={0.2} />
</g>
<g
filter="url(#p)"
opacity={0.8}
style={{
mixBlendMode: "plus-lighter",
}}
transform="matrix(-1 0 0 1 11.5 6)"
>
<circle cx={4} cy={4} r={4} fill="url(#q)" />
<circle cx={4} cy={4} r={3.9} stroke="url(#r)" strokeWidth={0.2} />
</g>
<circle
cx={7.5}
cy={7.5}
r={7.11}
fill={color}
style={{
mixBlendMode: "color",
}}
/>
<defs>
<linearGradient
id="b"
x1={7.5}
x2={7.5}
y1={0.39}
y2={14.61}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.2} stopColor="#C686FF" />
<stop offset={0.8} stopColor="#8D99FF" />
</linearGradient>
<linearGradient
id="c"
x1={3.115}
x2={11.463}
y1={7.468}
y2={10.558}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF6778" stopOpacity={0.8} />
<stop offset={1} stopColor="#fff" stopOpacity={0.1} />
</linearGradient>
<linearGradient
id="e"
x1={7.5}
x2={11.5}
y1={5}
y2={5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" stopOpacity={0.1} />
<stop offset={1} stopColor="#fff" stopOpacity={0.3} />
</linearGradient>
<linearGradient
id="f"
x1={11.5}
x2={7.5}
y1={5}
y2={5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#fff" />
<stop offset={1} stopColor="#fff" stopOpacity={0} />
</linearGradient>
<linearGradient
id="h"
x1={10}
x2={14}
y1={8.5}
y2={8.5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" stopOpacity={0.1} />
<stop offset={1} stopColor="#fff" stopOpacity={0.3} />
</linearGradient>
<linearGradient
id="i"
x1={14}
x2={10}
y1={8.5}
y2={8.5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" />
<stop offset={1} stopColor="#8D99FF" stopOpacity={0} />
</linearGradient>
<linearGradient
id="k"
x1={4}
x2={8}
y1={4}
y2={4}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" stopOpacity={0.1} />
<stop offset={1} stopColor="#fff" stopOpacity={0.3} />
</linearGradient>
<linearGradient
id="l"
x1={8}
x2={4}
y1={4}
y2={4}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" />
<stop offset={1} stopColor="#8D99FF" stopOpacity={0} />
</linearGradient>
<linearGradient
id="n"
x1={4}
x2={8}
y1={4}
y2={4}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" stopOpacity={0.1} />
<stop offset={1} stopColor="#fff" stopOpacity={0.3} />
</linearGradient>
<linearGradient
id="o"
x1={8}
x2={4}
y1={4}
y2={4}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" />
<stop offset={1} stopColor="#8D99FF" stopOpacity={0} />
</linearGradient>
<linearGradient
id="q"
x1={4}
x2={8}
y1={4}
y2={4}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" stopOpacity={0.1} />
<stop offset={1} stopColor="#fff" stopOpacity={0.3} />
</linearGradient>
<linearGradient
id="r"
x1={8}
x2={4}
y1={4}
y2={4}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#fff" />
<stop offset={1} stopColor="#fff" stopOpacity={0} />
</linearGradient>
<filter
id="a"
width={15.47}
height={15.22}
x={0.14}
y={0.39}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={0.25} />
<feGaussianBlur stdDeviation={0.125} />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
<feBlend
in2="BackgroundImageFix"
result="effect1_dropShadow_9187_11750"
/>
<feBlend
in="SourceGraphic"
in2="effect1_dropShadow_9187_11750"
result="shape"
/>
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dx={-0.25} dy={-0.25} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0" />
<feBlend in2="shape" result="effect2_innerShadow_9187_11750" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dx={0.25} dy={0.25} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.4 0" />
<feBlend
in2="effect2_innerShadow_9187_11750"
result="effect3_innerShadow_9187_11750"
/>
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dx={1} dy={1} />
<feGaussianBlur stdDeviation={1} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.6 0" />
<feBlend
in2="effect3_innerShadow_9187_11750"
result="effect4_innerShadow_9187_11750"
/>
</filter>
<filter
id="d"
width={9}
height={9}
x={3}
y={0.5}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
result="effect1_foregroundBlur_9187_11750"
stdDeviation={0.25}
/>
</filter>
<filter
id="g"
width={9}
height={9}
x={5.5}
y={4}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
result="effect1_foregroundBlur_9187_11750"
stdDeviation={0.25}
/>
</filter>
<filter
id="j"
width={9}
height={9}
x={0.5}
y={2}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
result="effect1_foregroundBlur_9187_11750"
stdDeviation={0.25}
/>
</filter>
<filter
id="m"
width={9}
height={9}
x={3}
y={3}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
result="effect1_foregroundBlur_9187_11750"
stdDeviation={0.25}
/>
</filter>
<filter
id="p"
width={9}
height={9}
x={3}
y={5.5}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
result="effect1_foregroundBlur_9187_11750"
stdDeviation={0.25}
/>
</filter>
</defs>
</svg>
)
}
)
AiAssistentLuminosity.displayName = "AiAssistentLuminosity"
export default AiAssistentLuminosity
packages/design-system/icons/src/components/ai-assistent.tsx
+61 -73
View File
@@ -5,15 +5,15 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={19}
height={19}
width={15}
height={16}
fill="none"
ref={ref}
{...props}
>
<g filter="url(#a)">
<circle cx={9.5} cy={8.457} r={7.414} fill="url(#b)" />
<circle cx={9.5} cy={8.457} r={7.414} fill="url(#c)" />
<circle cx={7.5} cy={7.5} r={7.11} fill="url(#b)" />
<circle cx={7.5} cy={7.5} r={7.11} fill="url(#c)" />
</g>
<g
filter="url(#d)"
@@ -22,14 +22,8 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
mixBlendMode: "plus-lighter",
}}
>
<circle cx={9.5} cy={5.85} r={4.171} fill="url(#e)" />
<circle
cx={9.5}
cy={5.85}
r={4.071}
stroke="url(#f)"
strokeWidth={0.2}
/>
<circle cx={7.5} cy={5} r={4} fill="url(#e)" />
<circle cx={7.5} cy={5} r={3.9} stroke="url(#f)" strokeWidth={0.2} />
</g>
<g
filter="url(#g)"
@@ -38,14 +32,8 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
mixBlendMode: "plus-lighter",
}}
>
<circle cx={12.107} cy={9.5} r={4.171} fill="url(#h)" />
<circle
cx={12.107}
cy={9.5}
r={4.071}
stroke="url(#i)"
strokeWidth={0.2}
/>
<circle cx={10} cy={8.5} r={4} fill="url(#h)" />
<circle cx={10} cy={8.5} r={3.9} stroke="url(#i)" strokeWidth={0.2} />
</g>
<g
filter="url(#j)"
@@ -53,7 +41,7 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
style={{
mixBlendMode: "plus-lighter",
}}
transform="matrix(-1.0428 0 0 1.0428 11.064 3.243)"
transform="matrix(-1 0 0 1 9 2.5)"
>
<circle cx={4} cy={4} r={4} fill="url(#k)" />
<circle cx={4} cy={4} r={3.9} stroke="url(#l)" strokeWidth={0.2} />
@@ -64,7 +52,7 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
style={{
mixBlendMode: "plus-lighter",
}}
transform="scale(1.0428 -1.0428)rotate(90 12.61 .5)"
transform="matrix(0 -1 -1 0 11.5 11.5)"
>
<circle cx={4} cy={4} r={4} fill="url(#n)" />
<circle cx={4} cy={4} r={3.9} stroke="url(#o)" strokeWidth={0.2} />
@@ -75,7 +63,7 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
style={{
mixBlendMode: "plus-lighter",
}}
transform="matrix(-1.0428 0 0 1.0428 13.67 6.893)"
transform="matrix(-1 0 0 1 11.5 6)"
>
<circle cx={4} cy={4} r={4} fill="url(#q)" />
<circle cx={4} cy={4} r={3.9} stroke="url(#r)" strokeWidth={0.2} />
@@ -83,10 +71,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
<defs>
<linearGradient
id="b"
x1={9.589}
x2={9.589}
y1={1.087}
y2={15.916}
x1={7.5}
x2={7.5}
y1={0.39}
y2={14.61}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.2} stopColor="#C686FF" />
@@ -94,10 +82,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</linearGradient>
<linearGradient
id="c"
x1={5.017}
x2={13.721}
y1={8.468}
y2={11.691}
x1={3.115}
x2={11.463}
y1={7.468}
y2={10.558}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF6778" stopOpacity={0.8} />
@@ -105,10 +93,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</linearGradient>
<linearGradient
id="e"
x1={9.728}
x2={13.899}
y1={5.922}
y2={5.922}
x1={7.5}
x2={11.5}
y1={5}
y2={5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" stopOpacity={0.1} />
@@ -116,10 +104,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</linearGradient>
<linearGradient
id="f"
x1={13.899}
x2={9.728}
y1={5.922}
y2={5.922}
x1={11.5}
x2={7.5}
y1={5}
y2={5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#fff" />
@@ -127,10 +115,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</linearGradient>
<linearGradient
id="h"
x1={12.446}
x2={16.618}
y1={9.728}
y2={9.728}
x1={10}
x2={14}
y1={8.5}
y2={8.5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" stopOpacity={0.1} />
@@ -138,10 +126,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</linearGradient>
<linearGradient
id="i"
x1={16.618}
x2={12.446}
y1={9.728}
y2={9.728}
x1={14}
x2={10}
y1={8.5}
y2={8.5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8D99FF" />
@@ -215,10 +203,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</linearGradient>
<filter
id="a"
width={19}
height={19}
x={0}
y={0}
width={15.47}
height={15.22}
x={0.14}
y={0.39}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
@@ -228,8 +216,8 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={1} />
<feGaussianBlur stdDeviation={1} />
<feOffset dy={0.25} />
<feGaussianBlur stdDeviation={0.125} />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
<feBlend
@@ -278,10 +266,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</filter>
<filter
id="d"
width={9.385}
height={9.385}
x={4.807}
y={1.158}
width={9}
height={9}
x={3}
y={0.5}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
@@ -298,10 +286,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</filter>
<filter
id="g"
width={9.385}
height={9.385}
x={7.414}
y={4.807}
width={9}
height={9}
x={5.5}
y={4}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
@@ -318,10 +306,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</filter>
<filter
id="j"
width={9.385}
height={9.385}
x={2.2}
y={2.722}
width={9}
height={9}
x={0.5}
y={2}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
@@ -338,10 +326,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</filter>
<filter
id="m"
width={9.385}
height={9.385}
x={4.807}
y={3.765}
width={9}
height={9}
x={3}
y={3}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
@@ -358,10 +346,10 @@ const AiAssistent = React.forwardRef<SVGSVGElement, IconProps>(
</filter>
<filter
id="p"
width={9.385}
height={9.385}
x={4.807}
y={6.372}
width={9}
height={9}
x={3}
y={5.5}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
packages/design-system/icons/src/components/arrrow-right.tsx → packages/design-system/icons/src/components/arrow-right.tsx
+3 -3
View File
@@ -1,6 +1,6 @@
import * as React from "react"
import type { IconProps } from "../types"
const ArrrowRight = React.forwardRef<SVGSVGElement, IconProps>(
const ArrowRight = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
@@ -22,5 +22,5 @@ const ArrrowRight = React.forwardRef<SVGSVGElement, IconProps>(
)
}
)
ArrrowRight.displayName = "ArrrowRight"
export default ArrrowRight
ArrowRight.displayName = "ArrowRight"
export default ArrowRight
packages/design-system/icons/src/components/arrow-up-tray.tsx
+1 -1
View File
@@ -16,7 +16,7 @@ const ArrowUpTray = React.forwardRef<SVGSVGElement, IconProps>(
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M13.056 9.944v1.334c0 .982-.796 1.777-1.778 1.777H3.722a1.777 1.777 0 0 1-1.778-1.777V9.944M10.611 5.055 7.5 1.945l-3.111 3.11M7.5 1.944v6.667"
d="M13.056 9.944v1.334c0 .982-.796 1.778-1.778 1.778H3.722a1.777 1.777 0 0 1-1.778-1.778V9.944M10.611 5.056 7.5 1.944 4.389 5.056M7.5 1.944v6.667"
/>
</svg>
)
packages/design-system/icons/src/components/arrows-reduce-diagonal.tsx
+26
View File
@@ -0,0 +1,26 @@
import * as React from "react"
import type { IconProps } from "../types"
const ArrowsReduceDiagonal = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M13.056 5.944h-4v-4M9.056 5.944l4-4M5.944 13.056v-4h-4M5.944 9.056l-4 4"
/>
</svg>
)
}
)
ArrowsReduceDiagonal.displayName = "ArrowsReduceDiagonal"
export default ArrowsReduceDiagonal
packages/design-system/icons/src/components/bell-alert-done.tsx
+1 -1
View File
@@ -12,7 +12,7 @@ const BellAlertDone = React.forwardRef<SVGSVGElement, IconProps>(
{...props}
>
<g clipPath="url(#a)">
<circle cx={12.5} cy={2.5} r={2.5} fill="#60A5FA" />
<circle cx={12.5} cy={2.5} r={2.5} fill="#3B82F6" />
<circle
cx={12.5}
cy={2.5}
packages/design-system/icons/src/components/brackets.tsx
+33
View File
@@ -0,0 +1,33 @@
import * as React from "react"
import type { IconProps } from "../types"
const Brackets = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<g
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
clipPath="url(#a)"
>
<path d="M5.056 13.055h-.89a1.777 1.777 0 0 1-1.777-1.777V8.944c0-.797-.647-1.444-1.445-1.444.798 0 1.445-.647 1.445-1.445V3.722c0-.982.795-1.778 1.778-1.778h.889M9.944 13.055h.89c.982 0 1.777-.795 1.777-1.777V8.944c0-.797.647-1.444 1.445-1.444a1.445 1.445 0 0 1-1.445-1.445V3.722c0-.982-.795-1.778-1.778-1.778h-.889" />
</g>
<defs>
<clipPath id="a">
<path fill="#fff" d="M0 0h15v15H0z" />
</clipPath>
</defs>
</svg>
)
}
)
Brackets.displayName = "Brackets"
export default Brackets
packages/design-system/icons/src/components/camera.tsx
+2 -2
View File
@@ -14,12 +14,12 @@ const Camera = React.forwardRef<SVGSVGElement, IconProps>(
<g fill={color} clipPath="url(#a)">
<path
fillRule="evenodd"
d="M4.582 1.869c.24-.64.85-1.063 1.534-1.063h2.768c.684 0 1.295.424 1.534 1.064l.268.713h1.48a2.527 2.527 0 0 1 2.529 2.528v5.778a2.527 2.527 0 0 1-2.528 2.528H2.833a2.527 2.527 0 0 1-2.527-2.528V5.111a2.527 2.527 0 0 1 2.527-2.528h1.48zm1.534.437a.14.14 0 0 0-.13.09l-.45 1.201a.75.75 0 0 1-.703.486h-2c-.568 0-1.027.46-1.027 1.028v5.778c0 .568.46 1.028 1.027 1.028h9.334c.568 0 1.028-.46 1.028-1.028V5.111c0-.568-.46-1.028-1.028-1.028h-2a.75.75 0 0 1-.702-.486l-.451-1.2a.14.14 0 0 0-.13-.091z"
d="M4.582 1.869c.24-.64.85-1.063 1.534-1.063h2.768c.684 0 1.295.424 1.534 1.063l.268.714h1.48a2.527 2.527 0 0 1 2.529 2.528v5.778a2.527 2.527 0 0 1-2.528 2.528H2.833a2.527 2.527 0 0 1-2.527-2.528V5.11a2.527 2.527 0 0 1 2.527-2.528h1.48zm1.534.437a.14.14 0 0 0-.13.09l-.45 1.2a.75.75 0 0 1-.703.487h-2c-.568 0-1.027.46-1.027 1.028v5.778c0 .568.46 1.028 1.027 1.028h9.334c.568 0 1.028-.46 1.028-1.028V5.11c0-.568-.46-1.028-1.028-1.028h-2a.75.75 0 0 1-.702-.486l-.451-1.201a.14.14 0 0 0-.13-.09z"
clipRule="evenodd"
/>
<path
fillRule="evenodd"
d="M7.5 6.306a1.694 1.694 0 1 0 0 3.389 1.694 1.694 0 0 0 0-3.39M4.306 8a3.194 3.194 0 1 1 6.389 0 3.194 3.194 0 0 1-6.39 0"
d="M7.5 6.306a1.694 1.694 0 1 0 0 3.388 1.694 1.694 0 0 0 0-3.388M4.306 8a3.194 3.194 0 1 1 6.389 0 3.194 3.194 0 0 1-6.39 0"
clipRule="evenodd"
/>
<path d="M3.278 6.222a.667.667 0 1 0 0-1.333.667.667 0 0 0 0 1.333" />
packages/design-system/icons/src/components/circle-minus.tsx
+23
View File
@@ -0,0 +1,23 @@
import * as React from "react"
import type { IconProps } from "../types"
const CircleMinus = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
fill={color}
d="M7.5.389C3.58.389.389 3.579.389 7.5s3.19 7.111 7.111 7.111 7.111-3.19 7.111-7.111S11.421.389 7.5.389m2.889 7.778H4.61a.667.667 0 0 1 0-1.334h5.778a.667.667 0 0 1 0 1.334"
/>
</svg>
)
}
)
CircleMinus.displayName = "CircleMinus"
export default CircleMinus
packages/design-system/icons/src/components/code-commit.tsx
+26
View File
@@ -0,0 +1,26 @@
import * as React from "react"
import type { IconProps } from "../types"
const CodeCommit = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M.833 7.5h3.959M14.167 7.5h-3.959M7.5 10.209a2.708 2.708 0 1 0 0-5.417 2.708 2.708 0 0 0 0 5.417"
/>
</svg>
)
}
)
CodeCommit.displayName = "CodeCommit"
export default CodeCommit
packages/design-system/icons/src/components/code-merge.tsx
+33
View File
@@ -0,0 +1,33 @@
import * as React from "react"
import type { IconProps } from "../types"
const CodeMerge = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M3.722 5.056v8.889M9.278 10.611a5.555 5.555 0 0 1-5.556-5.555M3.722 5.056a2 2 0 1 0 0-4 2 2 0 0 0 0 4"
/>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M11.278 12.61a2 2 0 1 0 0-4 2 2 0 0 0 0 4"
/>
</svg>
)
}
)
CodeMerge.displayName = "CodeMerge"
export default CodeMerge
packages/design-system/icons/src/components/drop-cap.tsx
+26
View File
@@ -0,0 +1,26 @@
import * as React from "react"
import type { IconProps } from "../types"
const DropCap = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M1.944 12.611h11.112M1.944 9.5h11.112M9.056 6.389h4M9.056 3.278h4M6.568 6.833 4.548 1.5h-.555L1.976 6.833M2.48 5.5h3.583"
/>
</svg>
)
}
)
DropCap.displayName = "DropCap"
export default DropCap
packages/design-system/icons/src/components/ellipse-grey-solid.tsx
+1 -1
View File
@@ -13,7 +13,7 @@ const EllipseGreySolid = React.forwardRef<SVGSVGElement, IconProps>(
>
<g clipPath="url(#a)" filter="url(#b)">
<rect width={10} height={10} x={2.5} y={2.5} fill="#fff" rx={5} />
<circle cx={7.5} cy={7.5} r={3} fill="#A1A1AA" />
<circle cx={7.5} cy={7.5} r={3} fill="#71717A" />
</g>
<defs>
<clipPath id="a">
packages/design-system/icons/src/components/expand.tsx
+26
View File
@@ -0,0 +1,26 @@
import * as React from "react"
import type { IconProps } from "../types"
const Expand = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M9.5 1.944h1.778c.982 0 1.778.796 1.778 1.778V5.5M5.5 13.056H3.722a1.777 1.777 0 0 1-1.778-1.778V9.5M1.944 5.5V3.722c0-.982.796-1.778 1.778-1.778H5.5M13.056 9.5v1.778c0 .982-.796 1.778-1.778 1.778H9.5"
/>
</svg>
)
}
)
Expand.displayName = "Expand"
export default Expand
packages/design-system/icons/src/components/featured-badge.tsx
+21 -81
View File
@@ -5,103 +5,43 @@ const FeaturedBadge = React.forwardRef<SVGSVGElement, IconProps>(
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={20}
height={20}
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<g filter="url(#a)">
<circle cx={10} cy={8.903} r={7.806} fill="#3B82F6" />
<circle
cx={10}
cy={8.903}
r={7.806}
fill="url(#b)"
fillOpacity={0.2}
/>
<circle
cx={10}
cy={8.903}
r={7.556}
stroke="#000"
strokeOpacity={0.2}
strokeWidth={0.5}
/>
</g>
<g clipPath="url(#c)">
<circle cx={7.5} cy={7.5} r={7.5} fill="#3B82F6" />
<circle cx={7.5} cy={7.5} r={7.5} fill="url(#a)" fillOpacity={0.2} />
<circle
cx={7.5}
cy={7.5}
r={7.2}
stroke={color}
strokeOpacity={0.24}
strokeWidth={0.6}
/>
<g clipPath="url(#b)">
<path
fill="#fff"
d="M14.604 7.623a.43.43 0 0 0-.35-.295l-2.67-.388-1.195-2.421c-.146-.296-.632-.296-.778 0l-1.195 2.42-2.671.388a.434.434 0 0 0-.24.74L7.438 9.95l-.457 2.66a.434.434 0 0 0 .63.457l2.388-1.256 2.39 1.256a.43.43 0 0 0 .457-.032.43.43 0 0 0 .172-.425l-.457-2.66 1.933-1.884a.43.43 0 0 0 .11-.445"
d="M11.924 6.27a.42.42 0 0 0-.336-.283L9.02 5.614 7.873 3.288c-.14-.285-.607-.285-.747 0L5.978 5.613l-2.566.373a.417.417 0 0 0-.23.71l1.856 1.81-.439 2.557a.417.417 0 0 0 .605.44l2.295-1.208 2.296 1.207a.41.41 0 0 0 .439-.032.42.42 0 0 0 .165-.407l-.438-2.556 1.857-1.81a.42.42 0 0 0 .105-.428z"
/>
</g>
<defs>
<linearGradient
id="b"
x1={10.089}
x2={10.089}
y1={1.142}
y2={16.754}
id="a"
x1={7.5}
x2={7.5}
y1={0}
y2={15}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#fff" />
<stop offset={1} stopColor="#fff" stopOpacity={0} />
</linearGradient>
<clipPath id="c">
<path fill="#fff" d="M4.796 3.699h10.408v10.408H4.796z" />
<clipPath id="b">
<path fill="#fff" d="M2.5 2.5h10v10h-10z" />
</clipPath>
<filter
id="a"
width={20}
height={20}
x={0}
y={0}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={1.054} />
<feGaussianBlur stdDeviation={1.054} />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
<feBlend
in2="BackgroundImageFix"
result="effect1_dropShadow_8442_559"
/>
<feBlend
in="SourceGraphic"
in2="effect1_dropShadow_8442_559"
result="shape"
/>
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={1.054} />
<feGaussianBlur stdDeviation={1.054} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0" />
<feBlend in2="shape" result="effect2_innerShadow_8442_559" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={-1.054} />
<feGaussianBlur stdDeviation={2.635} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0" />
<feBlend
in2="effect2_innerShadow_8442_559"
result="effect3_innerShadow_8442_559"
/>
</filter>
</defs>
</svg>
)
packages/design-system/icons/src/components/flying-box.tsx
+1 -1
View File
@@ -16,7 +16,7 @@ const FlyingBox = React.forwardRef<SVGSVGElement, IconProps>(
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M7.5 1.5v5.333M11.278 4.167H3.722c-.982 0-1.778.796-1.778 1.778v5.333c0 .982.796 1.778 1.778 1.778h7.556c.982 0 1.778-.796 1.778-1.778V5.945c0-.982-.796-1.778-1.778-1.778"
d="M7.5 1.5v5.333M11.278 4.167H3.722c-.982 0-1.778.796-1.778 1.777v5.334c0 .982.796 1.777 1.778 1.777h7.556c.982 0 1.778-.795 1.778-1.777V5.944c0-.981-.796-1.777-1.778-1.777"
/>
<path
stroke={color}
packages/design-system/icons/src/components/index.ts
+11 -1
View File
@@ -3,6 +3,7 @@ export { default as AcademicCapSolid } from "./academic-cap-solid"
export { default as AcademicCap } from "./academic-cap"
export { default as AdjustmentsDone } from "./adjustments-done"
export { default as Adjustments } from "./adjustments"
export { default as AiAssistentLuminosity } from "./ai-assistent-luminosity"
export { default as AiAssistent } from "./ai-assistent"
export { default as Amazon } from "./amazon"
export { default as Apple } from "./apple"
@@ -25,6 +26,7 @@ export { default as ArrowPath } from "./arrow-path"
export { default as ArrowRightDown } from "./arrow-right-down"
export { default as ArrowRightMini } from "./arrow-right-mini"
export { default as ArrowRightOnRectangle } from "./arrow-right-on-rectangle"
export { default as ArrowRight } from "./arrow-right"
export { default as ArrowUpCircleSolid } from "./arrow-up-circle-solid"
export { default as ArrowUpDown } from "./arrow-up-down"
export { default as ArrowUpMini } from "./arrow-up-mini"
@@ -35,7 +37,7 @@ export { default as ArrowUpTray } from "./arrow-up-tray"
export { default as ArrowUturnLeft } from "./arrow-uturn-left"
export { default as ArrowsPointingOutMini } from "./arrows-pointing-out-mini"
export { default as ArrowsPointingOut } from "./arrows-pointing-out"
export { default as ArrrowRight } from "./arrrow-right"
export { default as ArrowsReduceDiagonal } from "./arrows-reduce-diagonal"
export { default as AtSymbol } from "./at-symbol"
export { default as BackwardSolid } from "./backward-solid"
export { default as BarsArrowDown } from "./bars-arrow-down"
@@ -50,6 +52,7 @@ export { default as BookOpen } from "./book-open"
export { default as Book } from "./book"
export { default as Bookmarks } from "./bookmarks"
export { default as BottomToTop } from "./bottom-to-top"
export { default as Brackets } from "./brackets"
export { default as BroomSparkle } from "./broom-sparkle"
export { default as BugAntSolid } from "./bug-ant-solid"
export { default as Bug } from "./bug"
@@ -97,6 +100,7 @@ export { default as CircleFilledSolid } from "./circle-filled-solid"
export { default as CircleHalfSolid } from "./circle-half-solid"
export { default as CircleMiniFilledSolid } from "./circle-mini-filled-solid"
export { default as CircleMiniSolid } from "./circle-mini-solid"
export { default as CircleMinus } from "./circle-minus"
export { default as CircleQuarterSolid } from "./circle-quarter-solid"
export { default as CircleSliders } from "./circle-sliders"
export { default as CircleSolid } from "./circle-solid"
@@ -110,6 +114,8 @@ export { default as Clock } from "./clock"
export { default as CloneDashed } from "./clone-dashed"
export { default as CloudArrowDown } from "./cloud-arrow-down"
export { default as CloudArrowUp } from "./cloud-arrow-up"
export { default as CodeCommit } from "./code-commit"
export { default as CodeMerge } from "./code-merge"
export { default as CogSixToothSolid } from "./cog-six-tooth-solid"
export { default as CogSixTooth } from "./cog-six-tooth"
export { default as CommandLineSolid } from "./command-line-solid"
@@ -132,6 +138,7 @@ export { default as DocumentSeries } from "./document-series"
export { default as DocumentTextSolid } from "./document-text-solid"
export { default as DocumentText } from "./document-text"
export { default as DotsSix } from "./dots-six"
export { default as DropCap } from "./drop-cap"
export { default as EllipseBlueSolid } from "./ellipse-blue-solid"
export { default as EllipseGreenSolid } from "./ellipse-green-solid"
export { default as EllipseGreySolid } from "./ellipse-grey-solid"
@@ -146,6 +153,7 @@ export { default as EnvelopeSolid } from "./envelope-solid"
export { default as Envelope } from "./envelope"
export { default as ExclamationCircleSolid } from "./exclamation-circle-solid"
export { default as ExclamationCircle } from "./exclamation-circle"
export { default as Expand } from "./expand"
export { default as EyeMini } from "./eye-mini"
export { default as EyeSlashMini } from "./eye-slash-mini"
export { default as EyeSlash } from "./eye-slash"
@@ -220,6 +228,7 @@ export { default as Newspaper } from "./newspaper"
export { default as NextJs } from "./next-js"
export { default as OpenRectArrowOut } from "./open-rect-arrow-out"
export { default as PaperClip } from "./paper-clip"
export { default as Party } from "./party"
export { default as PauseSolid } from "./pause-solid"
export { default as PenPlus } from "./pen-plus"
export { default as PencilSquareSolid } from "./pencil-square-solid"
@@ -241,6 +250,7 @@ export { default as ReactJsEx } from "./react-js-ex"
export { default as ReactJs } from "./react-js"
export { default as ReceiptPercent } from "./receipt-percent"
export { default as Receipt } from "./receipt"
export { default as Reduce } from "./reduce"
export { default as ReplaySolid } from "./replay-solid"
export { default as Resize } from "./resize"
export { default as RocketLaunchSolid } from "./rocket-launch-solid"
packages/design-system/icons/src/components/party.tsx
+37
View File
@@ -0,0 +1,37 @@
import * as React from "react"
import type { IconProps } from "../types"
const Party = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="m2.433 11.549 2.264-7.44a.817.817 0 0 1 1.36-.34l5.176 5.176a.817.817 0 0 1-.34 1.36l-7.441 2.264a.817.817 0 0 1-1.02-1.02zM5.724 11.876 3.95 6.56M8.6 11 6.254 3.967"
/>
<path
fill={color}
d="m13.824 2.185-.773-.257-.258-.773c-.083-.25-.497-.25-.58 0l-.259.773-.772.257a.307.307 0 0 0 0 .582l.772.257.258.773a.306.306 0 0 0 .58 0l.258-.773.773-.257a.307.307 0 0 0 0-.582M10.563 5.05a.613.613 0 1 0 0-1.225.613.613 0 0 0 0 1.225"
/>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M8.317 2.959c.15-.109.48-.38.672-.856.25-.623.096-1.178.045-1.34M12.042 6.683c.108-.15.38-.48.855-.672a2 2 0 0 1 1.34-.045"
/>
</svg>
)
}
)
Party.displayName = "Party"
export default Party
packages/design-system/icons/src/components/reduce.tsx
+26
View File
@@ -0,0 +1,26 @@
import * as React from "react"
import type { IconProps } from "../types"
const Reduce = React.forwardRef<SVGSVGElement, IconProps>(
({ color = "currentColor", ...props }, ref) => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<path
stroke={color}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M5.5 1.944v1.778c0 .982-.796 1.778-1.778 1.778H1.944M13.056 5.5h-1.778A1.777 1.777 0 0 1 9.5 3.722V1.944M9.5 13.056v-1.778c0-.982.796-1.778 1.778-1.778h1.778M1.944 9.5h1.778c.982 0 1.778.796 1.778 1.778v1.778"
/>
</svg>
)
}
)
Reduce.displayName = "Reduce"
export default Reduce
packages/design-system/icons/src/components/sparkles-mini-solid.tsx
+1 -1
View File
@@ -13,7 +13,7 @@ const SparklesMiniSolid = React.forwardRef<SVGSVGElement, IconProps>(
>
<path
fill={color}
d="m1.582 3.905 1.123.374.374 1.123a.446.446 0 0 0 .845 0l.374-1.123 1.122-.374a.445.445 0 0 0 0-.842l-1.122-.375-.374-1.122c-.122-.363-.722-.363-.844 0l-.374 1.122-1.123.375a.444.444 0 0 0 0 .842M13.418 11.063l-1.122-.375-.375-1.122c-.121-.363-.721-.363-.843 0l-.374 1.122-1.123.375a.444.444 0 0 0 0 .842l1.123.375.374 1.122a.446.446 0 0 0 .844 0l.374-1.122 1.123-.375a.445.445 0 0 0 0-.842M7.967 9.531l-1.801-.713-.713-1.802c-.202-.508-1.038-.508-1.24 0L3.5 8.818l-1.8.713a.668.668 0 0 0 0 1.24l1.8.712.713 1.802a.667.667 0 0 0 1.239 0l.713-1.802 1.8-.713a.667.667 0 0 0 .002-1.239M13.3 4.198l-1.8-.713-.714-1.802c-.201-.509-1.038-.509-1.24 0l-.713 1.802-1.8.713a.668.668 0 0 0 0 1.239l1.8.713.713 1.801a.667.667 0 0 0 1.24 0l.712-1.801 1.801-.713a.668.668 0 0 0 .001-1.24"
d="m1.582 3.905 1.123.375.374 1.122a.446.446 0 0 0 .845 0l.374-1.122 1.122-.375a.444.444 0 0 0 0-.842l-1.122-.375-.374-1.122c-.122-.363-.722-.363-.844 0l-.374 1.122-1.123.375a.444.444 0 0 0 0 .842M13.418 11.063l-1.122-.375-.375-1.122c-.121-.363-.721-.363-.843 0l-.374 1.122-1.123.375a.444.444 0 0 0 0 .842l1.123.375.374 1.122a.446.446 0 0 0 .844 0l.374-1.122 1.123-.375a.445.445 0 0 0 0-.842M7.967 9.531l-1.801-.713-.713-1.802c-.202-.508-1.038-.508-1.24 0L3.5 8.818l-1.8.713a.668.668 0 0 0 0 1.24l1.8.712.713 1.802a.667.667 0 0 0 1.239 0l.713-1.802 1.8-.713a.667.667 0 0 0 .002-1.239M13.3 4.198l-1.8-.713-.714-1.802c-.201-.508-1.038-.508-1.24 0l-.713 1.802-1.8.713a.668.668 0 0 0 0 1.239l1.8.713.713 1.801a.667.667 0 0 0 1.24 0l.712-1.801 1.801-.713a.668.668 0 0 0 .001-1.24"
/>
</svg>
)
packages/design-system/icons/src/components/square-grey-solid.tsx
+1 -1
View File
@@ -11,7 +11,7 @@ const SquareGreySolid = React.forwardRef<SVGSVGElement, IconProps>(
ref={ref}
{...props}
>
<rect width={8} height={8} x={3.5} y={3.5} fill="#A1A1AA" rx={2} />
<rect width={8} height={8} x={3.5} y={3.5} fill="#71717A" rx={2} />
<rect
width={7.5}
height={7.5}
packages/design-system/icons/src/components/tag-illustration.tsx
+2 -2
View File
@@ -13,7 +13,7 @@ const TagIllustration = React.forwardRef<SVGSVGElement, IconProps>(
>
<g filter="url(#a)">
<path
fill="#818CF8"
fill="#60A5FA"
d="M12.863 6.686 8.315 2.138A2.16 2.16 0 0 0 6.777 1.5H2.884c-.763 0-1.384.62-1.384 1.384v3.893c0 .581.226 1.127.638 1.538l4.548 4.548c.41.412.957.637 1.537.637s1.128-.226 1.538-.637l3.102-3.102c.412-.41.637-.957.637-1.538 0-.58-.226-1.127-.637-1.537"
/>
<path
@@ -30,7 +30,7 @@ const TagIllustration = React.forwardRef<SVGSVGElement, IconProps>(
/>
<g filter="url(#c)">
<path
fill="#818CF8"
fill="#60A5FA"
d="M5.257 6.246a.99.99 0 0 1-.989-.989.99.99 0 0 1 .989-.989.99.99 0 0 1 .989.99.99.99 0 0 1-.989.988m3.385 3.979a.59.59 0 0 1-.838 0L6.222 8.643a.593.593 0 1 1 .84-.84l1.581 1.582a.593.593 0 0 1 0 .84m1.582-1.582a.59.59 0 0 1-.838 0L7.804 7.06a.593.593 0 1 1 .84-.84l1.581 1.582a.593.593 0 0 1 0 .84"
/>
<path
packages/design-system/icons/src/components/thumbnail-badge.tsx
+21 -81
View File
@@ -5,100 +5,40 @@ const ThumbnailBadge = React.forwardRef<SVGSVGElement, IconProps>(
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={20}
height={20}
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<g filter="url(#a)">
<circle cx={10} cy={8.903} r={7.806} fill="#3B82F6" />
<circle
cx={10}
cy={8.903}
r={7.806}
fill="url(#b)"
fillOpacity={0.2}
/>
<circle
cx={10}
cy={8.903}
r={7.556}
stroke="#000"
strokeOpacity={0.2}
strokeWidth={0.5}
/>
</g>
<g fill="#fff" clipPath="url(#c)">
<path d="M6.098 11.393a.724.724 0 0 1-.724-.723V7.136a.724.724 0 0 1 .951-.686l.487.163a.434.434 0 1 1-.274.822l-.297-.098v3.133l.297-.099a.433.433 0 1 1 .274.823l-.487.162a.7.7 0 0 1-.227.037M8.41 12.517a.723.723 0 0 1-.722-.723V6.012a.72.72 0 0 1 1-.667l.467.194a.434.434 0 0 1-.333.801l-.267-.111v5.349l.267-.111a.434.434 0 1 1 .333.8l-.467.195a.7.7 0 0 1-.278.055M14.038 5.752l-3.012-1.39A.722.722 0 0 0 10 5.018v7.77a.72.72 0 0 0 .722.724.7.7 0 0 0 .304-.067l3.012-1.39c.357-.165.588-.526.588-.92V6.672c0-.393-.23-.754-.588-.919" />
<circle cx={7.5} cy={7.5} r={7.5} fill="#3B82F6" />
<circle cx={7.5} cy={7.5} r={7.5} fill="url(#a)" fillOpacity={0.2} />
<circle
cx={7.5}
cy={7.5}
r={7.2}
stroke={color}
strokeOpacity={0.24}
strokeWidth={0.6}
/>
<g fill="#fff" clipPath="url(#b)">
<path d="M3.75 9.892a.696.696 0 0 1-.694-.694V5.802a.696.696 0 0 1 .914-.659l.467.156a.417.417 0 0 1-.264.79l-.285-.094v3.01l.285-.095a.416.416 0 1 1 .264.791l-.467.156a.7.7 0 0 1-.22.036M5.972 10.972a.695.695 0 0 1-.694-.694V4.722a.693.693 0 0 1 .961-.64l.45.186a.417.417 0 0 1-.321.77l-.256-.107v5.139l.256-.107a.417.417 0 0 1 .32.77l-.449.186a.7.7 0 0 1-.267.053M11.38 4.473 8.485 3.137a.694.694 0 0 0-.986.63v7.466a.69.69 0 0 0 .694.695.7.7 0 0 0 .292-.065l2.893-1.335a.98.98 0 0 0 .565-.883v-4.29a.98.98 0 0 0-.565-.882" />
</g>
<defs>
<linearGradient
id="b"
x1={10.09}
x2={10.09}
y1={1.142}
y2={16.754}
id="a"
x1={7.5}
x2={7.5}
y1={0}
y2={15}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#fff" />
<stop offset={1} stopColor="#fff" stopOpacity={0} />
</linearGradient>
<clipPath id="c">
<path fill="#fff" d="M4.796 3.699h10.408v10.408H4.796z" />
<clipPath id="b">
<path fill="#fff" d="M2.5 2.5h10v10h-10z" />
</clipPath>
<filter
id="a"
width={20}
height={20}
x={0}
y={0}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={1.054} />
<feGaussianBlur stdDeviation={1.054} />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
<feBlend
in2="BackgroundImageFix"
result="effect1_dropShadow_6384_214"
/>
<feBlend
in="SourceGraphic"
in2="effect1_dropShadow_6384_214"
result="shape"
/>
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={1.054} />
<feGaussianBlur stdDeviation={1.054} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0" />
<feBlend in2="shape" result="effect2_innerShadow_6384_214" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={-1.054} />
<feGaussianBlur stdDeviation={2.635} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0" />
<feBlend
in2="effect2_innerShadow_6384_214"
result="effect3_innerShadow_6384_214"
/>
</filter>
</defs>
</svg>
)
packages/design-system/icons/src/components/verified-badge.tsx
+27 -81
View File
@@ -5,104 +5,50 @@ const VerifiedBadge = React.forwardRef<SVGSVGElement, IconProps>(
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width={20}
height={20}
width={15}
height={15}
fill="none"
ref={ref}
{...props}
>
<g filter="url(#a)">
<path
fill="#3B82F6"
fillRule="evenodd"
d="M7.28 2.337A3.6 3.6 0 0 1 10 1.097c1.086 0 2.06.48 2.72 1.24a3.6 3.6 0 0 1 2.8 1.046 3.6 3.6 0 0 1 1.047 2.8 3.6 3.6 0 0 1 1.24 2.72 3.6 3.6 0 0 1-1.241 2.72 3.6 3.6 0 0 1-1.046 2.8 3.6 3.6 0 0 1-2.8 1.046 3.6 3.6 0 0 1-4.215.916 3.6 3.6 0 0 1-1.225-.916 3.6 3.6 0 0 1-2.8-1.046 3.6 3.6 0 0 1-1.047-2.8 3.6 3.6 0 0 1-1.24-2.72c0-1.087.481-2.06 1.241-2.72a3.6 3.6 0 0 1 1.047-2.8 3.6 3.6 0 0 1 2.8-1.046"
clipRule="evenodd"
/>
<path
fill="url(#b)"
fillOpacity={0.2}
fillRule="evenodd"
d="M7.28 2.337A3.6 3.6 0 0 1 10 1.097c1.086 0 2.06.48 2.72 1.24a3.6 3.6 0 0 1 2.8 1.046 3.6 3.6 0 0 1 1.047 2.8 3.6 3.6 0 0 1 1.24 2.72 3.6 3.6 0 0 1-1.241 2.72 3.6 3.6 0 0 1-1.046 2.8 3.6 3.6 0 0 1-2.8 1.046 3.6 3.6 0 0 1-4.215.916 3.6 3.6 0 0 1-1.225-.916 3.6 3.6 0 0 1-2.8-1.046 3.6 3.6 0 0 1-1.047-2.8 3.6 3.6 0 0 1-1.24-2.72c0-1.087.481-2.06 1.241-2.72a3.6 3.6 0 0 1 1.047-2.8 3.6 3.6 0 0 1 2.8-1.046"
clipRule="evenodd"
/>
<path
stroke="#000"
strokeOpacity={0.2}
strokeWidth={0.5}
d="M3.433 11.623a3.6 3.6 0 0 0 1.047 2.8 3.6 3.6 0 0 0 2.8 1.046zm0 0a3.6 3.6 0 0 1-1.24-2.72c0-1.087.481-2.06 1.241-2.72m0 5.44v-5.44m0 0a3.6 3.6 0 0 1 1.047-2.8zm3.828-3.586.13.009.085-.099A3.34 3.34 0 0 1 10 1.357c1.008 0 1.91.445 2.523 1.15l.085.099.13-.01a3.34 3.34 0 0 1 2.598.971 3.34 3.34 0 0 1 .971 2.598l-.01.13.1.085a3.34 3.34 0 0 1 1.149 2.523 3.34 3.34 0 0 1-1.15 2.523l-.099.085.01.13a3.34 3.34 0 0 1-.971 2.597 3.34 3.34 0 0 1-2.598.971l-.13-.009-.085.098A3.34 3.34 0 0 1 10 16.448a3.34 3.34 0 0 1-2.523-1.15l-.085-.098-.13.01a3.34 3.34 0 0 1-2.598-.97v-.001a3.34 3.34 0 0 1-.971-2.598l.01-.13-.1-.085a3.34 3.34 0 0 1-1.149-2.523c0-1.008.445-1.911 1.15-2.523l.099-.086-.01-.13a3.34 3.34 0 0 1 .971-2.596 3.34 3.34 0 0 1 2.598-.971Z"
/>
</g>
<path
fill="#3B82F6"
fillRule="evenodd"
d="M4.887 1.192A3.45 3.45 0 0 1 7.5 0a3.45 3.45 0 0 1 2.613 1.192 3.45 3.45 0 0 1 2.69 1.005 3.46 3.46 0 0 1 1.006 2.69 3.455 3.455 0 0 1 .88 4.05c-.206.45-.506.851-.88 1.176a3.46 3.46 0 0 1-1.006 2.69 3.45 3.45 0 0 1-2.69 1.005 3.455 3.455 0 0 1-4.05.88 3.45 3.45 0 0 1-1.176-.88 3.45 3.45 0 0 1-2.69-1.004 3.45 3.45 0 0 1-1.006-2.69A3.45 3.45 0 0 1 0 7.5a3.45 3.45 0 0 1 1.192-2.613 3.45 3.45 0 0 1 1.005-2.69 3.45 3.45 0 0 1 2.69-1.005"
clipRule="evenodd"
/>
<path
fill="url(#a)"
fillOpacity={0.2}
fillRule="evenodd"
d="M4.887 1.192A3.45 3.45 0 0 1 7.5 0a3.45 3.45 0 0 1 2.613 1.192 3.45 3.45 0 0 1 2.69 1.005 3.46 3.46 0 0 1 1.006 2.69 3.455 3.455 0 0 1 .88 4.05c-.206.45-.506.851-.88 1.176a3.46 3.46 0 0 1-1.006 2.69 3.45 3.45 0 0 1-2.69 1.005 3.455 3.455 0 0 1-4.05.88 3.45 3.45 0 0 1-1.176-.88 3.45 3.45 0 0 1-2.69-1.004 3.45 3.45 0 0 1-1.006-2.69A3.45 3.45 0 0 1 0 7.5a3.45 3.45 0 0 1 1.192-2.613 3.45 3.45 0 0 1 1.005-2.69 3.45 3.45 0 0 1 2.69-1.005"
clipRule="evenodd"
/>
<path
stroke={color}
strokeOpacity={0.24}
strokeWidth={0.6}
d="m4.866 1.49.15.011.098-.113A3.15 3.15 0 0 1 7.5.3a3.15 3.15 0 0 1 2.387 1.088l.098.113.15-.01a3.15 3.15 0 0 1 2.457.918 3.16 3.16 0 0 1 .918 2.457l-.01.15.113.098A3.16 3.16 0 0 1 14.7 7.5a3.15 3.15 0 0 1-1.088 2.386l-.113.099.01.15a3.16 3.16 0 0 1-.918 2.456 3.15 3.15 0 0 1-2.457.918l-.15-.01-.098.113A3.15 3.15 0 0 1 7.5 14.7a3.15 3.15 0 0 1-2.386-1.088l-.099-.114-.15.011a3.15 3.15 0 0 1-2.457-.917 3.15 3.15 0 0 1-.918-2.458l.01-.15-.113-.098A3.15 3.15 0 0 1 .3 7.5a3.15 3.15 0 0 1 1.088-2.387l.113-.098-.01-.15a3.15 3.15 0 0 1 .918-2.456 3.15 3.15 0 0 1 2.457-.918Z"
/>
<path
stroke="#fff"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="m6.964 9.206 2.429 2.429 3.643-5.464"
d="m4.584 7.792 2.333 2.333 3.5-5.25"
/>
<defs>
<linearGradient
id="b"
x1={10}
x2={10}
y1={1.097}
y2={16.709}
id="a"
x1={7.5}
x2={7.5}
y1={0}
y2={15}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#fff" />
<stop offset={1} stopColor="#fff" stopOpacity={0} />
</linearGradient>
<filter
id="a"
width={20}
height={20}
x={0}
y={0}
colorInterpolationFilters="sRGB"
filterUnits="userSpaceOnUse"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={1.054} />
<feGaussianBlur stdDeviation={1.054} />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0" />
<feBlend
in2="BackgroundImageFix"
result="effect1_dropShadow_6386_370"
/>
<feBlend
in="SourceGraphic"
in2="effect1_dropShadow_6386_370"
result="shape"
/>
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={1.054} />
<feGaussianBlur stdDeviation={1.054} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0" />
<feBlend in2="shape" result="effect2_innerShadow_6386_370" />
<feColorMatrix
in="SourceAlpha"
result="hardAlpha"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
/>
<feOffset dy={-1.054} />
<feGaussianBlur stdDeviation={2.635} />
<feComposite in2="hardAlpha" k2={-1} k3={1} operator="arithmetic" />
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0" />
<feBlend
in2="effect2_innerShadow_6386_370"
result="effect3_innerShadow_6386_370"
/>
</filter>
</defs>
</svg>
)