Fix/#42 add hot reload in storybook for stencil #43

Merged
Ninosaurier merged 3 commits from fix/#42-add-hot-reload-in-storybook-for-stencil into dev 2026-10-05 17:03:42 +00:00
10 changed files with 52 additions and 78 deletions
Showing only changes of commit 20a1f89030 - Show all commits
+1 -2
View File
@@ -2,6 +2,5 @@
"singleQuote": true,
"semi": true,
"trailingComma": "es5",
"printWidth": 100,
"bracketSameLine": true
"printWidth": 100
}
-1
View File
@@ -1,7 +1,6 @@
{
"arrowParens": "avoid",
"bracketSpacing": true,
"jsxBracketSameLine": false,
"jsxSingleQuote": false,
"quoteProps": "consistent",
"printWidth": 180,
+3 -4
View File
@@ -1,4 +1,3 @@
/**
* This is an autogenerated file created by the Stencil compiler.
* DO NOT MODIFY IT MANUALLY
@@ -29,7 +28,7 @@ interface ComponentCompilerTypeReference {
* - globally
* - by importing it into a file (and is defined elsewhere)
*/
location: "local" | "global" | "import";
location: 'local' | 'global' | 'import';
/**
* The path to the type reference, if applicable (global types should not need a path associated with them)
*/
@@ -152,7 +151,7 @@ export interface JsonDocsComponent {
/**
* The encapsulation strategy for a component
*/
encapsulation: "shadow" | "scoped" | "none";
encapsulation: 'shadow' | 'scoped' | 'none';
/**
* The tag name for the component, for use in HTML
*/
@@ -467,7 +466,7 @@ export interface StyleDoc {
* Used to inform Stencil where the start of a new property's description starts (and where the previous description
* ends).
*/
annotation: "prop";
annotation: 'prop';
/**
* The Stencil style-mode that is associated with this property.
*/
+10 -4
View File
@@ -1,5 +1,5 @@
{
"timestamp": "2026-09-17T15:31:03",
"timestamp": "2026-10-05T16:30:03",
"compiler": {
"name": "@stencil/core",
"version": "4.44.2",
@@ -30,10 +30,10 @@
"docsTags": [
{
"name": "default",
"text": "\"Hello World\""
"text": "'Hello World'"
}
],
"default": "\"Hello World\"",
"default": "'Hello World'",
"values": [
{
"type": "string"
@@ -62,5 +62,11 @@
"dependencyGraph": {}
}
],
"typeLibrary": {}
"typeLibrary": {
"src/types/index.ts::ChartInfo": {
"declaration": "export interface ChartInfo {\n title: string;\n description: string; \n sourceUrl: string; \n}",
"docstring": "",
"path": "src/types/index.ts"
}
}
}
+13 -13
View File
@@ -1,50 +1,50 @@
/* eslint-disable */
/* tslint:disable */
/**
* This is an autogenerated file created by the Stencil compiler.
* It contains typing information for all components that exist in this project.
*/
import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
import { HTMLStencilElement, JSXBase } from '@stencil/core/internal';
export namespace Components {
interface BarChart {
/**
* @default "Hello World"
* @default 'Hello World'
*/
"title": string;
title: string;
}
}
declare global {
interface HTMLBarChartElement extends Components.BarChart, HTMLStencilElement {
}
interface HTMLBarChartElement extends Components.BarChart, HTMLStencilElement {}
var HTMLBarChartElement: {
prototype: HTMLBarChartElement;
new (): HTMLBarChartElement;
};
interface HTMLElementTagNameMap {
"bar-chart": HTMLBarChartElement;
'bar-chart': HTMLBarChartElement;
}
}
declare namespace LocalJSX {
interface BarChart {
/**
* @default "Hello World"
* @default 'Hello World'
*/
"title"?: string;
title?: string;
}
interface BarChartAttributes {
"title": string;
title: string;
}
interface IntrinsicElements {
"bar-chart": Omit<BarChart, keyof BarChartAttributes> & { [K in keyof BarChart & keyof BarChartAttributes]?: BarChart[K] } & { [K in keyof BarChart & keyof BarChartAttributes as `attr:${K}`]?: BarChartAttributes[K] } & { [K in keyof BarChart & keyof BarChartAttributes as `prop:${K}`]?: BarChart[K] };
'bar-chart': Omit<BarChart, keyof BarChartAttributes> & { [K in keyof BarChart & keyof BarChartAttributes]?: BarChart[K] } & {
[K in keyof BarChart & keyof BarChartAttributes as `attr:${K}`]?: BarChartAttributes[K];
} & { [K in keyof BarChart & keyof BarChartAttributes as `prop:${K}`]?: BarChart[K] };
}
}
export { LocalJSX as JSX };
declare module "@stencil/core" {
declare module '@stencil/core' {
export namespace JSX {
interface IntrinsicElements {
"bar-chart": LocalJSX.IntrinsicElements["bar-chart"] & JSXBase.HTMLAttributes<HTMLBarChartElement>;
'bar-chart': LocalJSX.IntrinsicElements['bar-chart'] & JSXBase.HTMLAttributes<HTMLBarChartElement>;
}
}
}
@@ -16,7 +16,7 @@ type Story = StoryObj<BarChart>;
export const Primary: Story = {
args: {},
render: () => <bar-chart title='test' />,
render: () => <bar-chart title="test" />,
};
export const Secondary: Story = {
@@ -6,8 +6,7 @@ import { Component, Host, Prop, h } from '@stencil/core';
shadow: true,
})
export class BarChart {
@Prop() title: string = "Hello World";
@Prop() title: string = 'Hello World';
render() {
return (
@@ -1,24 +0,0 @@
# bar-chart
<!-- Auto Generated Below -->
## Properties
| Property | Attribute | Description | Type | Default |
| -------- | --------- | ----------- | -------- | --------------- |
| `title` | `title` | | `string` | `"Hello World"` |
## Slots
| Slot | Description |
| ---- | ---------------- |
| | The default slot |
----------------------------------------------
*Built with [StencilJS](https://stenciljs.com/)*
@@ -2,7 +2,6 @@ import { newSpecPage } from '@stencil/core/testing';
import { BarChart } from '../bar-chart';
import { describe, expect, it } from 'vitest';
describe('bar-chart', () => {
it('renders', async () => {
const page = await newSpecPage({
-3
View File
@@ -12,9 +12,6 @@ export const config: Config = {
customElementsExportBehavior: 'auto-define-custom-elements',
externalRuntime: false,
},
{
type: 'docs-readme',
},
{
type: 'www',
serviceWorker: null, // disable service workers