diff --git a/.storybook/add-ons/canvas-docs/Tab.tsx b/.storybook/add-ons/canvas-docs/Tab.tsx new file mode 100644 index 00000000..679e273d --- /dev/null +++ b/.storybook/add-ons/canvas-docs/Tab.tsx @@ -0,0 +1,32 @@ +import React from 'react'; +import { useParameter, useStorybookState } from '@storybook/manager-api'; +import { AddonPanel } from '@storybook/components'; +import { PARAM_KEY } from './constants.ts'; +import * as Blocks from '@storybook/blocks'; + +interface PanelProps { + active: boolean | undefined; +} + +const Tab: React.FC = (props) => { + const { storyId } = useStorybookState(); // Get the current story ID + const markdownContent = useParameter>(PARAM_KEY, {}); + + // Fetch Markdown content specific to the current story + const content = + markdownContent[storyId] || 'No documentation provided for this story.'; + + console.log('PROPS', props); + + return ( + + +
+ {content} +
+ + + ); +}; + +export default Tab; diff --git a/.storybook/add-ons/canvas-docs/constants.ts b/.storybook/add-ons/canvas-docs/constants.ts new file mode 100644 index 00000000..1bde048d --- /dev/null +++ b/.storybook/add-ons/canvas-docs/constants.ts @@ -0,0 +1,3 @@ +export const ADDON_ID = 'storybook/canvas-docs'; +export const PANEL_ID = `${ADDON_ID}/panel`; +export const PARAM_KEY = 'canvasDocs'; diff --git a/.storybook/add-ons/canvas-docs/index.tsx b/.storybook/add-ons/canvas-docs/index.tsx new file mode 100644 index 00000000..982daef1 --- /dev/null +++ b/.storybook/add-ons/canvas-docs/index.tsx @@ -0,0 +1,13 @@ +import React from 'react'; +import { addons, types } from '@storybook/manager-api'; +import { ADDON_ID, PANEL_ID } from './constants'; +import Tab from './Tab'; + +addons.register(ADDON_ID, () => { + addons.add(PANEL_ID, { + type: types.PANEL, + title: 'Docs', + match: ({ viewMode }) => viewMode === 'story', + render: (props) => , + }); +}); diff --git a/.storybook/manager.ts b/.storybook/manager.ts index f1e98430..65eed36e 100644 --- a/.storybook/manager.ts +++ b/.storybook/manager.ts @@ -1,5 +1,6 @@ import { addons } from '@storybook/manager-api'; import theme from './Theme'; +import './add-ons/canvas-docs'; addons.setConfig({ isFullscreen: false, diff --git a/CHANGELOG.md b/CHANGELOG.md index 4ed592ac..a70afc66 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,17 @@ # @reuters-graphics/graphics-components +## 2.0.3 + +### Patch Changes + +- 50f4320: Updates favicons for new kinesis + +## 2.0.2 + +### Patch Changes + +- 64b6d88: Fix for changed thumbnail API schema + ## 2.0.1 ### Patch Changes diff --git a/package.json b/package.json index c505a9d5..4050fb6b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@reuters-graphics/graphics-components", - "version": "2.0.1", + "version": "2.0.3", "type": "module", "private": false, "homepage": "https://reuters-graphics.github.io/graphics-components", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 861631fb..2d0e22ef 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -18,7 +18,7 @@ importers: specifier: ^0.0.3 version: 0.0.3(svelte@5.28.1) '@sveltejs/kit': - specifier: ^2.20.7 + specifier: ^2.0.0 version: 2.20.7(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.28.1)(vite@6.3.2(@types/node@22.14.1)(jiti@2.4.2)(sass@1.86.3)(yaml@2.7.1)))(svelte@5.28.1)(vite@6.3.2(@types/node@22.14.1)(jiti@2.4.2)(sass@1.86.3)(yaml@2.7.1)) dayjs: specifier: ^1.11.13 diff --git a/src/components/SEO/SEO.svelte b/src/components/SEO/SEO.svelte index dd407342..8ceb2cd5 100644 --- a/src/components/SEO/SEO.svelte +++ b/src/components/SEO/SEO.svelte @@ -136,28 +136,26 @@ {seoTitle} + + - -