From a8862974a66f69259ebc1dd75df52f2ba8f6f024 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Mon, 6 Oct 2025 14:42:26 +0530 Subject: [PATCH 1/8] chore: empty state component added and propel config updated --- .gitignore | 2 + packages/propel/package.json | 3 +- .../propel/src/empty-state/empty-state.tsx | 46 +++++++++++++++++++ packages/propel/src/empty-state/index.ts | 1 + packages/propel/tsdown.config.ts | 1 + 5 files changed, 52 insertions(+), 1 deletion(-) create mode 100644 packages/propel/src/empty-state/empty-state.tsx create mode 100644 packages/propel/src/empty-state/index.ts diff --git a/.gitignore b/.gitignore index 4baa3495a98..61c7bee8483 100644 --- a/.gitignore +++ b/.gitignore @@ -99,3 +99,5 @@ dev-editor *.rdb.gz storybook-static + +CLAUDE.md \ No newline at end of file diff --git a/packages/propel/package.json b/packages/propel/package.json index 923ac78ab93..5394d872efa 100644 --- a/packages/propel/package.json +++ b/packages/propel/package.json @@ -28,6 +28,7 @@ "./command": "./dist/command/index.js", "./context-menu": "./dist/context-menu/index.js", "./dialog": "./dist/dialog/index.js", + "./empty-state": "./dist/empty-state/index.js", "./emoji-icon-picker": "./dist/emoji-icon-picker/index.js", "./emoji-reaction": "./dist/emoji-reaction/index.js", "./emoji-reaction-picker": "./dist/emoji-reaction-picker/index.js", @@ -80,4 +81,4 @@ "tsdown": "catalog:", "typescript": "catalog:" } -} +} \ No newline at end of file diff --git a/packages/propel/src/empty-state/empty-state.tsx b/packages/propel/src/empty-state/empty-state.tsx new file mode 100644 index 00000000000..1821cdfd751 --- /dev/null +++ b/packages/propel/src/empty-state/empty-state.tsx @@ -0,0 +1,46 @@ +import React from "react"; +import { Button } from "../button/button"; +import { TButtonVariant } from "../button/helper"; + +export interface ActionButton { + label: string; + onClick: () => void; + variant?: "primary" | "secondary"; + disabled?: boolean; +} + +export interface EmptyStateProps { + asset?: React.ReactNode; + title: string; + description?: string; + actions?: ActionButton[]; + className?: string; +} + +export const EmptyState: React.FC = ({ asset, title, description, actions, className = "" }) => ( +
+ {asset &&
{asset}
} + +
+
+

{title}

+ {description &&

{description}

} +
+ + {actions && actions.length > 0 && ( +
+ {actions.map((action, index) => ( + + ))} +
+ )} +
+
+); diff --git a/packages/propel/src/empty-state/index.ts b/packages/propel/src/empty-state/index.ts new file mode 100644 index 00000000000..ce215b7c3b0 --- /dev/null +++ b/packages/propel/src/empty-state/index.ts @@ -0,0 +1 @@ +export * from "./empty-state"; diff --git a/packages/propel/tsdown.config.ts b/packages/propel/tsdown.config.ts index 5ad6a8c1125..0b85c7a88e8 100644 --- a/packages/propel/tsdown.config.ts +++ b/packages/propel/tsdown.config.ts @@ -14,6 +14,7 @@ export default defineConfig({ "src/command/index.ts", "src/context-menu/index.ts", "src/dialog/index.ts", + "src/empty-state/index.ts", "src/emoji-icon-picker/index.ts", "src/emoji-reaction/index.ts", "src/emoji-reaction-picker/index.ts", From ad23b1f6a9a7fd948a6f4eeab7a472a1d3d0f7f3 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Mon, 6 Oct 2025 20:09:37 +0530 Subject: [PATCH 2/8] chore: empty state component updated and stories added --- .../src/empty-state/empty-state.stories.tsx | 101 ++++++++++++++++++ .../propel/src/empty-state/empty-state.tsx | 64 ++++++----- 2 files changed, 141 insertions(+), 24 deletions(-) create mode 100644 packages/propel/src/empty-state/empty-state.stories.tsx diff --git a/packages/propel/src/empty-state/empty-state.stories.tsx b/packages/propel/src/empty-state/empty-state.stories.tsx new file mode 100644 index 00000000000..59050ddd9ca --- /dev/null +++ b/packages/propel/src/empty-state/empty-state.stories.tsx @@ -0,0 +1,101 @@ +import type { Meta, StoryObj } from "@storybook/react-vite"; +import type { EmptyStateProps } from "./empty-state"; +import { EmptyState } from "./empty-state"; +import { HorizontalStackAssetsMap } from "./assets/horizontal-stack/constant"; +import { VerticalStackAssetsMap } from "./assets/vertical-stack/constant"; +import { WorkItemVerticalStackIllustration } from "./assets/vertical-stack"; +import { WorkItemHorizontalStackIllustration } from "./assets/horizontal-stack"; + +const meta: Meta = { + title: "Components/EmptyState", + component: EmptyState, + parameters: { + layout: "centered", + docs: { + description: { + component: + "A flexible empty state component that can display an asset, title, description, and action buttons.", + }, + }, + }, + argTypes: { + title: { + control: "text", + description: "The main title text for the empty state", + }, + description: { + control: "text", + description: "Optional description text that appears below the title", + }, + className: { + control: "text", + description: "Additional CSS classes to apply to the root element", + }, + type: { + control: "select", + options: ["detailed", "simple"], + description: "The layout type of the empty state", + }, + asset: { + control: false, + description: "React node to display as the visual asset (icon, illustration, etc.)", + }, + actions: { + control: false, + description: "Array of action buttons to display", + }, + }, +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + args: { + asset: , + title: "Create an epic and split work into smaller goals", + description: "For larger bodies of work that span several cycles and can live across modules, create an epic.", + actions: [ + { + label: "Create an Epic", + onClick: () => console.log("primary-action-clicked"), + variant: "primary", + }, + ], + }, +}; + +export const Simple: Story = { + args: { + asset: , + title: "There're no progress metrics to show yet.", + description: "For larger bodies of work that span several cycles and can live across modules, create an epic.", + type: "simple", + }, +}; + +export const HorizontalStackAssets: Story = { + render: () => ( +
+ {HorizontalStackAssetsMap.map((item) => ( +
+ {item.asset} +

{item.title}

+
+ ))} +
+ ), +}; + +export const VerticalStackAssets: Story = { + render: () => ( +
+ {VerticalStackAssetsMap.map((item) => ( +
+ {item.asset} +

{item.title}

+
+ ))} +
+ ), +}; diff --git a/packages/propel/src/empty-state/empty-state.tsx b/packages/propel/src/empty-state/empty-state.tsx index 1821cdfd751..e4757d2bcb1 100644 --- a/packages/propel/src/empty-state/empty-state.tsx +++ b/packages/propel/src/empty-state/empty-state.tsx @@ -5,42 +5,58 @@ import { TButtonVariant } from "../button/helper"; export interface ActionButton { label: string; onClick: () => void; - variant?: "primary" | "secondary"; + variant?: TButtonVariant; disabled?: boolean; } +type TEmptyStateType = "detailed" | "simple"; + export interface EmptyStateProps { asset?: React.ReactNode; title: string; description?: string; actions?: ActionButton[]; className?: string; + type?: TEmptyStateType; } -export const EmptyState: React.FC = ({ asset, title, description, actions, className = "" }) => ( -
- {asset &&
{asset}
} +const EmptyStateContent: React.FC<{ + title: string; + description?: string; + actions?: ActionButton[]; +}> = ({ title, description, actions }) => ( +
+
+

{title}

+ {description &&

{description}

} +
-
-
-

{title}

- {description &&

{description}

} + {actions && actions.length > 0 && ( +
+ {actions.map((action, index) => ( + + ))}
- - {actions && actions.length > 0 && ( -
- {actions.map((action, index) => ( - - ))} -
- )} -
+ )}
); + +export const EmptyState: React.FC = ({ + asset, + title, + description, + actions, + className = "", + type = "detailed", +}) => { + const alignmentClass = type === "simple" ? "items-center text-center" : "text-left"; + + return ( +
+ {asset &&
{asset}
} + +
+ ); +}; \ No newline at end of file From 10fef8c72aa2b6b5006181ed3438f86dc20af249 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Mon, 6 Oct 2025 20:12:52 +0530 Subject: [PATCH 3/8] dev: empty state assets added --- .../propel/src/empty-state/assets/helper.tsx | 15 + .../assets/horizontal-stack/constant.tsx | 100 +++++ .../assets/horizontal-stack/customer.tsx | 64 +++ .../assets/horizontal-stack/epic.tsx | 62 +++ .../assets/horizontal-stack/estimate.tsx | 64 +++ .../assets/horizontal-stack/export.tsx | 70 ++++ .../assets/horizontal-stack/index.ts | 19 + .../assets/horizontal-stack/intake.tsx | 82 ++++ .../assets/horizontal-stack/label.tsx | 68 ++++ .../assets/horizontal-stack/link.tsx | 76 ++++ .../assets/horizontal-stack/members.tsx | 82 ++++ .../assets/horizontal-stack/note.tsx | 62 +++ .../assets/horizontal-stack/priority.tsx | 74 ++++ .../assets/horizontal-stack/settings.tsx | 66 ++++ .../assets/horizontal-stack/state.tsx | 62 +++ .../assets/horizontal-stack/template.tsx | 76 ++++ .../assets/horizontal-stack/token.tsx | 70 ++++ .../assets/horizontal-stack/unknown.tsx | 77 ++++ .../assets/horizontal-stack/update.tsx | 68 ++++ .../assets/horizontal-stack/webhook.tsx | 62 +++ .../assets/horizontal-stack/work-item.tsx | 76 ++++ .../assets/horizontal-stack/worklog.tsx | 70 ++++ .../propel/src/empty-state/assets/index.ts | 3 + .../assets/vertical-stack/404-error.tsx | 285 +++++++++++++ .../assets/vertical-stack/archived-cycle.tsx | 356 +++++++++++++++++ .../assets/vertical-stack/archived-module.tsx | 293 ++++++++++++++ .../vertical-stack/archived-work-item.tsx | 328 +++++++++++++++ .../assets/vertical-stack/constant.tsx | 95 +++++ .../assets/vertical-stack/customer.tsx | 373 ++++++++++++++++++ .../assets/vertical-stack/cycle.tsx | 242 ++++++++++++ .../assets/vertical-stack/dashboard.tsx | 317 +++++++++++++++ .../assets/vertical-stack/draft.tsx | 265 +++++++++++++ .../assets/vertical-stack/epic.tsx | 223 +++++++++++ .../assets/vertical-stack/index.ts | 19 + .../assets/vertical-stack/initiative.tsx | 247 ++++++++++++ .../assets/vertical-stack/invalid-link.tsx | 177 +++++++++ .../assets/vertical-stack/module.tsx | 373 ++++++++++++++++++ .../assets/vertical-stack/no-access.tsx | 163 ++++++++ .../assets/vertical-stack/page.tsx | 256 ++++++++++++ .../assets/vertical-stack/project.tsx | 247 ++++++++++++ .../assets/vertical-stack/server-error.tsx | 329 +++++++++++++++ .../assets/vertical-stack/teamspace.tsx | 351 ++++++++++++++++ .../assets/vertical-stack/view.tsx | 317 +++++++++++++++ .../assets/vertical-stack/work-item.tsx | 245 ++++++++++++ 44 files changed, 6969 insertions(+) create mode 100644 packages/propel/src/empty-state/assets/helper.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/constant.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/export.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/index.ts create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/label.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/link.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/members.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/note.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/state.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/template.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/token.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/update.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx create mode 100644 packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx create mode 100644 packages/propel/src/empty-state/assets/index.ts create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/constant.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/customer.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/draft.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/epic.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/index.ts create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/module.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/page.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/project.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/view.tsx create mode 100644 packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx diff --git a/packages/propel/src/empty-state/assets/helper.tsx b/packages/propel/src/empty-state/assets/helper.tsx new file mode 100644 index 00000000000..edd3fa4c08c --- /dev/null +++ b/packages/propel/src/empty-state/assets/helper.tsx @@ -0,0 +1,15 @@ +export const ILLUSTRATION_COLOR_TOKEN_MAP = { + fill: { + primary: "rgba(var(--color-background-100))", // white or #fff, + secondary: "rgba(var(--color-background-90))", // #F4F5F5 + tertiary: "rgba(var(--color-background-80))", // #E5E7E8 + }, + stroke: { + primary: "rgba(var(--color-text-200))", // #1D1F20 + secondary: "rgba(var(--color-border-400))", // #7A8185 or #CFD2D3 + }, +}; + +export type TIllustrationAssetProps = { + className?: string; +} \ No newline at end of file diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/constant.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/constant.tsx new file mode 100644 index 00000000000..ebaa89b450c --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/constant.tsx @@ -0,0 +1,100 @@ +import { + CustomerHorizontalStackIllustration, + EpicHorizontalStackIllustration, + EstimateHorizontalStackIllustration, + ExportHorizontalStackIllustration, + IntakeHorizontalStackIllustration, + LabelHorizontalStackIllustration, + LinkHorizontalStackIllustration, + MembersHorizontalStackIllustration, + NoteHorizontalStackIllustration, + PriorityHorizontalStackIllustration, + SettingsHorizontalStackIllustration, + StateHorizontalStackIllustration, + TemplateHorizontalStackIllustration, + TokenHorizontalStackIllustration, + UnknownHorizontalStackIllustration, + UpdateHorizontalStackIllustration, + WebhookHorizontalStackIllustration, + WorkItemHorizontalStackIllustration, + WorklogHorizontalStackIllustration, +} from "./"; + +export const HorizontalStackAssetsMap = [ + { + asset: , + title: "Customer", + }, + { + asset: , + title: "Epic", + }, + { + asset: , + title: "Estimate", + }, + { + asset: , + title: "Export", + }, + { + asset: , + title: "Intake", + }, + { + asset: , + title: "Label", + }, + { + asset: , + title: "Link", + }, + { + asset: , + title: "Members", + }, + { + asset: , + title: "Note", + }, + { + asset: , + title: "Priority", + }, + { + asset: , + title: "Settings", + }, + { + asset: , + title: "State", + }, + { + asset: , + title: "Template", + }, + { + asset: , + title: "Token", + }, + { + asset: , + title: "Unknown", + }, + { + asset: , + title: "Update", + }, + { + asset: , + title: "Webhook", + }, + { + asset: , + title: "WorkItem", + }, + { + asset: , + title: "Worklog", + }, +]; diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx new file mode 100644 index 00000000000..263da01019e --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx @@ -0,0 +1,64 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const CustomerHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx new file mode 100644 index 00000000000..71152d45520 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx @@ -0,0 +1,62 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const EpicHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx new file mode 100644 index 00000000000..48a01626aae --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/estimate.tsx @@ -0,0 +1,64 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const EstimateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx new file mode 100644 index 00000000000..10c685aa8e7 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx @@ -0,0 +1,70 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ExportHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/index.ts b/packages/propel/src/empty-state/assets/horizontal-stack/index.ts new file mode 100644 index 00000000000..cdea0327cc7 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/index.ts @@ -0,0 +1,19 @@ +export * from "./customer"; +export * from "./epic"; +export * from "./estimate"; +export * from "./export"; +export * from "./intake"; +export * from "./label"; +export * from "./link"; +export * from "./members"; +export * from "./note"; +export * from "./priority"; +export * from "./settings"; +export * from "./state"; +export * from "./template"; +export * from "./token"; +export * from "./unknown"; +export * from "./update"; +export * from "./webhook"; +export * from "./work-item"; +export * from "./worklog"; \ No newline at end of file diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx new file mode 100644 index 00000000000..995a9b16f3d --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx @@ -0,0 +1,82 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const IntakeHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx new file mode 100644 index 00000000000..b8b5e931ba2 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx @@ -0,0 +1,68 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const LabelHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx new file mode 100644 index 00000000000..8105f60aa8f --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx @@ -0,0 +1,76 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const LinkHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx new file mode 100644 index 00000000000..831215c0de2 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx @@ -0,0 +1,82 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const MembersHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx new file mode 100644 index 00000000000..b37b5172798 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx @@ -0,0 +1,62 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const NoteHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx new file mode 100644 index 00000000000..0b8bbe12e45 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/priority.tsx @@ -0,0 +1,74 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const PriorityHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx new file mode 100644 index 00000000000..f834a2b252c --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/settings.tsx @@ -0,0 +1,66 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const SettingsHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/state.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/state.tsx new file mode 100644 index 00000000000..da56839e9f5 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/state.tsx @@ -0,0 +1,62 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const StateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/template.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/template.tsx new file mode 100644 index 00000000000..54a4be32b75 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/template.tsx @@ -0,0 +1,76 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const TemplateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx new file mode 100644 index 00000000000..fc04b3489d3 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx @@ -0,0 +1,70 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const TokenHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx new file mode 100644 index 00000000000..8b87898143c --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/unknown.tsx @@ -0,0 +1,77 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const UnknownHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/update.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/update.tsx new file mode 100644 index 00000000000..cf03e10cc02 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/update.tsx @@ -0,0 +1,68 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const UpdateHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx new file mode 100644 index 00000000000..de29e0584bf --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx @@ -0,0 +1,62 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const WebhookHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx new file mode 100644 index 00000000000..09bdabf1c94 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/work-item.tsx @@ -0,0 +1,76 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const WorkItemHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx new file mode 100644 index 00000000000..bf97e593049 --- /dev/null +++ b/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx @@ -0,0 +1,70 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const WorklogHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/index.ts b/packages/propel/src/empty-state/assets/index.ts new file mode 100644 index 00000000000..3791a83f5f0 --- /dev/null +++ b/packages/propel/src/empty-state/assets/index.ts @@ -0,0 +1,3 @@ +export * from "./horizontal-stack"; +export * from "./vertical-stack"; +export * from "./helper"; diff --git a/packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx b/packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx new file mode 100644 index 00000000000..de498876d17 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/404-error.tsx @@ -0,0 +1,285 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const Error404VerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx b/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx new file mode 100644 index 00000000000..448d294bad6 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx @@ -0,0 +1,356 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx b/packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx new file mode 100644 index 00000000000..32929d1527d --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/archived-module.tsx @@ -0,0 +1,293 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ArchivedModuleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx b/packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx new file mode 100644 index 00000000000..7ce0211152a --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/archived-work-item.tsx @@ -0,0 +1,328 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ArchivedWorkItemVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/constant.tsx b/packages/propel/src/empty-state/assets/vertical-stack/constant.tsx new file mode 100644 index 00000000000..2756a436a3f --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/constant.tsx @@ -0,0 +1,95 @@ +import { + ArchivedCycleVerticalStackIllustration, + ArchivedModuleVerticalStackIllustration, + ArchivedWorkItemVerticalStackIllustration, + CustomerVerticalStackIllustration, + CycleVerticalStackIllustration, + DashboardVerticalStackIllustration, + DraftVerticalStackIllustration, + EpicVerticalStackIllustration, + Error404VerticalStackIllustration, + InvalidLinkVerticalStackIllustration, + ModuleVerticalStackIllustration, + NoAccessVerticalStackIllustration, + PageVerticalStackIllustration, + ProjectVerticalStackIllustration, + ServerErrorVerticalStackIllustration, + TeamspaceVerticalStackIllustration, + ViewVerticalStackIllustration, + WorkItemVerticalStackIllustration, +} from "."; + +export const VerticalStackAssetsMap = [ + { + asset: , + title: "ArchivedCycleVerticalStackIllustration", + }, + { + asset: , + title: "ArchivedModuleVerticalStackIllustration", + }, + { + asset: , + title: "ArchivedWorkItemVerticalStackIllustration", + }, + { + asset: , + title: "CustomerVerticalStackIllustration", + }, + { + asset: , + title: "CycleVerticalStackIllustration", + }, + { + asset: , + title: "DashboardVerticalStackIllustration", + }, + { + asset: , + title: "DraftVerticalStackIllustration", + }, + { + asset: , + title: "EpicVerticalStackIllustration", + }, + { + asset: , + title: "Error404VerticalStackIllustration", + }, + { + asset: , + title: "InvalidLinkVerticalStackIllustration", + }, + { + asset: , + title: "ModuleVerticalStackIllustration", + }, + { + asset: , + title: "NoAccessVerticalStackIllustration", + }, + { + asset: , + title: "PageVerticalStackIllustration", + }, + { + asset: , + title: "ProjectVerticalStackIllustration", + }, + { + asset: , + title: "ServerErrorVerticalStackIllustration", + }, + { + asset: , + title: "TeamspaceVerticalStackIllustration", + }, + { + asset: , + title: "ViewVerticalStackIllustration", + }, + { + asset: , + title: "WorkItemVerticalStackIllustration", + }, +]; diff --git a/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx b/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx new file mode 100644 index 00000000000..450781894a7 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx @@ -0,0 +1,373 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const CustomerVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx b/packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx new file mode 100644 index 00000000000..cf0a6e988e2 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/cycle.tsx @@ -0,0 +1,242 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const CycleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx b/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx new file mode 100644 index 00000000000..583a7fabcca --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx @@ -0,0 +1,317 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const DashboardVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/draft.tsx b/packages/propel/src/empty-state/assets/vertical-stack/draft.tsx new file mode 100644 index 00000000000..367f8149222 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/draft.tsx @@ -0,0 +1,265 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const DraftVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx b/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx new file mode 100644 index 00000000000..1827916f2bc --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx @@ -0,0 +1,223 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const EpicVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/index.ts b/packages/propel/src/empty-state/assets/vertical-stack/index.ts new file mode 100644 index 00000000000..7ee4ef61375 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/index.ts @@ -0,0 +1,19 @@ +export * from "./404-error"; +export * from "./archived-cycle"; +export * from "./archived-module"; +export * from "./archived-work-item"; +export * from "./customer"; +export * from "./cycle"; +export * from "./dashboard"; +export * from "./draft"; +export * from "./epic"; +export * from "./initiative"; +export * from "./invalid-link"; +export * from "./module"; +export * from "./no-access"; +export * from "./page"; +export * from "./project"; +export * from "./server-error"; +export * from "./teamspace"; +export * from "./view"; +export * from "./work-item"; \ No newline at end of file diff --git a/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx b/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx new file mode 100644 index 00000000000..c1aa1acd741 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx @@ -0,0 +1,247 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const InitiativeVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx b/packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx new file mode 100644 index 00000000000..5306f403fec --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/invalid-link.tsx @@ -0,0 +1,177 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const InvalidLinkVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/module.tsx b/packages/propel/src/empty-state/assets/vertical-stack/module.tsx new file mode 100644 index 00000000000..e581cc0e3ee --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/module.tsx @@ -0,0 +1,373 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ModuleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx b/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx new file mode 100644 index 00000000000..cb0f02e6569 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx @@ -0,0 +1,163 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const NoAccessVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/page.tsx b/packages/propel/src/empty-state/assets/vertical-stack/page.tsx new file mode 100644 index 00000000000..59d09a210f3 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/page.tsx @@ -0,0 +1,256 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const PageVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/project.tsx b/packages/propel/src/empty-state/assets/vertical-stack/project.tsx new file mode 100644 index 00000000000..974992104a1 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/project.tsx @@ -0,0 +1,247 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ProjectVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx b/packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx new file mode 100644 index 00000000000..b80e87e3ece --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/server-error.tsx @@ -0,0 +1,329 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ServerErrorVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx b/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx new file mode 100644 index 00000000000..3d2a387c3ea --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx @@ -0,0 +1,351 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/view.tsx b/packages/propel/src/empty-state/assets/vertical-stack/view.tsx new file mode 100644 index 00000000000..e6376a754ca --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/view.tsx @@ -0,0 +1,317 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx b/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx new file mode 100644 index 00000000000..41eb1fef921 --- /dev/null +++ b/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx @@ -0,0 +1,245 @@ +import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; + +export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); From ee6870391b091ca351660267e62b69f061886a8d Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Mon, 6 Oct 2025 20:33:03 +0530 Subject: [PATCH 4/8] chore: code refactor --- packages/propel/package.json | 2 +- .../propel/src/empty-state/assets/helper.tsx | 22 +++++++++---------- .../assets/horizontal-stack/index.ts | 2 +- .../assets/vertical-stack/index.ts | 2 +- .../src/empty-state/empty-state.stories.tsx | 8 +++---- 5 files changed, 18 insertions(+), 18 deletions(-) diff --git a/packages/propel/package.json b/packages/propel/package.json index 5394d872efa..1d6ef26bf1e 100644 --- a/packages/propel/package.json +++ b/packages/propel/package.json @@ -81,4 +81,4 @@ "tsdown": "catalog:", "typescript": "catalog:" } -} \ No newline at end of file +} diff --git a/packages/propel/src/empty-state/assets/helper.tsx b/packages/propel/src/empty-state/assets/helper.tsx index edd3fa4c08c..0ef1a11148f 100644 --- a/packages/propel/src/empty-state/assets/helper.tsx +++ b/packages/propel/src/empty-state/assets/helper.tsx @@ -1,15 +1,15 @@ export const ILLUSTRATION_COLOR_TOKEN_MAP = { - fill: { - primary: "rgba(var(--color-background-100))", // white or #fff, - secondary: "rgba(var(--color-background-90))", // #F4F5F5 - tertiary: "rgba(var(--color-background-80))", // #E5E7E8 - }, - stroke: { - primary: "rgba(var(--color-text-200))", // #1D1F20 - secondary: "rgba(var(--color-border-400))", // #7A8185 or #CFD2D3 - }, + fill: { + primary: "rgba(var(--color-background-100))", // white or #fff, + secondary: "rgba(var(--color-background-90))", // #F4F5F5 + tertiary: "rgba(var(--color-background-80))", // #E5E7E8 + }, + stroke: { + primary: "rgba(var(--color-text-200))", // #1D1F20 + secondary: "rgba(var(--color-border-400))", // #7A8185 or #CFD2D3 + }, }; export type TIllustrationAssetProps = { - className?: string; -} \ No newline at end of file + className?: string; +}; diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/index.ts b/packages/propel/src/empty-state/assets/horizontal-stack/index.ts index cdea0327cc7..049eb54385f 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/index.ts +++ b/packages/propel/src/empty-state/assets/horizontal-stack/index.ts @@ -16,4 +16,4 @@ export * from "./unknown"; export * from "./update"; export * from "./webhook"; export * from "./work-item"; -export * from "./worklog"; \ No newline at end of file +export * from "./worklog"; diff --git a/packages/propel/src/empty-state/assets/vertical-stack/index.ts b/packages/propel/src/empty-state/assets/vertical-stack/index.ts index 7ee4ef61375..70fc2f29661 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/index.ts +++ b/packages/propel/src/empty-state/assets/vertical-stack/index.ts @@ -16,4 +16,4 @@ export * from "./project"; export * from "./server-error"; export * from "./teamspace"; export * from "./view"; -export * from "./work-item"; \ No newline at end of file +export * from "./work-item"; diff --git a/packages/propel/src/empty-state/empty-state.stories.tsx b/packages/propel/src/empty-state/empty-state.stories.tsx index 59050ddd9ca..bb1ea67ddbe 100644 --- a/packages/propel/src/empty-state/empty-state.stories.tsx +++ b/packages/propel/src/empty-state/empty-state.stories.tsx @@ -1,10 +1,10 @@ import type { Meta, StoryObj } from "@storybook/react-vite"; -import type { EmptyStateProps } from "./empty-state"; -import { EmptyState } from "./empty-state"; +import { WorkItemHorizontalStackIllustration } from "./assets/horizontal-stack"; import { HorizontalStackAssetsMap } from "./assets/horizontal-stack/constant"; -import { VerticalStackAssetsMap } from "./assets/vertical-stack/constant"; import { WorkItemVerticalStackIllustration } from "./assets/vertical-stack"; -import { WorkItemHorizontalStackIllustration } from "./assets/horizontal-stack"; +import { VerticalStackAssetsMap } from "./assets/vertical-stack/constant"; +import type { EmptyStateProps } from "./empty-state"; +import { EmptyState } from "./empty-state"; const meta: Meta = { title: "Components/EmptyState", From 43f77ed8d9cdf76868be518f193a0d9a9c6d0846 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Tue, 7 Oct 2025 14:07:05 +0530 Subject: [PATCH 5/8] chore: code refactor --- .gitignore | 2 +- .../assets/horizontal-stack/customer.tsx | 42 +-- .../assets/horizontal-stack/epic.tsx | 38 +-- .../assets/horizontal-stack/estimate.tsx | 42 +-- .../assets/horizontal-stack/export.tsx | 44 +-- .../assets/horizontal-stack/intake.tsx | 54 ++-- .../assets/horizontal-stack/label.tsx | 42 +-- .../assets/horizontal-stack/link.tsx | 50 ++-- .../assets/horizontal-stack/members.tsx | 54 ++-- .../assets/horizontal-stack/note.tsx | 38 +-- .../assets/horizontal-stack/priority.tsx | 38 +-- .../assets/horizontal-stack/settings.tsx | 38 +-- .../assets/horizontal-stack/state.tsx | 38 +-- .../assets/horizontal-stack/template.tsx | 50 ++-- .../assets/horizontal-stack/token.tsx | 38 +-- .../assets/horizontal-stack/unknown.tsx | 38 +-- .../assets/horizontal-stack/update.tsx | 42 +-- .../assets/horizontal-stack/webhook.tsx | 38 +-- .../assets/horizontal-stack/work-item.tsx | 50 ++-- .../assets/horizontal-stack/worklog.tsx | 38 +-- .../assets/vertical-stack/404-error.tsx | 192 ++++++------- .../assets/vertical-stack/archived-cycle.tsx | 208 +++++++------- .../assets/vertical-stack/archived-module.tsx | 208 +++++++------- .../vertical-stack/archived-work-item.tsx | 204 ++++++------- .../assets/vertical-stack/customer.tsx | 272 +++++++++--------- .../assets/vertical-stack/cycle.tsx | 158 +++++----- .../assets/vertical-stack/dashboard.tsx | 178 ++++++------ .../assets/vertical-stack/draft.tsx | 180 ++++++------ .../assets/vertical-stack/epic.tsx | 150 +++++----- .../assets/vertical-stack/initiative.tsx | 172 +++++------ .../assets/vertical-stack/invalid-link.tsx | 98 +++---- .../assets/vertical-stack/module.tsx | 202 ++++++------- .../assets/vertical-stack/no-access.tsx | 112 ++++---- .../assets/vertical-stack/page.tsx | 172 +++++------ .../assets/vertical-stack/project.tsx | 162 +++++------ .../assets/vertical-stack/server-error.tsx | 116 ++++---- .../assets/vertical-stack/teamspace.tsx | 246 ++++++++-------- .../assets/vertical-stack/view.tsx | 172 +++++------ .../assets/vertical-stack/work-item.tsx | 168 +++++------ .../src/empty-state/empty-state.stories.tsx | 3 +- .../propel/src/icons/brand/zerodha-logo.tsx | 4 +- 41 files changed, 2095 insertions(+), 2096 deletions(-) diff --git a/.gitignore b/.gitignore index 61c7bee8483..7ebfe7e99f8 100644 --- a/.gitignore +++ b/.gitignore @@ -100,4 +100,4 @@ dev-editor storybook-static -CLAUDE.md \ No newline at end of file +CLAUDE.md diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx index 263da01019e..a2d06a97050 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/customer.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const CustomerHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const CustomerHorizontalStackIllustration = ({ className }: TIllustration d="M47.8782 2.57309C46.9628 2.10751 45.787 2.14718 44.5087 2.79426L9.267 20.7542C6.37097 22.2299 4.0195 26.2861 4.0195 29.8055V72.6934C4.0195 74.6583 4.74547 76.0394 5.88968 76.6313L2.37019 74.84C1.22598 74.256 0.5 72.867 0.5 70.9021V28.0142C0.5 24.4869 2.85157 20.4386 5.7476 18.9629L40.9893 1.00296C42.2755 0.347996 43.4513 0.316215 44.3588 0.781791L47.8782 2.57309Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,38 +25,38 @@ export const CustomerHorizontalStackIllustration = ({ className }: TIllustration d="M63.2578 9.36801C62.3425 8.90244 61.1667 8.94211 59.8883 9.58918L24.6466 27.5492C21.7506 29.0248 19.3991 33.081 19.3991 36.6004V79.4887C19.3991 81.4536 20.1251 82.8344 21.2693 83.4262L17.7498 81.6349C16.6056 81.0509 15.8796 79.6623 15.8796 77.6974V34.8091C15.8796 31.2818 18.2312 27.2335 21.1272 25.7579L56.3689 7.79788C57.6552 7.14292 58.8309 7.11114 59.7384 7.57671L63.2578 9.36801Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx index 71152d45520..bd4a3dc3d4c 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/epic.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const EpicHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const EpicHorizontalStackIllustration = ({ className }: TIllustrationAsse d="M47.8729 3.07316C46.9576 2.60763 45.782 2.6473 44.5038 3.2943L9.26602 21.2523C6.37031 22.7277 4.01901 26.7835 4.01901 30.3025V73.1855C4.01901 75.1502 4.7449 76.5312 5.88899 77.1229L2.36998 75.3318C1.2259 74.748 0.5 73.3595 0.5 71.3948V28.5114C0.5 24.9845 2.8513 20.9366 5.74701 19.4612L40.9848 1.5032C42.2709 0.848314 43.4464 0.816538 44.3538 1.28206L47.8729 3.07316Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const EpicHorizontalStackIllustration = ({ className }: TIllustrationAsse d="M63.2511 9.86669C62.3358 9.40117 61.1602 9.44084 59.8819 10.0878L24.6442 28.0458C21.7485 29.5213 19.3972 33.577 19.3972 37.096V79.9795C19.3972 81.9441 20.1231 83.3247 21.2672 83.9165L17.7482 82.1254C16.6041 81.5415 15.8782 80.153 15.8782 78.1884V35.3049C15.8782 31.778 18.2295 27.7302 21.1252 26.2547L56.3629 8.29674C57.649 7.64185 58.8246 7.61046 59.732 8.07598L63.2511 9.86669Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -7,17 +7,17 @@ export const EstimateHorizontalStackIllustration = ({ className }: TIllustration d="M47.8734 3.07267C46.9581 2.60715 45.7825 2.6466 44.5042 3.2936L9.26616 21.2519C6.37042 22.7274 4.01909 26.783 4.01909 30.3021V73.1858C4.01909 75.1505 4.745 76.5313 5.88909 77.1231L2.37005 75.332C1.22595 74.7481 0.5 73.3594 0.5 71.3948V28.511C0.5 24.984 2.85133 20.9363 5.74707 19.4608L40.9851 1.5025C42.2713 0.847607 43.4469 0.816046 44.3543 1.28157L47.8734 3.07267Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,38 +25,38 @@ export const EstimateHorizontalStackIllustration = ({ className }: TIllustration d="M63.2514 9.86595C62.3361 9.40042 61.1605 9.43987 59.8822 10.0869L24.6442 28.0452C21.7484 29.5207 19.3971 33.5763 19.3971 37.0954V79.9791C19.3971 81.9438 20.123 83.3246 21.2671 83.9164L17.748 82.1253C16.604 81.5414 15.8781 80.1527 15.8781 78.188V35.3043C15.8781 31.7773 18.2293 27.7296 21.1251 26.2541L56.3632 8.29578C57.6493 7.64088 58.8249 7.60932 59.7323 8.07485L63.2514 9.86595Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx index 10c685aa8e7..0dd13f22895 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/export.tsx @@ -7,17 +7,17 @@ export const ExportHorizontalStackIllustration = ({ className }: TIllustrationAs d="M41.9519 2.94243C41.151 2.53509 40.1223 2.5698 39.0038 3.13593L8.17037 18.8494C5.63659 20.1404 3.57921 23.6892 3.57921 26.7684V64.2916C3.57921 66.0107 4.21438 67.2191 5.21547 67.7369L2.13625 66.1696C1.13517 65.6587 0.5 64.4435 0.5 62.7244V25.2012C0.5 22.1151 2.55742 18.5732 5.0912 17.2821L35.9246 1.5687C37.05 0.995669 38.0787 0.967864 38.8726 1.3752L41.9519 2.94243Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,44 +25,44 @@ export const ExportHorizontalStackIllustration = ({ className }: TIllustrationAs d="M55.4078 8.88579C54.6069 8.47845 53.5782 8.51316 52.4597 9.07929L21.6263 24.7927C19.0926 26.0838 17.0351 29.6326 17.0351 32.7118V70.2353C17.0351 71.9544 17.6703 73.1624 18.6714 73.6802L15.5922 72.113C14.5911 71.6021 13.9559 70.3872 13.9559 68.6681V31.1446C13.9559 28.0585 16.0134 24.5165 18.5471 23.2255L49.3805 7.51206C50.5059 6.93903 51.5346 6.91122 52.3286 7.31856L55.4078 8.88579Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx index 995a9b16f3d..dc556b71303 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/intake.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const IntakeHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const IntakeHorizontalStackIllustration = ({ className }: TIllustrationAs d="M41.9519 2.42126C41.151 2.01392 40.1223 2.04846 39.0038 2.61459L8.1704 18.3282C5.63661 19.6192 3.57922 23.1679 3.57922 26.2471V63.7706C3.57922 65.4897 4.21438 66.6979 5.21547 67.2157L2.13625 65.6485C1.13517 65.1376 0.5 63.9225 0.5 62.2034V24.6799C0.5 21.5938 2.55742 18.052 5.0912 16.761L35.9246 1.04736C37.05 0.47433 38.0787 0.446693 38.8727 0.854032L41.9519 2.42126Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,56 +25,56 @@ export const IntakeHorizontalStackIllustration = ({ className }: TIllustrationAs d="M55.4078 8.39993C54.607 7.99259 53.5783 8.02713 52.4598 8.59326L21.6264 24.3069C19.0926 25.5979 17.0352 29.1466 17.0352 32.2258V69.7493C17.0352 71.4684 17.6704 72.6766 18.6714 73.1944L15.5923 71.6272C14.5912 71.1163 13.956 69.9012 13.956 68.1821V30.6585C13.956 27.5724 16.0134 24.0307 18.5472 22.7396L49.3806 7.02603C50.506 6.453 51.5347 6.42536 52.3286 6.8327L55.4078 8.39993Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx index b8b5e931ba2..8041aca6f8d 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/label.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const LabelHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const LabelHorizontalStackIllustration = ({ className }: TIllustrationAss d="M47.8737 2.47584C46.9585 2.00383 45.7828 2.04383 44.5045 2.69984L9.2662 20.9079C6.37044 22.4039 4.01909 26.5159 4.01909 30.0839V73.5641C4.01909 75.5561 4.745 76.9561 5.88911 77.5561L2.37001 75.7401C1.22591 75.1481 0.5 73.7401 0.5 71.7481V28.2679C0.5 24.6919 2.85132 20.5879 5.74708 19.0919L40.9854 0.883826C42.2716 0.219824 43.4472 0.187824 44.3546 0.659826L47.8737 2.47584Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,38 +25,38 @@ export const LabelHorizontalStackIllustration = ({ className }: TIllustrationAss d="M63.2522 9.36414C62.337 8.89214 61.1613 8.93214 59.883 9.58814L24.6447 27.7962C21.749 29.2922 19.3976 33.4042 19.3976 36.9722V80.4524C19.3976 82.4444 20.1235 83.8444 21.2676 84.4444L17.7485 82.6284C16.6044 82.0364 15.8785 80.6284 15.8785 78.6364V35.1562C15.8785 31.5802 18.2299 27.4762 21.1256 25.9802L56.364 7.77213C57.6501 7.10813 58.8257 7.07613 59.7331 7.54813L63.2522 9.36414Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx index 8105f60aa8f..bf1033c52a2 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/link.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const LinkHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const LinkHorizontalStackIllustration = ({ className }: TIllustrationAsse d="M30.6725 2.33465C30.0925 2.03965 29.3475 2.06465 28.5375 2.47465L6.20747 13.8546C4.37247 14.7896 2.88247 17.3596 2.88247 19.5896V46.7646C2.88247 48.0096 3.34246 48.8846 4.06746 49.2596L1.83746 48.1246C1.11246 47.7547 0.652466 46.8746 0.652466 45.6296V18.4546C0.652466 16.2196 2.14246 13.6546 3.97746 12.7196L26.3075 1.33964C27.1225 0.924644 27.8675 0.904645 28.4425 1.19964L30.6725 2.33465Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,50 +25,50 @@ export const LinkHorizontalStackIllustration = ({ className }: TIllustrationAsse d="M40.4175 6.66967C39.8375 6.37467 39.0925 6.39967 38.2825 6.80967L15.9525 18.1897C14.1175 19.1247 12.6275 21.6947 12.6275 23.9247V51.0997C12.6275 52.3447 13.0875 53.2197 13.8125 53.5947L11.5825 52.4597C10.8575 52.0897 10.3975 51.2097 10.3975 49.9647V22.7897C10.3975 20.5547 11.8875 17.9897 13.7225 17.0547L36.0525 5.67467C36.8675 5.25967 37.6125 5.23967 38.1875 5.53467L40.4175 6.66967Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx index 831215c0de2..88463176ad2 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/members.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const MembersHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const MembersHorizontalStackIllustration = ({ className }: TIllustrationA d="M41.9518 2.84283C41.151 2.43551 40.1223 2.47003 39.0038 3.03614L8.17039 18.7493C5.6366 20.0403 3.5792 23.5889 3.5792 26.668V64.1904C3.5792 65.9094 4.21437 67.1176 5.21546 67.6354L2.13626 66.0682C1.13517 65.5573 0.5 64.3423 0.5 62.6232V25.1008C0.5 22.0148 2.5574 18.4731 5.09119 17.1821L35.9246 1.46898C37.05 0.895957 38.0787 0.868332 38.8726 1.27566L41.9518 2.84283Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.3" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.3" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,56 +25,56 @@ export const MembersHorizontalStackIllustration = ({ className }: TIllustrationA d="M55.4077 8.82148C54.6068 8.41415 53.5781 8.44867 52.4596 9.01478L21.6262 24.7279C19.0924 26.0189 17.035 29.5675 17.035 32.6466V70.169C17.035 71.8881 17.6702 73.0962 18.6713 73.614L15.5921 72.0468C14.591 71.536 13.9558 70.3209 13.9558 68.6018V31.0795C13.9558 27.9934 16.0132 24.4518 18.547 23.1608L49.3804 7.44761C50.5058 6.87459 51.5345 6.84697 52.3284 7.2543L55.4077 8.82148Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.3" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.3" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx index b37b5172798..a312439bd19 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/note.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const NoteHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const NoteHorizontalStackIllustration = ({ className }: TIllustrationAsse d="M30.6721 2.43395C30.0921 2.13895 29.3471 2.16395 28.5371 2.57395L6.20711 13.9539C4.37211 14.8889 2.8821 17.4589 2.8821 19.6889V46.864C2.8821 48.109 3.34211 48.9839 4.06711 49.3589L1.8371 48.224C1.1121 47.854 0.6521 46.9739 0.6521 45.7289V18.5539C0.6521 16.3189 2.1421 13.7539 3.9771 12.8189L26.3071 1.43895C27.1221 1.02395 27.8671 1.00395 28.4421 1.29895L30.6721 2.43395Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const NoteHorizontalStackIllustration = ({ className }: TIllustrationAsse d="M40.4171 6.76894C39.8371 6.47394 39.0921 6.49894 38.2821 6.90894L15.9521 18.2889C14.1171 19.2239 12.6271 21.7939 12.6271 24.0239V51.1989C12.6271 52.4439 13.0871 53.3189 13.8121 53.6939L11.5821 52.5589C10.8571 52.1889 10.3971 51.3089 10.3971 50.0639V22.8889C10.3971 20.6539 11.8871 18.0889 13.7221 17.1539L36.0521 5.77394C36.8671 5.35894 37.6121 5.33894 38.1871 5.63394L40.4171 6.76894Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -7,17 +7,17 @@ export const PriorityHorizontalStackIllustration = ({ className }: TIllustration d="M42.4518 2.93859C41.651 2.53126 40.6222 2.5658 39.5038 3.13193L8.67038 18.8454C6.1366 20.1365 4.0792 23.6852 4.0792 26.7644V64.2878C4.0792 66.0069 4.71437 67.2151 5.71546 67.7329L2.63626 66.1657C1.63517 65.6548 1 64.4397 1 62.7206V25.1972C1 22.1111 3.0574 18.5693 5.59118 17.2783L36.4246 1.5647C37.5499 0.991664 38.5787 0.964028 39.3726 1.37137L42.4518 2.93859Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const PriorityHorizontalStackIllustration = ({ className }: TIllustration d="M55.9078 8.88293C55.1069 8.47559 54.0782 8.51013 52.9598 9.07626L22.1264 24.7899C19.5926 26.0809 17.5352 29.6296 17.5352 32.7088V70.2322C17.5352 71.9513 18.1704 73.1595 19.1715 73.6773L16.0923 72.11C15.0912 71.5991 14.456 70.384 14.456 68.6649V31.1415C14.456 28.0554 16.5134 24.5137 19.0472 23.2226L49.8806 7.50903C51.006 6.936 52.0347 6.90836 52.8286 7.3157L55.9078 8.88293Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -7,17 +7,17 @@ export const SettingsHorizontalStackIllustration = ({ className }: TIllustration d="M41.9517 2.43803C41.1509 2.0307 40.1222 2.0654 39.0037 2.63153L8.17035 18.3449C5.63658 19.636 3.57916 23.1848 3.57916 26.264V63.787C3.57916 65.5061 4.21433 66.7145 5.21541 67.2323L2.13625 65.6651C1.13517 65.1542 0.5 63.9393 0.5 62.2202V24.6967C0.5 21.6107 2.55741 18.0687 5.09119 16.7777L35.9246 1.06431C37.0499 0.491274 38.0785 0.46347 38.8725 0.870807L41.9517 2.43803Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.35" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.35" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const SettingsHorizontalStackIllustration = ({ className }: TIllustration d="M55.4078 8.38193C54.6069 7.97459 53.5782 8.0093 52.4598 8.57543L21.6264 24.2888C19.0926 25.5799 17.0352 29.1287 17.0352 32.2079V69.7313C17.0352 71.4504 17.6705 72.6584 18.6716 73.1762L15.5923 71.609C14.5912 71.0981 13.9561 69.8831 13.9561 68.164V30.6406C13.9561 27.5545 16.0135 24.0126 18.5472 22.7216L49.3806 7.0082C50.506 6.43517 51.5347 6.4077 52.3286 6.81504L55.4078 8.38193Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.35" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.35" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -7,17 +7,17 @@ export const StateHorizontalStackIllustration = ({ className }: TIllustrationAss d="M42.4518 2.9386C41.651 2.53126 40.6223 2.5658 39.5038 3.13193L8.6704 18.8454C6.13661 20.1365 4.07922 23.6852 4.07922 26.7644V64.2879C4.07922 66.007 4.71436 67.2152 5.71545 67.733L2.63625 66.1657C1.63517 65.6548 1 64.4397 1 62.7206V25.1972C1 22.1111 3.0574 18.5693 5.59118 17.2783L36.4246 1.5647C37.55 0.991664 38.5787 0.964027 39.3726 1.37137L42.4518 2.9386Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const StateHorizontalStackIllustration = ({ className }: TIllustrationAss d="M55.9078 8.88293C55.1069 8.47559 54.0782 8.51013 52.9597 9.07626L22.1263 24.7899C19.5925 26.0809 17.5351 29.6296 17.5351 32.7088V70.2322C17.5351 71.9513 18.1703 73.1595 19.1714 73.6773L16.0922 72.1101C15.0911 71.5992 14.4559 70.3841 14.4559 68.665V31.1415C14.4559 28.0554 16.5133 24.5137 19.0471 23.2226L49.8805 7.50903C51.0059 6.936 52.0346 6.90836 52.8286 7.3157L55.9078 8.88293Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.25" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.25" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -7,17 +7,17 @@ export const TemplateHorizontalStackIllustration = ({ className }: TIllustration d="M47.8783 2.45609C46.9629 1.98409 45.7871 2.02411 44.5088 2.68011L9.26704 20.8881C6.37099 22.3841 4.01943 26.4961 4.01943 30.0641V73.5441C4.01943 75.5361 4.74542 76.9361 5.88964 77.5361L2.37019 75.72C1.22598 75.128 0.5 73.7201 0.5 71.7281V28.2481C0.5 24.6721 2.85155 20.5681 5.74759 19.0721L40.9893 0.864095C42.2756 0.200096 43.4514 0.168121 44.3588 0.640121L47.8783 2.45609Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,50 +25,50 @@ export const TemplateHorizontalStackIllustration = ({ className }: TIllustration d="M63.2587 9.39208C62.3433 8.92008 61.1675 8.96005 59.8891 9.61605L24.6474 27.824C21.7514 29.32 19.3998 33.432 19.3998 37V80.48C19.3998 82.472 20.1258 83.872 21.27 84.472L17.7506 82.656C16.6064 82.064 15.8804 80.656 15.8804 78.664V35.1841C15.8804 31.6081 18.2319 27.504 21.128 26.008L56.3697 7.80004C57.656 7.13604 58.8317 7.10406 59.7392 7.57606L63.2587 9.39208Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx index fc04b3489d3..8ec4c149ca7 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/token.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const TokenHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const TokenHorizontalStackIllustration = ({ className }: TIllustrationAss d="M47.8735 3.05272C46.9582 2.58718 45.7826 2.62663 44.5043 3.27365L9.26615 21.2323C6.3704 22.7078 4.01908 26.7634 4.01908 30.2826V73.167C4.01908 75.1317 4.74499 76.5126 5.88909 77.1043L2.37001 75.3132C1.22591 74.7293 0.5 73.3406 0.5 71.3759V28.4914C0.5 24.9644 2.85132 20.9166 5.74706 19.4411L40.9931 1.48252C42.2793 0.827616 43.4549 0.796055 44.3623 1.26159L47.8814 3.05272H47.8735Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const TokenHorizontalStackIllustration = ({ className }: TIllustrationAss d="M63.2517 9.89232C62.3365 9.42678 61.1608 9.46623 59.8826 10.1132L24.6444 28.0719C21.7486 29.5474 19.3973 33.603 19.3973 37.1222V80.0066C19.3973 81.9713 20.1232 83.3522 21.2673 83.9439L17.7482 82.1528C16.6041 81.5689 15.8782 80.1802 15.8782 78.2155V35.331C15.8782 31.804 18.2296 27.7562 21.1253 26.2807L56.3635 8.32212C57.6496 7.66722 58.8253 7.63565 59.7326 8.10119L63.2517 9.89232Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -32,34 +32,34 @@ export const UnknownHorizontalStackIllustration = ({ className }: TIllustrationA d="M78.9375 11.853C77.7933 11.2711 76.3235 11.3204 74.7256 12.1292L30.6736 34.5794C27.0536 36.4239 24.1141 41.4939 24.1141 45.8932V99.5033C24.1141 101.959 25.0216 103.686 26.4519 104.425L22.0526 102.186C20.6223 101.456 19.7148 99.7203 19.7148 97.2642V43.6541C19.7148 39.245 22.6543 34.1848 26.2743 32.3403L70.3263 9.89014C71.9341 9.07144 73.4039 9.03198 74.5382 9.61395L78.9375 11.853Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -7,17 +7,17 @@ export const UpdateHorizontalStackIllustration = ({ className }: TIllustrationAs d="M42.4559 2.91759C41.655 2.51021 40.6262 2.54473 39.5076 3.11092L8.67113 18.8261C6.1371 20.1172 4.0795 23.6663 4.0795 26.7458V64.2729C4.0795 65.9922 4.71473 67.2005 5.71591 67.7184L2.63642 66.151C1.63523 65.6401 1 64.4248 1 62.7055V25.1784C1 22.092 3.0576 18.5499 5.59163 17.2587L36.4281 1.54355C37.5536 0.970462 38.5824 0.942844 39.3764 1.35022L42.4559 2.91759Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.35" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.35" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,38 +25,38 @@ export const UpdateHorizontalStackIllustration = ({ className }: TIllustrationAs d="M55.9132 8.904C55.1123 8.49662 54.0835 8.53114 52.9649 9.09733L22.1284 24.8125C19.5944 26.1036 17.5368 29.6527 17.5368 32.7322V70.2593C17.5368 71.9786 18.172 73.1869 19.1732 73.7048L16.0937 72.1374C15.0925 71.6265 14.4573 70.4112 14.4573 68.692V31.1648C14.4573 28.0784 16.5149 24.5363 19.0489 23.2451L49.8854 7.52994C51.0109 6.95685 52.0397 6.92923 52.8337 7.33661L55.9132 8.904Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.35" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.35" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx index de29e0584bf..1e938ed4303 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/webhook.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const WebhookHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const WebhookHorizontalStackIllustration = ({ className }: TIllustrationA d="M47.8736 2.5768C46.9583 2.11126 45.7826 2.15093 44.5044 2.79794L9.26615 20.7562C6.3704 22.2317 4.01906 26.2876 4.01906 29.8067V72.6905C4.01906 74.6552 4.74496 76.0362 5.88906 76.628L2.37 74.8369C1.22591 74.253 0.5 72.8641 0.5 70.8994V28.0155C0.5 24.4885 2.85134 20.4406 5.74709 18.9651L40.9853 1.00681C42.2715 0.351913 43.447 0.320136 44.3544 0.785668L47.8736 2.5768Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const WebhookHorizontalStackIllustration = ({ className }: TIllustrationA d="M63.2515 9.37172C62.3362 8.90619 61.1606 8.94585 59.8823 9.59286L24.6441 27.5512C21.7483 29.0267 19.397 33.0825 19.397 36.6016V79.4858C19.397 81.4505 20.1229 82.8311 21.267 83.4229L17.7479 81.6318C16.6038 81.0479 15.8779 79.6594 15.8779 77.6947V34.8105C15.8779 31.2835 18.2293 27.2355 21.125 25.76L56.3633 7.80174C57.6494 7.14683 58.825 7.11506 59.7324 7.58059L63.2515 9.37172Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -7,17 +7,17 @@ export const WorkItemHorizontalStackIllustration = ({ className }: TIllustration d="M42.4518 2.44207C41.651 2.03473 40.6223 2.06925 39.5038 2.63538L8.67038 18.349C6.1366 19.64 4.0792 23.1887 4.0792 26.2679V63.7913C4.0792 65.5104 4.71437 66.7186 5.71546 67.2364L2.63625 65.6692C1.63517 65.1583 1 63.9432 1 62.2241V24.7007C1 21.6146 3.0574 18.0728 5.59118 16.7818L36.4246 1.06817C37.55 0.495131 38.5787 0.467515 39.3726 0.874853L42.4518 2.44207Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.3" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.3" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,50 +25,50 @@ export const WorkItemHorizontalStackIllustration = ({ className }: TIllustration d="M55.9076 8.38648C55.1068 7.97914 54.0781 8.01366 52.9596 8.57979L22.1262 24.2934C19.5924 25.5844 17.535 29.1331 17.535 32.2123V69.7357C17.535 71.4548 18.1702 72.6631 19.1713 73.1809L16.0921 71.6136C15.091 71.1027 14.4558 69.8876 14.4558 68.1685V30.6451C14.4558 27.559 16.5132 24.0172 19.047 22.7262L49.8804 7.01256C51.0058 6.43953 52.0345 6.41191 52.8284 6.81925L55.9076 8.38648Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.3" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.3" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx b/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx index bf97e593049..1e7920e5eca 100644 --- a/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx +++ b/packages/propel/src/empty-state/assets/horizontal-stack/worklog.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const WorklogHorizontalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -7,17 +7,17 @@ export const WorklogHorizontalStackIllustration = ({ className }: TIllustrationA d="M47.8736 2.5768C46.9583 2.11127 45.7826 2.15093 44.5044 2.79795L9.26614 20.7563C6.37039 22.2318 4.01915 26.2876 4.01915 29.8067V72.6906C4.01915 74.6553 4.74506 76.0363 5.88915 76.6281L2.37 74.837C1.22591 74.2531 0.5 72.8642 0.5 70.8995V28.0156C0.5 24.4886 2.85134 20.4406 5.74709 18.9651L40.9853 1.00681C42.2714 0.351913 43.4471 0.320136 44.3545 0.785668L47.8736 2.5768Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -25,34 +25,34 @@ export const WorklogHorizontalStackIllustration = ({ className }: TIllustrationA d="M63.252 9.37172C62.3367 8.90619 61.161 8.94586 59.8828 9.59287L24.6446 27.5512C21.7488 29.0267 19.3976 33.0825 19.3976 36.6016V79.4859C19.3976 81.4506 20.1235 82.8312 21.2676 83.423L17.7484 81.6319C16.6043 81.048 15.8784 79.6595 15.8784 77.6948V34.8105C15.8784 31.2835 18.2298 27.2356 21.1255 25.7601L56.3637 7.80174C57.6499 7.14683 58.8255 7.11506 59.7329 7.58059L63.252 9.37172Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -32,54 +32,54 @@ export const Error404VerticalStackIllustration = ({ className }: TIllustrationAs d="M1 118.06C1 120.084 2.51532 122.102 5.54055 123.65L44.4938 143.499C50.5496 146.583 60.3642 146.583 66.42 143.499L148.273 101.793C151.298 100.251 152.813 98.2325 152.813 96.2085V102.671C152.813 104.695 151.298 106.714 148.273 108.256L66.42 149.961C60.3642 153.045 50.5496 153.045 44.4938 149.961L5.54055 130.113C2.50996 128.57 1 126.546 1 124.523V118.06Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx b/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx index 448d294bad6..32233dc52e2 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/archived-cycle.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,34 +32,34 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat d="M1 119.596C1 121.613 2.50994 123.625 5.52448 125.167L44.34 144.945C50.3744 148.018 60.1543 148.018 66.1888 144.945L147.752 103.387C150.767 101.851 152.277 99.8391 152.277 97.8223V104.262C152.277 106.279 150.767 108.29 147.752 109.827L66.1888 151.385C60.1543 154.458 50.3744 154.458 44.34 151.385L5.52448 131.601C2.5046 130.065 1 128.048 1 126.031V119.591V119.596Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -126,64 +126,64 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -215,14 +215,14 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat /> @@ -233,14 +233,14 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat /> @@ -250,24 +250,24 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat mask="url(#path-28-inside-3_637_1524)" /> @@ -323,24 +323,24 @@ export const ArchivedCycleVerticalStackIllustration = ({ className }: TIllustrat stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} /> ( @@ -106,17 +106,17 @@ export const ArchivedModuleVerticalStackIllustration = ({ className }: TIllustra d="M1 147.833C1 149.852 2.51135 151.866 5.52871 153.409L44.3805 173.206C50.4206 176.282 60.2097 176.282 66.2497 173.206L147.889 131.609C150.907 130.071 152.418 128.058 152.418 126.039V132.485C152.418 134.504 150.907 136.517 147.889 138.055L66.2497 179.652C60.2097 182.728 50.4206 182.728 44.3805 179.652L5.52871 159.855C2.50601 158.317 1 156.298 1 154.279V147.833Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -124,34 +124,34 @@ export const ArchivedModuleVerticalStackIllustration = ({ className }: TIllustra d="M1 127.47C1 129.489 2.51135 131.502 5.52871 133.046L44.3805 152.843C50.4206 155.919 60.2097 155.919 66.2497 152.843L147.889 111.246C150.907 109.708 152.418 107.694 152.418 105.676V112.122C152.418 114.14 150.907 116.154 147.889 117.692L66.2497 159.289C60.2097 162.365 50.4206 162.365 44.3805 159.289L5.52871 139.492C2.50601 137.954 1 135.935 1 133.916V127.47Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -218,64 +218,64 @@ export const ArchivedModuleVerticalStackIllustration = ({ className }: TIllustra fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> ( @@ -32,34 +32,34 @@ export const ArchivedWorkItemVerticalStackIllustration = ({ className }: TIllust d="M1 122.555C1 124.524 2.47405 126.488 5.41695 127.993L43.31 147.302C49.2011 150.302 58.7486 150.302 64.6396 147.302L144.265 106.731C147.207 105.231 148.681 103.268 148.681 101.299V107.586C148.681 109.555 147.207 111.518 144.265 113.018L64.6396 153.589C58.7486 156.589 49.2011 156.589 43.31 153.589L5.41695 134.28C2.46885 132.78 1 130.811 1 128.842V122.555Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -126,75 +126,75 @@ export const ArchivedWorkItemVerticalStackIllustration = ({ className }: TIllust fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -204,24 +204,24 @@ export const ArchivedWorkItemVerticalStackIllustration = ({ className }: TIllust mask="url(#path-22-inside-1_637_1592)" /> diff --git a/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx b/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx index 450781894a7..284ac7ad1eb 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/customer.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const CustomerVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,38 +32,38 @@ export const CustomerVerticalStackIllustration = ({ className }: TIllustrationAs d="M16.4846 118.307C16.4846 120.233 17.9271 122.155 20.8069 123.628L57.8876 142.523C63.6523 145.458 72.9951 145.458 78.7598 142.523L156.678 102.822C159.558 101.354 161 99.4325 161 97.5059V103.658C161 105.585 159.558 107.506 156.678 108.974L78.7598 148.675C72.9951 151.61 63.6523 151.61 57.8876 148.675L20.8069 129.78C17.922 128.312 16.4846 126.385 16.4846 124.459V118.307Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -72,194 +72,194 @@ export const CustomerVerticalStackIllustration = ({ className }: TIllustrationAs fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> ( @@ -33,38 +33,38 @@ export const CycleVerticalStackIllustration = ({ className }: TIllustrationAsset d="M10.364 112.021C10.364 113.96 11.8174 115.895 14.7191 117.377L52.0819 136.398C57.8905 139.353 67.3043 139.353 73.1129 136.398L151.624 96.433C154.525 94.9553 155.979 93.0209 155.979 91.0814V97.2745C155.979 99.214 154.525 101.148 151.624 102.626L73.1129 142.591C67.3043 145.546 57.8905 145.546 52.0819 142.591L14.7191 123.57C11.8123 122.093 10.364 120.153 10.364 118.214V112.021Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -73,24 +73,24 @@ export const CycleVerticalStackIllustration = ({ className }: TIllustrationAsset fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> diff --git a/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx b/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx index 583a7fabcca..fc439e98c54 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/dashboard.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const DashboardVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,34 +32,34 @@ export const DashboardVerticalStackIllustration = ({ className }: TIllustrationA d="M15.0806 111.921C15.0806 113.866 16.537 115.807 19.4448 117.294L56.8858 136.372C62.7065 139.337 72.1401 139.337 77.9608 136.372L156.636 96.2858C159.544 94.8036 161 92.8634 161 90.918V97.1299C161 99.0752 159.544 101.015 156.636 102.498L77.9608 142.584C72.1401 145.548 62.7065 145.548 56.8858 142.584L19.4448 123.506C16.5319 122.024 15.0806 120.078 15.0806 118.133V111.921Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -32,34 +32,34 @@ export const DraftVerticalStackIllustration = ({ className }: TIllustrationAsset d="M14.7751 121.74C14.7751 123.69 16.2347 125.634 19.1485 127.125L56.6679 146.243C62.5008 149.213 71.9541 149.213 77.787 146.243L156.627 106.072C159.54 104.587 161 102.643 161 100.693V106.918C161 108.868 159.54 110.812 156.627 112.297L77.787 152.467C71.9541 155.438 62.5008 155.438 56.6679 152.467L19.1485 133.349C16.2295 131.864 14.7751 129.915 14.7751 127.965V121.74Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx b/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx index 1827916f2bc..213eb4052b9 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/epic.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const EpicVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -64,17 +64,17 @@ export const EpicVerticalStackIllustration = ({ className }: TIllustrationAssetP d="M7.92419 134.11C7.92419 135.937 9.29639 137.76 12.0359 139.157L47.3107 157.077C52.7947 159.861 61.6825 159.861 67.1664 157.077L141.29 119.424C144.029 118.032 145.401 116.209 145.401 114.382V120.217C145.401 122.044 144.029 123.866 141.29 125.259L67.1664 162.912C61.6825 165.696 52.7947 165.696 47.3107 162.912L12.0359 144.991C9.29155 143.599 7.92419 141.772 7.92419 139.945V134.11Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.35" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.35" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -82,34 +82,34 @@ export const EpicVerticalStackIllustration = ({ className }: TIllustrationAssetP d="M7.92419 115.677C7.92419 117.505 9.29639 119.327 12.0359 120.724L47.3107 138.644C52.7947 141.429 61.6825 141.429 67.1664 138.644L141.29 100.991C144.029 99.599 145.401 97.7765 145.401 95.9492V101.784C145.401 103.611 144.029 105.434 141.29 106.826L67.1664 144.479C61.6825 147.264 52.7947 147.264 47.3107 144.479L12.0359 126.559C9.29155 125.167 7.92419 123.339 7.92419 121.512V115.677Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.35" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.35" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx b/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx index c1aa1acd741..547cd954025 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/initiative.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const InitiativeVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,58 +32,58 @@ export const InitiativeVerticalStackIllustration = ({ className }: TIllustration d="M11.214 120.094C11.214 121.961 12.6117 123.823 15.4023 125.25L51.3337 143.559C56.9198 146.404 65.973 146.404 71.5591 143.559L147.062 105.089C149.853 103.666 151.25 101.804 151.25 99.9375V105.899C151.25 107.766 149.853 109.628 147.062 111.05L71.5591 149.52C65.973 152.365 56.9198 152.365 51.3337 149.52L15.4023 131.211C12.6068 129.789 11.214 127.922 11.214 126.055V120.094Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -96,106 +96,106 @@ export const InitiativeVerticalStackIllustration = ({ className }: TIllustration fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -223,17 +223,17 @@ export const InitiativeVerticalStackIllustration = ({ className }: TIllustration d="M113.63 2.0262C114.79 1.43351 116.292 1.4829 117.927 2.3176L149.225 18.2657C152.92 20.1475 155.918 25.3187 155.918 29.8181C155.918 32.3272 154.984 34.0953 153.522 34.8411L155.725 33.72C157.192 32.9742 158.121 31.206 158.121 28.697C158.121 24.2025 155.123 19.0264 151.428 17.1446L120.125 1.19644C118.49 0.361744 116.993 0.312354 115.828 0.905038L113.625 2.0262H113.63Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -32,34 +32,34 @@ export const InvalidLinkVerticalStackIllustration = ({ className }: TIllustratio d="M0.5 92.2428C0.5 94.3759 2.09703 96.5034 5.28541 98.1342L46.3393 119.053C52.7217 122.304 63.0656 122.304 69.4479 119.053L155.715 75.0989C158.903 73.4737 160.5 71.3462 160.5 69.2131V76.0244C160.5 78.1575 158.903 80.285 155.715 81.9102L69.4479 125.865C63.0656 129.115 52.7217 129.115 46.3393 125.865L5.28541 104.946C2.09139 103.32 0.5 101.187 0.5 99.0541V92.2428Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/module.tsx b/packages/propel/src/empty-state/assets/vertical-stack/module.tsx index e581cc0e3ee..12ee94f410c 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/module.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/module.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const ModuleVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,34 +32,34 @@ export const ModuleVerticalStackIllustration = ({ className }: TIllustrationAsse d="M13.5711 117.959C13.5711 119.79 14.9421 121.616 17.6793 123.016L52.9231 140.975C58.4023 143.765 67.2823 143.765 72.7614 140.975L146.82 103.241C149.557 101.846 150.928 100.019 150.928 98.1882V104.036C150.928 105.867 149.557 107.693 146.82 109.088L72.7614 146.822C67.2823 149.613 58.4023 149.613 52.9231 146.822L17.6793 128.864C14.9373 127.468 13.5711 125.637 13.5711 123.806V117.959Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.35" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.35" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx b/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx index cb0f02e6569..ab2d1f3ec80 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/no-access.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const NoAccessVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,34 +32,34 @@ export const NoAccessVerticalStackIllustration = ({ className }: TIllustrationAs d="M0.5 110.294C0.5 112.427 2.097 114.555 5.28537 116.186L46.3392 137.105C52.7216 140.355 63.0656 140.355 69.4479 137.105L155.715 93.1504C158.903 91.5252 160.5 89.3978 160.5 87.2646V94.076C160.5 96.2091 158.903 98.3365 155.715 99.9617L69.4479 143.916C63.0656 147.167 52.7216 147.167 46.3392 143.916L5.28537 122.997C2.09135 121.372 0.5 119.239 0.5 117.106V110.294Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -120,44 +120,44 @@ export const NoAccessVerticalStackIllustration = ({ className }: TIllustrationAs fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> ); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/page.tsx b/packages/propel/src/empty-state/assets/vertical-stack/page.tsx index 59d09a210f3..3168b6723d8 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/page.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/page.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const PageVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -58,17 +58,17 @@ export const PageVerticalStackIllustration = ({ className }: TIllustrationAssetP d="M1.45563 140.366C1.45563 142.493 3.04808 144.614 6.22737 146.241L47.1643 167.1C53.5285 170.341 63.8429 170.341 70.2071 167.1L156.228 123.271C159.407 121.65 161 119.529 161 117.402V124.194C161 126.321 159.407 128.442 156.228 130.063L70.2071 173.892C63.8429 177.133 53.5285 177.133 47.1643 173.892L6.22737 153.033C3.04245 151.412 1.45563 149.285 1.45563 147.158V140.366Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -76,34 +76,34 @@ export const PageVerticalStackIllustration = ({ className }: TIllustrationAssetP d="M1.45563 118.91C1.45563 121.037 3.04808 123.159 6.22737 124.785L47.1643 145.644C53.5285 148.886 63.8429 148.886 70.2071 145.644L156.228 101.815C159.407 100.195 161 98.0732 161 95.9462V102.738C161 104.865 159.407 106.986 156.228 108.607L70.2071 152.436C63.8429 155.677 53.5285 155.677 47.1643 152.436L6.22737 131.577C3.04245 129.956 1.45563 127.829 1.45563 125.702V118.91Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/vertical-stack/project.tsx b/packages/propel/src/empty-state/assets/vertical-stack/project.tsx index 974992104a1..1d04eb2e5bf 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/project.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/project.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const ProjectVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -33,34 +33,34 @@ export const ProjectVerticalStackIllustration = ({ className }: TIllustrationAss d="M16.9216 96.9689C16.9216 98.6509 18.1809 100.328 20.6948 101.614L53.0651 118.109C58.0975 120.672 66.2534 120.672 71.2858 118.109L139.306 83.4514C141.82 82.1699 143.079 80.4925 143.079 78.8105V84.181C143.079 85.8629 141.82 87.5405 139.306 88.822L71.2858 123.479C66.2534 126.042 58.0975 126.042 53.0651 123.479L20.6948 106.985C18.1764 105.703 16.9216 104.021 16.9216 102.34V96.9689Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> ( @@ -32,34 +32,34 @@ export const ServerErrorVerticalStackIllustration = ({ className }: TIllustratio d="M1 126.144C1 128.277 2.597 130.404 5.78537 132.035L46.8392 152.954C53.2216 156.205 63.5656 156.205 69.9479 152.954L156.215 109C159.403 107.375 161 105.247 161 103.114V109.925C161 112.058 159.403 114.186 156.215 115.811L69.9479 159.766C63.5656 163.016 53.2216 163.016 46.8392 159.766L5.78537 138.846C2.59135 137.221 1 135.088 1 132.955V126.144Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.5" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.5" + strokeLinecap="round" + strokeLinejoin="round" /> ); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx b/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx index 3d2a387c3ea..f3dfef1410f 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/teamspace.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,38 +32,38 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA d="M13.3344 133.909C13.3344 135.871 14.8035 137.829 17.7366 139.329L55.503 158.573C61.3744 161.563 70.8899 161.563 76.7613 158.573L156.12 118.138C159.053 116.643 160.522 114.686 160.522 112.724V118.989C160.522 120.952 159.053 122.909 156.12 124.404L76.7613 164.839C70.8899 167.829 61.3744 167.829 55.503 164.839L17.7366 145.595C14.7983 144.1 13.3344 142.137 13.3344 140.175V133.909Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -72,8 +72,8 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -82,8 +82,8 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -92,8 +92,8 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -102,144 +102,144 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -303,43 +303,43 @@ export const TeamspaceVerticalStackIllustration = ({ className }: TIllustrationA d="M101.394 2.72093C102.614 2.09798 104.192 2.14989 105.91 3.02721L144.886 22.889C148.769 24.8669 151.921 30.3021 151.921 35.0314C151.921 37.6685 150.939 39.527 149.403 40.3109L151.718 39.1325C153.26 38.3486 154.236 36.4901 154.236 33.853C154.236 29.1289 151.085 23.6885 147.202 21.7106L108.22 1.8488C106.502 0.971472 104.929 0.919559 103.704 1.54251L101.389 2.72093H101.394Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> diff --git a/packages/propel/src/empty-state/assets/vertical-stack/view.tsx b/packages/propel/src/empty-state/assets/vertical-stack/view.tsx index e6376a754ca..2b863659fad 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/view.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/view.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -40,54 +40,54 @@ export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetP d="M13.2695 109.954C13.2695 111.884 14.7145 113.809 17.5993 115.285L54.7451 134.212C60.52 137.153 69.8791 137.153 75.654 134.212L153.709 94.4422C156.593 92.9717 158.038 91.0467 158.038 89.1167V95.2796C158.038 97.2096 156.593 99.1346 153.709 100.605L75.654 140.375C69.8791 143.316 60.52 143.316 54.7451 140.375L17.5993 121.448C14.7094 119.977 13.2695 118.047 13.2695 116.117V109.954Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -224,8 +224,8 @@ export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetP fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -234,8 +234,8 @@ export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetP fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -244,74 +244,74 @@ export const ViewVerticalStackIllustration = ({ className }: TIllustrationAssetP fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> ); diff --git a/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx b/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx index 41eb1fef921..a2152ae53b1 100644 --- a/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx +++ b/packages/propel/src/empty-state/assets/vertical-stack/work-item.tsx @@ -1,4 +1,4 @@ -import { TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; +import { type TIllustrationAssetProps, ILLUSTRATION_COLOR_TOKEN_MAP } from "../helper"; export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAssetProps) => ( @@ -32,86 +32,86 @@ export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAs d="M1 122.087C1 124.22 2.597 126.348 5.78537 127.979L46.8392 148.898C53.2216 152.148 63.5655 152.148 69.9479 148.898L156.215 104.943C159.403 103.318 161 101.191 161 99.0576V105.869C161 108.002 159.403 110.129 156.215 111.755L69.9479 155.709C63.5655 158.96 53.2216 158.96 46.8392 155.709L5.78537 134.79C2.59135 133.165 1 131.032 1 128.898V122.087Z" fill={ILLUSTRATION_COLOR_TOKEN_MAP.fill.secondary} stroke={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.secondary} - stroke-width="0.4" - stroke-linecap="round" - stroke-linejoin="round" + strokeWidth="0.4" + strokeLinecap="round" + strokeLinejoin="round" /> @@ -152,28 +152,28 @@ export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAs fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -182,28 +182,28 @@ export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAs fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> @@ -212,34 +212,34 @@ export const WorkItemVerticalStackIllustration = ({ className }: TIllustrationAs fill={ILLUSTRATION_COLOR_TOKEN_MAP.stroke.primary} /> ); diff --git a/packages/propel/src/empty-state/empty-state.stories.tsx b/packages/propel/src/empty-state/empty-state.stories.tsx index bb1ea67ddbe..095bbb71152 100644 --- a/packages/propel/src/empty-state/empty-state.stories.tsx +++ b/packages/propel/src/empty-state/empty-state.stories.tsx @@ -3,8 +3,7 @@ import { WorkItemHorizontalStackIllustration } from "./assets/horizontal-stack"; import { HorizontalStackAssetsMap } from "./assets/horizontal-stack/constant"; import { WorkItemVerticalStackIllustration } from "./assets/vertical-stack"; import { VerticalStackAssetsMap } from "./assets/vertical-stack/constant"; -import type { EmptyStateProps } from "./empty-state"; -import { EmptyState } from "./empty-state"; +import { EmptyState, type EmptyStateProps } from "./empty-state"; const meta: Meta = { title: "Components/EmptyState", diff --git a/packages/propel/src/icons/brand/zerodha-logo.tsx b/packages/propel/src/icons/brand/zerodha-logo.tsx index 21ae65bac29..8857151f90f 100644 --- a/packages/propel/src/icons/brand/zerodha-logo.tsx +++ b/packages/propel/src/icons/brand/zerodha-logo.tsx @@ -17,8 +17,8 @@ export const ZerodhaLogo: React.FC = ({ className={className} > From dbde562f305d369e81fbd39c445bfacc5c885453 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Tue, 7 Oct 2025 14:09:29 +0530 Subject: [PATCH 6/8] chore: code refactor --- packages/propel/package.json | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/propel/package.json b/packages/propel/package.json index f0d991852b4..3f8856bb0cb 100644 --- a/packages/propel/package.json +++ b/packages/propel/package.json @@ -88,6 +88,10 @@ "import": "./dist/dialog/index.mjs", "require": "./dist/dialog/index.js" }, + "./empty-state": { + "import": "./dist/empty-state/index.mjs", + "require": "./dist/empty-state/index.js" + }, "./emoji-icon-picker": { "import": "./dist/emoji-icon-picker/index.mjs", "require": "./dist/emoji-icon-picker/index.js" From 25cc99702985ea616af0fa1d2e520caad35db41d Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Tue, 7 Oct 2025 14:15:15 +0530 Subject: [PATCH 7/8] chore: code refactor --- packages/propel/package.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/propel/package.json b/packages/propel/package.json index 3f8856bb0cb..3503f4df034 100644 --- a/packages/propel/package.json +++ b/packages/propel/package.json @@ -88,10 +88,6 @@ "import": "./dist/dialog/index.mjs", "require": "./dist/dialog/index.js" }, - "./empty-state": { - "import": "./dist/empty-state/index.mjs", - "require": "./dist/empty-state/index.js" - }, "./emoji-icon-picker": { "import": "./dist/emoji-icon-picker/index.mjs", "require": "./dist/emoji-icon-picker/index.js" @@ -100,6 +96,10 @@ "import": "./dist/emoji-reaction/index.mjs", "require": "./dist/emoji-reaction/index.js" }, + "./empty-state": { + "import": "./dist/empty-state/index.mjs", + "require": "./dist/empty-state/index.js" + }, "./icons": { "import": "./dist/icons/index.mjs", "require": "./dist/icons/index.js" From 1dc1cb82220cb219890a762a464065dc62ad1ca6 Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia Date: Tue, 7 Oct 2025 16:04:15 +0530 Subject: [PATCH 8/8] chore: code refactor --- packages/propel/src/empty-state/empty-state.tsx | 2 +- packages/ui/src/popovers/popover-menu.stories.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/propel/src/empty-state/empty-state.tsx b/packages/propel/src/empty-state/empty-state.tsx index e4757d2bcb1..d1dc8823be1 100644 --- a/packages/propel/src/empty-state/empty-state.tsx +++ b/packages/propel/src/empty-state/empty-state.tsx @@ -59,4 +59,4 @@ export const EmptyState: React.FC = ({
); -}; \ No newline at end of file +}; diff --git a/packages/ui/src/popovers/popover-menu.stories.tsx b/packages/ui/src/popovers/popover-menu.stories.tsx index b868c9d01e9..4e8a56cda6b 100644 --- a/packages/ui/src/popovers/popover-menu.stories.tsx +++ b/packages/ui/src/popovers/popover-menu.stories.tsx @@ -1,5 +1,5 @@ -import React from "react"; import type { Meta, StoryObj } from "@storybook/react"; +import React from "react"; import { PopoverMenu } from "./popover-menu"; type TPopoverMenu = {