@newhighsco/storybook-preset 9.0.8 → 10.0.0

package/dist/{chunk-E7TEWFMC.js → chunk-SUGK4Y5S.js}

@@ -2,6 +2,7 @@ import { Title, Subtitle, Description, Source, Primary, Controls, Stories } from
 import React from 'react';
 import { TabWrapper, Spaced } from 'storybook/internal/components';
 import { convert, themes, ThemeProvider, ensure } from 'storybook/theming';
+import { breakpoints } from '@newhighsco/chipset';
 
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -31,12 +32,25 @@ var useDarkMode = () => {
   const dark2 = convert().base === themes.dark.base;
   return [dark2, dark2 ? themes.dark : themes.light];
 };
+var viewports = Object.entries(
+  breakpoints
+).reduce((viewports2, [name, width]) => {
+  viewports2[name] = { name, styles: { width: `${width}px`, height: "100%" } };
+  return viewports2;
+}, {});
+var modes = (breakpoints2) => Object.keys(viewports).reduce((modes2, viewport) => {
+  if (!breakpoints2?.length || breakpoints2?.includes(viewport)) {
+    modes2[viewport] = { viewport };
+  }
+  return modes2;
+}, {});
 
 // src/preview.ts
 var [dark, theme] = useDarkMode();
 var decorators = [WithSnapshot];
 var parameters = {
   actions: { argTypesRegex: "^on[A-Z].*" },
+  chromatic: { modes: modes(["desktopLarge"]) },
   controls: { matchers: { color: /(background|color)$/i, date: /Date$/ } },
   docs: {
     canvas: { className: theme.base, withToolbar: true },
@@ -44,7 +58,8 @@ var parameters = {
     source: { dark: !dark },
     theme
   },
-  viewMode: "docs"
+  viewMode: "docs",
+  viewport: { options: viewports }
 };
 
-export { decorators, parameters, preview_exports };
+export { decorators, modes, parameters, preview_exports, viewports };

package/dist/index.d.ts

@@ -1,5 +1,11 @@
 import { PreviewAddon } from 'storybook/internal/csf';
+import { Viewport } from 'storybook/viewport';
+
+declare const viewports: Record<string, Viewport>;
+declare const modes: (breakpoints?: string[]) => Record<string, {
+    viewport: string;
+}>;
 
 declare const _default: () => PreviewAddon;
 
-export { _default as default };
+export { _default as default, modes, viewports };

package/dist/index.js

@@ -1,4 +1,5 @@
-import { preview_exports } from './chunk-E7TEWFMC.js';
+import { preview_exports } from './chunk-SUGK4Y5S.js';
+export { modes, viewports } from './chunk-SUGK4Y5S.js';
 import { definePreviewAddon } from 'storybook/internal/csf';
 
 var index_default = () => definePreviewAddon(preview_exports);

package/dist/preview.js

@@ -1 +1 @@
-export { decorators, parameters } from './chunk-E7TEWFMC.js';
+export { decorators, parameters } from './chunk-SUGK4Y5S.js';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@newhighsco/storybook-preset",
   "description": "New High Score shareable Storybook preset",
-  "version": "9.0.8",
+  "version": "10.0.0",
   "author": "New High Score",
   "license": "ISC",
   "private": false,
@@ -38,6 +38,7 @@
     "build": "tsup --silent"
   },
   "dependencies": {
+    "@newhighsco/chipset": "6.27.0",
     "@newhighsco/storybook-addon-svgr": "4.0.0",
     "@newhighsco/storybook-addon-transpile-modules": "4.0.0",
     "@storybook/addon-a11y": "10.1.11",