diff --git a/.github/labeler.yml b/.github/labeler.yml index 9ae0229eb4..ba1651a23c 100644 --- a/.github/labeler.yml +++ b/.github/labeler.yml @@ -146,6 +146,8 @@ o-tracking: - libraries/o-tracking/**/* o-utils: - libraries/o-utils/**/* +o3-figma-sb-links: + - libraries/o3-figma-sb-links/**/* o3-tooling-token: - libraries/o3-tooling-token/**/* sass-mq: diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index f30494c9a4..d6fc5d1d01 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -149,6 +149,8 @@ jobs: - 'libraries/o-tracking/**' libraries/o-utils: - 'libraries/o-utils/**' + libraries/o3-figma-sb-links: + - 'libraries/o3-figma-sb-links/**' libraries/o3-tooling-token: - 'libraries/o3-tooling-token/**' libraries/sass-mq: diff --git a/apps/for-everyone-website/package.json b/apps/for-everyone-website/package.json index 7320fb59fe..dca229976c 100644 --- a/apps/for-everyone-website/package.json +++ b/apps/for-everyone-website/package.json @@ -22,6 +22,7 @@ "@astrojs/svelte": "^5.4.0", "@financial-times/o3-button": "^1.0.0", "@financial-times/o3-editorial-typography": "^1.0.0", + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0", "@financial-times/o3-tooling-token": "^0.0.0", "@financial-times/o3-tooltip": "^1.0.0", diff --git a/apps/for-everyone-website/src/components/button/ButtonGroupPreview.astro b/apps/for-everyone-website/src/components/button/ButtonGroupPreview.astro index d457dab6b3..9473a73fd3 100644 --- a/apps/for-everyone-website/src/components/button/ButtonGroupPreview.astro +++ b/apps/for-everyone-website/src/components/button/ButtonGroupPreview.astro @@ -5,44 +5,10 @@ import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; const {brand} = Astro.props; -let figma = - 'https://www.figma.com/files/938480807921629744/team/1237702133754424766/Origami-for-Everyone-(NEW)?fuid=840167457508775739'; -switch (brand) { - case 'core': - figma = - 'https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6605-826&t=mPp0f1R2Bgyi54UE-4'; - break; - case 'professional': - figma = - 'https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4173-834&t=mPp0f1R2Bgyi54UE-4'; - break; - case 'internal': - figma = - 'https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5545-1833&t=mPp0f1R2Bgyi54UE-4'; - break; - case 'sustainable-views': - figma = - 'https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=6294-955&t=mPp0f1R2Bgyi54UE-4'; - break; - - default: - break; -} - -let storybook = 'https://o3.origami.ft.com'; -if (brand) { - const storybookArgs = `grouped-buttons`; - const storybookbase = 'https://o3.origami.ft.com?path=/story'; - storybook = `${storybookbase}/${brand}-o3-button--${storybookArgs}`; - - if (brand === 'professional') { - storybook = `${storybookbase}/core-${brand}-o3-button--${storybookArgs}`; - } -} - +const storybookId = `${brand}-o3-button--grouped-buttons`; ---
- +
diff --git a/apps/for-everyone-website/src/components/button/ButtonPaginationPreview.astro b/apps/for-everyone-website/src/components/button/ButtonPaginationPreview.astro index 6f59074a15..0389a752c2 100644 --- a/apps/for-everyone-website/src/components/button/ButtonPaginationPreview.astro +++ b/apps/for-everyone-website/src/components/button/ButtonPaginationPreview.astro @@ -4,15 +4,13 @@ import * as InverseComponent from './preview/ButtonPagination-inverse'; import Preview from '../utils/Preview.astro'; import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; -const {theme} = Astro.props; +const {theme, brand} = Astro.props; const Component = theme === 'inverse' ? InverseComponent : StandardComponent; -const figma = - 'https://www.figma.com/file/nSD9N3r4MiMpv9pA6F4Dpy/Pagination?type=design&node-id=5463-1742&mode=design'; -const storybook = `https://o3.origami.ft.com?path=/story/core-o3-button--pagination&args=theme:${theme}`; +const storybookId = `${brand}-o3-button--pagination`; ---
- +
diff --git a/apps/for-everyone-website/src/components/button/ButtonPreview.astro b/apps/for-everyone-website/src/components/button/ButtonPreview.astro index f9d23ae57b..44ebd0ed18 100644 --- a/apps/for-everyone-website/src/components/button/ButtonPreview.astro +++ b/apps/for-everyone-website/src/components/button/ButtonPreview.astro @@ -14,42 +14,7 @@ import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; const {previewFile, componentProps, brand} = Astro.props; -let figma = - 'https://www.figma.com/files/938480807921629744/team/1237702133754424766/Origami-for-Everyone-(NEW)?fuid=840167457508775739'; -switch (brand) { - case 'core': - figma = - 'https://www.figma.com/file/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Design-System?type=design&node-id=4059-1949&mode=design&t=Coj8qOkQwGndrOew-4'; - break; - case 'professional': - figma = - 'https://www.figma.com/file/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Design-System?type=design&node-id=3786-2499&mode=design&t=3k5iL1exswqY1yJz-4'; - break; - case 'internal': - figma = - 'https://www.figma.com/file/H9vTWZgEzqzTtX689nwq4R/Internal---Design-System?type=design&node-id=4316-309&mode=design&t=3k5iL1exswqY1yJz-4'; - break; - case 'sustainable-views': - figma = - 'https://www.figma.com/file/Y7u0SwIJ1mCNDE0dpzgHCJ/Sustainable-Views---Design-System?type=design&node-id=4039-410&mode=design&t=3k5iL1exswqY1yJz-4'; - break; - - default: - break; -} - -let storybook = 'https://o3.origami.ft.com'; -if (brand) { - const storybookArgs = `button&args=${Object.entries(componentProps) - .map(p => `${p[0]}:${p[1]};`) - .join('')}`; - const storybookbase = 'https://o3.origami.ft.com?path=/story'; - storybook = `${storybookbase}/${brand}-o3-button--${storybookArgs}`; - - if (brand === 'professional') { - storybook = `${storybookbase}/core-${brand}-o3-button--${storybookArgs}`; - } -} +const storybookId = `${brand}-o3-button--button` let component = Primary; @@ -83,5 +48,5 @@ switch (previewFile) {
- +
diff --git a/apps/for-everyone-website/src/components/editorial-typography/BigNumber.astro b/apps/for-everyone-website/src/components/editorial-typography/BigNumber.astro index 3adb88b5bf..c7b8ed9bf2 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/BigNumber.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/BigNumber.astro @@ -3,10 +3,7 @@ import * as Component from './preview/BigNumber.tsx'; import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; import Preview from '../utils/Preview.astro'; const {brand} = Astro.props; -const figma = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4443&t=kyDVEfsg2tRJspyY-4'; - -const storybook = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography--big-number`; +const storybookId = `${brand}-o3-editorial-typography--big-number` ---

@@ -16,4 +13,4 @@ const storybook = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial- - + diff --git a/apps/for-everyone-website/src/components/editorial-typography/BodyStyles.astro b/apps/for-everyone-website/src/components/editorial-typography/BodyStyles.astro index 2fd85bd0b7..1881030aff 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/BodyStyles.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/BodyStyles.astro @@ -6,15 +6,11 @@ import { } from '@financial-times/o3-editorial-typography/esm'; import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; const {brand} = Astro.props; -const figmaBody = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4084&t=kyDVEfsg2tRJspyY-4'; -const figmaDetails = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4178&t=kyDVEfsg2tRJspyY-4'; -const sbDomain = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography`; -const sbBody = sbDomain + '--body'; -const sbTopicTag = sbDomain + '--topic-tag'; -const sbStandfirst = sbDomain + '--standfirst'; -const sbCaption = sbDomain + '--caption'; +const storybookIdBody = `${brand}-o3-editorial-typography--body`; +const storybookIdTopicTag = `${brand}-o3-editorial-typography--topic-tag`; +const storybookIdStandFirst = `${brand}-o3-editorial-typography--standfirst`; +const storybookIdCaption = `${brand}-o3-editorial-typography--caption`; +const storybookIdByline = `${brand}-o3-editorial-typography--byline`; ---

Body

@@ -32,14 +28,14 @@ const sbCaption = sbDomain + '--caption'; S body - + L body - + @@ -68,7 +64,7 @@ const sbCaption = sbDomain + '--caption'; (article cards) to indicate the category of a post. - + @@ -80,7 +76,7 @@ const sbCaption = sbDomain + '--caption'; in combination with a header in the topper component. - + @@ -91,7 +87,7 @@ const sbCaption = sbDomain + '--caption'; >For additional information about a piece or image that should be less prominent. - + @@ -102,7 +98,7 @@ const sbCaption = sbDomain + '--caption'; component - + @@ -114,7 +110,7 @@ const sbCaption = sbDomain + '--caption'; component - + @@ -126,7 +122,7 @@ const sbCaption = sbDomain + '--caption'; component - + @@ -153,6 +149,6 @@ const sbCaption = sbDomain + '--caption'; .not-content.o3-editorial-typography-blockquote__source, .not-content.o3-editorial-typography-blockquote__author { - display: revert + display: revert; } diff --git a/apps/for-everyone-website/src/components/editorial-typography/Byline.astro b/apps/for-everyone-website/src/components/editorial-typography/Byline.astro index 3f1c6d5ce1..fbb0f2069c 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/Byline.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/Byline.astro @@ -4,11 +4,7 @@ import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; import Preview from '../utils/Preview.astro'; const {brand} = Astro.props; -const figma = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4457&t=kyDVEfsg2tRJspyY-4'; - -const storybook = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography--byline`; - +const storybookId = `${brand}-o3-editorial-typography--byline` ---

@@ -18,4 +14,4 @@ const storybook = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial- - + diff --git a/apps/for-everyone-website/src/components/editorial-typography/DropCap.astro b/apps/for-everyone-website/src/components/editorial-typography/DropCap.astro index e2b92481bc..252b284d84 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/DropCap.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/DropCap.astro @@ -1,18 +1,15 @@ --- -import * as DropCap from './preview/DropCap.tsx' +import * as DropCap from './preview/DropCap.tsx'; import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; import Preview from '../utils/Preview.astro'; const {brand} = Astro.props; -const figma = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4370&t=kyDVEfsg2tRJspyY-4'; -const quoteSbLinkGenerator = () => { - return `/?path=/story/${brand}-o3-editorial-typography--body&args=dropCap:!true&globals=backgrounds.name:paper;backgrounds.value:!hex(ffffff)`; +const storybookId = `${brand}-o3-editorial-typography--body`; +const sbPathParams = { + dropCap: '!true', }; -const sb = quoteSbLinkGenerator(); - --- - + diff --git a/apps/for-everyone-website/src/components/editorial-typography/HeadingStyles.astro b/apps/for-everyone-website/src/components/editorial-typography/HeadingStyles.astro index 4a25dfb635..0c9ddb40f8 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/HeadingStyles.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/HeadingStyles.astro @@ -2,10 +2,7 @@ import {Headline} from '@financial-times/o3-editorial-typography'; import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; const {brand} = Astro.props -let storybook = - `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography--heading`; -let figma = - 'https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4717-652&t=JoNufjYjDEE8n0FL-4'; +const storybookId = `${brand}-o3-editorial-typography--heading` --- {brand === 'core' || brand === 'professional' && <> @@ -29,21 +26,21 @@ let figma = S Headline large - + M Headline large - + L Headline large - + @@ -64,21 +61,21 @@ let figma = S Headline - + M Headline - + L Headline - + @@ -105,7 +102,7 @@ let figma = For in-page titles / chapters - + @@ -114,7 +111,7 @@ let figma = For in-page sub-titles / sub-headings - + @@ -126,7 +123,7 @@ let figma = just above a chapter. - + diff --git a/apps/for-everyone-website/src/components/editorial-typography/Links.astro b/apps/for-everyone-website/src/components/editorial-typography/Links.astro index 8800b45ca2..5c3f8b00f1 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/Links.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/Links.astro @@ -4,10 +4,7 @@ import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; import Preview from '../utils/Preview.astro'; const {brand} = Astro.props; -const figma = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4418&t=kyDVEfsg2tRJspyY-4'; - -const storybook = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography--link`; +const storybookId = `${brand}-o3-editorial-typography--link`; ---

@@ -16,4 +13,4 @@ const storybook = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial- - + diff --git a/apps/for-everyone-website/src/components/editorial-typography/Lists.astro b/apps/for-everyone-website/src/components/editorial-typography/Lists.astro index 84e715bc1d..b9df562cb7 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/Lists.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/Lists.astro @@ -5,13 +5,7 @@ import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; import Preview from '../utils/Preview.astro'; const {brand} = Astro.props; -const figma = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4386&t=kyDVEfsg2tRJspyY-4'; -const quoteSbLinkGenerator = (type: string) => { - return `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography--list&args=type:${type}`; -}; -const sbOrdered = quoteSbLinkGenerator('ordered'); -const sbUnordered = quoteSbLinkGenerator('unordered'); +const storybookId = `${brand}-o3-editorial-typography--list` --- @@ -19,10 +13,10 @@ const sbUnordered = quoteSbLinkGenerator('unordered'); - +

Unordered List

- + diff --git a/apps/for-everyone-website/src/components/editorial-typography/Quotes.astro b/apps/for-everyone-website/src/components/editorial-typography/Quotes.astro index 5e533e1493..ab43f9c6a1 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/Quotes.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/Quotes.astro @@ -1,36 +1,36 @@ --- -import * as BlockComponent from './preview/Quote-Block.tsx' -import * as PullComponent from './preview/Quote-Pull.tsx' +import * as BlockComponent from './preview/Quote-Block.tsx'; +import * as PullComponent from './preview/Quote-Pull.tsx'; import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; import Preview from '../utils/Preview.astro'; const {brand} = Astro.props; -const figma = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=754-4370&t=kyDVEfsg2tRJspyY-4'; -const quoteSbLinkGenerator = (type: string) => { - return `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography--quote&args=type:${type}`; -}; -const sbBlock = quoteSbLinkGenerator('block'); -const sbPull = quoteSbLinkGenerator('pull'); - +const storybookId = `${brand}-o3-editorial-typography--quote`; --- -{brand === 'core' || brand === 'professional' && <> -

Block quote

-

- For direct quotations of an author's words from other sources. It's placed within the main flow of article body content. -

- +{ + (brand === 'core' || brand === 'professional') && ( + <> +

Block quote

+

+ For direct quotations of an author's words from other sources. It's + placed within the main flow of article body content. +

- -} + + + + + ) +}

Pull quote

- Pull quote is used to highlight important points within a body of text. It's pulled out and away from the normal flow of article body content, and is left-aligned for larger viewports. + Pull quote is used to highlight important points within a body of text. It's + pulled out and away from the normal flow of article body content, and is + left-aligned for larger viewports.

- - + diff --git a/apps/for-everyone-website/src/components/editorial-typography/TopicTag.astro b/apps/for-everyone-website/src/components/editorial-typography/TopicTag.astro index 13df3b3381..794f038cba 100644 --- a/apps/for-everyone-website/src/components/editorial-typography/TopicTag.astro +++ b/apps/for-everyone-website/src/components/editorial-typography/TopicTag.astro @@ -4,12 +4,9 @@ import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; import Preview from '../utils/Preview.astro'; const {brand} = Astro.props; -const figma = - 'https://www.figma.com/design/y25ZjT1MqqHbNXNXsm8DET/Documentation-Content-Template?node-id=1301-1096&t=kyDVEfsg2tRJspyY-4'; - -const storybook = `https://o3.origami.ft.com/?path=/story/${brand}-o3-editorial-typography--topic-tag`; +const storybookId = `${brand}-o3-editorial-typography--topic-tag` --- - + diff --git a/apps/for-everyone-website/src/components/tooltip/TooltipPreview.astro b/apps/for-everyone-website/src/components/tooltip/TooltipPreview.astro index 4795fc1bc8..d635ef4232 100644 --- a/apps/for-everyone-website/src/components/tooltip/TooltipPreview.astro +++ b/apps/for-everyone-website/src/components/tooltip/TooltipPreview.astro @@ -7,33 +7,11 @@ import FigmaSbLinks from '../utils/FigmaSbLinks.astro'; const brand = Astro.props.brand || 'whitelabel'; const componentName = Astro.props.component; const isToggle = componentName === 'toggle'; -let figma = ''; -if (brand === 'core') { - figma = isToggle - ? 'https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6660-395&t=5MVxMoSUoBEx6m9S-4' - : 'https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6660-336&t=5MVxMoSUoBEx6m9S-4'; -} else if (brand === 'whitelabel') { - figma = isToggle - ? 'https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4433-581&t=5MVxMoSUoBEx6m9S-4' - : 'https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4036-1844&t=5MVxMoSUoBEx6m9S-4'; -} else if (brand === 'professional') { - figma = isToggle - ? 'https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4200-424&t=5MVxMoSUoBEx6m9S-4' - : 'https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4200-365&t=5MVxMoSUoBEx6m9S-4'; -} else if (brand === 'internal') { - figma = isToggle - ? 'https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5626-775&t=JdWiq8zN9s46e6B9-4' - : 'https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5626-716&t=JdWiq8zN9s46e6B9-4'; -} else if (brand === 'sustainable-views') { - figma = isToggle - ? 'https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=6318-473&t=JdWiq8zN9s46e6B9-4' - : 'https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=6318-414&t=JdWiq8zN9s46e6B9-4'; -} -let brandSlug = brand == 'professional' ? 'core-professional' : brand; -let storybook = `https://o3.origami.ft.com/?path=/story/${brandSlug}-o3-tooltip--${componentName}-tooltip`; -let component = isToggle ? Toggletip : OnboardingTooltip; +const component = isToggle ? Toggletip : OnboardingTooltip; +const endOfId = isToggle ? 'toggle-tooltip' : 'onboarding-tooltip'; +const storybookId = `${brand}-o3-tooltip--${endOfId}`; --- - + diff --git a/apps/for-everyone-website/src/components/utils/FigmaSbLinks.astro b/apps/for-everyone-website/src/components/utils/FigmaSbLinks.astro index 3eb23715d4..0090462341 100644 --- a/apps/for-everyone-website/src/components/utils/FigmaSbLinks.astro +++ b/apps/for-everyone-website/src/components/utils/FigmaSbLinks.astro @@ -1,5 +1,32 @@ --- -const {storybook, figma} = Astro.props; +import links from '@financial-times/o3-figma-sb-links'; +const {storybook, figma} = getLinks(Astro.props); + +function getLinks(props) { + let {storybookId, sbPathParams, storybook, figma} = props; + const brandedstorybookId = storybookId?.startsWith('professional') + ? `core-${storybookId}` + : storybookId; + if (!storybook && storybookId) { + const sbPath = links[brandedstorybookId]?.sb; + storybook = `https://o3.origami.ft.com/${sbPath}`; + if (sbPathParams) { + const storybookArgs = `&args=${Object.entries(sbPathParams) + .map(p => `${p[0]}:${p[1]};`) + .join('')}`; + storybook += storybookArgs; + } + } + if (!figma && storybookId) { + const figmaEmbedUrl = links[brandedstorybookId]?.figma; + if (figmaEmbedUrl) { + const urlObj = new URL(figmaEmbedUrl); + const params = new URLSearchParams(urlObj.search); + figma = params.get('url'); + } + } + return {storybook, figma}; +} --- { diff --git a/apps/for-everyone-website/src/content/docs/patterns/pagination.mdx b/apps/for-everyone-website/src/content/docs/patterns/pagination.mdx index 33c6771797..1b6a5132b3 100644 --- a/apps/for-everyone-website/src/content/docs/patterns/pagination.mdx +++ b/apps/for-everyone-website/src/content/docs/patterns/pagination.mdx @@ -167,9 +167,9 @@ Our pagination pattern supports all button themes. For example: ### Standard Pagination - + ### Inverse Pagination
- +
diff --git a/components/o3-button/package.json b/components/o3-button/package.json index 79bd522283..87436c4b0f 100644 --- a/components/o3-button/package.json +++ b/components/o3-button/package.json @@ -30,6 +30,7 @@ }, "private": false, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" } } diff --git a/components/o3-button/stories/core/button.stories.tsx b/components/o3-button/stories/core/button.stories.tsx index 6a25baa9da..f7d98ac9f1 100644 --- a/components/o3-button/stories/core/button.stories.tsx +++ b/components/o3-button/stories/core/button.stories.tsx @@ -2,7 +2,7 @@ import type {Meta} from '@storybook/react'; import {Button as ButtonTsx} from '../../src/tsx/button'; import * as ButtonStories from '../story-templates'; import {Pagination as PaginationTemplate} from '../pagination-template'; - +import links from '@financial-times/o3-figma-sb-links'; import '../../src/css/brands/core.css'; export default { @@ -18,22 +18,21 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-button--button'].figma, + }, }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/VVM0PixrY3IRZq2ZUTdWfU/Core---Design-System?type=design&node-id=2819%3A133&mode=design&t=ISOqmF4aDY2CfuUR-1', -}; - export const Button = ButtonStories.Button; -Button.parameters = { - design: DesignParams, -}; export const LinkAsButton = ButtonStories.LinkAsButton; -LinkAsButton.parameters = { - design: DesignParams, -}; export const GroupedButtons = ButtonStories.GroupedButtons; export const Pagination = PaginationTemplate; +Pagination.parameters = { + design: { + type: 'figma', + url: links['core-o3-button--pagination'].figma, + }, +}; export const SmallButton = ButtonStories.SmallButton; diff --git a/components/o3-button/stories/core/professional/button.stories.tsx b/components/o3-button/stories/core/professional/button.stories.tsx index e411fb0c08..69970f54f4 100644 --- a/components/o3-button/stories/core/professional/button.stories.tsx +++ b/components/o3-button/stories/core/professional/button.stories.tsx @@ -4,6 +4,7 @@ import * as ButtonStories from '../../story-templates'; import {Pagination as PaginationTemplate} from '../../pagination-template'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-button', @@ -26,22 +27,23 @@ export default { }), parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-button--button'].figma, + + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/qfi6fTq5V05b0mnXw3F7q5/Professional---Design-System?type=design&node-id=3604%3A103&mode=design&t=MlrSqBrw4e7aDJ00-1', -}; export const Button = ButtonStories.Button; -Button.parameters = { - design: DesignParams, -}; export const LinkAsButton = ButtonStories.LinkAsButton; -LinkAsButton.parameters = { - design: DesignParams, -}; export const GroupedButtons = ButtonStories.GroupedButtons; export const Pagination = PaginationTemplate; +Pagination.parameters = { + design: { + type: 'figma', + url: links['core-professional-o3-button--pagination'].figma, + }, +}; export const SmallButton = ButtonStories.SmallButton; diff --git a/components/o3-button/stories/internal/button.stories.tsx b/components/o3-button/stories/internal/button.stories.tsx index 6faabe5cca..4eab840688 100644 --- a/components/o3-button/stories/internal/button.stories.tsx +++ b/components/o3-button/stories/internal/button.stories.tsx @@ -4,6 +4,7 @@ import * as ButtonStories from '../story-templates'; import {Pagination as PaginationTemplate} from '../pagination-template'; import '../../src/css/brands/internal.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-button', @@ -17,6 +18,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-button--button'].figma, + }, }, } as Meta; @@ -24,4 +29,10 @@ export const Button = ButtonStories.Button; export const LinkAsButton = ButtonStories.LinkAsButton; export const GroupedButtons = ButtonStories.GroupedButtons; export const Pagination = PaginationTemplate; +Pagination.parameters = { + design: { + type: 'figma', + url: links['internal-o3-button--pagination'].figma, + }, +}; export const SmallButton = ButtonStories.SmallButton; diff --git a/components/o3-button/stories/sustainable-views/button.stories.tsx b/components/o3-button/stories/sustainable-views/button.stories.tsx index 8f436adc20..bec56b10c1 100644 --- a/components/o3-button/stories/sustainable-views/button.stories.tsx +++ b/components/o3-button/stories/sustainable-views/button.stories.tsx @@ -4,7 +4,7 @@ import * as ButtonStories from '../story-templates'; import {Pagination as PaginationTemplate} from '../pagination-template'; import '../../src/css/brands/sustainable-views.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Sustainable Views/o3-button', component: ButtonTsx, @@ -26,27 +26,21 @@ export default { }), parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['sustainable-views-o3-button--button'].figma, + }, }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/VVM0PixrY3IRZq2ZUTdWfU/Core---Design-System?type=design&node-id=2819%3A133&mode=design&t=ISOqmF4aDY2CfuUR-1', -}; - export const Button = ButtonStories.Button; - -Button.parameters = { - design: DesignParams, -}; - export const LinkAsButton = ButtonStories.LinkAsButton; -LinkAsButton.parameters = { - design: DesignParams, -}; - export const GroupedButtons = ButtonStories.GroupedButtons; - export const Pagination = PaginationTemplate; - +Pagination.parameters = { + design: { + type: 'figma', + url: links['sustainable-views-o3-button--pagination'].figma, + }, +}; export const SmallButton = ButtonStories.SmallButton; diff --git a/components/o3-button/stories/whitelabel/button.stories.tsx b/components/o3-button/stories/whitelabel/button.stories.tsx index cf1b40fd8e..7b1bf43f9f 100644 --- a/components/o3-button/stories/whitelabel/button.stories.tsx +++ b/components/o3-button/stories/whitelabel/button.stories.tsx @@ -4,7 +4,7 @@ import * as ButtonStories from '../story-templates'; import {Pagination as PaginationTemplate} from '../pagination-template'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-button', component: ButtonTsx, @@ -20,22 +20,22 @@ export default { backgrounds: { disable: true, }, + design: { + type: 'figma', + url: links['whitelabel-o3-button--button'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=3312%3A89&mode=design&t=TROJD67flS5URgLJ-1', -}; export const Button = ButtonStories.Button; -Button.parameters = { - design: DesignParams, -}; export const LinkAsButton = ButtonStories.LinkAsButton; -LinkAsButton.parameters = { - design: DesignParams, -}; export const GroupedButtons = ButtonStories.GroupedButtons; export const Pagination = PaginationTemplate; +Pagination.parameters = { + design: { + type: 'figma', + url: links['whitelabel-o3-button--pagination'].figma, + }, +}; export const SmallButton = ButtonStories.SmallButton; diff --git a/components/o3-button/tsconfig.json b/components/o3-button/tsconfig.json index da2f6bcc18..1864d58c15 100644 --- a/components/o3-button/tsconfig.json +++ b/components/o3-button/tsconfig.json @@ -1,6 +1,3 @@ { - "extends": "../../tsconfig.json", - "include": [ - "./src/tsx" - ] + "extends": "../../tsconfig.json" } diff --git a/components/o3-editorial-typography/package.json b/components/o3-editorial-typography/package.json index 97e6333025..08f005295c 100644 --- a/components/o3-editorial-typography/package.json +++ b/components/o3-editorial-typography/package.json @@ -31,6 +31,7 @@ }, "private": false, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" } } diff --git a/components/o3-editorial-typography/stories/core/big-number.stories.tsx b/components/o3-editorial-typography/stories/core/big-number.stories.tsx index f90f236fac..2d466b36ec 100644 --- a/components/o3-editorial-typography/stories/core/big-number.stories.tsx +++ b/components/o3-editorial-typography/stories/core/big-number.stories.tsx @@ -3,6 +3,7 @@ import {BigNumber as BigNumberTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,11 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const BigNumber = StoryTemplates.BigNumber; BigNumber.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--big-number'].figma, + }, }; diff --git a/components/o3-editorial-typography/stories/core/body.stories.tsx b/components/o3-editorial-typography/stories/core/body.stories.tsx index d95ad4a12c..3b20644be6 100644 --- a/components/o3-editorial-typography/stories/core/body.stories.tsx +++ b/components/o3-editorial-typography/stories/core/body.stories.tsx @@ -3,6 +3,7 @@ import {Body as BodyTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,11 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const Body = StoryTemplates.Body; Body.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--body'].figma + }, }; diff --git a/components/o3-editorial-typography/stories/core/byline.stories.tsx b/components/o3-editorial-typography/stories/core/byline.stories.tsx index 8f5520b6b2..9996ffe9d6 100644 --- a/components/o3-editorial-typography/stories/core/byline.stories.tsx +++ b/components/o3-editorial-typography/stories/core/byline.stories.tsx @@ -3,6 +3,7 @@ import {Byline as BylineTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,11 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const Byline = StoryTemplates.Byline; Byline.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--byline'].figma + }, }; diff --git a/components/o3-editorial-typography/stories/core/caption.stories.tsx b/components/o3-editorial-typography/stories/core/caption.stories.tsx index 9af6c71fcd..f075a3ab94 100644 --- a/components/o3-editorial-typography/stories/core/caption.stories.tsx +++ b/components/o3-editorial-typography/stories/core/caption.stories.tsx @@ -3,6 +3,7 @@ import {Caption as CaptionTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,11 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const Caption = StoryTemplates.Caption; Caption.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--caption'].figma, + } }; diff --git a/components/o3-editorial-typography/stories/core/headline.stories.tsx b/components/o3-editorial-typography/stories/core/headline.stories.tsx index 322c7f16da..e014b2802e 100644 --- a/components/o3-editorial-typography/stories/core/headline.stories.tsx +++ b/components/o3-editorial-typography/stories/core/headline.stories.tsx @@ -3,6 +3,7 @@ import {Headline} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,13 +21,12 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const Heading = StoryTemplates.Heading; Heading.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--heading'].figma + }, }; diff --git a/components/o3-editorial-typography/stories/core/link.stories.tsx b/components/o3-editorial-typography/stories/core/link.stories.tsx index 88b780c167..528fc22e82 100644 --- a/components/o3-editorial-typography/stories/core/link.stories.tsx +++ b/components/o3-editorial-typography/stories/core/link.stories.tsx @@ -3,6 +3,7 @@ import {Link as LinkTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,11 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const Link = StoryTemplates.Link; Link.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--link'].figma + }, }; diff --git a/components/o3-editorial-typography/stories/core/list.stories.tsx b/components/o3-editorial-typography/stories/core/list.stories.tsx index 591ce8d3f2..cecccbd5a8 100644 --- a/components/o3-editorial-typography/stories/core/list.stories.tsx +++ b/components/o3-editorial-typography/stories/core/list.stories.tsx @@ -3,6 +3,7 @@ import {List as ListTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -22,12 +23,10 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const List = StoryTemplates.List; List.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--list'].figma, + }, }; diff --git a/components/o3-editorial-typography/stories/core/quote.stories.tsx b/components/o3-editorial-typography/stories/core/quote.stories.tsx index fa4cd8f521..bdd838dc75 100644 --- a/components/o3-editorial-typography/stories/core/quote.stories.tsx +++ b/components/o3-editorial-typography/stories/core/quote.stories.tsx @@ -3,6 +3,7 @@ import {Quote as QuoteTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,10 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const Quote = StoryTemplates.Quote; Quote.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--quote'].figma + }, }; diff --git a/components/o3-editorial-typography/stories/core/standfirst.stories.tsx b/components/o3-editorial-typography/stories/core/standfirst.stories.tsx index 2e5faadfd5..949f255a4b 100644 --- a/components/o3-editorial-typography/stories/core/standfirst.stories.tsx +++ b/components/o3-editorial-typography/stories/core/standfirst.stories.tsx @@ -3,6 +3,7 @@ import {StandFirst as StandFirstTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,10 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const StandFirst = StoryTemplates.StandFirst; StandFirst.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--stand-first'].figma + }, }; diff --git a/components/o3-editorial-typography/stories/core/topic-tag.stories.tsx b/components/o3-editorial-typography/stories/core/topic-tag.stories.tsx index 11d038213e..3e779eeae7 100644 --- a/components/o3-editorial-typography/stories/core/topic-tag.stories.tsx +++ b/components/o3-editorial-typography/stories/core/topic-tag.stories.tsx @@ -3,6 +3,7 @@ import {TopicTag as TopicTagTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-editorial-typography', @@ -20,12 +21,10 @@ export default { }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const TopicTag = StoryTemplates.TopicTag; TopicTag.parameters = { - design: DesignParams, + design: { + type: 'figma', + url: links['core-o3-editorial-typography--topic-tag'].figma + }, }; diff --git a/components/o3-editorial-typography/stories/story-templates.tsx b/components/o3-editorial-typography/stories/story-templates.tsx index a667aa95ff..1c4270f169 100644 --- a/components/o3-editorial-typography/stories/story-templates.tsx +++ b/components/o3-editorial-typography/stories/story-templates.tsx @@ -75,6 +75,11 @@ const TemplateSBConfig: Meta = { }, }, }, + parameters: { + design: { + type: 'figma' + } + } }; const HeadlineTemplate: StoryObj = { diff --git a/components/o3-editorial-typography/stories/sustainable-views/pull-quote.stories.tsx b/components/o3-editorial-typography/stories/sustainable-views/pull-quote.stories.tsx index bd0b5d0075..46f8c74a32 100644 --- a/components/o3-editorial-typography/stories/sustainable-views/pull-quote.stories.tsx +++ b/components/o3-editorial-typography/stories/sustainable-views/pull-quote.stories.tsx @@ -25,12 +25,12 @@ const DesignParams = { url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', }; -export const PullQuote = StoryTemplates.Quote; -PullQuote.parameters = { +export const Quote = StoryTemplates.Quote; +Quote.parameters = { design: DesignParams, }; -PullQuote.args = { +Quote.args = { ...StoryTemplates.Quote.args, type: 'pull', quoteSource: '', diff --git a/components/o3-editorial-typography/stories/whitelable/big-number.stories.tsx b/components/o3-editorial-typography/stories/whitelable/big-number.stories.tsx index 5acace2e64..9270a1d98e 100644 --- a/components/o3-editorial-typography/stories/whitelable/big-number.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/big-number.stories.tsx @@ -3,7 +3,7 @@ import {BigNumber as BigNumberTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: BigNumberTsx, @@ -17,15 +17,11 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--big-number'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const BigNumber = StoryTemplates.BigNumber; -BigNumber.parameters = { - design: DesignParams, -}; diff --git a/components/o3-editorial-typography/stories/whitelable/body.stories.tsx b/components/o3-editorial-typography/stories/whitelable/body.stories.tsx index f87d2a643a..e7e23cd6af 100644 --- a/components/o3-editorial-typography/stories/whitelable/body.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/body.stories.tsx @@ -3,7 +3,7 @@ import {Body as BodyTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: BodyTsx, @@ -17,15 +17,12 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--body'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const Body = StoryTemplates.Body; -Body.parameters = { - design: DesignParams, -}; + diff --git a/components/o3-editorial-typography/stories/whitelable/byline.stories.tsx b/components/o3-editorial-typography/stories/whitelable/byline.stories.tsx index 2c2fc6d0ea..1878e23951 100644 --- a/components/o3-editorial-typography/stories/whitelable/byline.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/byline.stories.tsx @@ -3,7 +3,7 @@ import {Byline as BylineTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: BylineTsx, @@ -17,19 +17,14 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'brand', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--byline'].figma, + }, }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const Byline = StoryTemplates.Byline; -Byline.parameters = { - design: DesignParams, -}; - Byline.args = { ...StoryTemplates.Byline.args, brand: 'whitelabel', diff --git a/components/o3-editorial-typography/stories/whitelable/caption.stories.tsx b/components/o3-editorial-typography/stories/whitelable/caption.stories.tsx index ba1a0fd149..c1e4059513 100644 --- a/components/o3-editorial-typography/stories/whitelable/caption.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/caption.stories.tsx @@ -3,7 +3,7 @@ import {Caption as CaptionTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: CaptionTsx, @@ -17,15 +17,13 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--caption'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; + export const Caption = StoryTemplates.Caption; -Caption.parameters = { - design: DesignParams, -}; diff --git a/components/o3-editorial-typography/stories/whitelable/headline.stories.tsx b/components/o3-editorial-typography/stories/whitelable/headline.stories.tsx index 795625dc3d..91922df914 100644 --- a/components/o3-editorial-typography/stories/whitelable/headline.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/headline.stories.tsx @@ -3,7 +3,7 @@ import {Headline} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: Headline, @@ -17,19 +17,14 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'underline', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--heading'].figma, + }, }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const Heading = StoryTemplates.Heading; -Heading.parameters = { - design: DesignParams, -}; - Heading.argTypes = { type: { options: ['headline', 'subheading', 'chapter', 'label'], diff --git a/components/o3-editorial-typography/stories/whitelable/link.stories.tsx b/components/o3-editorial-typography/stories/whitelable/link.stories.tsx index bbf8ed1df1..2cee70c75b 100644 --- a/components/o3-editorial-typography/stories/whitelable/link.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/link.stories.tsx @@ -3,7 +3,7 @@ import {Link as LinkTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: LinkTsx, @@ -17,15 +17,13 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--link'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const Link = StoryTemplates.Link; -Link.parameters = { - design: DesignParams, -}; + diff --git a/components/o3-editorial-typography/stories/whitelable/list.stories.tsx b/components/o3-editorial-typography/stories/whitelable/list.stories.tsx index dfb54eed36..bcd545916f 100644 --- a/components/o3-editorial-typography/stories/whitelable/list.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/list.stories.tsx @@ -3,7 +3,7 @@ import {List as ListTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: ListTsx, @@ -20,15 +20,11 @@ export default { root: '#component-wrapper', }, controls: {exclude: ['theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--list'].figma, + }, }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const List = StoryTemplates.List; -List.parameters = { - design: DesignParams, -}; diff --git a/components/o3-editorial-typography/stories/whitelable/pull-quote.stories.tsx b/components/o3-editorial-typography/stories/whitelable/pull-quote.stories.tsx index b568e89219..a4f751a2a6 100644 --- a/components/o3-editorial-typography/stories/whitelable/pull-quote.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/pull-quote.stories.tsx @@ -3,7 +3,7 @@ import {Quote as QuoteTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: QuoteTsx, @@ -17,20 +17,17 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'type', 'quoteSource', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--quote'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; +export const Quote = StoryTemplates.Quote; -export const PullQuote = StoryTemplates.Quote; -PullQuote.parameters = { - design: DesignParams, -}; -PullQuote.args = { +Quote.args = { ...StoryTemplates.Quote.args, type: 'pull', quoteSource: '', diff --git a/components/o3-editorial-typography/stories/whitelable/standfirst.stories.tsx b/components/o3-editorial-typography/stories/whitelable/standfirst.stories.tsx index 7ef495e054..f3e5c6d372 100644 --- a/components/o3-editorial-typography/stories/whitelable/standfirst.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/standfirst.stories.tsx @@ -3,7 +3,7 @@ import {StandFirst as StandFirstTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: StandFirstTsx, @@ -17,15 +17,12 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--stand-first'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; - export const StandFirst = StoryTemplates.StandFirst; -StandFirst.parameters = { - design: DesignParams, -}; + diff --git a/components/o3-editorial-typography/stories/whitelable/summary.stories.tsx b/components/o3-editorial-typography/stories/whitelable/summary.stories.tsx index 400c5b1a7d..a6cafaefcc 100644 --- a/components/o3-editorial-typography/stories/whitelable/summary.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/summary.stories.tsx @@ -3,7 +3,7 @@ import {Summary as SummaryTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: SummaryTsx, @@ -17,15 +17,12 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--summary'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=3-2&m=dev', -}; export const Summary = StoryTemplates.Summary; -Summary.parameters = { - design: DesignParams, -}; diff --git a/components/o3-editorial-typography/stories/whitelable/topic-tag.stories.tsx b/components/o3-editorial-typography/stories/whitelable/topic-tag.stories.tsx index f2639f5181..df3a353ce0 100644 --- a/components/o3-editorial-typography/stories/whitelable/topic-tag.stories.tsx +++ b/components/o3-editorial-typography/stories/whitelable/topic-tag.stories.tsx @@ -3,7 +3,7 @@ import {TopicTag as TopicTagTsx} from '../../src/tsx/index'; import * as StoryTemplates from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-editorial-typography', component: TopicTagTsx, @@ -17,15 +17,12 @@ export default { parameters: { backgrounds: {default: 'white'}, controls: {exclude: ['children', 'theme']}, + design: { + type: 'figma', + url: links['whitelabel-o3-editorial-typography--topic-tag'].figma, + } }, } as Meta; -const DesignParams = { - type: 'figma', - url: 'https://www.figma.com/file/5ATknbGociZMlnNXX4sy4f/Whitelabel---Design-System?type=design&node-id=4717-652&mode=design&t=Y50jCZbAtgxH2F3S-4', -}; export const TopicTag = StoryTemplates.TopicTag; -TopicTag.parameters = { - design: DesignParams, -}; diff --git a/components/o3-tooltip/package.json b/components/o3-tooltip/package.json index 2aa686fe5f..6c7f4f03a4 100644 --- a/components/o3-tooltip/package.json +++ b/components/o3-tooltip/package.json @@ -33,6 +33,7 @@ "build": "bash ../../scripts/component/build-o3.bash o3-tooltip" }, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" }, "engines": { diff --git a/components/o3-tooltip/stories/core/professional/tooltip.stories.tsx b/components/o3-tooltip/stories/core/professional/tooltip.stories.tsx index 45e7bc2ac4..929cd83079 100644 --- a/components/o3-tooltip/stories/core/professional/tooltip.stories.tsx +++ b/components/o3-tooltip/stories/core/professional/tooltip.stories.tsx @@ -6,7 +6,7 @@ import { } from '../../story-template'; import '../../../src/css/brands/professional.css'; import "../../../../o3-button/src/css/brands/professional.css" - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-tooltip', component: OnboardingTooltipTsx, @@ -23,4 +23,16 @@ export default { } as Meta; export const OnboardingTooltip = OnboardingTooltipStory; +OnboardingTooltip.parameters = { + design: { + type: 'figma', + url: links['core-professional-o3-tooltip--onboarding-tooltip'].figma, + } +} export const ToggleTooltip = ToggleToolTipStory; +ToggleTooltip.parameters = { + design: { + type: 'figma', + url: links['core-professional-o3-tooltip--toggle-tooltip'].figma, + } +} diff --git a/components/o3-tooltip/stories/core/tooltip.stories.tsx b/components/o3-tooltip/stories/core/tooltip.stories.tsx index f7d0dd4c40..c450abb475 100644 --- a/components/o3-tooltip/stories/core/tooltip.stories.tsx +++ b/components/o3-tooltip/stories/core/tooltip.stories.tsx @@ -4,6 +4,9 @@ import { OnboardingTooltip as OnboardingTooltipStory, ToggleToolTip as ToggleToolTipStory, } from '../story-template'; + +import links from '@financial-times/o3-figma-sb-links'; + import '../../src/css/brands/core.css'; import '../../../o3-button/src/css/brands/core.css'; @@ -23,4 +26,16 @@ export default { } as Meta; export const OnboardingTooltip = OnboardingTooltipStory; +OnboardingTooltip.parameters = { + design: { + type: 'figma', + url: links['core-o3-tooltip--onboarding-tooltip'].figma, + }, +}; export const ToggleTooltip = ToggleToolTipStory; +ToggleTooltip.parameters = { + design: { + type: 'figma', + url: links['core-o3-tooltip--toggle-tooltip'].figma, + }, +}; diff --git a/components/o3-tooltip/stories/internal/tooltip.stories.tsx b/components/o3-tooltip/stories/internal/tooltip.stories.tsx index 94c305f343..f79cb5c379 100644 --- a/components/o3-tooltip/stories/internal/tooltip.stories.tsx +++ b/components/o3-tooltip/stories/internal/tooltip.stories.tsx @@ -6,6 +6,7 @@ import { } from '../story-template'; import '../../src/css/brands/internal.css'; import "../../../o3-button/src/css/brands/internal.css" +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-tooltip', @@ -23,4 +24,16 @@ export default { } as Meta; export const OnboardingTooltip = OnboardingTooltipStory; +OnboardingTooltip.parameters = { + design: { + type: 'figma', + url: links['internal-o3-tooltip--onboarding-tooltip'].figma, + } +} export const ToggleTooltip = ToggleToolTipStory; +ToggleTooltip.parameters = { + design: { + type: 'figma', + url: links['internal-o3-tooltip--toggle-tooltip'].figma, + } +} diff --git a/components/o3-tooltip/stories/sb-story-config.ts b/components/o3-tooltip/stories/sb-story-config.ts index d41624c83d..7e4c7d605a 100644 --- a/components/o3-tooltip/stories/sb-story-config.ts +++ b/components/o3-tooltip/stories/sb-story-config.ts @@ -5,7 +5,7 @@ export const TemplateSBConfig: Meta = { html: { root: '#component-wrapper', transform: (code: string) => transformCode(code), - }, + } }, }; diff --git a/components/o3-tooltip/stories/story-template.tsx b/components/o3-tooltip/stories/story-template.tsx index 963b1af1d5..b116b2245e 100644 --- a/components/o3-tooltip/stories/story-template.tsx +++ b/components/o3-tooltip/stories/story-template.tsx @@ -81,10 +81,11 @@ export const OnboardingTooltip: OnBoardingTooltipStory = { export const ToggleToolTip: ToggleTooltipStory = { ...ToggleTemplateStory, args: { - content: 'tooltip content that is quite long and has some information about the target', + content: + 'tooltip content that is quite long and has some information about the target', title: 'Title', placement: 'right', - infoLabel: "more information" + infoLabel: 'more information', }, argTypes: { placement: { diff --git a/components/o3-tooltip/stories/sustainable-views/tooltip.stories.tsx b/components/o3-tooltip/stories/sustainable-views/tooltip.stories.tsx index 38ef8985b2..81451f87b2 100644 --- a/components/o3-tooltip/stories/sustainable-views/tooltip.stories.tsx +++ b/components/o3-tooltip/stories/sustainable-views/tooltip.stories.tsx @@ -6,7 +6,7 @@ import { } from '../story-template'; import '../../src/css/brands/sustainable-views.css'; import "../../../o3-button/src/css/brands/sustainable-views.css" - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Sustainable Views/o3-tooltip', component: OnboardingTooltipTsx, @@ -23,4 +23,16 @@ export default { } as Meta; export const OnboardingTooltip = OnboardingTooltipStory; +OnboardingTooltip.parameters = { + design: { + type: 'figma', + url: links['sustainable-views-o3-tooltip--onboarding-tooltip'].figma, + } +} export const ToggleTooltip = ToggleToolTipStory; +ToggleTooltip.parameters = { + design: { + type: 'figma', + url: links['sustainable-views-o3-tooltip--toggle-tooltip'].figma, + } +} diff --git a/components/o3-tooltip/stories/whitelabel/tooltip.stories.tsx b/components/o3-tooltip/stories/whitelabel/tooltip.stories.tsx index 96ca07a26b..45662e4132 100644 --- a/components/o3-tooltip/stories/whitelabel/tooltip.stories.tsx +++ b/components/o3-tooltip/stories/whitelabel/tooltip.stories.tsx @@ -6,7 +6,7 @@ import { } from '../story-template'; import '../../src/css/brands/whitelabel.css'; import "../../../o3-button/src/css/brands/whitelabel.css"; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-tooltip', component: OnboardingTooltipTsx, @@ -23,4 +23,16 @@ export default { } as Meta; export const OnboardingTooltip = OnboardingTooltipStory; +OnboardingTooltip.parameters = { + design: { + type: 'figma', + url: links['whitelabel-o3-tooltip--onboarding-tooltip'].figma, + } +} export const ToggleTooltip = ToggleToolTipStory; +ToggleTooltip.parameters = { + design: { + type: 'figma', + url: links['whitelabel-o3-tooltip--toggle-tooltip'].figma, + } +} diff --git a/components/o3-tooltip/tsconfig.json b/components/o3-tooltip/tsconfig.json index ce6a831645..1864d58c15 100644 --- a/components/o3-tooltip/tsconfig.json +++ b/components/o3-tooltip/tsconfig.json @@ -1,6 +1,3 @@ { - "extends": "../../tsconfig.json", - "include": [ - "./src/tsx", "./src/ts/index.ts" - ] + "extends": "../../tsconfig.json" } diff --git a/components/o3-typography/package.json b/components/o3-typography/package.json index a5f60cf11b..9ec589249a 100644 --- a/components/o3-typography/package.json +++ b/components/o3-typography/package.json @@ -30,6 +30,7 @@ }, "private": false, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" } } diff --git a/components/o3-typography/stories/core/body.stories.tsx b/components/o3-typography/stories/core/body.stories.tsx index d85efe48ad..e1804a648f 100644 --- a/components/o3-typography/stories/core/body.stories.tsx +++ b/components/o3-typography/stories/core/body.stories.tsx @@ -3,6 +3,8 @@ import * as TypographyStories from '../story-templates'; import {Body} from '../../src/tsx'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; + export default { title: 'Core/o3-typography/Body', component: Body, @@ -15,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography-body--body-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/core/caption.stories.tsx b/components/o3-typography/stories/core/caption.stories.tsx index f5bb186b7f..b446cb0d39 100644 --- a/components/o3-typography/stories/core/caption.stories.tsx +++ b/components/o3-typography/stories/core/caption.stories.tsx @@ -4,6 +4,7 @@ import * as TypographyStories from '../story-templates'; import '../../main.css'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-typography/Caption', @@ -17,6 +18,11 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography-caption--caption-story'].figma, + + } }, } as Meta; diff --git a/components/o3-typography/stories/core/footer.stories.tsx b/components/o3-typography/stories/core/footer.stories.tsx index df6dd16353..3dbf04703b 100644 --- a/components/o3-typography/stories/core/footer.stories.tsx +++ b/components/o3-typography/stories/core/footer.stories.tsx @@ -3,6 +3,7 @@ import * as TypographyStories from '../story-templates'; import {Footer} from '../../src/tsx'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-typography/Footer', @@ -16,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography-footer--footer-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/core/heading.stories.tsx b/components/o3-typography/stories/core/heading.stories.tsx index e65c2e387e..a6ad4ca595 100644 --- a/components/o3-typography/stories/core/heading.stories.tsx +++ b/components/o3-typography/stories/core/heading.stories.tsx @@ -4,6 +4,7 @@ import * as TypographyStories from '../story-templates'; import '../../main.css'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-typography/Heading', @@ -17,6 +18,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography-heading--heading-story'].figma + } }, argTypes: { text: { diff --git a/components/o3-typography/stories/core/link.stories.tsx b/components/o3-typography/stories/core/link.stories.tsx index 513ceadbe7..b067e4277d 100644 --- a/components/o3-typography/stories/core/link.stories.tsx +++ b/components/o3-typography/stories/core/link.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import {Link, Body} from '../../src/tsx'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-typography/Link', @@ -15,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography-link--links'].figma, + }, }, argTypes: { theme: { diff --git a/components/o3-typography/stories/core/orderedList.stories.tsx b/components/o3-typography/stories/core/orderedList.stories.tsx index fa29f5effb..11cd683cc5 100644 --- a/components/o3-typography/stories/core/orderedList.stories.tsx +++ b/components/o3-typography/stories/core/orderedList.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../story-templates'; import {OrderedList} from '../../src/tsx'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-typography/OrderedList', @@ -15,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography-orderedlist--ordered-list-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/core/professional/body.stories.tsx b/components/o3-typography/stories/core/professional/body.stories.tsx index 260fa38449..5154f55727 100644 --- a/components/o3-typography/stories/core/professional/body.stories.tsx +++ b/components/o3-typography/stories/core/professional/body.stories.tsx @@ -3,6 +3,8 @@ import * as TypographyStories from '../../story-templates'; import {Body} from '../../../src/tsx'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; + export default { title: 'Core/Professional/o3-typography/Body', component: Body, @@ -15,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-typography-body--body-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/core/professional/caption.stories.tsx b/components/o3-typography/stories/core/professional/caption.stories.tsx index c66e126b8d..cee22da9e8 100644 --- a/components/o3-typography/stories/core/professional/caption.stories.tsx +++ b/components/o3-typography/stories/core/professional/caption.stories.tsx @@ -4,6 +4,7 @@ import * as TypographyStories from '../../story-templates'; import '../../../main.css'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-typography/Caption', @@ -17,6 +18,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-typography-caption--caption-story'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/core/professional/footer.stories.tsx b/components/o3-typography/stories/core/professional/footer.stories.tsx index 5499859202..b9607e4cda 100644 --- a/components/o3-typography/stories/core/professional/footer.stories.tsx +++ b/components/o3-typography/stories/core/professional/footer.stories.tsx @@ -3,6 +3,7 @@ import * as TypographyStories from '../../story-templates'; import {Footer} from '../../../src/tsx'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-typography/Footer', @@ -16,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-typography-footer--footer-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/core/professional/heading.stories.tsx b/components/o3-typography/stories/core/professional/heading.stories.tsx index f96d50ea2a..d8fbaa1bb3 100644 --- a/components/o3-typography/stories/core/professional/heading.stories.tsx +++ b/components/o3-typography/stories/core/professional/heading.stories.tsx @@ -4,6 +4,7 @@ import * as TypographyStories from '../../story-templates'; import '../../../main.css'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-typography/Heading', @@ -17,6 +18,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-typography-heading--heading-story'].figma, + }, }, argTypes: { text: { diff --git a/components/o3-typography/stories/core/professional/link.stories.tsx b/components/o3-typography/stories/core/professional/link.stories.tsx index 90d23f8580..c691cc6af4 100644 --- a/components/o3-typography/stories/core/professional/link.stories.tsx +++ b/components/o3-typography/stories/core/professional/link.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import {Link, Body} from '../../../src/tsx'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-typography/Link', @@ -15,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-typography-link--links'].figma, + }, }, argTypes: { theme: { diff --git a/components/o3-typography/stories/core/professional/orderedList.stories.tsx b/components/o3-typography/stories/core/professional/orderedList.stories.tsx index e7e88c35d6..bbc53788a9 100644 --- a/components/o3-typography/stories/core/professional/orderedList.stories.tsx +++ b/components/o3-typography/stories/core/professional/orderedList.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../../story-templates'; import {OrderedList} from '../../../src/tsx'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-typography/OrderedList', @@ -15,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-typography-orderedlist--ordered-list-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/core/professional/unorderedList.stories.tsx b/components/o3-typography/stories/core/professional/unorderedList.stories.tsx index 0309307c80..c37bbaf55f 100644 --- a/components/o3-typography/stories/core/professional/unorderedList.stories.tsx +++ b/components/o3-typography/stories/core/professional/unorderedList.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../../story-templates'; import {UnorderedList} from '../../../src/tsx'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-typography/UnorderedList', @@ -15,6 +16,12 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links[ + 'core-professional-o3-typography-unorderedlist--unordered-list-story' + ].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/core/professional/wrapper.stories.tsx b/components/o3-typography/stories/core/professional/wrapper.stories.tsx index c5586b5809..e9c2cab55a 100644 --- a/components/o3-typography/stories/core/professional/wrapper.stories.tsx +++ b/components/o3-typography/stories/core/professional/wrapper.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import {Wrapper} from '../../../src/tsx'; import * as TypographyStories from '../../story-templates'; import '../../../src/css/brands/professional.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/Professional/o3-typography', @@ -15,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-professional-o3-typography--wrapper-story'].figma, + }, }, argTypes: { theme: { diff --git a/components/o3-typography/stories/core/unorderedList.stories.tsx b/components/o3-typography/stories/core/unorderedList.stories.tsx index 56c4114ac8..4493374014 100644 --- a/components/o3-typography/stories/core/unorderedList.stories.tsx +++ b/components/o3-typography/stories/core/unorderedList.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../story-templates'; import {UnorderedList} from '../../src/tsx'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-typography/UnorderedList', @@ -15,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography-unorderedlist--unordered-list-story'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/core/wrapper.stories.tsx b/components/o3-typography/stories/core/wrapper.stories.tsx index fe0fbfbd05..6dd20e3b1f 100644 --- a/components/o3-typography/stories/core/wrapper.stories.tsx +++ b/components/o3-typography/stories/core/wrapper.stories.tsx @@ -2,6 +2,7 @@ import type {Meta} from '@storybook/react'; import {Wrapper} from '../../src/tsx'; import * as TypographyStories from '../story-templates'; import '../../src/css/brands/core.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Core/o3-typography', @@ -15,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'paper'}, + design: { + type: 'figma', + url: links['core-o3-typography--wrapper-story'].figma, + } }, argTypes: { theme: { diff --git a/components/o3-typography/stories/internal/body.stories.tsx b/components/o3-typography/stories/internal/body.stories.tsx index 5883a62e57..86ae7f2bc4 100644 --- a/components/o3-typography/stories/internal/body.stories.tsx +++ b/components/o3-typography/stories/internal/body.stories.tsx @@ -3,7 +3,7 @@ import {Body as BodyTsx} from '../../src/tsx'; import '../../src/css/brands/internal.css'; import {Meta} from '@storybook/react'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography/Body', component: BodyTsx, @@ -16,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography-body--body'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/internal/caption.stories.tsx b/components/o3-typography/stories/internal/caption.stories.tsx index 257261136a..b8d7355312 100644 --- a/components/o3-typography/stories/internal/caption.stories.tsx +++ b/components/o3-typography/stories/internal/caption.stories.tsx @@ -4,7 +4,7 @@ import * as TypographyStories from '../story-templates'; import '../../main.css'; import '../../src/css/brands/internal.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography/Caption', component: Caption, @@ -17,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography-caption--caption-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/internal/footer.stories.tsx b/components/o3-typography/stories/internal/footer.stories.tsx index eea069fbf8..14163ff1e1 100644 --- a/components/o3-typography/stories/internal/footer.stories.tsx +++ b/components/o3-typography/stories/internal/footer.stories.tsx @@ -3,7 +3,7 @@ import * as TypographyStories from '../story-templates'; import {Footer} from '../../src/tsx'; import '../../src/css/brands/internal.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography/Footer', component: Footer, @@ -16,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography-footer--footer-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/internal/heading.stories.tsx b/components/o3-typography/stories/internal/heading.stories.tsx index ff6163fe62..859cf74f00 100644 --- a/components/o3-typography/stories/internal/heading.stories.tsx +++ b/components/o3-typography/stories/internal/heading.stories.tsx @@ -3,7 +3,7 @@ import {Heading as HeadingTsx} from '../../src/tsx'; import * as TypographyStories from '../story-templates'; import '../../src/css/brands/internal.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography/Heading', component: HeadingTsx, @@ -16,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography-heading--heading-story'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/internal/link.stories.tsx b/components/o3-typography/stories/internal/link.stories.tsx index b3cbb4003e..34c2f6ffb3 100644 --- a/components/o3-typography/stories/internal/link.stories.tsx +++ b/components/o3-typography/stories/internal/link.stories.tsx @@ -3,7 +3,7 @@ import {Link as LinkTsx} from '../../src/tsx'; import '../../src/css/brands/internal.css'; import {Meta} from '@storybook/react'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography/Link', component: LinkTsx, @@ -17,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography-link--link'].figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/internal/orderedList.stories.tsx b/components/o3-typography/stories/internal/orderedList.stories.tsx index 3c9d584db6..eefaf7e092 100644 --- a/components/o3-typography/stories/internal/orderedList.stories.tsx +++ b/components/o3-typography/stories/internal/orderedList.stories.tsx @@ -2,7 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../story-templates'; import {OrderedList} from '../../src/tsx'; import '../../src/css/brands/internal.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography/OrderedList', component: OrderedList, @@ -15,6 +15,11 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography-orderedlist--ordered-list-story'] + .figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/internal/unorderedList.stories.tsx b/components/o3-typography/stories/internal/unorderedList.stories.tsx index 7720f91a2b..128e57ffcd 100644 --- a/components/o3-typography/stories/internal/unorderedList.stories.tsx +++ b/components/o3-typography/stories/internal/unorderedList.stories.tsx @@ -2,7 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../story-templates'; import {UnorderedList} from '../../src/tsx'; import '../../src/css/brands/internal.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography/UnorderedList', component: UnorderedList, @@ -15,6 +15,11 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography-unorderedlist--unordered-list-story'] + .figma, + }, }, } as Meta; diff --git a/components/o3-typography/stories/internal/wrapper.stories.tsx b/components/o3-typography/stories/internal/wrapper.stories.tsx index e7f42185ab..e1e01c1a37 100644 --- a/components/o3-typography/stories/internal/wrapper.stories.tsx +++ b/components/o3-typography/stories/internal/wrapper.stories.tsx @@ -2,7 +2,7 @@ import type {Meta} from '@storybook/react'; import {Wrapper} from '../../src/tsx'; import * as TypographyStories from '../story-templates'; import '../../src/css/brands/internal.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Internal/o3-typography', component: Wrapper, @@ -15,6 +15,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['internal-o3-typography--wrapper-story'].figma, + }, }, argTypes: { theme: { diff --git a/components/o3-typography/stories/whitelabel/body.stories.tsx b/components/o3-typography/stories/whitelabel/body.stories.tsx index e6507ff2de..d114f54688 100644 --- a/components/o3-typography/stories/whitelabel/body.stories.tsx +++ b/components/o3-typography/stories/whitelabel/body.stories.tsx @@ -4,6 +4,7 @@ import {Body as BodyTsx} from '../../src/tsx'; import '../../src/css/brands/whitelabel.css'; import {Meta} from '@storybook/react'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography/Body', component: BodyTsx, @@ -16,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography-body--body'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/whitelabel/caption.stories.tsx b/components/o3-typography/stories/whitelabel/caption.stories.tsx index 198530661c..44422450ec 100644 --- a/components/o3-typography/stories/whitelabel/caption.stories.tsx +++ b/components/o3-typography/stories/whitelabel/caption.stories.tsx @@ -4,6 +4,7 @@ import * as TypographyStories from '../story-templates'; import '../../main.css'; import '../../src/css/brands/whitelabel.css'; +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography/Caption', @@ -17,6 +18,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography-caption--caption-story'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/whitelabel/footer.stories.tsx b/components/o3-typography/stories/whitelabel/footer.stories.tsx index 75333c1018..f573d3800b 100644 --- a/components/o3-typography/stories/whitelabel/footer.stories.tsx +++ b/components/o3-typography/stories/whitelabel/footer.stories.tsx @@ -3,7 +3,7 @@ import * as TypographyStories from '../story-templates'; import {Footer} from '../../src/tsx'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography/Footer', component: Footer, @@ -16,6 +16,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography-footer--footer-story'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/whitelabel/heading.stories.tsx b/components/o3-typography/stories/whitelabel/heading.stories.tsx index 3b8ea09f5a..6a45455614 100644 --- a/components/o3-typography/stories/whitelabel/heading.stories.tsx +++ b/components/o3-typography/stories/whitelabel/heading.stories.tsx @@ -4,7 +4,7 @@ import * as TypographyStories from '../story-templates'; import '../../main.css'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography/Heading', component: HeadingTsx, @@ -17,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography-heading--heading-story'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/whitelabel/link.stories.tsx b/components/o3-typography/stories/whitelabel/link.stories.tsx index 23f416ffb6..d582426594 100644 --- a/components/o3-typography/stories/whitelabel/link.stories.tsx +++ b/components/o3-typography/stories/whitelabel/link.stories.tsx @@ -3,7 +3,7 @@ import {Link as LinkTsx} from '../../src/tsx'; import '../../src/css/brands/whitelabel.css'; import {Meta} from '@storybook/react'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography/Link', component: LinkTsx, @@ -17,6 +17,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography-link--link'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/whitelabel/orderedList.stories.tsx b/components/o3-typography/stories/whitelabel/orderedList.stories.tsx index dd6056c87b..4797be4dee 100644 --- a/components/o3-typography/stories/whitelabel/orderedList.stories.tsx +++ b/components/o3-typography/stories/whitelabel/orderedList.stories.tsx @@ -2,7 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../story-templates'; import {OrderedList} from '../../src/tsx'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography/OrderedList', component: OrderedList, @@ -15,6 +15,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography-orderedlist--ordered-list-story'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/whitelabel/unorderedList.stories.tsx b/components/o3-typography/stories/whitelabel/unorderedList.stories.tsx index 65753cb902..536cabfc7b 100644 --- a/components/o3-typography/stories/whitelabel/unorderedList.stories.tsx +++ b/components/o3-typography/stories/whitelabel/unorderedList.stories.tsx @@ -2,7 +2,7 @@ import type {Meta} from '@storybook/react'; import * as TypographyStories from '../story-templates'; import {UnorderedList} from '../../src/tsx'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography/UnorderedList', component: UnorderedList, @@ -15,6 +15,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography-unorderedlist--unordered-list-story'].figma, + } }, } as Meta; diff --git a/components/o3-typography/stories/whitelabel/wrapper.stories.tsx b/components/o3-typography/stories/whitelabel/wrapper.stories.tsx index c34feff296..e11c107986 100644 --- a/components/o3-typography/stories/whitelabel/wrapper.stories.tsx +++ b/components/o3-typography/stories/whitelabel/wrapper.stories.tsx @@ -2,7 +2,7 @@ import type {Meta} from '@storybook/react'; import {Wrapper} from '../../src/tsx'; import * as TypographyStories from '../story-templates'; import '../../src/css/brands/whitelabel.css'; - +import links from '@financial-times/o3-figma-sb-links'; export default { title: 'Whitelabel/o3-typography', component: Wrapper, @@ -15,6 +15,10 @@ export default { ], parameters: { backgrounds: {default: 'white'}, + design: { + type: 'figma', + url: links['whitelabel-o3-typography--wrapper-story'].figma, + } }, argTypes: { theme: { diff --git a/components/o3-typography/tsconfig.json b/components/o3-typography/tsconfig.json index da2f6bcc18..1864d58c15 100644 --- a/components/o3-typography/tsconfig.json +++ b/components/o3-typography/tsconfig.json @@ -1,6 +1,3 @@ { - "extends": "../../tsconfig.json", - "include": [ - "./src/tsx" - ] + "extends": "../../tsconfig.json" } diff --git a/libraries/o3-figma-sb-links/.eslintrc.cjs b/libraries/o3-figma-sb-links/.eslintrc.cjs new file mode 100644 index 0000000000..b331d6cfbf --- /dev/null +++ b/libraries/o3-figma-sb-links/.eslintrc.cjs @@ -0,0 +1,3 @@ +module.exports = { + "extends": "origami-component" +}; diff --git a/libraries/o3-figma-sb-links/.gitignore b/libraries/o3-figma-sb-links/.gitignore new file mode 100644 index 0000000000..9be0d26213 --- /dev/null +++ b/libraries/o3-figma-sb-links/.gitignore @@ -0,0 +1,9 @@ +.DS_Store +.env +/.sass-cache/ +/bower_components/ +/node_modules/ +.idea/ +/demos/local +/coverage +!icons/ diff --git a/libraries/o3-figma-sb-links/.npmignore b/libraries/o3-figma-sb-links/.npmignore new file mode 100644 index 0000000000..c728cb8af1 --- /dev/null +++ b/libraries/o3-figma-sb-links/.npmignore @@ -0,0 +1,13 @@ +.env +.gitignore +.npmignore +.eslintrc.cjs +.remarkrc.cjs +.stylelintrc.cjs +.prettierrc.toml +.eslintignore +.stylelintignore +stories/ +src/tsx/ +.github/ +test/ diff --git a/libraries/o3-figma-sb-links/.prettierrc.toml b/libraries/o3-figma-sb-links/.prettierrc.toml new file mode 100644 index 0000000000..62ad41e70c --- /dev/null +++ b/libraries/o3-figma-sb-links/.prettierrc.toml @@ -0,0 +1,8 @@ +printWidth = 80 +trailingComma = "es5" +semi = true +singleQuote = true +useTabs = true +bracketSpacing = false +jsxBracketSameLine = true +arrowParens = "avoid" diff --git a/libraries/o3-figma-sb-links/.remarkrc.cjs b/libraries/o3-figma-sb-links/.remarkrc.cjs new file mode 100644 index 0000000000..ec5166b376 --- /dev/null +++ b/libraries/o3-figma-sb-links/.remarkrc.cjs @@ -0,0 +1 @@ +module.exports.plugins = [require("remark-preset-lint-origami-component")] diff --git a/libraries/o3-figma-sb-links/.stylelintrc.cjs b/libraries/o3-figma-sb-links/.stylelintrc.cjs new file mode 100644 index 0000000000..53330b263c --- /dev/null +++ b/libraries/o3-figma-sb-links/.stylelintrc.cjs @@ -0,0 +1,3 @@ +module.exports = { + "extends": "stylelint-config-origami-component" +}; \ No newline at end of file diff --git a/libraries/o3-figma-sb-links/CHANGELOG.md b/libraries/o3-figma-sb-links/CHANGELOG.md new file mode 100644 index 0000000000..4dc68c6ff8 --- /dev/null +++ b/libraries/o3-figma-sb-links/CHANGELOG.md @@ -0,0 +1,2 @@ +# Changelog + diff --git a/libraries/o3-figma-sb-links/README.md b/libraries/o3-figma-sb-links/README.md new file mode 100644 index 0000000000..523c27a162 --- /dev/null +++ b/libraries/o3-figma-sb-links/README.md @@ -0,0 +1,79 @@ +# o3-figma-sb-links + +`o3-figma-sb-links` provides links for Storybook and Figma that are related to the O3 components. This package can be used by other components to provide Figma files and is source of truth for the Figma and Storybook links. Main purpose of this package is to provide links to Figma files for the O3 components and also to origami-for-everyone site. + +- [o3-figma-sb-links](#o3-figma-sb-links) + - [Usage](#usage) + - [Migration](#migration) + - [Contact](#contact) + - [Licence](#licence) + +## Usage + +`o3-figma-sb-links` exports a json file that contains links to Figma and Storybook for the O3 components. The links can be retrieved by story ids. Story ids are retrieved using [@storybook/csf-tools](https://www.npmjs.com/package/@storybook/csf-tools) package. Example of `.stories` file: + +```jsx +export default { + title: 'Core/o3-button' +}; +export const Button = ButtonStories.Button; +export const ButtonSmall = ButtonStories.ButtonSmall; +``` + +The story IDs are a composite of the Component's title and exported name. In our case, title is combination of `BRAND` and `COMPONENT` and component name is `VARIANT`. The story ID is then: + +```txt +core-o3-button--button +[BRAND]-[COMPONENT]--[VARIANT] + +core-o3-button--button-small +[BRAND]-[COMPONENT]--[VARIANT] + +``` + +To use the links in your project, import the links from the package: + +```js +import links from "@financial-times/o3-figma-sb-links"; +``` + +json structure: + +```json +{ + "STORY-ID-1": { + "figma": "FIGMA-LINK", + "sb": "STORYBOOK-LINK" + }, + "STORY-ID-2": { + "figma": "FIGMA-LINK", + "sb": "STORYBOOK-LINK" + } +} +``` + +where figma links are absolute links to the Figma files and sb links are relative paths to provided hostname. + +### Adding new links + +Links for storybook are generated by the build script but figma links need to be updated for each story manually. For each story the build script will also create an ID field in `src/figma-links.json` file with a blank value assigned to it. To add new links, update the `src/figma-links.json` file and run the build script again. + +```bash +npm run build +``` + +This will update `links.json` file with new links. + +## Migration + +| State | Major Version | Last Minor Release | Migration guide | +| :-------: | :-----------: | :----------------: | :-------------: | +| ✨ active | 0 | N/A | N/A | + +## Contact + +If you have any questions or comments about this component, or need help using it, please either [raise an issue](https://github.com/Financial-Times/origami/issues/new?labels=o-buttons-experimental,components), visit [#origami-support](https://financialtimes.slack.com/messages/#origami-support/) or email [origami.support@ft.com](mailto:origami.support@ft.com). + +## Licence + +This software is published by the Financial Times under the [MIT licence](http://opensource.org/licenses/MIT). diff --git a/libraries/o3-figma-sb-links/package.json b/libraries/o3-figma-sb-links/package.json new file mode 100644 index 0000000000..cc0b7a875d --- /dev/null +++ b/libraries/o3-figma-sb-links/package.json @@ -0,0 +1,33 @@ +{ + "name": "@financial-times/o3-figma-sb-links", + "version": "0.0.0", + "description": "package to keep links consistent for figma and storybook", + "keywords": [ + "figma-links", + "storybook links" + ], + "homepage": "https://github.com/Financial-Times/origami/tree/main/libraries/o3-figma-sb-links", + "bugs": { + "url": "https://github.com/Financial-Times/origami/issues/new?labels=o3-figma-sb-links,libraries", + "email": "origami.support@ft.com" + }, + "license": "MIT", + "type": "module", + "exports": { + ".": "./src/links.json" + }, + "files": [ + "src/links.json" + ], + "scripts": { + "build": "npm run metadata && node ./src/build-links.js", + "metadata": "node ./src/create-metadata.js" + }, + "engines": { + "npm": ">7" + }, + "private": true, + "dependencies": { + "@storybook/csf-tools": "^8.1.10" + } +} diff --git a/libraries/o3-figma-sb-links/src/build-links.js b/libraries/o3-figma-sb-links/src/build-links.js new file mode 100644 index 0000000000..e7ce684ff9 --- /dev/null +++ b/libraries/o3-figma-sb-links/src/build-links.js @@ -0,0 +1,62 @@ +import fs from 'fs'; +import path from 'path'; +import {fileURLToPath} from 'url'; + +const __filename = fileURLToPath(import.meta.url); +const __dirname = path.dirname(__filename); + +const figmaLinks = JSON.parse(fs.readFileSync(__dirname + '/figma-links.json')); +const sbLinks = JSON.parse(fs.readFileSync(__dirname + '/sb-links.json')); +const linksJson = JSON.parse(fs.readFileSync(__dirname + '/links.json')); +const figmaLinkIds = Object.keys(figmaLinks); +const sbLinkIds = Object.keys(sbLinks); + +function buildLinks() { + figmaLinkIds.forEach(id => { + if (!linksJson[id]) { + linksJson[id] = {}; + } + const convertedFigmaLink = convertFigmaStringsToEmbedStrings(figmaLinks[id]); + if (figmaLinks[id]) { + if (!linksJson[id].figma) { + linksJson[id].figma = convertedFigmaLink; + } else if (linksJson[id].figma !== convertedFigmaLink) { + linksJson[id].figma = convertedFigmaLink; + } + } else if (linksJson[id].figma && !figmaLinks[id]) { + linksJson[id].figma = ''; + } + }); + + sbLinkIds.forEach(id => { + if (!linksJson[id]) { + linksJson[id] = {}; + } + if (!linksJson[id].sb) { + linksJson[id].sb = sbLinks[id]; + } + }); + + // order the links by id + + const orderedLinks = {}; + + Object.keys(linksJson) + .sort() + .forEach(key => { + orderedLinks[key] = linksJson[key]; + }); + + fs.writeFileSync( + __dirname + '/links.json', + JSON.stringify(orderedLinks, null, 2) + ); +} + +function convertFigmaStringsToEmbedStrings(str) { + return `https://www.figma.com/embed?embed_host=share&url=${encodeURIComponent( + str + )}`; +} + +buildLinks(); diff --git a/libraries/o3-figma-sb-links/src/create-metadata.js b/libraries/o3-figma-sb-links/src/create-metadata.js new file mode 100644 index 0000000000..ebdb1364f1 --- /dev/null +++ b/libraries/o3-figma-sb-links/src/create-metadata.js @@ -0,0 +1,97 @@ +import fs from 'fs'; +import path from 'path'; +import {fileURLToPath} from 'url'; +import {loadCsf} from '@storybook/csf-tools'; + +const __filename = fileURLToPath(import.meta.url); +const __dirname = path.dirname(__filename); + +const figmaLinks = JSON.parse(fs.readFileSync(__dirname + '/figma-links.json')); +const sbLinks = JSON.parse(fs.readFileSync(__dirname + '/sb-links.json')); +const figmaLinkIds = Object.keys(figmaLinks); +const sbLinkIds = Object.keys(sbLinks); + +function generateSbMetadata() { + const componentsDir = path.join(__dirname, '..', '..', '..', 'components'); + + const dirContent = fs + .readdirSync(componentsDir) + .filter(dir => dir.startsWith('o3-')); + const storyFiles = []; + // check if the dir has a stories file + dirContent.forEach(dir => { + const storiesFiles = getStoriesFiles(path.join(componentsDir, dir)); + if (storiesFiles.length) { + storyFiles.push(...storiesFiles); + } + }); + + storyFiles.forEach(file => { + const {_stories} = extractStoryFileMetaData(file); + const ids = getStoryIds(_stories); + + const missingFigmaLinks = ids.filter(id => !figmaLinkIds.includes(id)); + const missingSbLinks = ids.filter(id => !sbLinkIds.includes(id)); + + if (missingFigmaLinks.length) { + missingFigmaLinks.forEach(id => { + figmaLinks[id] = ''; + }); + } + + if (missingSbLinks.length) { + missingSbLinks.forEach(id => { + sbLinks[id] = `?path=/story/${id}`; + }); + } + }); + // order the links by id + const orderedFigmaLinks = {}; + Object.keys(figmaLinks) + .sort() + .forEach(key => { + orderedFigmaLinks[key] = figmaLinks[key]; + }); + + fs.writeFileSync( + __dirname + '/figma-links.json', + JSON.stringify(orderedFigmaLinks, null, 2) + ); + fs.writeFileSync( + __dirname + '/sb-links.json', + JSON.stringify(sbLinks, null, 2) + ); +} + +function getStoriesFiles(dir, fileList = []) { + // recursively get all files in the directory that contain .stories. in its name + const files = fs.readdirSync(dir); + files.forEach(file => { + const filePath = path.join(dir, file); + if (fs.statSync(filePath).isDirectory()) { + getStoriesFiles(filePath, fileList); + } else if (file.includes('.stories.')) { + fileList.push(filePath); + } + }); + return fileList; +} + +function extractStoryFileMetaData(filePath) { + const content = fs.readFileSync(filePath, 'utf-8'); + const makeTitle = userTitle => userTitle || 'default'; + const csfObj = loadCsf(content, {makeTitle}).parse(); + const {_meta, _stories} = csfObj; + return {_meta, _stories}; +} + +function getStoryIds(stories) { + const keys = Object.keys(stories); + const ids = []; + keys.forEach(key => { + ids.push(stories[key].id); + }); + return ids; +} + +generateSbMetadata(); diff --git a/libraries/o3-figma-sb-links/src/figma-links.json b/libraries/o3-figma-sb-links/src/figma-links.json new file mode 100644 index 0000000000..36dcee5a61 --- /dev/null +++ b/libraries/o3-figma-sb-links/src/figma-links.json @@ -0,0 +1,100 @@ +{ + "core-o3-button--button": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=2819-133&t=3nAdE1vRK549Suhi-0", + "core-o3-button--grouped-buttons": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=2819-133&t=3nAdE1vRK549Suhi-0", + "core-o3-button--link-as-button": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=2819-133&t=3nAdE1vRK549Suhi-0", + "core-o3-button--pagination": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=5463-1742&t=3nAdE1vRK549Suhi-0", + "core-o3-button--small-button": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=2819-133&t=3nAdE1vRK549Suhi-0", + "core-o3-editorial-typography--big-number": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=7030-189&t=OXWNvTZ67QPdakfd-4", + "core-o3-editorial-typography--body": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6420-5508&t=58TFgNdha3aoeQtE-4", + "core-o3-editorial-typography--byline": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=7030-198&t=OXWNvTZ67QPdakfd-4", + "core-o3-editorial-typography--caption": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6420-5759&t=58TFgNdha3aoeQtE-4", + "core-o3-editorial-typography--heading": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=7030-117&t=OXWNvTZ67QPdakfd-4", + "core-o3-editorial-typography--link": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6519-6412&t=OXWNvTZ67QPdakfd-4", + "core-o3-editorial-typography--list": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=7030-213&t=OXWNvTZ67QPdakfd-4", + "core-o3-editorial-typography--quote": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=7030-152&t=OXWNvTZ67QPdakfd-4", + "core-o3-editorial-typography--stand-first": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6420-5653&t=58TFgNdha3aoeQtE-4", + "core-o3-editorial-typography--topic-tag": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6420-5630&t=58TFgNdha3aoeQtE-4", + "core-o3-tooltip--onboarding-tooltip": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6660-336&t=58TFgNdha3aoeQtE-4", + "core-o3-tooltip--toggle-tooltip": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6660-395&t=58TFgNdha3aoeQtE-4", + "core-o3-typography--wrapper-story": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=3-2&t=LhQp6rOU5w4cq1mu-0", + "core-o3-typography-body--body-story": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6528-284&t=58TFgNdha3aoeQtE-4", + "core-o3-typography-caption--caption-story": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6528-397&t=58TFgNdha3aoeQtE-4", + "core-o3-typography-footer--footer-story": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6528-375&t=58TFgNdha3aoeQtE-4", + "core-o3-typography-heading--heading-story": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6878-4110&t=58TFgNdha3aoeQtE-4", + "core-o3-typography-link--links": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=6519-6425&t=58TFgNdha3aoeQtE-4", + "core-o3-typography-orderedlist--ordered-list-story": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=7532-3257&t=58TFgNdha3aoeQtE-4", + "core-o3-typography-unorderedlist--unordered-list-story": "https://www.figma.com/design/VVM0PixrY3IRZq2ZUTdWfU/%F0%9F%92%A0-Core---Origami-(o3)?node-id=7532-3257&t=58TFgNdha3aoeQtE-4", + "core-professional-o3-button--button": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "core-professional-o3-button--grouped-buttons": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "core-professional-o3-button--link-as-button": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "core-professional-o3-button--pagination": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4033-1234&t=uSXzpLGDcxFzfDex-0", + "core-professional-o3-button--small-button": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "core-professional-o3-tooltip--onboarding-tooltip": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4200-365&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-tooltip--toggle-tooltip": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4200-424&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-typography--wrapper-story": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=3406-12&t=uSXzpLGDcxFzfDex-0", + "core-professional-o3-typography-body--body-story": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4137-3113&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-typography-caption--caption-story": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4137-3226&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-typography-footer--footer-story": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4137-3204&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-typography-heading--heading-story": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4245-528&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-typography-link--links": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4161-379&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-typography-orderedlist--ordered-list-story": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4287-213&t=uSXzpLGDcxFzfDex-4", + "core-professional-o3-typography-unorderedlist--unordered-list-story": "https://www.figma.com/design/qfi6fTq5V05b0mnXw3F7q5/%F0%9F%92%A0-Professional---Origami-(o3)?node-id=4287-213&t=uSXzpLGDcxFzfDex-4", + "internal-o3-button--button": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=2819-133&t=uSXzpLGDcxFzfDex-0", + "internal-o3-button--grouped-buttons": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=2819-133&t=uSXzpLGDcxFzfDex-0", + "internal-o3-button--link-as-button": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=2819-133&t=uSXzpLGDcxFzfDex-0", + "internal-o3-button--pagination": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=627-2&t=uSXzpLGDcxFzfDex-0", + "internal-o3-button--small-button": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=2819-133&t=uSXzpLGDcxFzfDex-0", + "internal-o3-tooltip--onboarding-tooltip": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5626-716&t=uSXzpLGDcxFzfDex-4", + "internal-o3-tooltip--toggle-tooltip": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5626-775&t=uSXzpLGDcxFzfDex-4", + "internal-o3-typography--wrapper-story": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=3-2&t=uSXzpLGDcxFzfDex-0", + "internal-o3-typography-body--body": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5522-3076&t=uSXzpLGDcxFzfDex-4", + "internal-o3-typography-caption--caption-story": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5522-3189&t=uSXzpLGDcxFzfDex-4", + "internal-o3-typography-footer--footer-story": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5522-3167&t=uSXzpLGDcxFzfDex-4", + "internal-o3-typography-heading--heading-story": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5626-1212&t=uSXzpLGDcxFzfDex-4", + "internal-o3-typography-link--link": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5536-569&t=uSXzpLGDcxFzfDex-4", + "internal-o3-typography-orderedlist--ordered-list-story": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5641-47&t=uSXzpLGDcxFzfDex-4", + "internal-o3-typography-unorderedlist--unordered-list-story": "https://www.figma.com/design/H9vTWZgEzqzTtX689nwq4R/%F0%9F%92%A0-Internal---Origami-(o3)?node-id=5641-47&t=uSXzpLGDcxFzfDex-4", + "sustainable-views-o3-button--button": "https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "sustainable-views-o3-button--grouped-buttons": "https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "sustainable-views-o3-button--link-as-button": "https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "sustainable-views-o3-button--pagination": "https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=6176-3984&t=uSXzpLGDcxFzfDex-0", + "sustainable-views-o3-button--small-button": "https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=3604-103&t=uSXzpLGDcxFzfDex-0", + "sustainable-views-o3-editorial-typography--big-number": "", + "sustainable-views-o3-editorial-typography--body": "", + "sustainable-views-o3-editorial-typography--byline": "", + "sustainable-views-o3-editorial-typography--caption": "", + "sustainable-views-o3-editorial-typography--heading": "", + "sustainable-views-o3-editorial-typography--link": "", + "sustainable-views-o3-editorial-typography--list": "", + "sustainable-views-o3-editorial-typography--quote": "", + "sustainable-views-o3-editorial-typography--stand-first": "", + "sustainable-views-o3-editorial-typography--topic-tag": "", + "sustainable-views-o3-tooltip--onboarding-tooltip": "https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=6318-414&t=jZcQ882g8fhmd6uu-4", + "sustainable-views-o3-tooltip--toggle-tooltip": "https://www.figma.com/design/Y7u0SwIJ1mCNDE0dpzgHCJ/%F0%9F%92%A0-Sustainable-Views---Origami-(o3)?node-id=6318-473&t=jZcQ882g8fhmd6uu-4", + "whitelabel-o3-button--button": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=3312-89&t=uSXzpLGDcxFzfDex-0", + "whitelabel-o3-button--grouped-buttons": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=3312-89&t=uSXzpLGDcxFzfDex-0", + "whitelabel-o3-button--link-as-button": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=3312-89&t=uSXzpLGDcxFzfDex-0", + "whitelabel-o3-button--pagination": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=3394-508&t=uSXzpLGDcxFzfDex-0", + "whitelabel-o3-button--small-button": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=3312-89&t=uSXzpLGDcxFzfDex-0", + "whitelabel-o3-editorial-typography--big-number": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5908-528&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--body": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4718-214&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--byline": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5909-541&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--caption": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4717-1428&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--heading": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5075-366&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--link": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5114-1046&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--list": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5909-578&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--quote": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5876-825&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--stand-first": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4717-1322&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-editorial-typography--summary": "", + "whitelabel-o3-editorial-typography--topic-tag": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4717-1299&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-tooltip--onboarding-tooltip": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4036-1844&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-tooltip--toggle-tooltip": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4433-581&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-typography--wrapper-story": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=4720-671&t=uSXzpLGDcxFzfDex-0", + "whitelabel-o3-typography-body--body": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5647-2083&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-typography-caption--caption-story": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5847-242&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-typography-footer--footer-story": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5847-220&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-typography-heading--heading-story": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5647-2064&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-typography-link--link": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5133-1523&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-typography-orderedlist--ordered-list-story": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5851-969&t=uSXzpLGDcxFzfDex-4", + "whitelabel-o3-typography-unorderedlist--unordered-list-story": "https://www.figma.com/design/5ATknbGociZMlnNXX4sy4f/Whitelabel---Origami-(o3)?node-id=5851-969&t=uSXzpLGDcxFzfDex-4" +} \ No newline at end of file diff --git a/libraries/o3-figma-sb-links/src/links.json b/libraries/o3-figma-sb-links/src/links.json new file mode 100644 index 0000000000..70adf02f71 --- /dev/null +++ b/libraries/o3-figma-sb-links/src/links.json @@ -0,0 +1,390 @@ +{ + "core-o3-button--button": { + "sb": "?path=/story/core-o3-button--button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D2819-133%26t%3D3nAdE1vRK549Suhi-0" + }, + "core-o3-button--grouped-buttons": { + "sb": "?path=/story/core-o3-button--grouped-buttons", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D2819-133%26t%3D3nAdE1vRK549Suhi-0" + }, + "core-o3-button--link-as-button": { + "sb": "?path=/story/core-o3-button--link-as-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D2819-133%26t%3D3nAdE1vRK549Suhi-0" + }, + "core-o3-button--pagination": { + "sb": "?path=/story/core-o3-button--pagination", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D5463-1742%26t%3D3nAdE1vRK549Suhi-0" + }, + "core-o3-button--small-button": { + "sb": "?path=/story/core-o3-button--small-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D2819-133%26t%3D3nAdE1vRK549Suhi-0" + }, + "core-o3-editorial-typography--big-number": { + "sb": "?path=/story/core-o3-editorial-typography--big-number", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D7030-189%26t%3DOXWNvTZ67QPdakfd-4" + }, + "core-o3-editorial-typography--body": { + "sb": "?path=/story/core-o3-editorial-typography--body", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6420-5508%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-editorial-typography--byline": { + "sb": "?path=/story/core-o3-editorial-typography--byline", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D7030-198%26t%3DOXWNvTZ67QPdakfd-4" + }, + "core-o3-editorial-typography--caption": { + "sb": "?path=/story/core-o3-editorial-typography--caption", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6420-5759%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-editorial-typography--heading": { + "sb": "?path=/story/core-o3-editorial-typography--heading", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D7030-117%26t%3DOXWNvTZ67QPdakfd-4" + }, + "core-o3-editorial-typography--link": { + "sb": "?path=/story/core-o3-editorial-typography--link", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6519-6412%26t%3DOXWNvTZ67QPdakfd-4" + }, + "core-o3-editorial-typography--list": { + "sb": "?path=/story/core-o3-editorial-typography--list", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D7030-213%26t%3DOXWNvTZ67QPdakfd-4" + }, + "core-o3-editorial-typography--quote": { + "sb": "?path=/story/core-o3-editorial-typography--quote", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D7030-152%26t%3DOXWNvTZ67QPdakfd-4" + }, + "core-o3-editorial-typography--stand-first": { + "sb": "?path=/story/core-o3-editorial-typography--stand-first", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6420-5653%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-editorial-typography--topic-tag": { + "sb": "?path=/story/core-o3-editorial-typography--topic-tag", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6420-5630%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-tooltip--onboarding-tooltip": { + "sb": "?path=/story/core-o3-tooltip--onboarding-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6660-336%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-tooltip--toggle-tooltip": { + "sb": "?path=/story/core-o3-tooltip--toggle-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6660-395%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-typography--wrapper-story": { + "sb": "?path=/story/core-o3-typography--wrapper-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D3-2%26t%3DLhQp6rOU5w4cq1mu-0" + }, + "core-o3-typography-body--body-story": { + "sb": "?path=/story/core-o3-typography-body--body-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6528-284%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-typography-caption--caption-story": { + "sb": "?path=/story/core-o3-typography-caption--caption-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6528-397%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-typography-footer--footer-story": { + "sb": "?path=/story/core-o3-typography-footer--footer-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6528-375%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-typography-heading--heading-story": { + "sb": "?path=/story/core-o3-typography-heading--heading-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6878-4110%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-typography-link--links": { + "sb": "?path=/story/core-o3-typography-link--links", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D6519-6425%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-typography-orderedlist--ordered-list-story": { + "sb": "?path=/story/core-o3-typography-orderedlist--ordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D7532-3257%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-o3-typography-unorderedlist--unordered-list-story": { + "sb": "?path=/story/core-o3-typography-unorderedlist--unordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FVVM0PixrY3IRZq2ZUTdWfU%2F%25F0%259F%2592%25A0-Core---Origami-(o3)%3Fnode-id%3D7532-3257%26t%3D58TFgNdha3aoeQtE-4" + }, + "core-professional-o3-button--button": { + "sb": "?path=/story/core-professional-o3-button--button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "core-professional-o3-button--grouped-buttons": { + "sb": "?path=/story/core-professional-o3-button--grouped-buttons", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "core-professional-o3-button--link-as-button": { + "sb": "?path=/story/core-professional-o3-button--link-as-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "core-professional-o3-button--pagination": { + "sb": "?path=/story/core-professional-o3-button--pagination", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4033-1234%26t%3DuSXzpLGDcxFzfDex-0" + }, + "core-professional-o3-button--small-button": { + "sb": "?path=/story/core-professional-o3-button--small-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "core-professional-o3-tooltip--onboarding-tooltip": { + "sb": "?path=/story/core-professional-o3-tooltip--onboarding-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4200-365%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-tooltip--toggle-tooltip": { + "sb": "?path=/story/core-professional-o3-tooltip--toggle-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4200-424%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-typography--wrapper-story": { + "sb": "?path=/story/core-professional-o3-typography--wrapper-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D3406-12%26t%3DuSXzpLGDcxFzfDex-0" + }, + "core-professional-o3-typography-body--body-story": { + "sb": "?path=/story/core-professional-o3-typography-body--body-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4137-3113%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-typography-caption--caption-story": { + "sb": "?path=/story/core-professional-o3-typography-caption--caption-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4137-3226%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-typography-footer--footer-story": { + "sb": "?path=/story/core-professional-o3-typography-footer--footer-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4137-3204%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-typography-heading--heading-story": { + "sb": "?path=/story/core-professional-o3-typography-heading--heading-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4245-528%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-typography-link--links": { + "sb": "?path=/story/core-professional-o3-typography-link--links", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4161-379%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-typography-orderedlist--ordered-list-story": { + "sb": "?path=/story/core-professional-o3-typography-orderedlist--ordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4287-213%26t%3DuSXzpLGDcxFzfDex-4" + }, + "core-professional-o3-typography-unorderedlist--unordered-list-story": { + "sb": "?path=/story/core-professional-o3-typography-unorderedlist--unordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2Fqfi6fTq5V05b0mnXw3F7q5%2F%25F0%259F%2592%25A0-Professional---Origami-(o3)%3Fnode-id%3D4287-213%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-button--button": { + "sb": "?path=/story/internal-o3-button--button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D2819-133%26t%3DuSXzpLGDcxFzfDex-0" + }, + "internal-o3-button--grouped-buttons": { + "sb": "?path=/story/internal-o3-button--grouped-buttons", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D2819-133%26t%3DuSXzpLGDcxFzfDex-0" + }, + "internal-o3-button--link-as-button": { + "sb": "?path=/story/internal-o3-button--link-as-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D2819-133%26t%3DuSXzpLGDcxFzfDex-0" + }, + "internal-o3-button--pagination": { + "sb": "?path=/story/internal-o3-button--pagination", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D627-2%26t%3DuSXzpLGDcxFzfDex-0" + }, + "internal-o3-button--small-button": { + "sb": "?path=/story/internal-o3-button--small-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D2819-133%26t%3DuSXzpLGDcxFzfDex-0" + }, + "internal-o3-tooltip--onboarding-tooltip": { + "sb": "?path=/story/internal-o3-tooltip--onboarding-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5626-716%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-tooltip--toggle-tooltip": { + "sb": "?path=/story/internal-o3-tooltip--toggle-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5626-775%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-typography--wrapper-story": { + "sb": "?path=/story/internal-o3-typography--wrapper-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D3-2%26t%3DuSXzpLGDcxFzfDex-0" + }, + "internal-o3-typography-body--body": { + "sb": "?path=/story/internal-o3-typography-body--body", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5522-3076%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-typography-caption--caption-story": { + "sb": "?path=/story/internal-o3-typography-caption--caption-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5522-3189%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-typography-footer--footer-story": { + "sb": "?path=/story/internal-o3-typography-footer--footer-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5522-3167%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-typography-heading--heading-story": { + "sb": "?path=/story/internal-o3-typography-heading--heading-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5626-1212%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-typography-link--link": { + "sb": "?path=/story/internal-o3-typography-link--link", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5536-569%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-typography-orderedlist--ordered-list-story": { + "sb": "?path=/story/internal-o3-typography-orderedlist--ordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5641-47%26t%3DuSXzpLGDcxFzfDex-4" + }, + "internal-o3-typography-unorderedlist--unordered-list-story": { + "sb": "?path=/story/internal-o3-typography-unorderedlist--unordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FH9vTWZgEzqzTtX689nwq4R%2F%25F0%259F%2592%25A0-Internal---Origami-(o3)%3Fnode-id%3D5641-47%26t%3DuSXzpLGDcxFzfDex-4" + }, + "sustainable-views-o3-button--button": { + "sb": "?path=/story/sustainable-views-o3-button--button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FY7u0SwIJ1mCNDE0dpzgHCJ%2F%25F0%259F%2592%25A0-Sustainable-Views---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "sustainable-views-o3-button--grouped-buttons": { + "sb": "?path=/story/sustainable-views-o3-button--grouped-buttons", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FY7u0SwIJ1mCNDE0dpzgHCJ%2F%25F0%259F%2592%25A0-Sustainable-Views---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "sustainable-views-o3-button--link-as-button": { + "sb": "?path=/story/sustainable-views-o3-button--link-as-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FY7u0SwIJ1mCNDE0dpzgHCJ%2F%25F0%259F%2592%25A0-Sustainable-Views---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "sustainable-views-o3-button--pagination": { + "sb": "?path=/story/sustainable-views-o3-button--pagination", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FY7u0SwIJ1mCNDE0dpzgHCJ%2F%25F0%259F%2592%25A0-Sustainable-Views---Origami-(o3)%3Fnode-id%3D6176-3984%26t%3DuSXzpLGDcxFzfDex-0" + }, + "sustainable-views-o3-button--small-button": { + "sb": "?path=/story/sustainable-views-o3-button--small-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FY7u0SwIJ1mCNDE0dpzgHCJ%2F%25F0%259F%2592%25A0-Sustainable-Views---Origami-(o3)%3Fnode-id%3D3604-103%26t%3DuSXzpLGDcxFzfDex-0" + }, + "sustainable-views-o3-editorial-typography--big-number": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--big-number" + }, + "sustainable-views-o3-editorial-typography--body": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--body" + }, + "sustainable-views-o3-editorial-typography--byline": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--byline" + }, + "sustainable-views-o3-editorial-typography--caption": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--caption" + }, + "sustainable-views-o3-editorial-typography--heading": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--heading" + }, + "sustainable-views-o3-editorial-typography--link": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--link" + }, + "sustainable-views-o3-editorial-typography--list": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--list" + }, + "sustainable-views-o3-editorial-typography--pull-quote": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--pull-quote" + }, + "sustainable-views-o3-editorial-typography--quote": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--quote" + }, + "sustainable-views-o3-editorial-typography--stand-first": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--stand-first" + }, + "sustainable-views-o3-editorial-typography--topic-tag": { + "sb": "?path=/story/sustainable-views-o3-editorial-typography--topic-tag" + }, + "sustainable-views-o3-tooltip--onboarding-tooltip": { + "sb": "?path=/story/sustainable-views-o3-tooltip--onboarding-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FY7u0SwIJ1mCNDE0dpzgHCJ%2F%25F0%259F%2592%25A0-Sustainable-Views---Origami-(o3)%3Fnode-id%3D6318-414%26t%3DjZcQ882g8fhmd6uu-4" + }, + "sustainable-views-o3-tooltip--toggle-tooltip": { + "sb": "?path=/story/sustainable-views-o3-tooltip--toggle-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FY7u0SwIJ1mCNDE0dpzgHCJ%2F%25F0%259F%2592%25A0-Sustainable-Views---Origami-(o3)%3Fnode-id%3D6318-473%26t%3DjZcQ882g8fhmd6uu-4" + }, + "whitelabel-o3-button--button": { + "sb": "?path=/story/whitelabel-o3-button--button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D3312-89%26t%3DuSXzpLGDcxFzfDex-0" + }, + "whitelabel-o3-button--grouped-buttons": { + "sb": "?path=/story/whitelabel-o3-button--grouped-buttons", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D3312-89%26t%3DuSXzpLGDcxFzfDex-0" + }, + "whitelabel-o3-button--link-as-button": { + "sb": "?path=/story/whitelabel-o3-button--link-as-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D3312-89%26t%3DuSXzpLGDcxFzfDex-0" + }, + "whitelabel-o3-button--pagination": { + "sb": "?path=/story/whitelabel-o3-button--pagination", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D3394-508%26t%3DuSXzpLGDcxFzfDex-0" + }, + "whitelabel-o3-button--small-button": { + "sb": "?path=/story/whitelabel-o3-button--small-button", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D3312-89%26t%3DuSXzpLGDcxFzfDex-0" + }, + "whitelabel-o3-editorial-typography--big-number": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--big-number", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5908-528%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--body": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--body", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D4718-214%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--byline": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--byline", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5909-541%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--caption": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--caption", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D4717-1428%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--heading": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--heading", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5075-366%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--link": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--link", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5114-1046%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--list": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--list", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5909-578%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--pull-quote": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--pull-quote", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5876-825%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--quote": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--quote", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5876-825%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--stand-first": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--stand-first", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D4717-1322%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-editorial-typography--summary": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--summary" + }, + "whitelabel-o3-editorial-typography--topic-tag": { + "sb": "?path=/story/whitelabel-o3-editorial-typography--topic-tag", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D4717-1299%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-tooltip--onboarding-tooltip": { + "sb": "?path=/story/whitelabel-o3-tooltip--onboarding-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D4036-1844%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-tooltip--toggle-tooltip": { + "sb": "?path=/story/whitelabel-o3-tooltip--toggle-tooltip", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D4433-581%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-typography--wrapper-story": { + "sb": "?path=/story/whitelabel-o3-typography--wrapper-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D4720-671%26t%3DuSXzpLGDcxFzfDex-0" + }, + "whitelabel-o3-typography-body--body": { + "sb": "?path=/story/whitelabel-o3-typography-body--body", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5647-2083%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-typography-caption--caption-story": { + "sb": "?path=/story/whitelabel-o3-typography-caption--caption-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5847-242%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-typography-footer--footer-story": { + "sb": "?path=/story/whitelabel-o3-typography-footer--footer-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5847-220%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-typography-heading--heading-story": { + "sb": "?path=/story/whitelabel-o3-typography-heading--heading-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5647-2064%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-typography-link--link": { + "sb": "?path=/story/whitelabel-o3-typography-link--link", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5133-1523%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-typography-orderedlist--ordered-list-story": { + "sb": "?path=/story/whitelabel-o3-typography-orderedlist--ordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5851-969%26t%3DuSXzpLGDcxFzfDex-4" + }, + "whitelabel-o3-typography-unorderedlist--unordered-list-story": { + "sb": "?path=/story/whitelabel-o3-typography-unorderedlist--unordered-list-story", + "figma": "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2F5ATknbGociZMlnNXX4sy4f%2FWhitelabel---Origami-(o3)%3Fnode-id%3D5851-969%26t%3DuSXzpLGDcxFzfDex-4" + } +} \ No newline at end of file diff --git a/libraries/o3-figma-sb-links/src/sb-links.json b/libraries/o3-figma-sb-links/src/sb-links.json new file mode 100644 index 0000000000..0bc1e0ba21 --- /dev/null +++ b/libraries/o3-figma-sb-links/src/sb-links.json @@ -0,0 +1,102 @@ +{ + "core-o3-button--button": "?path=/story/core-o3-button--button", + "core-o3-button--link-as-button": "?path=/story/core-o3-button--link-as-button", + "core-o3-button--grouped-buttons": "?path=/story/core-o3-button--grouped-buttons", + "core-o3-button--pagination": "?path=/story/core-o3-button--pagination", + "core-o3-button--small-button": "?path=/story/core-o3-button--small-button", + "core-professional-o3-button--button": "?path=/story/core-professional-o3-button--button", + "core-professional-o3-button--link-as-button": "?path=/story/core-professional-o3-button--link-as-button", + "core-professional-o3-button--grouped-buttons": "?path=/story/core-professional-o3-button--grouped-buttons", + "core-professional-o3-button--pagination": "?path=/story/core-professional-o3-button--pagination", + "core-professional-o3-button--small-button": "?path=/story/core-professional-o3-button--small-button", + "internal-o3-button--button": "?path=/story/internal-o3-button--button", + "internal-o3-button--link-as-button": "?path=/story/internal-o3-button--link-as-button", + "internal-o3-button--grouped-buttons": "?path=/story/internal-o3-button--grouped-buttons", + "internal-o3-button--pagination": "?path=/story/internal-o3-button--pagination", + "internal-o3-button--small-button": "?path=/story/internal-o3-button--small-button", + "sustainable-views-o3-button--button": "?path=/story/sustainable-views-o3-button--button", + "sustainable-views-o3-button--link-as-button": "?path=/story/sustainable-views-o3-button--link-as-button", + "sustainable-views-o3-button--grouped-buttons": "?path=/story/sustainable-views-o3-button--grouped-buttons", + "sustainable-views-o3-button--pagination": "?path=/story/sustainable-views-o3-button--pagination", + "sustainable-views-o3-button--small-button": "?path=/story/sustainable-views-o3-button--small-button", + "whitelabel-o3-button--button": "?path=/story/whitelabel-o3-button--button", + "whitelabel-o3-button--link-as-button": "?path=/story/whitelabel-o3-button--link-as-button", + "whitelabel-o3-button--grouped-buttons": "?path=/story/whitelabel-o3-button--grouped-buttons", + "whitelabel-o3-button--pagination": "?path=/story/whitelabel-o3-button--pagination", + "whitelabel-o3-button--small-button": "?path=/story/whitelabel-o3-button--small-button", + "core-o3-editorial-typography--big-number": "?path=/story/core-o3-editorial-typography--big-number", + "core-o3-editorial-typography--body": "?path=/story/core-o3-editorial-typography--body", + "core-o3-editorial-typography--byline": "?path=/story/core-o3-editorial-typography--byline", + "core-o3-editorial-typography--caption": "?path=/story/core-o3-editorial-typography--caption", + "core-o3-editorial-typography--heading": "?path=/story/core-o3-editorial-typography--heading", + "core-o3-editorial-typography--link": "?path=/story/core-o3-editorial-typography--link", + "core-o3-editorial-typography--list": "?path=/story/core-o3-editorial-typography--list", + "core-o3-editorial-typography--quote": "?path=/story/core-o3-editorial-typography--quote", + "core-o3-editorial-typography--stand-first": "?path=/story/core-o3-editorial-typography--stand-first", + "core-o3-editorial-typography--topic-tag": "?path=/story/core-o3-editorial-typography--topic-tag", + "sustainable-views-o3-editorial-typography--big-number": "?path=/story/sustainable-views-o3-editorial-typography--big-number", + "sustainable-views-o3-editorial-typography--body": "?path=/story/sustainable-views-o3-editorial-typography--body", + "sustainable-views-o3-editorial-typography--byline": "?path=/story/sustainable-views-o3-editorial-typography--byline", + "sustainable-views-o3-editorial-typography--caption": "?path=/story/sustainable-views-o3-editorial-typography--caption", + "sustainable-views-o3-editorial-typography--heading": "?path=/story/sustainable-views-o3-editorial-typography--heading", + "sustainable-views-o3-editorial-typography--link": "?path=/story/sustainable-views-o3-editorial-typography--link", + "sustainable-views-o3-editorial-typography--list": "?path=/story/sustainable-views-o3-editorial-typography--list", + "sustainable-views-o3-editorial-typography--pull-quote": "?path=/story/sustainable-views-o3-editorial-typography--pull-quote", + "sustainable-views-o3-editorial-typography--stand-first": "?path=/story/sustainable-views-o3-editorial-typography--stand-first", + "sustainable-views-o3-editorial-typography--topic-tag": "?path=/story/sustainable-views-o3-editorial-typography--topic-tag", + "whitelabel-o3-editorial-typography--big-number": "?path=/story/whitelabel-o3-editorial-typography--big-number", + "whitelabel-o3-editorial-typography--body": "?path=/story/whitelabel-o3-editorial-typography--body", + "whitelabel-o3-editorial-typography--byline": "?path=/story/whitelabel-o3-editorial-typography--byline", + "whitelabel-o3-editorial-typography--caption": "?path=/story/whitelabel-o3-editorial-typography--caption", + "whitelabel-o3-editorial-typography--heading": "?path=/story/whitelabel-o3-editorial-typography--heading", + "whitelabel-o3-editorial-typography--link": "?path=/story/whitelabel-o3-editorial-typography--link", + "whitelabel-o3-editorial-typography--list": "?path=/story/whitelabel-o3-editorial-typography--list", + "whitelabel-o3-editorial-typography--pull-quote": "?path=/story/whitelabel-o3-editorial-typography--pull-quote", + "whitelabel-o3-editorial-typography--stand-first": "?path=/story/whitelabel-o3-editorial-typography--stand-first", + "whitelabel-o3-editorial-typography--summary": "?path=/story/whitelabel-o3-editorial-typography--summary", + "whitelabel-o3-editorial-typography--topic-tag": "?path=/story/whitelabel-o3-editorial-typography--topic-tag", + "core-professional-o3-tooltip--onboarding-tooltip": "?path=/story/core-professional-o3-tooltip--onboarding-tooltip", + "core-professional-o3-tooltip--toggle-tooltip": "?path=/story/core-professional-o3-tooltip--toggle-tooltip", + "core-o3-tooltip--onboarding-tooltip": "?path=/story/core-o3-tooltip--onboarding-tooltip", + "core-o3-tooltip--toggle-tooltip": "?path=/story/core-o3-tooltip--toggle-tooltip", + "internal-o3-tooltip--onboarding-tooltip": "?path=/story/internal-o3-tooltip--onboarding-tooltip", + "internal-o3-tooltip--toggle-tooltip": "?path=/story/internal-o3-tooltip--toggle-tooltip", + "sustainable-views-o3-tooltip--onboarding-tooltip": "?path=/story/sustainable-views-o3-tooltip--onboarding-tooltip", + "sustainable-views-o3-tooltip--toggle-tooltip": "?path=/story/sustainable-views-o3-tooltip--toggle-tooltip", + "whitelabel-o3-tooltip--onboarding-tooltip": "?path=/story/whitelabel-o3-tooltip--onboarding-tooltip", + "whitelabel-o3-tooltip--toggle-tooltip": "?path=/story/whitelabel-o3-tooltip--toggle-tooltip", + "core-o3-typography-body--body-story": "?path=/story/core-o3-typography-body--body-story", + "core-o3-typography-caption--caption-story": "?path=/story/core-o3-typography-caption--caption-story", + "core-o3-typography-footer--footer-story": "?path=/story/core-o3-typography-footer--footer-story", + "core-o3-typography-heading--heading-story": "?path=/story/core-o3-typography-heading--heading-story", + "core-o3-typography-link--links": "?path=/story/core-o3-typography-link--links", + "core-o3-typography-orderedlist--ordered-list-story": "?path=/story/core-o3-typography-orderedlist--ordered-list-story", + "core-professional-o3-typography-body--body-story": "?path=/story/core-professional-o3-typography-body--body-story", + "core-professional-o3-typography-caption--caption-story": "?path=/story/core-professional-o3-typography-caption--caption-story", + "core-professional-o3-typography-footer--footer-story": "?path=/story/core-professional-o3-typography-footer--footer-story", + "core-professional-o3-typography-heading--heading-story": "?path=/story/core-professional-o3-typography-heading--heading-story", + "core-professional-o3-typography-link--links": "?path=/story/core-professional-o3-typography-link--links", + "core-professional-o3-typography-orderedlist--ordered-list-story": "?path=/story/core-professional-o3-typography-orderedlist--ordered-list-story", + "core-professional-o3-typography-unorderedlist--unordered-list-story": "?path=/story/core-professional-o3-typography-unorderedlist--unordered-list-story", + "core-professional-o3-typography--wrapper-story": "?path=/story/core-professional-o3-typography--wrapper-story", + "core-o3-typography-unorderedlist--unordered-list-story": "?path=/story/core-o3-typography-unorderedlist--unordered-list-story", + "core-o3-typography--wrapper-story": "?path=/story/core-o3-typography--wrapper-story", + "internal-o3-typography-body--body": "?path=/story/internal-o3-typography-body--body", + "internal-o3-typography-caption--caption-story": "?path=/story/internal-o3-typography-caption--caption-story", + "internal-o3-typography-footer--footer-story": "?path=/story/internal-o3-typography-footer--footer-story", + "internal-o3-typography-heading--heading-story": "?path=/story/internal-o3-typography-heading--heading-story", + "internal-o3-typography-link--link": "?path=/story/internal-o3-typography-link--link", + "internal-o3-typography-orderedlist--ordered-list-story": "?path=/story/internal-o3-typography-orderedlist--ordered-list-story", + "internal-o3-typography-unorderedlist--unordered-list-story": "?path=/story/internal-o3-typography-unorderedlist--unordered-list-story", + "internal-o3-typography--wrapper-story": "?path=/story/internal-o3-typography--wrapper-story", + "whitelabel-o3-typography-body--body": "?path=/story/whitelabel-o3-typography-body--body", + "whitelabel-o3-typography-caption--caption-story": "?path=/story/whitelabel-o3-typography-caption--caption-story", + "whitelabel-o3-typography-footer--footer-story": "?path=/story/whitelabel-o3-typography-footer--footer-story", + "whitelabel-o3-typography-heading--heading-story": "?path=/story/whitelabel-o3-typography-heading--heading-story", + "whitelabel-o3-typography-link--link": "?path=/story/whitelabel-o3-typography-link--link", + "whitelabel-o3-typography-orderedlist--ordered-list-story": "?path=/story/whitelabel-o3-typography-orderedlist--ordered-list-story", + "whitelabel-o3-typography-unorderedlist--unordered-list-story": "?path=/story/whitelabel-o3-typography-unorderedlist--unordered-list-story", + "whitelabel-o3-typography--wrapper-story": "?path=/story/whitelabel-o3-typography--wrapper-story", + "sustainable-views-o3-editorial-typography--quote": "?path=/story/sustainable-views-o3-editorial-typography--quote", + "whitelabel-o3-editorial-typography--quote": "?path=/story/whitelabel-o3-editorial-typography--quote" +} \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index bda35ad706..58db07d0fe 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1459,6 +1459,7 @@ "@astrojs/svelte": "^5.4.0", "@financial-times/o3-button": "^1.0.0", "@financial-times/o3-editorial-typography": "^1.0.0", + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0", "@financial-times/o3-tooling-token": "^0.0.0", "@financial-times/o3-tooltip": "^1.0.0", @@ -2849,7 +2850,7 @@ }, "components/ft-concept-button": { "name": "@financial-times/ft-concept-button", - "version": "1.2.3", + "version": "1.3.0", "license": "MIT", "engines": { "npm": ">7" @@ -3234,7 +3235,7 @@ }, "components/o-header": { "name": "@financial-times/o-header", - "version": "12.0.0", + "version": "13.0.0", "license": "MIT", "devDependencies": { "@financial-times/o-fonts": "^5.2.0", @@ -3874,6 +3875,7 @@ "npm": ">7" }, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" } }, @@ -3885,6 +3887,7 @@ "npm": ">7" }, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" } }, @@ -3907,6 +3910,7 @@ "npm": ">7" }, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" } }, @@ -3918,6 +3922,7 @@ "npm": ">7" }, "peerDependencies": { + "@financial-times/o3-figma-sb-links": "^0.0.0", "@financial-times/o3-foundation": "^1.0.0" } }, @@ -4957,6 +4962,17 @@ "npm": ">7" } }, + "libraries/o3-figma-sb-links": { + "name": "@financial-times/o3-figma-sb-links", + "version": "0.0.0", + "license": "MIT", + "dependencies": { + "@storybook/csf-tools": "^8.1.10" + }, + "engines": { + "npm": ">7" + } + }, "libraries/o3-tooling-token": { "name": "@financial-times/o3-tooling-token", "version": "0.0.0", @@ -11469,6 +11485,10 @@ "resolved": "components/o3-editorial-typography", "link": true }, + "node_modules/@financial-times/o3-figma-sb-links": { + "resolved": "libraries/o3-figma-sb-links", + "link": true + }, "node_modules/@financial-times/o3-foundation": { "resolved": "components/o3-foundation", "link": true @@ -19179,7 +19199,6 @@ "version": "8.1.10", "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-8.1.10.tgz", "integrity": "sha512-CxZE4XrQoe+F+S2mo8Z9HTvFZKfKHIIiwYfoXKCryVp2U/z7ZKrely2PbfxWsrQvF3H0+oegfYYhYRHRiM21Zw==", - "dev": true, "dependencies": { "@storybook/client-logger": "8.1.10", "@storybook/core-events": "8.1.10", @@ -19196,7 +19215,6 @@ "version": "8.1.10", "resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-8.1.10.tgz", "integrity": "sha512-aS4zsBVyJds74+rAW0IfTEjULDCQwXecVpQfv11B8/89/07s3bOPssGGoTtCTaN4pHbduywE6MxbmFvTmXOFCA==", - "dev": true, "dependencies": { "@storybook/csf": "^0.1.7", "ts-dedent": "^2.0.0" @@ -19558,7 +19576,6 @@ "version": "8.1.10", "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-8.1.10.tgz", "integrity": "sha512-sVXCOo7jnlCgRPOcMlQGODAEt6ipPj+8xGkRUws0kie77qiDld1drLSB6R380dWc9lUrbv9E1GpxCd/Y4ZzSJQ==", - "dev": true, "dependencies": { "@storybook/global": "^5.0.0" }, @@ -20705,7 +20722,6 @@ "version": "0.1.8", "resolved": "https://registry.npmjs.org/@storybook/csf/-/csf-0.1.8.tgz", "integrity": "sha512-Ntab9o7LjBCbFIao5l42itFiaSh/Qu+l16l/r/9qmV9LnYZkO+JQ7tzhdlwpgJfhs+B5xeejpdAtftDRyXNajw==", - "dev": true, "dependencies": { "type-fest": "^2.19.0" } @@ -20728,7 +20744,6 @@ "version": "8.1.10", "resolved": "https://registry.npmjs.org/@storybook/csf-tools/-/csf-tools-8.1.10.tgz", "integrity": "sha512-bm/J1jAJf1YaKhcXgOlsNN02sf8XvILXuVAvr9cFC3aFkxVoGbC2AKCss4cgXAd8EQxUNtyETkOcheB5mJ5IlA==", - "dev": true, "dependencies": { "@babel/generator": "^7.24.4", "@babel/parser": "^7.24.4", @@ -20749,7 +20764,6 @@ "version": "11.2.0", "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz", "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==", - "dev": true, "dependencies": { "graceful-fs": "^4.2.0", "jsonfile": "^6.0.1", @@ -20828,8 +20842,7 @@ "node_modules/@storybook/global": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/@storybook/global/-/global-5.0.0.tgz", - "integrity": "sha512-FcOqPAXACP0I3oJ/ws6/rrPT9WGhu915Cg8D02a9YxLo0DE9zI+a9A5gRGvmQ09fiWPukqI8ZAEoQEdWUKMQdQ==", - "dev": true + "integrity": "sha512-FcOqPAXACP0I3oJ/ws6/rrPT9WGhu915Cg8D02a9YxLo0DE9zI+a9A5gRGvmQ09fiWPukqI8ZAEoQEdWUKMQdQ==" }, "node_modules/@storybook/icons": { "version": "1.2.9", @@ -24344,7 +24357,6 @@ "version": "8.1.10", "resolved": "https://registry.npmjs.org/@storybook/types/-/types-8.1.10.tgz", "integrity": "sha512-UJ97iqI+0Mk13I6ayd3TaBfSFBkWnEauwTnFMQe1dN/L3wTh8laOBaLa0Vr3utRSnt2b5hpcw/nq7azB/Gx4Yw==", - "dev": true, "dependencies": { "@storybook/channels": "8.1.10", "@types/express": "^4.7.0", @@ -27811,7 +27823,6 @@ "version": "0.16.1", "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.16.1.tgz", "integrity": "sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==", - "dev": true, "dependencies": { "tslib": "^2.0.1" }, @@ -36867,7 +36878,6 @@ "version": "2.3.0", "resolved": "https://registry.npmjs.org/file-system-cache/-/file-system-cache-2.3.0.tgz", "integrity": "sha512-l4DMNdsIPsVnKrgEXbJwDJsA5mB8rGwHYERMgqQx/xAUtChPJMre1bXBzDEqqVbWv9AIbFezXMxeEkZDSrXUOQ==", - "dev": true, "dependencies": { "fs-extra": "11.1.1", "ramda": "0.29.0" @@ -36877,7 +36887,6 @@ "version": "11.1.1", "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.1.1.tgz", "integrity": "sha512-MGIE4HOvQCeUCzmlHs0vXpih4ysz4wg9qiSAu6cd42lVwPbTM1TjV7RusoyQqMmk/95gdQZX72u+YW+c3eEpFQ==", - "dev": true, "dependencies": { "graceful-fs": "^4.2.0", "jsonfile": "^6.0.1", @@ -47678,8 +47687,7 @@ "node_modules/map-or-similar": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/map-or-similar/-/map-or-similar-1.5.0.tgz", - "integrity": "sha512-0aF7ZmVon1igznGI4VS30yugpduQW3y3GkcgGJOp7d8x8QrizhigUxjI/m2UojsXXto+jLAH3KSz+xOJTiORjg==", - "dev": true + "integrity": "sha512-0aF7ZmVon1igznGI4VS30yugpduQW3y3GkcgGJOp7d8x8QrizhigUxjI/m2UojsXXto+jLAH3KSz+xOJTiORjg==" }, "node_modules/map-stream": { "version": "0.1.0", @@ -52243,7 +52251,6 @@ "version": "1.11.3", "resolved": "https://registry.npmjs.org/memoizerific/-/memoizerific-1.11.3.tgz", "integrity": "sha512-/EuHYwAPdLtXwAwSZkh/Gutery6pD2KYd44oQLhAvQp/50mpyduZh8Q7PYHXTCJ+wuXxt7oij2LXyIJOOYFPog==", - "dev": true, "dependencies": { "map-or-similar": "^1.5.0" } @@ -59181,7 +59188,6 @@ "version": "0.29.0", "resolved": "https://registry.npmjs.org/ramda/-/ramda-0.29.0.tgz", "integrity": "sha512-BBea6L67bYLtdbOqfp8f58fPMqEwx0doL+pAi8TZyp2YWz8R9G8z9x75CZI8W+ftqhFHCpEX2cRnUUXK130iKA==", - "dev": true, "funding": { "type": "opencollective", "url": "https://opencollective.com/ramda" @@ -59981,7 +59987,6 @@ "version": "0.23.9", "resolved": "https://registry.npmjs.org/recast/-/recast-0.23.9.tgz", "integrity": "sha512-Hx/BGIbwj+Des3+xy5uAtAbdCyqK9y9wbBcDFDYanLS9JnMqf7OeF87HQwUimE87OEc72mr6tkKUKMBBL+hF9Q==", - "dev": true, "dependencies": { "ast-types": "^0.16.1", "esprima": "~4.0.0", @@ -70647,7 +70652,6 @@ "version": "7.2.0", "resolved": "https://registry.npmjs.org/telejson/-/telejson-7.2.0.tgz", "integrity": "sha512-1QTEcJkJEhc8OnStBx/ILRu5J2p0GjvWsBx56bmZRqnrkdBMUe+nX92jxV+p3dB4CP6PZCdJMQJwCggkNBMzkQ==", - "dev": true, "dependencies": { "memoizerific": "^1.11.3" } @@ -71501,7 +71505,6 @@ "version": "2.2.0", "resolved": "https://registry.npmjs.org/ts-dedent/-/ts-dedent-2.2.0.tgz", "integrity": "sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==", - "dev": true, "engines": { "node": ">=6.10" } diff --git a/package.json b/package.json index 5da62b043d..ba0faa802d 100644 --- a/package.json +++ b/package.json @@ -65,6 +65,7 @@ "fetch-mock": "^9.11.0", "husky": "^8.0.3", "mocha": "^8.3.2", + "patch-package": "^8.0.0", "prettier": "^2.3.2", "proclaim": "^3.6.0", "react": "^16.14.0", @@ -77,8 +78,7 @@ "sinon": "^10.0.0", "stylelint": "^13.12.0", "stylelint-config-origami-component": "^1.0.4", - "stylelint-config-prettier": "^9.0.3", - "patch-package": "^8.0.0" + "stylelint-config-prettier": "^9.0.3" }, "dependencies": { "@actions/core": "^1.2.6",