diff --git a/es-ds-components/components/es-form-textarea.vue b/es-ds-components/components/es-form-textarea.vue
new file mode 100644
index 000000000..5a3611441
--- /dev/null
+++ b/es-ds-components/components/es-form-textarea.vue
@@ -0,0 +1,124 @@
+
+
+
+
+
+
+
{{ row[columnIndex] }}
diff --git a/es-ds-docs/package-lock.json b/es-ds-docs/package-lock.json
index f91ca5b1c..904325e6e 100644
--- a/es-ds-docs/package-lock.json
+++ b/es-ds-docs/package-lock.json
@@ -15,11 +15,12 @@
"@vuelidate/core": "^2.0.3",
"@vuelidate/validators": "^2.0.4",
"clipboard": "^2.0.11",
- "nuxt": "^3.13.0",
+ "html-truncate": "^1.2.2",
+ "nuxt": "^3.13.1",
"nuxt-primevue": "^3.0.0",
"primevue": "^3.53.0",
"prismjs": "^1.29.0",
- "vue": "^3.4.34"
+ "vue": "^3.5.4"
},
"devDependencies": {
"@eslint/js": "^9.9.0",
@@ -3256,12 +3257,12 @@
}
},
"node_modules/@vue/compiler-core": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.1.tgz",
- "integrity": "sha512-WdjF+NSgFYdWttHevHw5uaJFtKPalhmxhlu2uREj8cLP0uyKKIR60/JvSZNTp0x+NSd63iTiORQTx3+tt55NWQ==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.4.tgz",
+ "integrity": "sha512-oNwn+BAt3n9dK9uAYvI+XGlutwuTq/wfj4xCBaZCqwwVIGtD7D6ViihEbyYZrDHIHTDE3Q6oL3/hqmAyFEy9DQ==",
"dependencies": {
"@babel/parser": "^7.25.3",
- "@vue/shared": "3.5.1",
+ "@vue/shared": "3.5.4",
"entities": "^4.5.0",
"estree-walker": "^2.0.2",
"source-map-js": "^1.2.0"
@@ -3273,24 +3274,24 @@
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="
},
"node_modules/@vue/compiler-dom": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.1.tgz",
- "integrity": "sha512-Ao23fB1lINo18HLCbJVApvzd9OQe8MgmQSgyY5+umbWj2w92w9KykVmJ4Iv2US5nak3ixc2B+7Km7JTNhQ8kSQ==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.4.tgz",
+ "integrity": "sha512-yP9RRs4BDLOLfldn6ah+AGCNovGjMbL9uHvhDHf5wan4dAHLnFGOkqtfE7PPe4HTXIqE7l/NILdYw53bo1C8jw==",
"dependencies": {
- "@vue/compiler-core": "3.5.1",
- "@vue/shared": "3.5.1"
+ "@vue/compiler-core": "3.5.4",
+ "@vue/shared": "3.5.4"
}
},
"node_modules/@vue/compiler-sfc": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.1.tgz",
- "integrity": "sha512-DFizMNH8eDglLhlfwJ0+ciBsztaYe3fY/zcZjrqL1ljXvUw/UpC84M1d7HpBTCW68SNqZyIxrs1XWmf+73Y65w==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.4.tgz",
+ "integrity": "sha512-P+yiPhL+NYH7m0ZgCq7AQR2q7OIE+mpAEgtkqEeH9oHSdIRvUO+4X6MPvblJIWcoe4YC5a2Gdf/RsoyP8FFiPQ==",
"dependencies": {
"@babel/parser": "^7.25.3",
- "@vue/compiler-core": "3.5.1",
- "@vue/compiler-dom": "3.5.1",
- "@vue/compiler-ssr": "3.5.1",
- "@vue/shared": "3.5.1",
+ "@vue/compiler-core": "3.5.4",
+ "@vue/compiler-dom": "3.5.4",
+ "@vue/compiler-ssr": "3.5.4",
+ "@vue/shared": "3.5.4",
"estree-walker": "^2.0.2",
"magic-string": "^0.30.11",
"postcss": "^8.4.44",
@@ -3303,12 +3304,12 @@
"integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="
},
"node_modules/@vue/compiler-ssr": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.1.tgz",
- "integrity": "sha512-C1hpSHQgRM8bg+5XWWD7CkFaVpSn9wZHCLRd10AmxqrH17d4EMP6+XcZpwBOM7H1jeStU5naEapZZWX0kso1tQ==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.4.tgz",
+ "integrity": "sha512-acESdTXsxPnYr2C4Blv0ggx5zIFMgOzZmYU2UgvIff9POdRGbRNBHRyzHAnizcItvpgerSKQbllUc9USp3V7eg==",
"dependencies": {
- "@vue/compiler-dom": "3.5.1",
- "@vue/shared": "3.5.1"
+ "@vue/compiler-dom": "3.5.4",
+ "@vue/shared": "3.5.4"
}
},
"node_modules/@vue/compiler-vue2": {
@@ -3427,49 +3428,49 @@
}
},
"node_modules/@vue/reactivity": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.1.tgz",
- "integrity": "sha512-aFE1nMDfbG7V+U5vdOk/NXxH/WX78XuAfX59vWmCM7Ao4lieoc83RkzOAWun61sQXlzNZ4IgROovFBHg+Iz1+Q==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.4.tgz",
+ "integrity": "sha512-HKKbEuP7tYSGCq4e4nK6ZW6l5hyG66OUetefBp4budUyjvAYsnQDf+bgFzg2RAgnH0CInyqXwD9y47jwJEHrQw==",
"dependencies": {
- "@vue/shared": "3.5.1"
+ "@vue/shared": "3.5.4"
}
},
"node_modules/@vue/runtime-core": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.1.tgz",
- "integrity": "sha512-Ce92CCholNRHR3ZtzpRp/7CDGIPFxQ7ElXt9iH91ilK5eOrUv3Z582NWJesuM3aYX71BujVG5/4ypUxigGNxjA==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.4.tgz",
+ "integrity": "sha512-f3ek2sTA0AFu0n+w+kCtz567Euqqa3eHewvo4klwS7mWfSj/A+UmYTwsnUFo35KeyAFY60JgrCGvEBsu1n/3LA==",
"dependencies": {
- "@vue/reactivity": "3.5.1",
- "@vue/shared": "3.5.1"
+ "@vue/reactivity": "3.5.4",
+ "@vue/shared": "3.5.4"
}
},
"node_modules/@vue/runtime-dom": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.1.tgz",
- "integrity": "sha512-B/fUJfBLp5PwE0EWNfBYnA4JUea8Yufb3wN8fN0/HzaqBdkiRHh4sFHOjWqIY8GS75gj//8VqeEqhcU6yUjIkA==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.4.tgz",
+ "integrity": "sha512-ofyc0w6rbD5KtjhP1i9hGOKdxGpvmuB1jprP7Djlj0X7R5J/oLwuNuE98GJ8WW31Hu2VxQHtk/LYTAlW8xrJdw==",
"dependencies": {
- "@vue/reactivity": "3.5.1",
- "@vue/runtime-core": "3.5.1",
- "@vue/shared": "3.5.1",
+ "@vue/reactivity": "3.5.4",
+ "@vue/runtime-core": "3.5.4",
+ "@vue/shared": "3.5.4",
"csstype": "^3.1.3"
}
},
"node_modules/@vue/server-renderer": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.1.tgz",
- "integrity": "sha512-C5V/fjQTitgVaRNH5wCoHynaWysjZ+VH68drNsAvQYg4ArHsZUQNz0nHoEWRj41nzqkVn2RUlnWaEOTl2o1Ppg==",
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.4.tgz",
+ "integrity": "sha512-FbjV6DJLgKRetMYFBA1UXCroCiED/Ckr53/ba9wivyd7D/Xw9fpo0T6zXzCnxQwyvkyrL7y6plgYhWhNjGxY5g==",
"dependencies": {
- "@vue/compiler-ssr": "3.5.1",
- "@vue/shared": "3.5.1"
+ "@vue/compiler-ssr": "3.5.4",
+ "@vue/shared": "3.5.4"
},
"peerDependencies": {
- "vue": "3.5.1"
+ "vue": "3.5.4"
}
},
"node_modules/@vue/shared": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.1.tgz",
- "integrity": "sha512-NdcTRoO4KuW2RSFgpE2c+E/R/ZHaRzWPxAGxhmxZaaqLh6nYCXx7lc9a88ioqOCxCaV2SFJmujkxbUScW7dNsQ=="
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.4.tgz",
+ "integrity": "sha512-L2MCDD8l7yC62Te5UUyPVpmexhL9ipVnYRw9CsWfm/BGRL5FwDX4a25bcJ/OJSD3+Hx+k/a8LDKcG2AFdJV3BA=="
},
"node_modules/@vuelidate/core": {
"version": "2.0.3",
@@ -6848,6 +6849,14 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/html-truncate": {
+ "version": "1.2.2",
+ "resolved": "https://registry.npmjs.org/html-truncate/-/html-truncate-1.2.2.tgz",
+ "integrity": "sha512-oiXb65RDxSYY8eXJKJiKHHpI7LyQbMG8LbSuvvWLLxAKNywJ7aaq0M1ynj2QJs0odQNggEEg/dTFVtH3lG0ClQ==",
+ "engines": {
+ "node": "*"
+ }
+ },
"node_modules/http-errors": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.0.tgz",
@@ -12796,15 +12805,15 @@
"integrity": "sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw=="
},
"node_modules/vue": {
- "version": "3.5.1",
- "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.1.tgz",
- "integrity": "sha512-k4UNnbPOEskodSxMtv+B9GljdB0C9ubZDOmW6vnXVGIfMqmEsY2+ohasjGguhGkMkrcP/oOrbH0dSD41x5JQFw==",
- "dependencies": {
- "@vue/compiler-dom": "3.5.1",
- "@vue/compiler-sfc": "3.5.1",
- "@vue/runtime-dom": "3.5.1",
- "@vue/server-renderer": "3.5.1",
- "@vue/shared": "3.5.1"
+ "version": "3.5.4",
+ "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.4.tgz",
+ "integrity": "sha512-3yAj2gkmiY+i7+22A1PWM+kjOVXjU74UPINcTiN7grIVPyFFI0lpGwHlV/4xydDmobaBn7/xmi+YG8HeSlCTcg==",
+ "dependencies": {
+ "@vue/compiler-dom": "3.5.4",
+ "@vue/compiler-sfc": "3.5.4",
+ "@vue/runtime-dom": "3.5.4",
+ "@vue/server-renderer": "3.5.4",
+ "@vue/shared": "3.5.4"
},
"peerDependencies": {
"typescript": "*"
diff --git a/es-ds-docs/package.json b/es-ds-docs/package.json
index aafe09479..0436b2433 100644
--- a/es-ds-docs/package.json
+++ b/es-ds-docs/package.json
@@ -24,11 +24,12 @@
"@vuelidate/core": "^2.0.3",
"@vuelidate/validators": "^2.0.4",
"clipboard": "^2.0.11",
- "nuxt": "^3.13.0",
+ "nuxt": "^3.13.1",
"nuxt-primevue": "^3.0.0",
"primevue": "^3.53.0",
"prismjs": "^1.29.0",
- "vue": "^3.4.34"
+ "vue": "^3.5.4",
+ "html-truncate": "^1.2.2"
},
"devDependencies": {
"@eslint/js": "^9.9.0",
diff --git a/es-ds-docs/pages/atoms/color.vue b/es-ds-docs/pages/atoms/color.vue
index 55c68cb33..351b36486 100644
--- a/es-ds-docs/pages/atoms/color.vue
+++ b/es-ds-docs/pages/atoms/color.vue
@@ -90,14 +90,15 @@ const yellowTints = slice(sassYellows, ['yellow-400', 'yellow-300', 'yellow-200'
const { $prism } = useNuxtApp();
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const docSource = await import('./color.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./color.vue?raw');
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/atoms/corners.vue b/es-ds-docs/pages/atoms/corners.vue
index fec99aa0f..b27a4fdd9 100644
--- a/es-ds-docs/pages/atoms/corners.vue
+++ b/es-ds-docs/pages/atoms/corners.vue
@@ -54,14 +54,15 @@ const borderRadius = computed(() => {
const { $prism } = useNuxtApp();
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-self-import */
- const docSource = await import('./corners.vue?raw');
- /* eslint-enable import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./corners.vue?raw');
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/atoms/icons.vue b/es-ds-docs/pages/atoms/icons.vue
index 771e369df..505a478c6 100644
--- a/es-ds-docs/pages/atoms/icons.vue
+++ b/es-ds-docs/pages/atoms/icons.vue
@@ -22,13 +22,15 @@ const docCode = ref('');
const { $prism } = useNuxtApp();
-if ($prism) {
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./icons.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./icons.vue?raw');
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/atoms/layout.vue b/es-ds-docs/pages/atoms/layout.vue
index 8d39b7ecc..4ad3ad95a 100644
--- a/es-ds-docs/pages/atoms/layout.vue
+++ b/es-ds-docs/pages/atoms/layout.vue
@@ -37,12 +37,14 @@ const breakpointTableItems = [
const { $prism } = useNuxtApp();
const docCode = ref('');
-if ($prism) {
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./layout.vue?raw');
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./layout.vue?raw');
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/atoms/spacing.vue b/es-ds-docs/pages/atoms/spacing.vue
index 7562a0489..4cf6d29f4 100644
--- a/es-ds-docs/pages/atoms/spacing.vue
+++ b/es-ds-docs/pages/atoms/spacing.vue
@@ -41,12 +41,14 @@ const deprecatedSpacers = computed(() =>
const { $prism } = useNuxtApp();
const docCode = ref('');
-if ($prism) {
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./spacing.vue?raw');
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./spacing.vue?raw');
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/atoms/typography.vue b/es-ds-docs/pages/atoms/typography.vue
index 494794e82..21a746b2b 100644
--- a/es-ds-docs/pages/atoms/typography.vue
+++ b/es-ds-docs/pages/atoms/typography.vue
@@ -240,13 +240,14 @@ const calculateActualFontSize = (remStr) => {
const { $prism } = useNuxtApp();
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const docSource = await import('./typography.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./typography.vue?raw');
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/examples/form-field-validation.vue b/es-ds-docs/pages/examples/form-field-validation.vue
index 684f055ef..040d7e499 100644
--- a/es-ds-docs/pages/examples/form-field-validation.vue
+++ b/es-ds-docs/pages/examples/form-field-validation.vue
@@ -82,13 +82,15 @@ const getErrorMessage = (validatorName) => {
const { $prism } = useNuxtApp();
const docCode = ref('');
-if ($prism) {
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./form-field-validation.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./form-field-validation.vue?raw');
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/examples/form-validation.vue b/es-ds-docs/pages/examples/form-validation.vue
index 08550c6bb..733ec6fb9 100644
--- a/es-ds-docs/pages/examples/form-validation.vue
+++ b/es-ds-docs/pages/examples/form-validation.vue
@@ -31,13 +31,15 @@ const onSubmit = async () => {
const { $prism } = useNuxtApp();
const docCode = ref('');
-if ($prism) {
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./form-validation.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./form-validation.vue?raw');
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/index.vue b/es-ds-docs/pages/index.vue
index 6c3cda4a7..dbef233ef 100644
--- a/es-ds-docs/pages/index.vue
+++ b/es-ds-docs/pages/index.vue
@@ -14,14 +14,9 @@
target="_blank">
PrimeVue v3
- projects. If something is documented in those projects but not here, it is still very likely you can use it
- in our system. For example if a component does not exist here but exists in
-
- PrimeVue
-
- you are encouraged to use it.
+ projects. If something is documented in Bootstrap but not here, it is still very likely you can use it in
+ our system. If a component does not exist here but exists in PrimeVue, you may use it, but it will not have
+ any styles.
-
@@ -33,6 +28,9 @@
-
Organisms
+ -
+
Examples
+
diff --git a/es-ds-docs/pages/molecules/accordion.vue b/es-ds-docs/pages/molecules/accordion.vue
index 8ece28145..208907679 100644
--- a/es-ds-docs/pages/molecules/accordion.vue
+++ b/es-ds-docs/pages/molecules/accordion.vue
@@ -57,16 +57,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-accordion-list.vue?raw');
- const docSource = await import('./accordion.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-accordion-list.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./accordion.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/badge.vue b/es-ds-docs/pages/molecules/badge.vue
index f6ffa8d97..5372113a2 100644
--- a/es-ds-docs/pages/molecules/badge.vue
+++ b/es-ds-docs/pages/molecules/badge.vue
@@ -3,15 +3,16 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- // eslint-disable-next-line import/no-unresolved
- const compSource = await import('@energysage/es-ds-components/components/es-badge.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./badge.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-badge.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./badge.vue?raw');
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/breadcrumbs.vue b/es-ds-docs/pages/molecules/breadcrumbs.vue
index 17b8d3362..958a3a6e3 100644
--- a/es-ds-docs/pages/molecules/breadcrumbs.vue
+++ b/es-ds-docs/pages/molecules/breadcrumbs.vue
@@ -35,16 +35,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-breadcrumbs.vue?raw');
- const docSource = await import('./breadcrumbs.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-breadcrumbs.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./breadcrumbs.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/button.vue b/es-ds-docs/pages/molecules/button.vue
index b0555dbbb..80b3bb338 100644
--- a/es-ds-docs/pages/molecules/button.vue
+++ b/es-ds-docs/pages/molecules/button.vue
@@ -89,15 +89,17 @@ const propTableWidths = ref({
const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-button.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./button.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-button.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./button.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/card.vue b/es-ds-docs/pages/molecules/card.vue
index cafae3398..8a1865cb4 100644
--- a/es-ds-docs/pages/molecules/card.vue
+++ b/es-ds-docs/pages/molecules/card.vue
@@ -7,14 +7,16 @@ const modalVisible = ref(false);
const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-card.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./card.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-card.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./card.vue?raw');
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/checkbox.vue b/es-ds-docs/pages/molecules/checkbox.vue
index 9f114cb93..aaadc2458 100644
--- a/es-ds-docs/pages/molecules/checkbox.vue
+++ b/es-ds-docs/pages/molecules/checkbox.vue
@@ -29,15 +29,17 @@ const handleSelectAllToggle = () => {
const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-form-checkbox.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./checkbox.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-form-checkbox.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./checkbox.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
@@ -149,8 +151,8 @@ if ($prism) {
+ doc-source="es-ds-docs/pages/molecules/checkbox.vue" />
diff --git a/es-ds-docs/pages/molecules/collapse.vue b/es-ds-docs/pages/molecules/collapse.vue
index c7ff0d2a4..d27ef19fb 100644
--- a/es-ds-docs/pages/molecules/collapse.vue
+++ b/es-ds-docs/pages/molecules/collapse.vue
@@ -38,16 +38,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-collapse.vue?raw');
- const docSource = await import('./collapse.vue?raw');
- /* eslint-enable import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-collapse.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./collapse.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
@@ -219,7 +220,7 @@ if ($prism) {
diff --git a/es-ds-docs/pages/molecules/data-table-simple.vue b/es-ds-docs/pages/molecules/data-table-simple.vue
index 8baf6bc88..3387de875 100644
--- a/es-ds-docs/pages/molecules/data-table-simple.vue
+++ b/es-ds-docs/pages/molecules/data-table-simple.vue
@@ -118,7 +118,7 @@ onMounted(async () => {
diff --git a/es-ds-docs/pages/molecules/data-table.vue b/es-ds-docs/pages/molecules/data-table.vue
index 9cba97da2..7aa2d0d62 100644
--- a/es-ds-docs/pages/molecules/data-table.vue
+++ b/es-ds-docs/pages/molecules/data-table.vue
@@ -51,15 +51,17 @@ const dataTableItems = [
const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-data-table.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./data-table.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-data-table.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./data-table.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/file-input.vue b/es-ds-docs/pages/molecules/file-input.vue
index 22a90c0db..bd67b076f 100644
--- a/es-ds-docs/pages/molecules/file-input.vue
+++ b/es-ds-docs/pages/molecules/file-input.vue
@@ -81,16 +81,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-file-input.vue?raw');
- const docSource = await import('./file-input.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-file-input.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./file-input.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
const url = ref('');
let fileObjects = [];
@@ -267,7 +268,7 @@ const fileSizeError = (fileName) => {
diff --git a/es-ds-docs/pages/molecules/form-message.vue b/es-ds-docs/pages/molecules/form-message.vue
index d508cdc52..92eb2d9fd 100644
--- a/es-ds-docs/pages/molecules/form-message.vue
+++ b/es-ds-docs/pages/molecules/form-message.vue
@@ -22,15 +22,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-form-msg.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./form-message.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-form-msg.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./form-message.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
@@ -145,8 +147,8 @@ if ($prism) {
+ doc-source="es-ds-docs/pages/molecules/form-message.vue" />
diff --git a/es-ds-docs/pages/molecules/form-textarea.vue b/es-ds-docs/pages/molecules/form-textarea.vue
new file mode 100644
index 000000000..40d3137ab
--- /dev/null
+++ b/es-ds-docs/pages/molecules/form-textarea.vue
@@ -0,0 +1,166 @@
+
+
+
+
+ Textarea
+
+ When using a form textarea, please ensure that the label style is
+
+ Sentence case.
+
+
+
+
+
+ Basic example
+
+ Notes
+
+
+
+
+
+
+ Required
+
+ Notes
+
+
+
+
+
+
+ Error state
+
+ Notes
+ This field is required.
+
+
+
+
+
+
+ Success state
+
+ Notes
+ This field is required.
+
+
+
+
+
+
+ Success state with message
+
+ Notes
+ Please enter your notes.
+ This field is required.
+ Your notes have been entered successfully.
+
+
+
+
+
+
+ Disabled state
+
+ Notes
+
+
+
+
+
+
+ Context message
+
+ Notes
+ Please enter your notes.
+ This field is required.
+ Your notes have been entered successfully.
+
+
+
+
+
+ EsFormTextarea props
+
+
+
+
+
+
diff --git a/es-ds-docs/pages/molecules/modal.vue b/es-ds-docs/pages/molecules/modal.vue
index 18f41136a..3c4b34846 100644
--- a/es-ds-docs/pages/molecules/modal.vue
+++ b/es-ds-docs/pages/molecules/modal.vue
@@ -11,16 +11,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-modal.vue?raw');
- const docSource = await import('./modal.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-modal.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./modal.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/pagination.vue b/es-ds-docs/pages/molecules/pagination.vue
index 3cb373f76..2e7e2777f 100644
--- a/es-ds-docs/pages/molecules/pagination.vue
+++ b/es-ds-docs/pages/molecules/pagination.vue
@@ -2,14 +2,16 @@
const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-pagination.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./pagination.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-pagination.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./pagination.vue?raw');
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
const perPage = 3;
const items = Array.from({ length: 36 }, (v, i) => `Item ${i}`);
diff --git a/es-ds-docs/pages/molecules/popover.vue b/es-ds-docs/pages/molecules/popover.vue
index f4177269b..a60eb50bf 100644
--- a/es-ds-docs/pages/molecules/popover.vue
+++ b/es-ds-docs/pages/molecules/popover.vue
@@ -219,7 +219,7 @@ onMounted(async () => {
diff --git a/es-ds-docs/pages/molecules/progress-circle.vue b/es-ds-docs/pages/molecules/progress-circle.vue
index 1072b3336..f3c37dc14 100644
--- a/es-ds-docs/pages/molecules/progress-circle.vue
+++ b/es-ds-docs/pages/molecules/progress-circle.vue
@@ -19,16 +19,17 @@ const propTableWidths = {
lg: ['2', '2', '2', '6'],
};
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-progress-circle.vue?raw');
- const docSource = await import('./progress-circle.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-progress-circle.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./progress-circle.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/progress.vue b/es-ds-docs/pages/molecules/progress.vue
index 47a0d6e75..e3f895cec 100644
--- a/es-ds-docs/pages/molecules/progress.vue
+++ b/es-ds-docs/pages/molecules/progress.vue
@@ -13,15 +13,17 @@ const propTableWidths = {
md: ['2', '2', '2', '6'],
};
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-progress.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./progress.vue?raw');
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-progress.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./progress.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/radio-button.vue b/es-ds-docs/pages/molecules/radio-button.vue
index fe3c41b45..343b8e8c9 100644
--- a/es-ds-docs/pages/molecules/radio-button.vue
+++ b/es-ds-docs/pages/molecules/radio-button.vue
@@ -49,21 +49,23 @@ const { $prism } = useNuxtApp();
const radioButtonComponentCode = ref('');
const radioButtonGroupComponentCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const radioButtonComponentSource = await import('@energysage/es-ds-components/components/es-radio-button.vue?raw');
- // eslint-disable-next-line max-len
- const radioButtonGroupComponentSource = await import(
- '@energysage/es-ds-components/components/es-radio-button-group.vue?raw'
- );
- const docSource = await import('./radio-button.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
-
- radioButtonComponentCode.value = $prism.normalizeCode(radioButtonComponentSource.default);
- radioButtonGroupComponentCode.value = $prism.normalizeCode(radioButtonGroupComponentSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ const radioButtonComponentSource = await import(
+ '@energysage/es-ds-components/components/es-radio-button.vue?raw'
+ );
+ const radioButtonGroupComponentSource = await import(
+ '@energysage/es-ds-components/components/es-radio-button-group.vue?raw'
+ );
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./radio-button.vue?raw');
+
+ radioButtonComponentCode.value = $prism.normalizeCode(radioButtonComponentSource.default);
+ radioButtonGroupComponentCode.value = $prism.normalizeCode(radioButtonGroupComponentSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
@@ -149,12 +151,12 @@ if ($prism) {
+ comp-source="es-ds-components/components/es-radio-button.vue" />
+ comp-source="es-ds-components/components/es-radio-button-group.vue" />
{
const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-rating.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./rating.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-rating.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./rating.vue?raw');
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
@@ -54,7 +56,7 @@ if ($prism) {
diff --git a/es-ds-docs/pages/molecules/support.vue b/es-ds-docs/pages/molecules/support.vue
index 14c3d0df9..31902172b 100644
--- a/es-ds-docs/pages/molecules/support.vue
+++ b/es-ds-docs/pages/molecules/support.vue
@@ -2,14 +2,16 @@
const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- const compSource = await import('@energysage/es-ds-components/components/es-support.vue?raw');
- // eslint-disable-next-line import/no-self-import
- const docSource = await import('./support.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-support.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./support.vue?raw');
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
const link = 'https://www.energysage.com';
const placeholderImage = 'https://a-us.storyblok.com/f/1006156/110x110/d215996a95/default-installer-logo.png';
@@ -59,8 +61,8 @@ const supportProps = [
+ doc-source="es-ds-docs/pages/molecules/support.vue" />
diff --git a/es-ds-docs/pages/molecules/tabs.vue b/es-ds-docs/pages/molecules/tabs.vue
index 05ab235d6..1bf999f68 100644
--- a/es-ds-docs/pages/molecules/tabs.vue
+++ b/es-ds-docs/pages/molecules/tabs.vue
@@ -5,16 +5,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-tabs.vue?raw');
- const docSource = await import('./tabs.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-tabs.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./tabs.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
diff --git a/es-ds-docs/pages/molecules/text-input.vue b/es-ds-docs/pages/molecules/text-input.vue
index 67c8b7470..aea42389e 100644
--- a/es-ds-docs/pages/molecules/text-input.vue
+++ b/es-ds-docs/pages/molecules/text-input.vue
@@ -12,16 +12,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-form-input.vue?raw');
- const docSource = await import('./text-input.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-form-input.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./text-input.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
const propTableRows = [
['v-model', 'String', 'n/a', 'Required. The v-model directive binds the input to a data property.'],
@@ -310,7 +311,7 @@ const propTableRows = [
diff --git a/es-ds-docs/pages/molecules/view-more.vue b/es-ds-docs/pages/molecules/view-more.vue
new file mode 100644
index 000000000..e5845d413
--- /dev/null
+++ b/es-ds-docs/pages/molecules/view-more.vue
@@ -0,0 +1,87 @@
+
+
+
+
+ View more
+
+ Using
+
+ html-truncate .
+
+
+
+
+
+ EsViewMore props
+
+
+
+
+
+
diff --git a/es-ds-docs/pages/organisms/carousel.vue b/es-ds-docs/pages/organisms/carousel.vue
index e5c2ca5e4..a9596dc36 100644
--- a/es-ds-docs/pages/organisms/carousel.vue
+++ b/es-ds-docs/pages/organisms/carousel.vue
@@ -41,16 +41,17 @@ const { $prism } = useNuxtApp();
const compCode = ref('');
const docCode = ref('');
-if ($prism) {
- /* eslint-disable import/no-webpack-loader-syntax, import/no-self-import */
- const compSource = await import('@energysage/es-ds-components/components/es-carousel.vue?raw');
- const docSource = await import('./carousel.vue?raw');
- /* eslint-enable import/no-webpack-loader-syntax, import/no-self-import */
+onMounted(async () => {
+ if ($prism) {
+ const compSource = await import('@energysage/es-ds-components/components/es-carousel.vue?raw');
+ // eslint-disable-next-line import/no-self-import
+ const docSource = await import('./carousel.vue?raw');
- compCode.value = $prism.normalizeCode(compSource.default);
- docCode.value = $prism.normalizeCode(docSource.default);
- $prism.highlight();
-}
+ compCode.value = $prism.normalizeCode(compSource.default);
+ docCode.value = $prism.normalizeCode(docSource.default);
+ $prism.highlight();
+ }
+});
const propTableRows = [
[
@@ -190,9 +191,9 @@ const propTableRows = [
+ doc-source="es-ds-docs/pages/organisms/carousel.vue" />