diff --git a/README.md b/README.md index 9a74fd3..0102d5d 100644 --- a/README.md +++ b/README.md @@ -53,17 +53,6 @@ npm run storybook ## Publishing -### For design and component library inclusion - -This project is hosted on [Chromatic](https://www.chromatic.com/builds?appId={id}). -Feel free to [invite yourself](https://www.chromatic.com/builds?appId={id}&inviteToken={id}). - -```bash -npm run-script chromatic -``` - -### For application consumption - This package is published into a private npm registery. Documentation changes do not require a version publishing. @@ -71,12 +60,7 @@ For functional changes, follow [SemVer](https://semver.org/) standards updating the `package.json` and `package-lock.json` files in your pull request. -Once the changes are merged through PR into `main` -you may run this command to publish a new package: - -```bash -npm publish -``` +When you are ready to publish a new verison, use the Github Release action. ### Chromatic diff --git a/src/components/Typography/Link/Link.stories.tsx b/src/components/Typography/Link/Link.stories.tsx index d03cb22..fa95d8b 100644 --- a/src/components/Typography/Link/Link.stories.tsx +++ b/src/components/Typography/Link/Link.stories.tsx @@ -1,6 +1,6 @@ import type { Meta, StoryObj } from "@storybook/react"; import { Link } from "."; -import { Paragraph } from ".."; +import { LineClamp, Paragraph } from ".."; // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export const meta: Meta = { @@ -45,3 +45,39 @@ export const CustomClasses: Story = { className: "font-black", }, }; + +export const Truncated: Story = { + args: { external: true }, + render: ({ children, ...args }) => ( + <> + Paragraph: + + {children} + + + List: + + + Line clamp: + + + {children} +
+ {children} +
+ {children} +
+ {children} +
+ {children} + +
+ + ), +}; diff --git a/src/components/Typography/Link/Link.tsx b/src/components/Typography/Link/Link.tsx index 5da1118..d653745 100644 --- a/src/components/Typography/Link/Link.tsx +++ b/src/components/Typography/Link/Link.tsx @@ -21,16 +21,17 @@ export const Link: FC = (props) => { * - className * - External icon in children */ -export const getLinkProps = (props: LinkProps): LinkProps => ({ +export const getLinkProps = ({ external, ...props }: LinkProps): LinkProps => ({ ...props, className: twMerge(linkClasses, props.className), children: ( <> {props.children} - {props.external && } + {external && ( + + )} ), }); -const linkClasses = - "inline-flex items-center text-primary-600 underline dark:text-primary-400"; +const linkClasses = "text-primary-600 underline dark:text-primary-400";