@wikimedia/codex - npm Package Compare versions

Comparing version 0.5.0 to 0.6.0

dist/types/components/combobox/Combobox.vue.d.ts

@@ -452,2 +452,3 @@ import { PropType } from 'vue';
             } | null>;
+            highlightedViaKeyboard: import("vue").Ref<boolean>;
             activeMenuItem: import("vue").Ref<{
@@ -501,6 +502,7 @@ id: string;
             } | null>;
-            handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
+            handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
             handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
         }, unknown, {}, {
             getHighlightedMenuItem(): import("../../types").MenuItemDataWithId | null;
+            getHighlightedViaKeyboard(): boolean;
             clearActive(): void;
@@ -650,2 +652,3 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;
         } | null>;
+        highlightedViaKeyboard: import("vue").Ref<boolean>;
         activeMenuItem: import("vue").Ref<{
@@ -699,6 +702,7 @@ id: string;
         } | null>;
-        handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
+        handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
         handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
     }> & {} & {
         getHighlightedMenuItem(): import("../../types").MenuItemDataWithId | null;
+        getHighlightedViaKeyboard(): boolean;
         clearActive(): void;
@@ -705,0 +709,0 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;

dist/types/components/icon/Icon.vue.d.ts

@@ -38,5 +38,16 @@ import { PropType } from 'vue';
     };
+    /**
+     * Specify icon size by choosing one of several pre-defined size
+     * options. See the type documentation for supported size options.
+     * The `medium` size is used by default if no size prop is provided.
+     */
+    size: {
+        type: PropType<"x-small" | "small" | "medium">;
+        default: string;
+        validator: import("../../types").StringTypeValidator<"x-small" | "small" | "medium">;
+    };
 }, {
     rootElement: import("vue").Ref<HTMLSpanElement | undefined>;
     rootClasses: import("vue").ComputedRef<{
+        [x: string]: boolean;
         'cdx-icon--flipped': boolean;
@@ -81,2 +92,12 @@ }>;
     };
+    /**
+     * Specify icon size by choosing one of several pre-defined size
+     * options. See the type documentation for supported size options.
+     * The `medium` size is used by default if no size prop is provided.
+     */
+    size: {
+        type: PropType<"x-small" | "small" | "medium">;
+        default: string;
+        validator: import("../../types").StringTypeValidator<"x-small" | "small" | "medium">;
+    };
 }>> & {
@@ -88,3 +109,4 @@ onClick?: ((...args: any[]) => any) | undefined;
     dir: HTMLDirection | null;
+    size: "x-small" | "small" | "medium";
 }>;
 export default _default;

dist/types/components/lookup/Lookup.vue.d.ts

@@ -254,2 +254,3 @@ import { PropType } from 'vue';
             } | null>;
+            highlightedViaKeyboard: import("vue").Ref<boolean>;
             activeMenuItem: import("vue").Ref<{
@@ -303,6 +304,7 @@ id: string;
             } | null>;
-            handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
+            handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
             handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
         }, unknown, {}, {
             getHighlightedMenuItem(): import("../../types").MenuItemDataWithId | null;
+            getHighlightedViaKeyboard(): boolean;
             clearActive(): void;
@@ -452,2 +454,3 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;
         } | null>;
+        highlightedViaKeyboard: import("vue").Ref<boolean>;
         activeMenuItem: import("vue").Ref<{
@@ -501,6 +504,7 @@ id: string;
         } | null>;
-        handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
+        handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
         handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
     }> & {} & {
         getHighlightedMenuItem(): import("../../types").MenuItemDataWithId | null;
+        getHighlightedViaKeyboard(): boolean;
         clearActive(): void;
@@ -507,0 +511,0 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;

dist/types/components/menu/Menu.vue.d.ts

@@ -186,2 +186,3 @@ import { PropType, ComponentPublicInstance } from 'vue';
     } | null>;
