@discourser/design-system 0.15.1 → 0.18.0

package/src/components/Icons/SpeechIcon.figma.tsx

@@ -0,0 +1,10 @@
+import figma from '@figma/code-connect';
+import { SpeechIcon } from './SpeechIcon';
+
+figma.connect(
+  SpeechIcon,
+  'https://www.figma.com/design/GaHmFfmvO4loUzuZS4TgEz/Discourser.AI--V1?node-id=622-3768',
+  {
+    example: () => <SpeechIcon />,
+  },
+);

package/src/components/Icons/SpeechIcon.tsx

@@ -0,0 +1,26 @@
+import { ark } from '@ark-ui/react/factory';
+import type { ComponentProps } from 'react';
+import { styled } from 'styled-system/jsx';
+
+const StyledSvg = styled(ark.svg);
+
+export type SpeechIconProps = ComponentProps<typeof StyledSvg>;
+
+export const SpeechIcon = (props: SpeechIconProps) => (
+  <StyledSvg
+    viewBox="0 0 60 60"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    width="1em"
+    height="1em"
+    {...props}
+  >
+    <path
+      d="M22 50.0002V39.7502L26.75 40.2502C28.1328 40.1734 29.4415 39.6 30.4354 38.6355C31.4293 37.671 32.0417 36.3801 32.16 35.0002V20.7502C32.1766 17.1485 30.7617 13.6878 28.2267 11.1294C25.6917 8.57091 22.2441 7.12426 18.6425 7.10769C15.0409 7.09111 11.5801 8.50596 9.02168 11.041C6.46322 13.576 5.01658 17.0235 5 20.6252C5 27.6252 6.64 28.2602 7.5 32.0002C8.08121 34.2589 8.10609 36.6248 7.5725 38.8952L5 50.0002M49.5001 44.5001C53.0147 40.9851 54.9897 36.2185 54.9911 31.2479C54.9925 26.2773 53.0202 21.5095 49.5076 17.9926M42.4999 37.4998C43.3179 36.682 43.9656 35.7102 44.4056 34.6405C44.8455 33.5708 45.0691 32.4246 45.0633 31.268C45.0575 30.1114 44.8224 28.9674 44.3717 27.9022C43.921 26.837 43.2636 25.8718 42.4374 25.0623"
+      stroke="currentColor"
+      strokeWidth="2.4"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </StyledSvg>
+);

package/src/components/Icons/StopPlayIcon.figma.tsx

@@ -0,0 +1,10 @@
+import figma from '@figma/code-connect';
+import { StopPlayIcon } from './StopPlayIcon';
+
+figma.connect(
+  StopPlayIcon,
+  'https://www.figma.com/design/GaHmFfmvO4loUzuZS4TgEz/Discourser.AI--V1?node-id=38-9857',
+  {
+    example: () => <StopPlayIcon />,
+  },
+);

package/src/components/Icons/StopPlayIcon.tsx

@@ -0,0 +1,35 @@
+import { ark } from '@ark-ui/react/factory';
+import type { ComponentProps } from 'react';
+import { styled } from 'styled-system/jsx';
+
+const StyledSvg = styled(ark.svg);
+
+export type StopPlayIconProps = ComponentProps<typeof StyledSvg>;
+
+export const StopPlayIcon = (props: StopPlayIconProps) => (
+  <StyledSvg
+    viewBox="0 0 64 64"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    width="1em"
+    height="1em"
+    {...props}
+  >
+    <circle
+      cx="31.7438"
+      cy="31.7438"
+      r="30.7438"
+      stroke="currentColor"
+      strokeWidth="2"
+      fill="none"
+    />
+    <rect
+      x="15.231"
+      y="15.231"
+      width="33.0254"
+      height="33.0254"
+      rx="8"
+      fill="currentColor"
+    />
+  </StyledSvg>
+);

package/src/components/Icons/TimerIcon.figma.tsx

@@ -0,0 +1,10 @@
+import figma from '@figma/code-connect';
+import { TimerIcon } from './TimerIcon';
+
+figma.connect(
+  TimerIcon,
+  'https://www.figma.com/design/GaHmFfmvO4loUzuZS4TgEz/Discourser.AI--V1?node-id=38-9817',
+  {
+    example: () => <TimerIcon />,
+  },
+);

package/src/components/Icons/TimerIcon.tsx

@@ -0,0 +1,26 @@
+import { ark } from '@ark-ui/react/factory';
+import type { ComponentProps } from 'react';
+import { styled } from 'styled-system/jsx';
+
+const StyledSvg = styled(ark.svg);
+
+export type TimerIconProps = ComponentProps<typeof StyledSvg>;
+
+export const TimerIcon = (props: TimerIconProps) => (
+  <StyledSvg
+    viewBox="0 0 35 39"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    width="1em"
+    height="1em"
+    {...props}
+  >
+    <path
+      d="M6.27333 12C4.83741 14.1451 4 16.7248 4 19.5C4 26.9559 10.0442 33 17.5 33C24.9559 33 31 26.9559 31 19.5C31 12.0442 24.9559 6 17.5 6V10.5M17.5 19.5L11.5 13.5"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </StyledSvg>
+);

package/src/components/Icons/UserProfileIcon.figma.tsx

