Comments (1)
** Disclaimer** This information might be inaccurate, due to it being generated automatically
To address the issue of Storybook Angular not setting required Inputs correctly, follow these steps:
-
Update Meta Type: Modify the
Meta
type in@storybook/angular
to accepttype
with arequired
property.// Path: /code/frameworks/angular/src/types.ts export interface ArgType { type?: { name?: string; required?: boolean }; // other properties... }
-
Infer Required Fields: Enhance the logic to infer required fields from
compodoc
.// Path: /code/frameworks/angular/src/client/preview/angular/compodoc.ts function inferArgTypesFromCompodoc(compodocJson) { return compodocJson.reduce((acc, doc) => { acc[doc.name] = { type: { name: doc.type, required: doc.required }, // other properties... }; return acc; }, {}); }
-
Example Usage: Update your story to use the new
Meta
type.// Path: /code/frameworks/angular/template/stories/basics/component-with-provider/di.component.stories.ts const meta: Meta<DiComponent> = { component: DiComponent, argTypes: { title: { type: { name: 'string', required: true }, control: 'text' }, }, }; export default meta;
References
/docs/_snippets/api-doc-block-argtypes-parameter.md
/code/frameworks/angular/template/stories/basics/component-with-provider/di.component.stories.ts
/code/lib/blocks/src/examples/ArgTypesWithSubcomponentsParameters.stories.tsx
/docs/_snippets/button-story-with-parameters.md
/docs/_snippets/component-story-auto-title.md
/code/core/src/csf-tools/CsfFile.test.ts
/docs/_snippets/component-story-sort-controls.md
/docs/_snippets/button-story-controls-radio-group.md
/docs/_snippets/arg-types-in-meta.md
/docs/_snippets/component-story-conditional-controls-toggle.md
/docs/_snippets/arg-types-options.md
/code/renderers/server/template/cli/button.stories.json
/docs/_snippets/button-story-hypothetical-example.md
/.github/DISCUSSION_TEMPLATE/ideas.yml
/docs/_snippets/button-story-baseline.md
/code/frameworks/angular/template/stories/core/README.mdx
/code/renderers/vue3/src/public-types.test.ts
/code/frameworks/angular/template/stories/basics/component-with-enums/enums.component.stories.ts
/.github/DISCUSSION_TEMPLATE/rfc.yml
/docs/_snippets/checkbox-story-grouped.md
/docs/_snippets/storybook-preview-with-angular-polyfills.md
/code/frameworks/angular/template/stories/basics/README.mdx
/docs/_snippets/api-doc-block-story-parameter.md
/docs/_snippets/arg-types-control.md
/code/frameworks/angular/template/stories/basics/angular-forms/customControlValueAccessor/custom-cva-component.stories.ts
About Greptile
This response provides a starting point for your research, not a precise solution.
Help us improve! Please leave a ๐ if this is helpful and ๐ if it is irrelevant.
from storybook.
Related Issues (20)
- [Bug]: Using a project with PNPM and Vite cannot find HOT 1
- [Bug]: vite build.outDir does not contain all Storybook build files with React Vite (TypeScript) setup HOT 1
- [Bug]: Dark theme not work properly. HOT 2
- [Documentation]: docs/get-started/frameworks/nextjs needs draftMode mock example HOT 1
- Use CSF tools/babel instead of typescript
- [Bug]: SB_CORE-SERVER_0002 (CriticalPresetLoadError) Failed to load preset: "@storybook/nextjs/preset" HOT 2
- [Bug]: Weird CSS added that affects docs styling HOT 1
- [Bug]: TypeError [ERR_INVALID_ARG_TYPE] with test-runner and ES6 package
- [Bug]: SfC not working in `8.3.0-alpha.5` HOT 1
- [Bug]: Storybook fails to launch with `NODE_OPTIONS=--experimental-strip-types`
- [Bug]: @storybook/test does not support typescript versions < 4.7
- Bug: Investigate issue with MSW and browser mode
- Bug: Investigate global-setup storybook spawn script sometimes not killing Storybook process
- Introduce portable stories support for Web components
- Introduce portable stories support for SvelteKit
- Documentation: Vitest plugin setup/usage
- Introduce setProjectAnnotations for every Storybook renderer
- Introduce portable stories support for HTML
- Introduce portable stories support for Angular
- Introduce portable stories support for Preact
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from storybook.