@ilo-org/react 0.14.0 → 0.15.0

package/src/stories/Button/Button.stories.tsx

@@ -1,68 +0,0 @@
-import { Button, buttonArgs } from "../../components/Button";
-import { Meta, StoryObj } from "@storybook/react";
-
-const argTypes = {
-  size: {
-    options: ["large", "medium", "small"],
-    control: { type: "select" },
-  },
-  type: {
-    options: ["primary", "secondary", "tertiary", "alert"],
-    control: { type: "select" },
-  },
-  icononly: {
-    options: [true, false],
-    control: { type: "boolean" },
-  },
-  iconPosition: {
-    options: ["left", "center", "right"],
-    control: { type: "select" },
-  },
-  opensmodal: {
-    options: [true, false],
-    control: { type: "boolean" },
-  },
-};
-
-const ButtonMeta: Meta<typeof Button> = {
-  title: "Components/User Interface/Button",
-  component: Button,
-  argTypes,
-};
-
-export default ButtonMeta;
-
-export const PrimaryBtn: StoryObj<typeof Button> = {
-  args: buttonArgs.primary,
-  name: "Primary",
-};
-
-export const SecondaryBtn: StoryObj<typeof Button> = {
-  args: buttonArgs.secondary,
-  name: "Secondary",
-};
-
-export const TertiaryBtn: StoryObj<typeof Button> = {
-  args: buttonArgs.tertiary,
-  name: "Tertiary",
-};
-
-export const AlertBtn: StoryObj<typeof Button> = {
-  args: buttonArgs.alert,
-  name: "Alert",
-};
-
-export const IconBtn: StoryObj<typeof Button> = {
-  args: buttonArgs.icon,
-  name: "Icon",
-};
-
-export const DisabledBtn: StoryObj<typeof Button> = {
-  args: buttonArgs.disabled,
-  name: "Disabled",
-};
-
-export const LinkBtn: StoryObj<typeof Button> = {
-  name: "Link",
-  args: buttonArgs.link,
-};

package/src/stories/Callout/Callout.mdx

@@ -1,35 +0,0 @@
-import { Meta, Story, Canvas, ArgsTable, Unstyled } from "@storybook/blocks";
-import * as CalloutStories from "./Callout.stories.tsx";
-import { Callout } from "../../components";
-
-<Meta title="Callout" of={CalloutStories} />
-
-# Callout
-
-The Callout component provides an inline alert or message to end users.
-
-<Canvas>
-  <Story of={CalloutStories.InfoCallout} />
-</Canvas>
-
-## Callout type
-
-You can change the coloring of the callout with the `type` prop. The default is `info`.
-
-## Examples
-
-<Canvas>
-  <Story of={CalloutStories.SuccessCallout} />
-</Canvas>
-
-<Canvas>
-  <Story of={CalloutStories.WarningCallout} />
-</Canvas>
-
-<Canvas>
-  <Story of={CalloutStories.ErrorCallout} />
-</Canvas>
-
-## Default Props
-
-<ArgsTable of={Callout} />

package/src/stories/Callout/Callout.stories.tsx

@@ -1,43 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { Callout, calloutArgs } from "../../components/Callout";
-
-const CalloutMeta: Meta<typeof Callout> = {
-  title: "Components/Feedback/Callout",
-  component: Callout,
-  argTypes: {
-    isCollapsible: {
-      options: [true, false],
-      control: { type: "boolean" },
-    },
-    isOpen: {
-      options: [true, false],
-      control: { type: "boolean" },
-    },
-    type: {
-      options: ["info", "error", "success", "warning"],
-      control: { type: "select" },
-    },
-  },
-};
-
-export default CalloutMeta;
-
-export const InfoCallout: StoryObj<typeof Callout> = {
-  args: calloutArgs.baseArgs,
-  name: "Info",
-};
-
-export const SuccessCallout: StoryObj<typeof Callout> = {
-  args: calloutArgs.success,
-  name: "Success",
-};
-
-export const WarningCallout: StoryObj<typeof Callout> = {
-  args: calloutArgs.warning,
-  name: "Warning",
-};
-
-export const ErrorCallout: StoryObj<typeof Callout> = {
-  args: calloutArgs.error,
-  name: "Error",
-};