@@ -0,0 +1,10 @@
+import figma from '@figma/code-connect';
+import { UserProfileIcon } from './UserProfileIcon';
+
+figma.connect(
+  UserProfileIcon,
+  'https://www.figma.com/design/GaHmFfmvO4loUzuZS4TgEz/Discourser.AI--V1?node-id=622-3774',
+  {
+    example: () => <UserProfileIcon />,
+  },
+);

package/src/components/Icons/UserProfileIcon.tsx

@@ -0,0 +1,26 @@
+import { ark } from '@ark-ui/react/factory';
+import type { ComponentProps } from 'react';
+import { styled } from 'styled-system/jsx';
+
+const StyledSvg = styled(ark.svg);
+
+export type UserProfileIconProps = ComponentProps<typeof StyledSvg>;
+
+export const UserProfileIcon = (props: UserProfileIconProps) => (
+  <StyledSvg
+    viewBox="0 0 42 42"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    width="1em"
+    height="1em"
+    {...props}
+  >
+    <path
+      d="M21 22.75C25.8325 22.75 29.75 18.8325 29.75 14C29.75 9.16751 25.8325 5.25 21 5.25C16.1675 5.25 12.25 9.16751 12.25 14C12.25 18.8325 16.1675 22.75 21 22.75ZM21 22.75C24.713 22.75 28.274 24.225 30.8995 26.8505C33.525 29.476 35 33.037 35 36.75M21 22.75C17.287 22.75 13.726 24.225 11.1005 26.8505C8.475 29.476 7 33.037 7 36.75"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </StyledSvg>
+);

package/src/components/Icons/index.ts

@@ -1,2 +1,39 @@
-export { GripDotsVerticalIcon, type GripDotsVerticalIconProps } from './GripDotsVerticalIcon'
-export { ClockIcon, type ClockIconProps } from './ClockIcon'
+export {
+  GripDotsVerticalIcon,
+  type GripDotsVerticalIconProps,
+} from './GripDotsVerticalIcon';
+export { ClockIcon, type ClockIconProps } from './ClockIcon';
+export { DashboardIcon, type DashboardIconProps } from './DashboardIcon';
+export { NotebookIcon, type NotebookIconProps } from './NotebookIcon';
+export { ScenarioIcon, type ScenarioIconProps } from './ScenarioIcon';
+export { HelpIcon, type HelpIconProps } from './HelpIcon';
+export { AccountIcon, type AccountIconProps } from './AccountIcon';
+export { RightArrowIcon, type RightArrowIconProps } from './RightArrowIcon';
+export { ChevronUpIcon, type ChevronUpIconProps } from './ChevronUpIcon';
+export { DiscourserLogo, type DiscourserLogoProps } from './DiscourserLogo';
+export { TimerIcon, type TimerIconProps } from './TimerIcon';
+export { ClipBoardIcon, type ClipBoardIconProps } from './ClipBoardIcon';
+export { MicrophoneIcon, type MicrophoneIconProps } from './MicrophoneIcon';
+export { AudienceIcon, type AudienceIconProps } from './AudienceIcon';
+export { RecordIcon, type RecordIconProps } from './RecordIcon';
+export { NotebookPenIcon, type NotebookPenIconProps } from './NotebookPenIcon';
+export { SparklesIcon, type SparklesIconProps } from './SparklesIcon';
+export { ScrollTextIcon, type ScrollTextIconProps } from './ScrollTextIcon';
+export {
+  RepeatQuestionIcon,
+  type RepeatQuestionIconProps,
+} from './RepeatQuestionIcon';
+export { ExitStudioIcon, type ExitStudioIconProps } from './ExitStudioIcon';
+export { PausePlayIcon, type PausePlayIconProps } from './PausePlayIcon';
+export { StopPlayIcon, type StopPlayIconProps } from './StopPlayIcon';
+export {
+  BookmarkPlusIcon,
+  type BookmarkPlusIconProps,
+} from './BookmarkPlusIcon';
+export {
+  AudioSpeakerIcon,
+  type AudioSpeakerIconProps,
+} from './AudioSpeakerIcon';
+export { UserProfileIcon, type UserProfileIconProps } from './UserProfileIcon';
+export { PlayIcon, type PlayIconProps } from './PlayIcon';
+export { SpeechIcon, type SpeechIconProps } from './SpeechIcon';

package/src/components/NavigationMenu/NavigationMenu.figma.tsx

@@ -0,0 +1,26 @@
+import figma from '@figma/code-connect';
+import { NavigationMenu } from './NavigationMenu';
+
+figma.connect(
+  NavigationMenu,
+  'https://www.figma.com/design/GaHmFfmvO4loUzuZS4TgEz/Discourser.AI--V1?node-id=38-8485',
+  {
+    example: () => (
+      <NavigationMenu
+        sections={[
+          {
+            value: 'dashboard',
+            title: 'Dashboard',
+            icon: null,
+            items: [
+              { label: 'Quick Start', href: '/dashboard/quick-start' },
+              { label: 'Progress', href: '/dashboard/progress' },
+            ],
+          },
+        ]}
+        defaultOpenSections={['dashboard']}
+        activeHref="/dashboard/quick-start"
+      />
+    ),
+  },
+);