mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-23 01:46:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add StorybookJS

Browse source
This commit is contained in:
Michal 2025-04-04 11:51:33 +02:00
parent 1039a4788d
commit cbc1260553
116 changed files with 3560 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

18
stories/embedded-content/embed.stories.ts Normal file
View file

@ -0,0 +1,18 @@
import { createHTMLElement } from "../HTMLElement";
export default {
title: "EmbeddedContent/Embed",
tags: ["autodocs"],
args: {
src: "https://example.com",
type: "text/html",
width: 300,
height: 200,
},
// Render the <html> element
render: (args) => {
return createHTMLElement("embed", args);
},
};
export const Default = {};

18
stories/embedded-content/fencedframe.stories.ts Normal file
View file

@ -0,0 +1,18 @@
import { createHTMLElement } from "../HTMLElement";
export default {
title: "EmbeddedContent/FencedFrame",
tags: ["autodocs"],
args: {
src: "https://example.com",
type: "text/html",
width: 300,
height: 200,
},
// Render the <html> element
render: (args) => {
return createHTMLElement("fencedframe", args);
},
};
export const Default = {};

29
stories/embedded-content/iframe.stories.ts Normal file
View file

@ -0,0 +1,29 @@
import { createHTMLElement } from "../HTMLElement";
export default {
title: "EmbeddedContent/Iframe",
tags: ["autodocs"],
args: {
src: "https://example.com",
type: "text/html",
width: 300,
height: 200,
allow:
"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
allowfullscreen: false,
allowpaymentrequest: false,
browsingtopics: false,
credentialless: true,
loading: "lazy",
name: "iframe-name",
refererpolicy: "no-referrer",
sandbox: "allow-same-origin allow-scripts",
srcdoc: "<p>Your browser does not support iframes.</p>",
},
// Render the <html> element
render: (args) => {
return createHTMLElement("iframe", args);
},
};
export const Default = {};

21
stories/embedded-content/object.stories.ts Normal file
View file

@ -0,0 +1,21 @@
import { createHTMLElement } from "../HTMLElement";
export default {
title: "EmbeddedContent/Object",
tags: ["autodocs"],
args: {
content: "Content",
data: "https://example.com",
type: "text/html",
form: "form",
width: 300,
height: 200,
name: "objectName",
},
// Render the <html> element
render: (args) => {
return createHTMLElement("object", args);
},
};
export const Default = {};

15
stories/embedded-content/picture.stories.ts Normal file
View file

@ -0,0 +1,15 @@
import { createHTMLElement } from "../HTMLElement";
export default {
title: "EmbeddedContent/Picture",
tags: ["autodocs"],
args: {
content: "Content",
},
// Render the <html> element
render: (args) => {
return createHTMLElement("picture", args);
},
};
export const Default = {};

22
stories/embedded-content/source.stories.ts Normal file
View file

@ -0,0 +1,22 @@
import { createHTMLElement } from "../HTMLElement";
export default {
title: "EmbeddedContent/Source",
tags: ["autodocs"],
args: {
type: "video/mp4",
src: "https://www.example.com/video.mp4",
srcset:
"https://www.example.com/video_720p.mp4 720w, https://www.example.com/video_1080p.mp4 1080w",
sizes: "100vw",
media: "(min-width: 600px)",
height: 240,
width: 320,
},
// Render the <html> element
render: (args) => {
return createHTMLElement("source", args);
},
};
export const Default = {};