+    highlightedViaKeyboard: import("vue").Ref<boolean>;
     activeMenuItem: import("vue").Ref<{
@@ -247,2 +248,9 @@ id: string;
     /**
+     * Get whether the last highlighted item was highlighted via the keyboard.
+     *
+     * @public
+     * @return {boolean} Whether the last highlighted menu item was highlighted via keyboard.
+     */
+    getHighlightedViaKeyboard(): boolean;
+    /**
      * Ensure no menu item is active. This unsets the active item if there is one.
@@ -249,0 +257,0 @@ *

dist/types/components/select/Select.vue.d.ts

@@ -253,2 +253,3 @@ import { PropType } from 'vue';
             } | null>;
+            highlightedViaKeyboard: import("vue").Ref<boolean>;
             activeMenuItem: import("vue").Ref<{
@@ -302,6 +303,7 @@ id: string;
             } | null>;
-            handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
+            handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
             handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
         }, unknown, {}, {
             getHighlightedMenuItem(): import("../../types").MenuItemDataWithId | null;
+            getHighlightedViaKeyboard(): boolean;
             clearActive(): void;
@@ -451,2 +453,3 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;
         } | null>;
+        highlightedViaKeyboard: import("vue").Ref<boolean>;
         activeMenuItem: import("vue").Ref<{
@@ -500,6 +503,7 @@ id: string;
         } | null>;
-        handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
+        handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: import("../../types").MenuItemDataWithId | undefined) => void;
         handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
     }> & {} & {
         getHighlightedMenuItem(): import("../../types").MenuItemDataWithId | null;
+        getHighlightedViaKeyboard(): boolean;
         clearActive(): void;
@@ -506,0 +510,0 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;

dist/types/components/typeahead-search/TypeaheadSearch.vue.d.ts

@@ -307,2 +307,3 @@ import { PropType } from 'vue';
             } | null>;
+            highlightedViaKeyboard: import("vue").Ref<boolean>;
             activeMenuItem: import("vue").Ref<{
@@ -356,6 +357,7 @@ id: string;
             } | null>;
-            handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: MenuItemDataWithId | undefined) => void;
+            handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: MenuItemDataWithId | undefined) => void;
             handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
         }, unknown, {}, {
             getHighlightedMenuItem(): MenuItemDataWithId | null;
+            getHighlightedViaKeyboard(): boolean;
             clearActive(): void;
@@ -505,2 +507,3 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;
         } | null>;
+        highlightedViaKeyboard: import("vue").Ref<boolean>;
         activeMenuItem: import("vue").Ref<{
@@ -554,6 +557,7 @@ id: string;
         } | null>;
-        handleMenuItemChange: (menuState: "selected" | "highlighted" | "active", menuItem?: MenuItemDataWithId | undefined) => void;
+        handleMenuItemChange: (menuState: "selected" | "highlighted" | "highlightedViaKeyboard" | "active", menuItem?: MenuItemDataWithId | undefined) => void;
         handleKeyNavigation: (e: KeyboardEvent, prevent?: boolean) => boolean;
     }> & {} & {
         getHighlightedMenuItem(): MenuItemDataWithId | null;
+        getHighlightedViaKeyboard(): boolean;
         clearActive(): void;
@@ -560,0 +564,0 @@ delegateKeyNavigation(event: KeyboardEvent, prevent?: boolean): boolean;

dist/types/constants.d.ts

@@ -9,2 +9,3 @@ import { ComputedRef, InjectionKey } from 'vue';
 export declare const ButtonTypes: readonly ["normal", "primary", "quiet"];
+export declare const IconSizes: readonly ["x-small", "small", "medium"];
 export declare const StatusTypes: readonly ["notice", "warning", "error", "success"];
@@ -14,3 +15,3 @@ export declare const statusTypeValidator: import("./types").StringTypeValidator<"notice" | "warning" | "error" | "success">;
 export declare const ValidationStatusTypes: readonly ["default", "error"];
-export declare const MenuStates: readonly ["selected", "highlighted", "active"];
+export declare const MenuStates: readonly ["selected", "highlighted", "highlightedViaKeyboard", "active"];
 /**
@@ -17,0 +18,0 @@ * Default length of delay for debouncing, in milliseconds.

dist/types/types.d.ts

@@ -8,3 +8,3 @@ /*!
 import { Icon } from '@wikimedia/codex-icons';
-import { ButtonActions, ButtonTypes, TextInputTypes, ValidationStatusTypes, StatusTypes, MenuStates } from './constants';
+import { ButtonActions, ButtonTypes, IconSizes, TextInputTypes, ValidationStatusTypes, StatusTypes, MenuStates } from './constants';
 /** @public */
@@ -33,2 +33,4 @@ export type HTMLDirection = 'ltr' | 'rtl';
 /** @public */
+export type IconSize = typeof IconSizes[number];
+/** @public */
 export type StatusType = typeof StatusTypes[number];
@@ -35,0 +37,0 @@ export type StatusIconMap = {

package.json

 {
 	"name": "@wikimedia/codex",
-	"version": "0.5.0",
+	"version": "0.6.0",
 	"description": "Codex is a toolkit for building user interfaces within the Wikimedia Design System",
@@ -5,0 +5,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

633151

6.68%

Lines of code

9789

1.74%

No dependency changes