diff --git a/CHANGELOG.md b/CHANGELOG.md index 46bf612..0c7fe6e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,17 +1,21 @@ # Change Log All notable changes to this project will be documented in this file. -## [0.3.2] - 2021-03-18 +## [0.3.3] - 2022-04-29 +### Fixed +- fix: changed typescript types to correctly handle null/undefined. + +## [0.3.2] - 2022-03-18 ### Fixed - fix(Modal): disabled implicit attr inheritance in modals. - fix(ListView): do not assume a specific typescript type for pf-list-view rows. -## [0.3.1] - 2021-02-08 +## [0.3.1] - 2022-02-08 ### Fixed - fix(Layout): never pass undefined|null to emitted event update:collapsed. - fix(OUIA): reverted ouia component names to use V-PF3/ prefix. -## [0.3.0] - 2021-02-03 +## [0.3.0] - 2022-02-03 ### Added - refactor: converted the whole codebase to typescript. - feat(typescript): exported type definitions for all components. @@ -407,7 +411,8 @@ disabled, as per PatternFly design guidelines. - `pf-toolbar` component - `pf-utilization-bar-chart` component -[Unreleased]: https://github.com/mtorromeo/vue-patternfly/compare/v0.3.2...HEAD +[Unreleased]: https://github.com/mtorromeo/vue-patternfly/compare/v0.3.3...HEAD +[0.3.3]: https://github.com/mtorromeo/vue-patternfly/compare/v0.3.2...v0.3.3 [0.3.2]: https://github.com/mtorromeo/vue-patternfly/compare/v0.3.1...v0.3.2 [0.3.1]: https://github.com/mtorromeo/vue-patternfly/compare/v0.3.0...v0.3.1 [0.3.0]: https://github.com/mtorromeo/vue-patternfly/compare/v0.2.11...v0.3.0 diff --git a/package.json b/package.json index cc1b23e..d5d6f93 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-patternfly", - "version": "0.3.2", + "version": "0.3.3", "description": "PatternFly 3 components for Vue 3", "main": "dist/vue-patternfly.umd.js", "module": "dist/vue-patternfly.es.js", diff --git a/src/components/Card.vue b/src/components/Card.vue index 9c8814b..53ba9da 100644 --- a/src/components/Card.vue +++ b/src/components/Card.vue @@ -2,7 +2,7 @@
- +
  • - +
  • = 0) { + if (value && this.iValue.includes(value)) { sortedValue.push(value); } } diff --git a/src/components/Combobox.vue b/src/components/Combobox.vue index 71ac665..e0ca78a 100644 --- a/src/components/Combobox.vue +++ b/src/components/Combobox.vue @@ -11,7 +11,7 @@
    - + @@ -82,7 +82,7 @@ export default defineComponent({ default: null, }, modelValue: { - type: [String, Number], + type: [String, Number] as PropType, default: null, }, placeholder: { @@ -108,11 +108,11 @@ export default defineComponent({ default: 'id', }, match: { - type: Function, + type: Function as PropType<(o: NormalizedOption, q: string) => boolean>, default: (o: NormalizedOption, q: string) => o.label.toString().toLowerCase().includes(q.toLowerCase()), }, highlight: { - type: Function, + type: Function as PropType<(o: NormalizedOption, q: string) => string>, default: (o: NormalizedOption, q: string) => o.label.replace(new RegExp(q.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), 'ig'), '$&'), }, withCheckbox: { @@ -123,8 +123,8 @@ export default defineComponent({ }, emits: { - update: (value: string | number) => value !== undefined, - 'update:modelValue': (value: string | number) => value !== undefined, + update: (value: string | number | null) => value !== undefined, + 'update:modelValue': (value: string | number | null) => value !== undefined, }, setup(props) { @@ -133,10 +133,10 @@ export default defineComponent({ data(this: void) { return { - blurTimeout: null as ReturnType | null, + blurTimeout: undefined as ReturnType | undefined, showOptions: false, - filter: null as string, - active: null as string | number, + filter: null as string | null, + active: null as string | number | null, hasError: false, checked: false, }; @@ -148,7 +148,7 @@ export default defineComponent({ }, label() { - if (!this.hasValue || typeof this.optionsMap[this.modelValue] === 'undefined') { + if (this.modelValue === null || typeof this.optionsMap[this.modelValue] === 'undefined') { return ''; } return this.optionsMap[this.modelValue].label; @@ -173,15 +173,17 @@ export default defineComponent({ if (this.filter === null) { return []; } - return Object.values(this.optionsMap).reduce((options, o) => { + + const options = []; + for (const o of Object.values(this.optionsMap)) { if (this.match(o, this.filter)) { options.push({ ...o, highlighted: this.highlight(o, this.filter), }); } - return options; - }, []); + } + return options; }, text: { @@ -198,7 +200,7 @@ export default defineComponent({ }, effectiveDisabled() { - return this.disabled || (this.withCheckbox && !this.checked); + return this.disabled || Boolean(this.withCheckbox && !this.checked); }, }, @@ -220,7 +222,7 @@ export default defineComponent({ }, methods: { - setValue(value: string | number) { + setValue(value: string | number | null) { this.showOptions = false; this.filter = null; if (value !== this.modelValue) { diff --git a/src/components/DrawerGroup.vue b/src/components/DrawerGroup.vue index fadc065..71360d0 100644 --- a/src/components/DrawerGroup.vue +++ b/src/components/DrawerGroup.vue @@ -54,7 +54,7 @@ export default defineComponent({ setup(props) { return { - activeGroup: inject('activeGroup', null), + activeGroup: inject('activeGroup', null), ...useOUIAProps(props), }; }, diff --git a/src/components/DrawerNotification.vue b/src/components/DrawerNotification.vue index d5dbfa9..3fbe2ca 100644 --- a/src/components/DrawerNotification.vue +++ b/src/components/DrawerNotification.vue @@ -30,7 +30,7 @@ class="pull-right" :variant="buttonVariant" :title="action.title" - @click="triggered(action)" + @click="action && triggered(action)" > {{ action.name }} @@ -85,7 +85,7 @@ export default defineComponent({ setup(props) { return { drawerExpanded: inject('drawerExpanded', false), - drawerDropdowns: inject('drawerDropdowns', null), + drawerDropdowns: inject('drawerDropdowns', undefined), ...useOUIAProps(props), }; }, diff --git a/src/components/Dropdown.vue b/src/components/Dropdown.vue index b50ed91..52dea5b 100644 --- a/src/components/Dropdown.vue +++ b/src/components/Dropdown.vue @@ -172,13 +172,13 @@ export default defineComponent({ }, setDropdownPosition() { - if (!(this.$refs.dropdown instanceof HTMLElement) || !(this.$refs.trigger instanceof Element) || !this.appendTo) { + if (!(this.$refs.dropdown instanceof HTMLElement) || !(this.$refs.trigger instanceof Element) || !this.appendTo?.offsetParent) { return; } const rP = this.appendTo.offsetParent.getBoundingClientRect(); const rT = this.$refs.trigger.getBoundingClientRect(); - let rD: DOMRect; + let rD: DOMRect | undefined; if (this.menuRight || this.dropup) { rD = this.$refs.dropdown.getBoundingClientRect(); } @@ -186,11 +186,11 @@ export default defineComponent({ let top = rT.top - rP.top; let left = rT.left - rP.left; - if (this.menuRight) { + if (rD && this.menuRight) { left -= rD.width - rT.width; } - if (this.dropup) { + if (rD && this.dropup) { top -= rD.height; } else { top += rT.height; diff --git a/src/components/FilterFields.vue b/src/components/FilterFields.vue index c0f481f..3902df3 100644 --- a/src/components/FilterFields.vue +++ b/src/components/FilterFields.vue @@ -1,13 +1,13 @@