From 67931a5a7d9301e23f934aafec27fc901c920f57 Mon Sep 17 00:00:00 2001 From: Lukas Mestel Date: Mon, 26 Feb 2024 17:47:16 +0100 Subject: [PATCH] refactor: format code --- .github/workflows/release.yml | 2 +- .storybook/preview.ts | 6 ++-- CHANGELOG.md | 2 -- README.md | 39 ++++++++++++----------- manager.js | 2 +- package.json | 2 +- src/components/SchemaDoc.tsx | 2 +- src/components/SchemaView.tsx | 4 +-- src/constants.ts | 12 ++++--- stories/button/Button.jsx | 18 +++++++---- stories/button/button.css | 2 +- stories/header/Header.jsx | 20 +++++++++--- stories/header/header.css | 2 +- stories/page/Page.jsx | 60 +++++++++++++++++++++++------------ stories/page/page.css | 2 +- tsconfig.json | 6 ++-- 16 files changed, 106 insertions(+), 75 deletions(-) diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index eeb868f..348f8ce 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -25,4 +25,4 @@ jobs: env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} NPM_TOKEN: ${{ secrets.NPM_TOKEN }} - run: yarn release \ No newline at end of file + run: yarn release diff --git a/.storybook/preview.ts b/.storybook/preview.ts index 6725e6c..5a4a52d 100644 --- a/.storybook/preview.ts +++ b/.storybook/preview.ts @@ -1,4 +1,4 @@ -import { Preview } from '@storybook/react'; +import { Preview } from "@storybook/react"; const preview: Preview = { parameters: { @@ -9,6 +9,6 @@ const preview: Preview = { }, }, }, -} +}; -export default preview; \ No newline at end of file +export default preview; diff --git a/CHANGELOG.md b/CHANGELOG.md index a67bbe8..8e2b401 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -97,8 +97,6 @@ # v1.0.1 (Sun Dec 12 2021) - - --- # v1.0.0 (Sun Dec 12 2021) diff --git a/README.md b/README.md index 09c0645..5a1e611 100644 --- a/README.md +++ b/README.md @@ -21,10 +21,11 @@ It was slightly modified to generate bundles that can be imported for partial us ## What it's for -Three things you can use this addon for: -1. Explore associated JSON Schema documentation, in a nicely organized fashion in the `JSON Schema Explorer` -2. Configure components through Controls, copy the resulting JSON as a starting point or template for API-usage / data generation purposes in the `JSON Code Editor` -3. Paste JSON to validate data or preview component state in the `JSON Code Editor` +Three things you can use this addon for: + +1. Explore associated JSON Schema documentation, in a nicely organized fashion in the `JSON Schema Explorer` +2. Configure components through Controls, copy the resulting JSON as a starting point or template for API-usage / data generation purposes in the `JSON Code Editor` +3. Paste JSON to validate data or preview component state in the `JSON Code Editor` ## Getting started @@ -40,7 +41,7 @@ Second step, register the addon inside your `.storybook/main.js` (just add it to ```javascript module.exports = { - addons: ['@kickstartds/storybook-addon-jsonschema'] + addons: ["@kickstartds/storybook-addon-jsonschema"], }; ``` @@ -53,21 +54,21 @@ export default { parameters: { jsonschema: { schema: { - "$schema": "http://json-schema.org/draft-07/schema#", - "$id": "https://my-components/button.schema.json", - "type": "object", - "properties": { - "primary": { - "type": "boolean", - "default": false, + $schema: "http://json-schema.org/draft-07/schema#", + $id: "https://my-components/button.schema.json", + type: "object", + properties: { + primary: { + type: "boolean", + default: false, + }, + label: { + type: "string", }, - "label": { - "type": "string" - } - } - } - } - } + }, + }, + }, + }, }; ``` diff --git a/manager.js b/manager.js index b4aa441..ec8c537 100644 --- a/manager.js +++ b/manager.js @@ -1 +1 @@ -export * from "./dist/esm/manager"; \ No newline at end of file +export * from "./dist/esm/manager"; diff --git a/package.json b/package.json index aa984f6..1d19775 100644 --- a/package.json +++ b/package.json @@ -102,4 +102,4 @@ ], "icon": "https://opencollective-production.s3.us-west-1.amazonaws.com/1e445ca0-fca9-11e9-a830-c36c137aded5.png" } -} \ No newline at end of file +} diff --git a/src/components/SchemaDoc.tsx b/src/components/SchemaDoc.tsx index 84a320e..f85888a 100644 --- a/src/components/SchemaDoc.tsx +++ b/src/components/SchemaDoc.tsx @@ -91,7 +91,7 @@ export const SchemaDoc: React.FC = ({ const currentPathElement = path[path.length - 1]; const currentSchema = getSchemaFromReference( currentPathElement.reference, - lookup + lookup, ); if (currentSchema === undefined) { diff --git a/src/components/SchemaView.tsx b/src/components/SchemaView.tsx index a7c65e6..e45c2e9 100644 --- a/src/components/SchemaView.tsx +++ b/src/components/SchemaView.tsx @@ -45,10 +45,10 @@ const SchemaEditorContainerHeading = styled.h3` export const SchemaView: React.FC = () => { const { schema, fromArgs, toArgs } = useParameter( PARAM_KEY, - { schema: {} } + { schema: {} }, ); const [validationResults, setValidationResults] = useState( - [] + [], ); const [selectedValidation, setSelectedValidation] = useState(); return ( diff --git a/src/constants.ts b/src/constants.ts index 76c8b55..6540fe6 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -4,8 +4,10 @@ import type { JsonSchema } from "@kickstartds/json-schema-viewer"; export const ADDON_ID = "storybook/jsonschema"; export const PANEL_ID = `${ADDON_ID}/panel`; export const PARAM_KEY = "jsonschema"; -export type JsonSchemaParameter = { - schema: JsonSchema; - fromArgs?: (args: Args) => Record; - toArgs?: (obj: Record) => Args; -} | undefined; +export type JsonSchemaParameter = + | { + schema: JsonSchema; + fromArgs?: (args: Args) => Record; + toArgs?: (obj: Record) => Args; + } + | undefined; diff --git a/stories/button/Button.jsx b/stories/button/Button.jsx index 15dde39..68f1d92 100644 --- a/stories/button/Button.jsx +++ b/stories/button/Button.jsx @@ -1,16 +1,20 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import './button.css'; +import React from "react"; +import PropTypes from "prop-types"; +import "./button.css"; /** * Primary UI component for user interaction */ export const Button = ({ primary, backgroundColor, size, label, ...props }) => { - const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary'; + const mode = primary + ? "storybook-button--primary" + : "storybook-button--secondary"; return (