feather-k-demo-utils 0.0.39 → 0.0.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/DEMO-UTILS.md +15 -3
- package/package.json +1 -1
package/DEMO-UTILS.md
CHANGED
|
@@ -82,6 +82,7 @@ Notes:
|
|
|
82
82
|
|
|
83
83
|
## 4) Render DemoStats, DemoDebug, and DemoSettings in your app
|
|
84
84
|
|
|
85
|
+
|
|
85
86
|
### DemoStats
|
|
86
87
|
|
|
87
88
|
```vue
|
|
@@ -95,12 +96,16 @@ const version = computed(() => getFeatherkStylesVersionFromUrl(import.meta.env.F
|
|
|
95
96
|
</script>
|
|
96
97
|
|
|
97
98
|
<template>
|
|
98
|
-
<DemoStats v-if="version" :version="version" :publishDate="PUBLISH_DATE" />
|
|
99
|
+
<DemoStats v-if="version" :version="version" :publishDate="PUBLISH_DATE" :active="false" />
|
|
99
100
|
</template>
|
|
100
101
|
```
|
|
101
102
|
|
|
102
103
|
`DemoStats` renders the version and publish date, and links to the demo-utils README if the publish date is missing.
|
|
103
104
|
|
|
105
|
+
- **active prop (optional):** Controls whether the stats panel is open by default. If omitted, defaults to closed. The panel manages its own open/close state after initialization.
|
|
106
|
+
- **Accessibility:** Includes role, aria-label, and aria-expanded attributes for screen readers.
|
|
107
|
+
|
|
108
|
+
|
|
104
109
|
### DemoDebug
|
|
105
110
|
|
|
106
111
|
Collapsible debug panel. Slot content is only shown if provided.
|
|
@@ -112,12 +117,16 @@ const debugInfo = { foo: 'bar', count: 42 };
|
|
|
112
117
|
</script>
|
|
113
118
|
|
|
114
119
|
<template>
|
|
115
|
-
<DemoDebug>
|
|
120
|
+
<DemoDebug :active="false">
|
|
116
121
|
<pre>{{ debugInfo }}</pre>
|
|
117
122
|
</DemoDebug>
|
|
118
123
|
</template>
|
|
119
124
|
```
|
|
120
125
|
|
|
126
|
+
- **active prop (optional):** Controls whether the debug panel is open by default. If omitted, defaults to closed. The panel manages its own open/close state after initialization.
|
|
127
|
+
- **Accessibility:** Includes role, aria-label, and aria-expanded attributes for screen readers.
|
|
128
|
+
|
|
129
|
+
|
|
121
130
|
### DemoSettings
|
|
122
131
|
|
|
123
132
|
Collapsible settings panel. Slot content is only shown if provided.
|
|
@@ -128,12 +137,15 @@ import { DemoSettings } from "feather-k-demo-utils";
|
|
|
128
137
|
</script>
|
|
129
138
|
|
|
130
139
|
<template>
|
|
131
|
-
<DemoSettings>
|
|
140
|
+
<DemoSettings :active="false">
|
|
132
141
|
<div>Settings content here</div>
|
|
133
142
|
</DemoSettings>
|
|
134
143
|
</template>
|
|
135
144
|
```
|
|
136
145
|
|
|
146
|
+
- **active prop (optional):** Controls whether the settings panel is open by default. If omitted, defaults to closed. The panel manages its own open/close state after initialization.
|
|
147
|
+
- **Accessibility:** Includes role, aria-label, and aria-expanded attributes for screen readers.
|
|
148
|
+
|
|
137
149
|
## 5) (Optional) Pin the dependency version
|
|
138
150
|
|
|
139
151
|
```json
|