@popsure/dirty-swan 0.33.5 → 0.34.0

package/src/lib/components/cards/cardWithLeftIcon/index.stories.mdx

@@ -1,103 +0,0 @@
-import { Meta, Preview } from '@storybook/addon-docs/blocks';
-
-import CardWithLeftIcon from '.';
-import { featherLogo } from '../icons';
-
-<Meta title="JSX/Cards/Card with left icon" />
-
-# Card with left icon
-
-| attribute  | unit                                                                                 | description                                       | default value | required |
-| ---------- | ------------------------------------------------------------------------------------ | ------------------------------------------------- | ------------- | -------- |
-| title      | string                                                                               | The title text that needs to be displayed         | n/a           | true     |
-| cardSize  | [Card Size (xs,s,m,b)](?path=/story/jsx-cards-intro--page#card-size-xsmall-small-medium-big) | Size of the card                                 | medium        | false    |
-| leftIcon   | [Icon](?path=/story/jsx-cards-intro--page#icon)                                      | Icon displayed on the left hand side of the card  | n/a           | false    |
-| rightIcon  | [Icon](?path=/story/jsx-cards-intro--page#icon)                                      | Icon displayed on the right hand side of the card | n/a           | false    |
-| state      | [Card State](?path=/story/jsx-cards-intro--page#card-state)                          | State that describe the interation with the card  | actionable    | false    |
-| dropshadow | boolean                                                                              | If the card should have a box-shadow or not       | true          | false    |
-| className  | string                                                                               | Class name for most top parent element         | 'n/a'           | false    |
-
-<Preview>
-  <>
-    <h4 className="p-h4">Extra small card</h4>
-    <CardWithLeftIcon
-      title="Lorem ipsum"
-      cardSize="xsmall"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithLeftIcon>
-    <h4 className="p-h4">Small card</h4>
-    <CardWithLeftIcon
-      title="Lorem ipsum"
-      cardSize="small"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithLeftIcon>
-    <h4 className="p-h4 mt24">Medium card</h4>
-    <CardWithLeftIcon
-      title="Lorem ipsum"
-      cardSize="medium"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithLeftIcon>
-    <h4 className="p-h4 mt24">Big card</h4>
-    <CardWithLeftIcon
-      title="Lorem ipsum"
-      cardSize="big"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithLeftIcon>
-    <h4 className="p-h4 mt24">Muted</h4>
-    <CardWithLeftIcon
-      state="muted"
-      title="Lorem ipsum"
-      cardSize="big"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithLeftIcon>
-    <h4 className="p-h4 mt24">No left icon and right icon</h4>
-    <CardWithLeftIcon title="Lorem ipsum" cardSize="big" className="wmx6 mt8">
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithLeftIcon>
-    <h4 className="p-h4 mt24">No dropshadow</h4>
-    <CardWithLeftIcon
-      title="Lorem ipsum"
-      cardSize="medium"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-      dropshadow={false}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithLeftIcon>
-  </>
-</Preview>

package/src/lib/components/cards/cardWithTopIcon/index.stories.mdx

@@ -1,105 +0,0 @@
-import { Meta, Preview } from '@storybook/addon-docs/blocks';
-
-import CardWithTopIcon from '.';
-import { featherLogo } from '../icons';
-
-<Meta title="JSX/Cards/Card with top icon" />
-
-# Card with top icon
-
-| attribute  | unit                                                                                      | description                                      | default value | required |
-| ---------- | ----------------------------------------------------------------------------------------- | ------------------------------------------------ | ------------- | -------- |
-| title      | string                                                                                    | The title text that needs to be displayed        | n/a           | true     |
-| cardSize   | [Card Size (s,m,b)](?path=/story/jsx-cards-intro--page#card-size-xsmall-small-medium-big) | Size of the card                                 | medium        | false    |
-| topIcon    | [Icon](?path=/story/jsx-cards-intro--page#icon)                                           | Icon displayed on the top of the card            | n/a           | true     |
-| rightIcon  | [Icon](?path=/story/jsx-cards-intro--page#icon)                                           | Icon displayed on the right of the title         | n/a           | false    |
-| state      | [Card State](?path=/story/jsx-cards-intro--page#card-state)                               | State that describe the interation with the card | actionable    | false    |
-| dropshadow | boolean                                                                                   | If the card should have a box-shadow or not      | true          | false    |
-
-<Preview>
-  <>
-    <h4 className="p-h4">Small card</h4>
-    <CardWithTopIcon
-      title="Lorem ipsum"
-      cardSize="small"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      topIcon={featherLogo}
-    >
-      <p className="p-p mt16 tc-grey-600">
-        Praesent euismod porta odio at tempus.{' '}
-        <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-        eros at, rhoncus imperdiet nunc
-      </p>
-    </CardWithTopIcon>
-    <h4 className="p-h4 mt24">Medium card</h4>
-    <CardWithTopIcon
-      title="Lorem ipsum"
-      cardSize="medium"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      topIcon={featherLogo}
-    >
-      <p className="p-p mt16 tc-grey-600">
-        Praesent euismod porta odio at tempus.{' '}
-        <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-        eros at, rhoncus imperdiet nunc
-      </p>
-    </CardWithTopIcon>
-    <h4 className="p-h4 mt24">Big card</h4>
-    <CardWithTopIcon
-      title="Lorem ipsum"
-      cardSize="big"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      topIcon={featherLogo}
-    >
-      <p className="p-p mt16 tc-grey-600">
-        Praesent euismod porta odio at tempus.{' '}
-        <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-        eros at, rhoncus imperdiet nunc
-      </p>
-    </CardWithTopIcon>
-    <h4 className="p-h4 mt24">Muted</h4>
-    <CardWithTopIcon
-      title="Lorem ipsum"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      topIcon={featherLogo}
-      state="muted"
-    >
-      <p className="p-p mt16 tc-grey-600">
-        Praesent euismod porta odio at tempus.{' '}
-        <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-        eros at, rhoncus imperdiet nunc
-      </p>
-    </CardWithTopIcon>
-    <h4 className="p-h4 mt24">No right icon</h4>
-    <CardWithTopIcon
-      title="Lorem ipsum"
-      topIcon={featherLogo}
-      cardSize="small"
-      className="wmx6 mt8"
-    >
-      <p className="p-p mt16 tc-grey-600">
-        Praesent euismod porta odio at tempus.{' '}
-        <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-        eros at, rhoncus imperdiet nunc
-      </p>
-    </CardWithTopIcon>
-    <h4 className="p-h4 mt24">No dropshadow</h4>
-    <CardWithTopIcon
-      title="Lorem ipsum"
-      topIcon={featherLogo}
-      cardSize="small"
-      className="wmx6 mt8"
-      dropshadow={false}
-    >
-      <p className="p-p mt16 tc-grey-600">
-        Praesent euismod porta odio at tempus.{' '}
-        <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-        eros at, rhoncus imperdiet nunc
-      </p>
-    </CardWithTopIcon>
-  </>
-</Preview>

package/src/lib/components/cards/cardWithTopLeftIcon/index.stories.mdx

@@ -1,101 +0,0 @@
-import { Meta, Preview } from '@storybook/addon-docs/blocks';
-
-import CardWithTopLeftIcon from '.';
-import { featherLogo } from '../icons';
-
-<Meta title="JSX/Cards/Card with top left icon" />
-
-# Card with top left icon
-
-| attribute  | unit                                                                              | description                                      | default value | required |
-| ---------- | --------------------------------------------------------------------------------- | ------------------------------------------------ | ------------- | -------- |
-| title      | string                                                                            | The title text that needs to be displayed        | n/a           | true     |
-| cardSize  | [Card Size (xs,s,m,b)](?path=/story/jsx-cards-intro--page#card-size-xsmall-small-medium-big) | Size of the card                                | medium        | false    |
-| topIcon    | [Icon](?path=/story/jsx-cards-intro--page#icon)                                   | Icon displayed on the left of the title          | n/a           | false    |
-| rightIcon  | [Icon](?path=/story/jsx-cards-intro--page#icon)                                   | Icon displayed on the right of the title         | n/a           | false    |
-| state      | [Card State](?path=/story/jsx-cards-intro--page#card-state)                       | State that describe the interation with the card | actionable    | false    |
-| dropshadow | boolean                                                                           | If the card should have a box-shadow or not      | true          | false    |
-
-<Preview>
-  <>
-    <h4 className="p-h4">Extra small card</h4>
-    <CardWithTopLeftIcon
-      title="Lorem ipsum"
-      cardSize="xsmall"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithTopLeftIcon>
-    <h4 className="p-h4 mt24">Small card</h4>
-    <CardWithTopLeftIcon
-      title="Lorem ipsum"
-      cardSize="small"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithTopLeftIcon>
-    <h4 className="p-h4 mt24">Medium card</h4>
-    <CardWithTopLeftIcon
-      title="Lorem ipsum"
-      cardSize="medium"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithTopLeftIcon>
-    <h4 className="p-h4 mt24">Big card</h4>
-    <CardWithTopLeftIcon
-      title="Lorem ipsum"
-      cardSize="big"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithTopLeftIcon>
-    <h4 className="p-h4 mt24">Muted</h4>
-    <CardWithTopLeftIcon
-      title="Lorem ipsum"
-      state="muted"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithTopLeftIcon>
-    <h4 className="p-h4 mt24">No right icon or left icon</h4>
-    <CardWithTopLeftIcon title="Lorem ipsum" className="wmx6 mt8">
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithTopLeftIcon>
-    <h4 className="p-h4">No dropshadow</h4>
-    <CardWithTopLeftIcon
-      title="Lorem ipsum"
-      cardSize="medium"
-      className="wmx6 mt8"
-      rightIcon="arrow"
-      leftIcon={featherLogo}
-      dropshadow={false}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </CardWithTopLeftIcon>
-  </>
-</Preview>

package/src/lib/components/cards/infoCard/index.stories.mdx

@@ -1,61 +0,0 @@
-import { Meta, Preview } from '@storybook/addon-docs/blocks';
-
-import InfoCard from '.';
-import { featherLogo } from '../icons';
-
-<Meta title="JSX/Cards/Info card" />
-
-# Info card
-
-| attribute  | unit                                                        | description                                                     | default value | required |
-| ---------- | ----------------------------------------------------------- | --------------------------------------------------------------- | ------------- | -------- |
-| title      | string                                                      | The title text that needs to be displayed                       | n/a           | true     |
-| topIcon    | [Icon](?path=/story/jsx-cards-intro--page#icon)             | Icon displayed on the top of the card, inside the purple circle | n/a           | true     |
-| rightIcon  | [Icon](?path=/story/jsx-cards-intro--page#icon)             | Icon displayed on the top right corner of the card              | n/a           | false    |
-| state      | [Card State](?path=/story/jsx-cards-intro--page#card-state) | State that describe the interation with the card                | actionable    | false    |
-| dropshadow | boolean                                                     | If the card should have a box-shadow or not                     | true          | false    |
-
-<Preview>
-  <>
-    <h4 className="p-h4">With right icon</h4>
-    <InfoCard
-      className="wmx6 mt8"
-      title="Lorem ipsum"
-      rightIcon="info"
-      topIcon={featherLogo}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </InfoCard>
-    <h4 className="p-h4 mt24">Without right icon</h4>
-    <InfoCard className="wmx6 mt8" title="Lorem ipsum" topIcon={featherLogo}>
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </InfoCard>
-    <h4 className="p-h4 mt24">Muted</h4>
-    <InfoCard
-      className="wmx6 mt8"
-      title="Lorem ipsum"
-      topIcon={featherLogo}
-      state="muted"
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </InfoCard>
-    <h4 className="p-h4">No dropshadow</h4>
-    <InfoCard
-      className="wmx6 mt8"
-      title="Lorem ipsum"
-      rightIcon="info"
-      topIcon={featherLogo}
-      dropshadow={false}
-    >
-      Praesent euismod porta odio at tempus.{' '}
-      <span className="fw-bold">Aenean urna massa</span>, facilisis malesuada
-      eros at, rhoncus imperdiet nunc
-    </InfoCard>
-  </>
-</Preview>

package/src/lib/components/input/index.stories.mdx

@@ -1,108 +0,0 @@
-import { Meta, Preview } from '@storybook/addon-docs/blocks';
-
-import Input from '.';
-
-<Meta title="JSX/Inputs/Input" />
-
-## Input
-
-The default input component is used to gather informations from the user.
-
-You are looking at the JSX definition of the Input component, if you want you can use the [css alternative](?path=/story/css-components-input--page)
-
-<Preview>
-  <>
-    <h1 className="p-h1">Without placeholder</h1>
-    <h4 className="p-h4 mt24">Empty</h4>
-    <Input className="wmx5 mt8" />
-    <h4 className="p-h4 mt24">Filled</h4>
-    <Input className="wmx5 mt8" value="Lorem ipsum" />
-    <h4 className="p-h4 mt24">Disabled</h4>
-    <Input className="wmx5 mt8" value="Lorem ipsum" disabled={true} />
-    <h4 className="p-h4 mt24">Error</h4>
-    <Input
-      className="wmx5 mt8"
-      value="Lorem ipsum"
-      error="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
-    />
-    <h1 className="p-h1 mt32">With placeholder</h1>
-    <h4 className="p-h4 mt24">Empty</h4>
-    <Input className="wmx5 mt8" placeholder="Email" />
-    <h4 className="p-h4 mt24">Filled</h4>
-    <Input
-      className="wmx5 mt8"
-      value="jane.doe@feather-insurance.com"
-      placeholder="Email"
-    />
-    <h4 className="p-h4 mt24">Disabled</h4>
-    <Input className="wmx5 mt8" placeholder="Email" disabled />
-    <h4 className="p-h4 mt24">Error</h4>
-    <Input
-      className="wmx5 mt8"
-      value="jane.doe@feather-insurance.com"
-      placeholder="Email"
-      error="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
-    />
-    <h1 className="p-h1 mt32">With prefix</h1>
-    <h4 className="p-h4 mt24">Empty</h4>
-    <Input className="wmx5 mt8" prefix="€" />
-    <h4 className="p-h4 mt24">Filled</h4>
-    <Input className="wmx5 mt8" value="100" prefix="€" />
-    <h4 className="p-h4 mt24">Empty with placeholder</h4>
-    <Input className="wmx5 mt8" placeholder="amount" prefix="€" />
-    <h4 className="p-h4 mt24">Filled with placeholder</h4>
-    <Input className="wmx5 mt8" placeholder="amount" value="100" prefix="€" />
-    <h4 className="p-h4 mt24">Disabled</h4>
-    <Input className="wmx5 mt8" placeholder="amount" disabled prefix="€" />
-    <h4 className="p-h4 mt24">Error</h4>
-    <Input
-      className="wmx5 mt8"
-      placeholder="amount"
-      value="100"
-      prefix="€"
-      error="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ac hendrerit justo. Nunc nibh ex, vulputate ac leo id, feugiat rhoncus purus."
-    />
-    <h1 className="p-h1 mt32">With label</h1>
-    <h4 className="p-h4 mt24">Empty</h4>
-    <Input className="wmx5 mt8" label="Email" />
-    <h4 className="p-h4 mt24">With placeholder</h4>
-    <Input
-      className="wmx5 mt8"
-      label="Email"
-      placeholder="email@feather-insurance.com"
-    />
-    <h4 className="p-h4 mt24">Filled</h4>
-    <Input
-      className="wmx5 mt8"
-      value="email@feather-insurance.com"
-      label="Email"
-      placeholder="email@feather-insurance.com"
-    />
-    <h4 className="p-h4 mt24">Disabled</h4>
-    <Input
-      className="wmx5 mt8"
-      label="Email"
-      placeholder="email@feather-insurance.com"
-      disabled
-    />
-    <h4 className="p-h4 mt24">Error</h4>
-    <Input
-      className="wmx5 mt8"
-      label="Email"
-      value="invalid.email@feather-insurance.com"
-      placeholder="email@feather-insurance.com"
-      error="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
-    />
-    <h4 className="p-h4 mt24">With prefix</h4>
-    <Input className="wmx5 mt8" label="Amount" value="100" prefix="€" />
-    <h4 className="p-h4 mt24">With label hidden</h4>
-    <Input
-      className="wmx5 mt8"
-      label="Amount"
-      value="100"
-      prefix="€"
-      hideLabel
-      onChange={() => {}}
-    />
-  </>
-</Preview>