package/src/stories/Card/DataCard.stories.tsx

@@ -1,45 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { DataCard, DataCardArgs } from "../../components/Cards/DataCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof DataCard> = {
-  title: "Components/Cards/Data Card",
-  component: DataCard,
-  tags: ["autodocs"],
-  argTypes: {
-    size: {
-      options: ["narrow", "wide", "fluid"],
-      control: { type: "radio" },
-    },
-    columns: {
-      options: ["one", "two"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>Cards display prominent content of a page.</Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const DataCardDefault: StoryObj<typeof DataCard> = {
-  args: DataCardArgs,
-  name: "Default",
-};

package/src/stories/Card/DetailCard.stories.tsx

@@ -1,41 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { DetailCard, DetailCardArgs } from "../../components/Cards/DetailCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof DetailCard> = {
-  title: "Components/Cards/Detail Card",
-  component: DetailCard,
-  tags: ["autodocs"],
-  argTypes: {
-    size: {
-      options: ["wide", "narrow", "fluid"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>Cards display prominent content of a page.</Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const DetailCardDefault: StoryObj<typeof DetailCard> = {
-  args: DetailCardArgs,
-  name: "Default",
-};

package/src/stories/Card/FactlistCard.stories.tsx

@@ -1,48 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import {
-  FactlistCard,
-  FactlistCardArgs,
-} from "../../components/Cards/FactlistCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof FactlistCard> = {
-  title: "Components/Cards/Factlist Card",
-  component: FactlistCard,
-  tags: ["autodocs"],
-  argTypes: {
-    theme: {
-      options: ["dark", "light"],
-      control: { type: "radio" },
-    },
-    size: {
-      options: ["wide", "narrow", "fluid"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>Cards display prominent content of a page.</Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const FactListCardDefault: StoryObj<typeof FactlistCard> = {
-  args: FactlistCardArgs,
-  name: "Default",
-};

package/src/stories/Card/FeatureCard.stories.tsx

@@ -1,56 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import {
-  FeatureCard,
-  FeatureCardArgs,
-} from "../../components/Cards/FeatureCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof FeatureCard> = {
-  title: "Components/Cards/Feature Card",
-  component: FeatureCard,
-  tags: ["autodocs"],
-  argTypes: {
-    theme: {
-      options: ["dark", "light"],
-      control: { type: "radio" },
-    },
-    size: {
-      options: ["wide", "narrow", "fluid"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>
-            Cards display prominent content of a page. This component is a
-            wrapper around all of the card types in the design system except for
-            the Hero Card. To use it, pass a `type` setting to the card and then
-            pass the appropriate fields for that card type. For more information
-            about the settings you can pass to each card type, see the
-            documentation for that card.
-          </Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const FeatureCardDefault: StoryObj<typeof FeatureCard> = {
-  args: FeatureCardArgs,
-  name: "Default",
-  render: (args) => <FeatureCard {...args} />,
-};

package/src/stories/Card/MultilinkCard.stories.tsx

@@ -1,48 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import {
-  MultilinkCard,
-  MultilinkCardArgs,
-} from "../../components/Cards/MultilinkCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof MultilinkCard> = {
-  title: "Components/Cards/Multilink Card",
-  component: MultilinkCard,
-  tags: ["autodocs"],
-  argTypes: {
-    size: {
-      options: ["wide", "standard", "narrow", "fluid"],
-      control: { type: "radio" },
-    },
-    alignment: {
-      options: ["left", "right"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>Cards display prominent content of a page.</Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const MultilinkCardDefault: StoryObj<typeof MultilinkCard> = {
-  args: MultilinkCardArgs,
-  name: "Default",
-};

package/src/stories/Card/PromoCard.stories.tsx

@@ -1,48 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { PromoCard, PromoCardArgs } from "../../components/Cards/PromoCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof PromoCard> = {
-  title: "Components/Cards/Promo Card",
-  component: PromoCard,
-  tags: ["autodocs"],
-  argTypes: {
-    theme: {
-      options: ["dark", "light"],
-      control: { type: "radio" },
-    },
-    cornercut: {
-      control: { type: "boolean" },
-    },
-    size: {
-      options: ["wide", "standard", "narrow", "fluid"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>Cards display prominent content of a page.</Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const PromoCardDefault: StoryObj<typeof PromoCard> = {
-  args: PromoCardArgs,
-  name: "Default",
-};

package/src/stories/Card/StatCard.stories.tsx

@@ -1,45 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { StatCard, StatCardArgs } from "../../components/Cards/StatCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof StatCard> = {
-  title: "Components/Cards/Stat Card",
-  component: StatCard,
-  tags: ["autodocs"],
-  argTypes: {
-    color: {
-      options: ["turquoise", "green", "yellow", "blue"],
-      control: { type: "select" },
-    },
-    size: {
-      options: ["standard", "fluid"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>Cards display prominent content of a page.</Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const StatCardDefault: StoryObj<typeof StatCard> = {
-  args: StatCardArgs,
-  name: "Default",
-};

package/src/stories/Card/TextCard.stories.tsx

@@ -1,45 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { TextCard, TextCardArgs } from "../../components/Cards/TextCard";
-import {
-  ArgTypes,
-  Description,
-  Primary,
-  Stories,
-  Title,
-} from "@storybook/blocks";
-
-const CardMeta: Meta<typeof TextCard> = {
-  title: "Components/Cards/Text Card",
-  component: TextCard,
-  tags: ["autodocs"],
-  argTypes: {
-    theme: {
-      options: ["dark", "light"],
-      control: { type: "radio" },
-    },
-    size: {
-      options: ["wide", "fluid", "narrow"],
-      control: { type: "radio" },
-    },
-  },
-  parameters: {
-    docs: {
-      page: () => (
-        <>
-          <Title>Card</Title>
-          <Description>Cards display prominent content of a page.</Description>
-          <Primary />
-          <ArgTypes of={CardMeta} />
-          <Stories />
-        </>
-      ),
-    },
-  },
-};
-
-export default CardMeta;
-
-export const TextCardDefault: StoryObj<typeof TextCard> = {
-  args: TextCardArgs,
-  name: "Default",
-};

package/src/stories/CardGroup/CardGroup.mdx

@@ -1,17 +0,0 @@
-import { Meta, Story, Canvas, ArgsTable, Unstyled } from "@storybook/blocks";
-import * as CardGroupStories from "./CardGroup.stories.tsx";
-import { CardGroup } from "../../components";
-
-<Meta title="CardGroup" of={CardGroupStories} />
-
-# Card Group
-
-Card Group displays a group of Cards.
-
-<Canvas>
-  <Story of={CardGroupStories.FeatureCardGroup} />
-</Canvas>
-
-## Default Props
-
-<ArgsTable of={CardGroup} />

package/src/stories/CardGroup/CardGroup.stories.tsx

@@ -1,50 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import CardGroup from "../../components/Cards/CardGroup/CardGroup";
-import CardGroupArgs from "../../components/Cards/CardGroup/CardGroup.args";
-
-const CardGroupMeta: Meta<typeof CardGroup> = {
-  title: "Components/Cards/CardGroup",
-  component: CardGroup,
-};
-
-export default CardGroupMeta;
-
-export const FeatureCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.featureCardGroup,
-  name: "Feature Group",
-};
-
-export const GraphicCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.textCardGroup,
-  name: "Text Group",
-};
-
-export const StatCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.statCardGroup,
-  name: "Stat Group",
-};
-
-export const MultilinkCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.multilinkCardGroup,
-  name: "Multilink Group",
-};
-
-export const GraphicPromoCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.promoCardGroup,
-  name: "Promo Group",
-};
-
-export const DetailCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.detailCardGroup,
-  name: "Detail Group",
-};
-
-export const FactListCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.factListCardGroup,
-  name: "Fact List Group",
-};
-
-export const DataCardGroup: StoryObj<typeof CardGroup> = {
-  args: CardGroupArgs.dataCardGroup,
-  name: "Data Group",
-};