From 342ba880f1a601b5ed4bfe6541b3ed3def1320c8 Mon Sep 17 00:00:00 2001 From: mrholek Date: Sat, 16 Nov 2024 12:10:42 +0100 Subject: [PATCH 01/12] refactor(CNavItem): pass anchor attributes to the internal element if the href attribute is set --- packages/coreui-vue/src/components/nav/CNavItem.ts | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/packages/coreui-vue/src/components/nav/CNavItem.ts b/packages/coreui-vue/src/components/nav/CNavItem.ts index 48290ba7..e660c01a 100644 --- a/packages/coreui-vue/src/components/nav/CNavItem.ts +++ b/packages/coreui-vue/src/components/nav/CNavItem.ts @@ -5,10 +5,12 @@ import type { ComponentProps } from '../../utils/ComponentProps' interface CNavItemProps extends ComponentProps { as: string + class: string } const CNavItem = defineComponent({ name: 'CNavItem', + inheritAttrs: false, props: { /** * Toggle the active state for the component. @@ -21,6 +23,10 @@ const CNavItem = defineComponent({ type: String, default: 'li', }, + /** + * A string of all className you want applied to the component. + */ + class: String, /** * Toggle the disabled state for the component. */ @@ -30,17 +36,18 @@ const CNavItem = defineComponent({ */ href: String, }, - setup(props: CNavItemProps, { slots }) { + setup(props: CNavItemProps, { attrs, slots }) { return () => h( props.as, { - class: 'nav-item', + class: ['nav-item', props.class], }, props.href ? h( CNavLink, { + ...attrs, active: props.active, disabled: props.disabled, href: props.href, From 8c2827790d607a449aeafc821a80d7848a8438ba Mon Sep 17 00:00:00 2001 From: mrholek Date: Tue, 7 Jan 2025 22:39:15 +0100 Subject: [PATCH 02/12] refactor(CAccordion): improve component accessibility --- .../src/components/accordion/CAccordionBody.ts | 3 ++- .../src/components/accordion/CAccordionButton.ts | 4 +++- .../src/components/accordion/CAccordionItem.ts | 14 +++++++++++--- 3 files changed, 16 insertions(+), 5 deletions(-) diff --git a/packages/coreui-vue/src/components/accordion/CAccordionBody.ts b/packages/coreui-vue/src/components/accordion/CAccordionBody.ts index 4a8d83ff..c8907021 100644 --- a/packages/coreui-vue/src/components/accordion/CAccordionBody.ts +++ b/packages/coreui-vue/src/components/accordion/CAccordionBody.ts @@ -4,11 +4,12 @@ import { CCollapse } from '../collapse/CCollapse' const CAccordionBody = defineComponent({ name: 'CAccordionBody', setup(_, { slots }) { + const id = inject('id') const visible = inject('visible') as Ref return () => h( CCollapse, - { class: 'accordion-collapse', visible: visible.value }, + { class: 'accordion-collapse', id, visible: visible.value }, { default: () => h('div', { class: ['accordion-body'] }, slots.default && slots.default()), }, diff --git a/packages/coreui-vue/src/components/accordion/CAccordionButton.ts b/packages/coreui-vue/src/components/accordion/CAccordionButton.ts index 69ab7a00..f9820b4a 100644 --- a/packages/coreui-vue/src/components/accordion/CAccordionButton.ts +++ b/packages/coreui-vue/src/components/accordion/CAccordionButton.ts @@ -3,6 +3,7 @@ import { defineComponent, h, inject, Ref } from 'vue' const CAccordionButton = defineComponent({ name: 'CAccordionButton', setup(_, { slots }) { + const id = inject('id') as string const toggleVisibility = inject('toggleVisibility') as () => void const visible = inject('visible') as Ref @@ -11,7 +12,8 @@ const CAccordionButton = defineComponent({ 'button', { type: 'button', - 'aria-expanded': !visible.value, + 'aria-control': id, + 'aria-expanded': visible.value, class: ['accordion-button', { ['collapsed']: !visible.value }], onClick: () => toggleVisibility(), }, diff --git a/packages/coreui-vue/src/components/accordion/CAccordionItem.ts b/packages/coreui-vue/src/components/accordion/CAccordionItem.ts index 20575085..f2ebe594 100644 --- a/packages/coreui-vue/src/components/accordion/CAccordionItem.ts +++ b/packages/coreui-vue/src/components/accordion/CAccordionItem.ts @@ -1,8 +1,12 @@ -import { defineComponent, h, inject, provide, ref, watch, Ref } from 'vue' +import { defineComponent, h, inject, provide, ref, watch, Ref, useId } from 'vue' const CAccordionItem = defineComponent({ name: 'CAccordionItem', props: { + /** + * The id global attribute defines an identifier (ID) that must be unique in the whole document. + */ + id: String, /** * The item key. */ @@ -13,16 +17,20 @@ const CAccordionItem = defineComponent({ const alwaysOpen = inject('alwaysOpen') as boolean const setActiveItemKey = inject('setActiveItemKey') as (key: number | string) => void - const itemKey = ref(props.itemKey ?? Math.random().toString(36).slice(2, 11)) + const id = props.id ?? useId() + const itemKey = ref(props.itemKey ?? id) const visible = ref(Boolean(activeItemKey.value === itemKey.value)) watch(activeItemKey, () => (visible.value = Boolean(activeItemKey.value === itemKey.value))) const toggleVisibility = () => { visible.value = !visible.value - !alwaysOpen && visible && setActiveItemKey(itemKey.value) + if (!alwaysOpen && visible) { + setActiveItemKey(itemKey.value) + } } + provide('id', id) provide('visible', visible) provide('toggleVisibility', toggleVisibility) From 7a65f3674bca057e74196736d8d052f7c765034b Mon Sep 17 00:00:00 2001 From: mrholek Date: Tue, 7 Jan 2025 22:46:32 +0100 Subject: [PATCH 03/12] fix(CNavGroup): add the missing href attribute to the toggler --- packages/coreui-vue/src/components/nav/CNavGroup.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/coreui-vue/src/components/nav/CNavGroup.ts b/packages/coreui-vue/src/components/nav/CNavGroup.ts index 2c83ccdf..7c45bd7c 100644 --- a/packages/coreui-vue/src/components/nav/CNavGroup.ts +++ b/packages/coreui-vue/src/components/nav/CNavGroup.ts @@ -41,7 +41,10 @@ const CNavGroup = defineComponent({ onMounted(() => { visible.value = props.visible - props.visible && navGroupRef.value.classList.add('show') + if (props.visible) { + navGroupRef.value.classList.add('show') + } + emit('visible-change', visible.value) }) @@ -60,7 +63,8 @@ const CNavGroup = defineComponent({ emit('visible-change', visible.value) }) - const handleTogglerClick = () => { + const handleTogglerClick = (event: Event) => { + event.preventDefault() visible.value = !visible.value emit('visible-change', visible.value) } @@ -111,6 +115,7 @@ const CNavGroup = defineComponent({ 'a', { class: ['nav-link', 'nav-group-toggle'], + href: '#', onClick: handleTogglerClick, }, slots.togglerContent && slots.togglerContent(), From 0f0a66d2dce66b99e449484a38fdb09550f00ea2 Mon Sep 17 00:00:00 2001 From: mrholek Date: Wed, 8 Jan 2025 11:10:59 +0100 Subject: [PATCH 04/12] build: upgrade ESLint to v9.x --- .eslintignore | 3 -- .eslintrc.js | 75 ---------------------------------------------- eslint.config.mjs | 76 +++++++++++++++++++++++++++++++++++++++++++++++ package.json | 18 +++++------ 4 files changed, 84 insertions(+), 88 deletions(-) delete mode 100644 .eslintignore delete mode 100644 .eslintrc.js create mode 100644 eslint.config.mjs diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index 1846284b..00000000 --- a/.eslintignore +++ /dev/null @@ -1,3 +0,0 @@ -/dist/** -/docs/** -.eslintrc.js \ No newline at end of file diff --git a/.eslintrc.js b/.eslintrc.js deleted file mode 100644 index a0662dcd..00000000 --- a/.eslintrc.js +++ /dev/null @@ -1,75 +0,0 @@ -/** - * Copyright (c) 2013-present, creativeLabs Lukasz Holeczek. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -'use strict' - -module.exports = { - root: true, // So parent files don't get applied - env: { - es6: true, - browser: true, - node: true, - }, - parser: '@typescript-eslint/parser', // Specifies the ESLint parser - parserOptions: { - ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features - sourceType: 'module', // Allows for the use of imports - extraFileExtensions: ['.vue'], - }, - extends: [ - 'eslint:recommended', - 'plugin:vue/vue3-recommended', - 'plugin:prettier/recommended', - 'plugin:unicorn/recommended', - '@vue/eslint-config-typescript/recommended', - '@vue/eslint-config-prettier', - ], - rules: { - 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off', - 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off', - 'unicorn/filename-case': 'off', - 'unicorn/no-array-for-each': 'off', - 'unicorn/no-null': 'off', - 'unicorn/prefer-dom-node-append': 'off', - 'unicorn/prefer-export-from': 'off', - 'unicorn/prefer-query-selector': 'off', - 'unicorn/prevent-abbreviations': 'off', - 'vue/require-default-prop': 'off', - }, - overrides: [ - { - files: ['**/*.mjs'], - env: { - browser: false, - node: true, - }, - parserOptions: { - sourceType: 'module', - }, - }, - { - files: ['**/__tests__/*.{j,t}s?(x)', '**/tests/unit/**/*.spec.{j,t}s?(x)'], - env: { - jest: true, - }, - }, - { - files: ['packages/docs/build/**'], - env: { - browser: false, - node: true, - }, - parserOptions: { - sourceType: 'script', - }, - rules: { - 'no-console': 'off', - strict: 'error', - }, - }, - ], -} diff --git a/eslint.config.mjs b/eslint.config.mjs new file mode 100644 index 00000000..3cee3965 --- /dev/null +++ b/eslint.config.mjs @@ -0,0 +1,76 @@ +import eslint from '@eslint/js' +import eslintPluginUnicorn from 'eslint-plugin-unicorn' +import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended' +import eslintPluginVue from 'eslint-plugin-vue' +import globals from 'globals' +import typescriptEslint from 'typescript-eslint' + +export default typescriptEslint.config( + { ignores: ['**/*.d.ts', '**/coverage', '**/dist', '**/docs', 'eslint.config.mjs'] }, + { + extends: [ + eslint.configs.recommended, + ...typescriptEslint.configs.recommended, + ...eslintPluginVue.configs['flat/recommended'], + eslintPluginUnicorn.configs['flat/recommended'], + ], + files: ['packages/**/src/**/*.{js,ts,tsx}'], + languageOptions: { + ecmaVersion: 'latest', + sourceType: 'module', + globals: globals.browser, + parserOptions: { + parser: typescriptEslint.parser, + }, + }, + rules: { + 'no-console': 'off', + 'no-debugger': 'off', + 'unicorn/filename-case': 'off', + 'unicorn/no-array-for-each': 'off', + 'unicorn/no-null': 'off', + 'unicorn/prefer-dom-node-append': 'off', + 'unicorn/prefer-export-from': 'off', + 'unicorn/prefer-query-selector': 'off', + 'unicorn/prevent-abbreviations': 'off', + 'vue/require-default-prop': 'off', + }, + }, + { + files: ['**/*.mjs'], + languageOptions: { + globals: { + ...Object.fromEntries(Object.entries(globals.browser).map(([key]) => [key, 'off'])), + ...globals.node, + }, + + ecmaVersion: 5, + sourceType: 'module', + }, + }, + { + files: ['**/__tests__/*.{j,t}s?(x)', '**/tests/unit/**/*.spec.{j,t}s?(x)'], + languageOptions: { + globals: { + ...globals.jest, + }, + }, + }, + { + files: ['packages/docs/build/**'], + languageOptions: { + globals: { + ...Object.fromEntries(Object.entries(globals.browser).map(([key]) => [key, 'off'])), + ...globals.node, + }, + + ecmaVersion: 5, + sourceType: 'commonjs', + }, + rules: { + 'no-console': 'off', + strict: 'error', + }, + }, + eslintPluginPrettierRecommended, +) diff --git a/package.json b/package.json index a8e640de..37eb604e 100644 --- a/package.json +++ b/package.json @@ -17,23 +17,21 @@ "lib:build": "lerna run --scope \"@coreui/vue\" build --stream", "lib:test": "lerna run --scope \"@coreui/vue\" test --stream", "lib:test:update": "lerna run --scope \"@coreui/vue\" test:update --stream", - "lint": "eslint \"packages/**/src/**/*.{js,ts,tsx}\"", + "lint": "eslint", "test": "npm-run-all charts:test icons:test lib:test", "test:update": "npm-run-all charts:test:update icons:test:update lib:test:update" }, "devDependencies": { - "@typescript-eslint/eslint-plugin": "^8.6.0", - "@typescript-eslint/parser": "^8.6.0", - "@vue/eslint-config-prettier": "^9.0.0", - "@vue/eslint-config-typescript": "^13.0.0", "@vue/vue3-jest": "29.2.6", - "eslint": "8.57.0", - "eslint-plugin-prettier": "^5.2.1", - "eslint-plugin-vue": "^9.28.0", + "eslint": "^9.17.0", "eslint-config-prettier": "^9.1.0", - "eslint-plugin-unicorn": "^55.0.0", + "eslint-plugin-prettier": "^5.2.1", + "eslint-plugin-unicorn": "^56.0.1", + "eslint-plugin-vue": "^9.32.0", + "globals": "^15.14.0", "lerna": "^8.1.8", "npm-run-all": "^4.1.5", - "prettier": "^3.3.3" + "prettier": "^3.3.3", + "typescript-eslint": "^8.19.1" } } From ad4bfdfdb99fae7b710b688089731c33812ce742 Mon Sep 17 00:00:00 2001 From: mrholek Date: Wed, 8 Jan 2025 11:17:13 +0100 Subject: [PATCH 05/12] build: migrate `.prettierrc.js` to `eslint.config.mjs` --- .prettierrc.js | 7 ------- eslint.config.mjs | 4 ++-- prettier.config.mjs | 13 +++++++++++++ 3 files changed, 15 insertions(+), 9 deletions(-) delete mode 100644 .prettierrc.js create mode 100644 prettier.config.mjs diff --git a/.prettierrc.js b/.prettierrc.js deleted file mode 100644 index 415ca057..00000000 --- a/.prettierrc.js +++ /dev/null @@ -1,7 +0,0 @@ -module.exports = { - semi: false, - trailingComma: "all", - singleQuote: true, - printWidth: 100, - tabWidth: 2 -}; \ No newline at end of file diff --git a/eslint.config.mjs b/eslint.config.mjs index 3cee3965..15164bf5 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -6,7 +6,7 @@ import globals from 'globals' import typescriptEslint from 'typescript-eslint' export default typescriptEslint.config( - { ignores: ['**/*.d.ts', '**/coverage', '**/dist', '**/docs', 'eslint.config.mjs'] }, + { ignores: ['**/*.d.ts', '**/coverage', '**/dist', '**/docs'] }, { extends: [ eslint.configs.recommended, @@ -44,7 +44,7 @@ export default typescriptEslint.config( ...globals.node, }, - ecmaVersion: 5, + ecmaVersion: 'latest', sourceType: 'module', }, }, diff --git a/prettier.config.mjs b/prettier.config.mjs new file mode 100644 index 00000000..6e0ae723 --- /dev/null +++ b/prettier.config.mjs @@ -0,0 +1,13 @@ +/** + * @see https://prettier.io/docs/en/configuration.html + * @type {import("prettier").Config} + */ +const config = { + printWidth: 100, + semi: false, + singleQuote: true, + tabWidth: 2, + trailingComma: 'es5', +}; + +export default config; \ No newline at end of file From 83d380c315404eb6152cfed0b2d687a82507fed1 Mon Sep 17 00:00:00 2001 From: mrholek Date: Wed, 8 Jan 2025 11:18:14 +0100 Subject: [PATCH 06/12] chore: dependencies and devDependencies MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit lerna ^8.1.8 → ^8.1.9 prettier ^3.3.3 → ^3.4.2 --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 37eb604e..9b945921 100644 --- a/package.json +++ b/package.json @@ -29,9 +29,9 @@ "eslint-plugin-unicorn": "^56.0.1", "eslint-plugin-vue": "^9.32.0", "globals": "^15.14.0", - "lerna": "^8.1.8", + "lerna": "^8.1.9", "npm-run-all": "^4.1.5", - "prettier": "^3.3.3", + "prettier": "^3.4.2", "typescript-eslint": "^8.19.1" } } From 9eb188014652f1c912900539e2aa3145f5123edc Mon Sep 17 00:00:00 2001 From: mrholek Date: Wed, 8 Jan 2025 11:19:46 +0100 Subject: [PATCH 07/12] chore: update dependencies and devDependencies MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit @rollup/plugin-commonjs ^28.0.1 → ^28.0.2 @rollup/plugin-node-resolve ^15.3.0 → ^16.0.0 @rollup/plugin-typescript ^12.1.1 → ^12.1.2 rollup ^4.24.2 → ^4.30.1 typescript ^5.6.3 → ^5.7.2 vue ^3.5.12 → ^3.5.13 --- packages/coreui-vue/package.json | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/coreui-vue/package.json b/packages/coreui-vue/package.json index 02a7b5e2..bc94fec7 100644 --- a/packages/coreui-vue/package.json +++ b/packages/coreui-vue/package.json @@ -45,20 +45,20 @@ "@popperjs/core": "^2.11.8" }, "devDependencies": { - "@rollup/plugin-commonjs": "^28.0.1", - "@rollup/plugin-node-resolve": "^15.3.0", - "@rollup/plugin-typescript": "^12.1.1", + "@rollup/plugin-commonjs": "^28.0.2", + "@rollup/plugin-node-resolve": "^16.0.0", + "@rollup/plugin-typescript": "^12.1.2", "@types/jest": "^29.5.14", "@vue/test-utils": "^2.4.6", "@vue/vue3-jest": "29.2.6", "cross-env": "^7.0.3", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", - "rollup": "^4.24.2", + "rollup": "^4.30.1", "rollup-plugin-vue": "^6.0.0", "ts-jest": "^29.2.5", - "typescript": "^5.6.3", - "vue": "^3.5.12", + "typescript": "^5.7.2", + "vue": "^3.5.13", "vue-types": "^5.1.3" }, "peerDependencies": { From 9ffefe651379f6a02b7f9748811b83ee4095c125 Mon Sep 17 00:00:00 2001 From: mrholek Date: Wed, 8 Jan 2025 11:23:55 +0100 Subject: [PATCH 08/12] chore: update dependencies and devDependencies MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit @docsearch/css ^3.6.2 → ^3.8.2 @docsearch/js ^3.6.2 → ^3.8.2 @vuepress/bundler-vite 2.0.0-rc.18 → 2.0.0-rc.19 @vuepress/bundler-webpack 2.0.0-rc.18 → 2.0.0-rc.19 @vuepress/plugin-active-header-links 2.0.0-rc.55 → 2.0.0-rc.69 @vuepress/plugin-git 2.0.0-rc.56 → 2.0.0-rc.68 @vuepress/plugin-markdown-container 2.0.0-rc.54 → 2.0.0-rc.66 @vuepress/plugin-register-components 2.0.0-rc.54 → 2.0.0-rc.66 @vuepress/plugin-theme-data 2.0.0-rc.57 → 2.0.0-rc.69 @vuepress/plugin-toc 2.0.0-rc.55 → 2.0.0-rc.66 @vuepress/shared 2.0.0-rc.18 → 2.0.0-rc.19 @vuepress/utils 2.0.0-rc.18 → 2.0.0-rc.19 sass ^1.80.4 → ^1.83.1 vuepress 2.0.0-rc.18 → 2.0.0-rc.19 --- packages/docs/package.json | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/packages/docs/package.json b/packages/docs/package.json index 43b43f9c..45028b48 100644 --- a/packages/docs/package.json +++ b/packages/docs/package.json @@ -14,23 +14,23 @@ "@coreui/icons-vue": "^2.2.0", "@coreui/utils": "^2.0.2", "@coreui/vue-chartjs": "^3.0.0", - "@docsearch/css": "^3.6.2", - "@docsearch/js": "^3.6.2", - "@vuepress/bundler-vite": "2.0.0-rc.18", - "@vuepress/bundler-webpack": "2.0.0-rc.18", - "@vuepress/plugin-active-header-links": "2.0.0-rc.55", - "@vuepress/plugin-git": "2.0.0-rc.56", - "@vuepress/plugin-markdown-container": "2.0.0-rc.54", + "@docsearch/css": "^3.8.2", + "@docsearch/js": "^3.8.2", + "@vuepress/bundler-vite": "2.0.0-rc.19", + "@vuepress/bundler-webpack": "2.0.0-rc.19", + "@vuepress/plugin-active-header-links": "2.0.0-rc.69", + "@vuepress/plugin-git": "2.0.0-rc.68", + "@vuepress/plugin-markdown-container": "2.0.0-rc.66", "@vuepress/plugin-prismjs": "2.0.0-rc.37", - "@vuepress/plugin-theme-data": "2.0.0-rc.57", - "@vuepress/plugin-register-components": "2.0.0-rc.54", - "@vuepress/plugin-toc": "2.0.0-rc.55", - "@vuepress/shared": "2.0.0-rc.18", - "@vuepress/utils": "2.0.0-rc.18", + "@vuepress/plugin-theme-data": "2.0.0-rc.69", + "@vuepress/plugin-register-components": "2.0.0-rc.66", + "@vuepress/plugin-toc": "2.0.0-rc.66", + "@vuepress/shared": "2.0.0-rc.19", + "@vuepress/utils": "2.0.0-rc.19", "markdown-it-anchor": "^9.2.0", "markdown-it-include": "^2.0.0", - "sass": "^1.80.4", + "sass": "^1.83.1", "vue-docgen-cli": "^4.79.0", - "vuepress": "2.0.0-rc.18" + "vuepress": "2.0.0-rc.19" } } From 8b7e683d8eb50ca3a030d2b05ede1cf9e2c4bf75 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Wed, 8 Jan 2025 11:37:43 +0100 Subject: [PATCH 09/12] chore: update the current year --- LICENSE | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/LICENSE b/LICENSE index f19fc729..fbb053e0 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2021 creativeLabs Łukasz Holeczek +Copyright (c) 2025 creativeLabs Łukasz Holeczek Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal @@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. \ No newline at end of file +SOFTWARE. From 49180937bf5172e80f3fb2a578db44012cff1b80 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Wed, 8 Jan 2025 11:38:12 +0100 Subject: [PATCH 10/12] chore: update the current year --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index e21d4f28..3d4aab99 100644 --- a/README.md +++ b/README.md @@ -227,4 +227,4 @@ CoreUI is an MIT-licensed open source project and is completely free to use. How ## Copyright and license -Copyright 2024 creativeLabs Łukasz Holeczek. Code released under the [MIT License](https://github.com/coreui/coreui-vue/blob/main/LICENSE). Docs released under [Creative Commons](https://creativecommons.org/licenses/by/3.0/). +Copyright 2025 creativeLabs Łukasz Holeczek. Code released under the [MIT License](https://github.com/coreui/coreui-vue/blob/main/LICENSE). Docs released under [Creative Commons](https://creativecommons.org/licenses/by/3.0/). From 9f310bb700dee6f30dab3748de333a605127d0fc Mon Sep 17 00:00:00 2001 From: mrholek Date: Tue, 6 May 2025 13:45:48 +0200 Subject: [PATCH 11/12] build: add .prettierc for docgen cli --- packages/docs/.prettierrc | 8 ++++++++ packages/docs/api/accordion/CAccordionItem.api.md | 7 ++++--- packages/docs/api/form/CFormControlWrapper.api.md | 11 ++++++----- packages/docs/api/nav/CNavItem.api.md | 1 + 4 files changed, 19 insertions(+), 8 deletions(-) create mode 100644 packages/docs/.prettierrc diff --git a/packages/docs/.prettierrc b/packages/docs/.prettierrc new file mode 100644 index 00000000..53e4559d --- /dev/null +++ b/packages/docs/.prettierrc @@ -0,0 +1,8 @@ +{ + "semi": false, + "trailingComma": "es5", + "singleQuote": true, + "printWidth": 100, + "tabWidth": 2 + +} diff --git a/packages/docs/api/accordion/CAccordionItem.api.md b/packages/docs/api/accordion/CAccordionItem.api.md index 753acd83..3e07d5aa 100644 --- a/packages/docs/api/accordion/CAccordionItem.api.md +++ b/packages/docs/api/accordion/CAccordionItem.api.md @@ -8,6 +8,7 @@ import CAccordionItem from '@coreui/vue/src/components/accordion/CAccordionItem' #### Props -| Prop name | Description | Type | Values | Default | -| ------------ | ------------- | -------------- | ------ | ------- | -| **item-key** | The item key. | number\|string | - | - | +| Prop name | Description | Type | Values | Default | +| ------------ | --------------------------------------------------------------------------------------------- | -------------- | ------ | ------- | +| **id** | The id global attribute defines an identifier (ID) that must be unique in the whole document. | string | - | - | +| **item-key** | The item key. | number\|string | - | - | diff --git a/packages/docs/api/form/CFormControlWrapper.api.md b/packages/docs/api/form/CFormControlWrapper.api.md index c4d97891..ebce3a46 100644 --- a/packages/docs/api/form/CFormControlWrapper.api.md +++ b/packages/docs/api/form/CFormControlWrapper.api.md @@ -8,8 +8,9 @@ import CFormControlWrapper from '@coreui/vue/src/components/form/CFormControlWra #### Props -| Prop name | Description | Type | Values | Default | -| ----------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | ------ | ------- | -| **floating-label**
4.3.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | string | - | - | -| **label**
4.3.0+
| Add a caption for a component. | string | - | - | -| **text**
4.3.0+
| Add helper text to the component. | string | - | - | +| Prop name | Description | Type | Values | Default | +| ---------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | ------ | ------- | +| **floating-class-name**
5.5.0+
| A string of all className you want applied to the floating label wrapper. | string | - | - | +| **floating-label**
4.3.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | string | - | - | +| **label**
4.3.0+
| Add a caption for a component. | string | - | - | +| **text**
4.3.0+
| Add helper text to the component. | string | - | - | diff --git a/packages/docs/api/nav/CNavItem.api.md b/packages/docs/api/nav/CNavItem.api.md index bba531c6..788b3792 100644 --- a/packages/docs/api/nav/CNavItem.api.md +++ b/packages/docs/api/nav/CNavItem.api.md @@ -12,4 +12,5 @@ import CNavItem from '@coreui/vue/src/components/nav/CNavItem' | ------------ | --------------------------------------------------------------------------------------- | ------- | ------ | ------- | | **active** | Toggle the active state for the component. | boolean | - | - | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'li' | +| **class** | A string of all className you want applied to the component. | string | - | - | | **disabled** | Toggle the disabled state for the component. | boolean | - | - | From c43c76b9d991041b19ad06912469585031236928 Mon Sep 17 00:00:00 2001 From: mrholek Date: Tue, 6 May 2025 13:48:40 +0200 Subject: [PATCH 12/12] feat(CFormControlWrapper): allow passing class names to the CFormFloaging component --- .../components/form/CFormControlWrapper.ts | 48 ++++++++++++------- 1 file changed, 31 insertions(+), 17 deletions(-) diff --git a/packages/coreui-vue/src/components/form/CFormControlWrapper.ts b/packages/coreui-vue/src/components/form/CFormControlWrapper.ts index bdecc2ff..0ed3d195 100644 --- a/packages/coreui-vue/src/components/form/CFormControlWrapper.ts +++ b/packages/coreui-vue/src/components/form/CFormControlWrapper.ts @@ -7,6 +7,7 @@ import { CFormText } from './CFormText' import type { ComponentProps } from '../../utils/ComponentProps' interface CFormControlWrapperProps extends ComponentProps { + floatingClassName?: string floatingLabel?: string id?: string label?: string @@ -18,6 +19,12 @@ const CFormControlWrapper = defineComponent({ inheritAttrs: false, props: { ...CFormControlValidation.props, + /** + * A string of all className you want applied to the floating label wrapper. + * + * @since 5.5.0 + */ + floatingClassName: String, /** * Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. * @@ -69,29 +76,36 @@ const CFormControlWrapper = defineComponent({ return () => props.floatingLabel - ? h(CFormFloating, () => [ - slots.default && slots.default(), - h( - CFormLabel, - { - for: props.id, - }, - { - default: () => (slots.label && slots.label()) || props.label || props.floatingLabel, - }, - ), - (props.text || slots.text) && + ? h( + CFormFloating, + { + class: props.floatingClassName, + }, + () => [ + slots.default && slots.default(), h( - CFormText, + CFormLabel, { - id: props.describedby, + for: props.id, }, { - default: () => (slots.text && slots.text()) || props.text, + default: () => + (slots.label && slots.label()) || props.label || props.floatingLabel, }, ), - formControlValidation(), - ]) + (props.text || slots.text) && + h( + CFormText, + { + id: props.describedby, + }, + { + default: () => (slots.text && slots.text()) || props.text, + }, + ), + formControlValidation(), + ], + ) : [ (props.label || slots.label) && h(