@ni/nimble-components 24.1.9 → 24.1.10

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.
@@ -1,6 +1,6 @@
1
1
  import { __decorate } from "tslib";
2
2
  import { attr, observable } from '@microsoft/fast-element';
3
- import { DesignSystem, MenuItem as FoundationMenuItem } from '@microsoft/fast-foundation';
3
+ import { DesignSystem } from '@microsoft/fast-foundation';
4
4
  import { keyEnter } from '@microsoft/fast-web-utilities';
5
5
  import { AnchorBase } from '../anchor-base';
6
6
  import { styles } from './styles';
@@ -87,18 +87,4 @@ DesignSystem.getOrCreate()
87
87
  .withPrefix('nimble')
88
88
  .register(nimbleAnchorMenuItem());
89
89
  export const anchorMenuItemTag = 'nimble-anchor-menu-item';
90
- // This is a workaround for the fact that FAST's menu uses `instanceof MenuItem`
91
- // in their logic for indenting menu items. Since our AnchorMenuItem derives from
92
- // AnchorBase and not FAST's MenuItem, we need to change their MenuItem's definition
93
- // of `hasInstance` so that it includes our AnchorMenuItem, too.
94
- //
95
- // If/when we change FAST to test for the presence of `startColumnCount` instead
96
- // of using `instanceof MenuItem`, we can remove this workaround. Here is the
97
- // PR into FAST: https://github.com/microsoft/fast/pull/6667
98
- const originalInstanceOf = FoundationMenuItem[Symbol.hasInstance].bind(FoundationMenuItem);
99
- Object.defineProperty(FoundationMenuItem, Symbol.hasInstance, {
100
- value(instance) {
101
- return (originalInstanceOf(instance) || instance instanceof AnchorMenuItem);
102
- }
103
- });
104
90
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/anchor-menu-item/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EACH,YAAY,EAEZ,QAAQ,IAAI,kBAAkB,EAEjC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAQtC;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,UAAU;IAA9C;;QAEW,aAAQ,GAAG,KAAK,CAAC;QAQxB;;;;;WAKG;QAEI,qBAAgB,GAAwB,CAAC,CAAC;IAkDrD,CAAC;IAhDG,4FAA4F;IAC5F,uGAAuG;IACvG,gGAAgG;IAChG,gEAAgE;IAEhE;;OAEG;IACI,YAAY,CAAC,CAAa;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED;;OAEG;IACI,cAAc,CAAC,CAAgB;QAClC,IAAI,CAAC,CAAC,gBAAgB,EAAE;YACpB,OAAO,KAAK,CAAC;SAChB;QACD,QAAQ,CAAC,CAAC,GAAG,EAAE;YACX,KAAK,QAAQ;gBACT,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,MAAM;YACV,QAAQ;SACX;QACD,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,0DAA0D;IAC1D,4EAA4E;IAC5E,6EAA6E;IAC7E,oEAAoE;IACpD,YAAY,CAAC,aAAqB,EAAE,KAAa;QAC7D,IAAI,aAAa,KAAK,UAAU,EAAE;YAC9B,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;SAClD;aAAM;YACH,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;SAC5C;IACL,CAAC;IAED,IAAoB,QAAQ;QACxB,OAAO,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC;IAChC,CAAC;IAED,IAAoB,QAAQ,CAAC,KAAa;QACtC,IAAI,CAAC,MAAM,CAAC,QAAQ,GAAG,KAAK,CAAC;IACjC,CAAC;CACJ;AAjEG;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;gDACF;AAMxB;IADC,UAAU;8CACuB;AASlC;IADC,UAAU;wDACsC;AAoDrD,uFAAuF;AAEvF,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,CAAgB;IAC/D,QAAQ,EAAE,kBAAkB;IAC5B,QAAQ;IACR,MAAM;IACN,aAAa,EAAE;QACX,cAAc,EAAE,IAAI;KACvB;CACJ,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE;KACrB,UAAU,CAAC,QAAQ,CAAC;KACpB,QAAQ,CAAC,oBAAoB,EAAE,CAAC,CAAC;AACtC,MAAM,CAAC,MAAM,iBAAiB,GAAG,yBAAyB,CAAC;AAE3D,gFAAgF;AAChF,iFAAiF;AACjF,oFAAoF;AACpF,gEAAgE;AAChE,EAAE;AACF,gFAAgF;AAChF,6EAA6E;AAC7E,4DAA4D;AAC5D,MAAM,kBAAkB,GAAG,kBAAkB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;AAC3F,MAAM,CAAC,cAAc,CAAC,kBAAkB,EAAE,MAAM,CAAC,WAAW,EAAE;IAC1D,KAAK,CAAC,QAAiB;QACnB,OAAO,CACH,kBAAkB,CAAC,QAAQ,CAAC,IAAI,QAAQ,YAAY,cAAc,CACrE,CAAC;IACN,CAAC;CACJ,CAAC,CAAC","sourcesContent":["import { attr, observable } from '@microsoft/fast-element';\nimport {\n DesignSystem,\n AnchorOptions,\n MenuItem as FoundationMenuItem,\n MenuItemColumnCount\n} from '@microsoft/fast-foundation';\nimport { keyEnter } from '@microsoft/fast-web-utilities';\nimport { AnchorBase } from '../anchor-base';\nimport { styles } from './styles';\nimport { template } from './template';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-anchor-menu-item': AnchorMenuItem;\n }\n}\n\n/**\n * A nimble-styled anchor menu-item\n */\nexport class AnchorMenuItem extends AnchorBase {\n @attr({ mode: 'boolean' })\n public disabled = false;\n\n /**\n * @internal\n */\n @observable\n public anchor!: HTMLAnchorElement;\n\n /**\n * There is an assumption that this component is styled using a grid display, and this property\n * controls which grid column contains the menu item text (i.e. the indentation of the text).\n * The parent menu sets this value on all its child menu items so their indentations align.\n * @internal\n */\n @observable\n public startColumnCount: MenuItemColumnCount = 0;\n\n // The following two handlers are workarounds for issues with anchor menu items in submenus.\n // Events can bubble up the DOM and get handled by the menu item in the parent menu. When that happens,\n // the menu item's handlers (FAST) return false and prevent the default action, i.e. navigation.\n // See tech debt issue: https://github.com/ni/nimble/issues/1740\n\n /**\n * @internal\n */\n public clickHandler(e: MouseEvent): boolean {\n e.stopPropagation();\n return true;\n }\n\n /**\n * @internal\n */\n public keydownHandler(e: KeyboardEvent): boolean {\n if (e.defaultPrevented) {\n return false;\n }\n switch (e.key) {\n case keyEnter:\n e.stopPropagation();\n break;\n default:\n }\n return true;\n }\n\n // The FAST Menu manages the `tabindex` of its menu items.\n // When keyboard navigating to an item, it sets that item's `tabindex` to 0.\n // We need to pass this on to the anchor, otherwise an anchor without an href\n // will not be focusable and will prevent arrowing through the menu.\n public override setAttribute(qualifiedName: string, value: string): void {\n if (qualifiedName === 'tabindex') {\n this.anchor.setAttribute(qualifiedName, value);\n } else {\n super.setAttribute(qualifiedName, value);\n }\n }\n\n public override get tabIndex(): number {\n return this.anchor.tabIndex;\n }\n\n public override set tabIndex(value: number) {\n this.anchor.tabIndex = value;\n }\n}\n\n// FoundationAnchor already applies the StartEnd mixin, so we don't need to do it here.\n\nconst nimbleAnchorMenuItem = AnchorMenuItem.compose<AnchorOptions>({\n baseName: 'anchor-menu-item',\n template,\n styles,\n shadowOptions: {\n delegatesFocus: true\n }\n});\n\nDesignSystem.getOrCreate()\n .withPrefix('nimble')\n .register(nimbleAnchorMenuItem());\nexport const anchorMenuItemTag = 'nimble-anchor-menu-item';\n\n// This is a workaround for the fact that FAST's menu uses `instanceof MenuItem`\n// in their logic for indenting menu items. Since our AnchorMenuItem derives from\n// AnchorBase and not FAST's MenuItem, we need to change their MenuItem's definition\n// of `hasInstance` so that it includes our AnchorMenuItem, too.\n//\n// If/when we change FAST to test for the presence of `startColumnCount` instead\n// of using `instanceof MenuItem`, we can remove this workaround. Here is the\n// PR into FAST: https://github.com/microsoft/fast/pull/6667\nconst originalInstanceOf = FoundationMenuItem[Symbol.hasInstance].bind(FoundationMenuItem);\nObject.defineProperty(FoundationMenuItem, Symbol.hasInstance, {\n value(instance: unknown) {\n return (\n originalInstanceOf(instance) || instance instanceof AnchorMenuItem\n );\n }\n});\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/anchor-menu-item/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EACH,YAAY,EAGf,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAQtC;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,UAAU;IAA9C;;QAEW,aAAQ,GAAG,KAAK,CAAC;QAQxB;;;;;WAKG;QAEI,qBAAgB,GAAwB,CAAC,CAAC;IAkDrD,CAAC;IAhDG,4FAA4F;IAC5F,uGAAuG;IACvG,gGAAgG;IAChG,gEAAgE;IAEhE;;OAEG;IACI,YAAY,CAAC,CAAa;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED;;OAEG;IACI,cAAc,CAAC,CAAgB;QAClC,IAAI,CAAC,CAAC,gBAAgB,EAAE;YACpB,OAAO,KAAK,CAAC;SAChB;QACD,QAAQ,CAAC,CAAC,GAAG,EAAE;YACX,KAAK,QAAQ;gBACT,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,MAAM;YACV,QAAQ;SACX;QACD,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,0DAA0D;IAC1D,4EAA4E;IAC5E,6EAA6E;IAC7E,oEAAoE;IACpD,YAAY,CAAC,aAAqB,EAAE,KAAa;QAC7D,IAAI,aAAa,KAAK,UAAU,EAAE;YAC9B,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;SAClD;aAAM;YACH,KAAK,CAAC,YAAY,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;SAC5C;IACL,CAAC;IAED,IAAoB,QAAQ;QACxB,OAAO,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC;IAChC,CAAC;IAED,IAAoB,QAAQ,CAAC,KAAa;QACtC,IAAI,CAAC,MAAM,CAAC,QAAQ,GAAG,KAAK,CAAC;IACjC,CAAC;CACJ;AAjEG;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;gDACF;AAMxB;IADC,UAAU;8CACuB;AASlC;IADC,UAAU;wDACsC;AAoDrD,uFAAuF;AAEvF,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,CAAgB;IAC/D,QAAQ,EAAE,kBAAkB;IAC5B,QAAQ;IACR,MAAM;IACN,aAAa,EAAE;QACX,cAAc,EAAE,IAAI;KACvB;CACJ,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE;KACrB,UAAU,CAAC,QAAQ,CAAC;KACpB,QAAQ,CAAC,oBAAoB,EAAE,CAAC,CAAC;AACtC,MAAM,CAAC,MAAM,iBAAiB,GAAG,yBAAyB,CAAC","sourcesContent":["import { attr, observable } from '@microsoft/fast-element';\nimport {\n DesignSystem,\n AnchorOptions,\n MenuItemColumnCount\n} from '@microsoft/fast-foundation';\nimport { keyEnter } from '@microsoft/fast-web-utilities';\nimport { AnchorBase } from '../anchor-base';\nimport { styles } from './styles';\nimport { template } from './template';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-anchor-menu-item': AnchorMenuItem;\n }\n}\n\n/**\n * A nimble-styled anchor menu-item\n */\nexport class AnchorMenuItem extends AnchorBase {\n @attr({ mode: 'boolean' })\n public disabled = false;\n\n /**\n * @internal\n */\n @observable\n public anchor!: HTMLAnchorElement;\n\n /**\n * There is an assumption that this component is styled using a grid display, and this property\n * controls which grid column contains the menu item text (i.e. the indentation of the text).\n * The parent menu sets this value on all its child menu items so their indentations align.\n * @internal\n */\n @observable\n public startColumnCount: MenuItemColumnCount = 0;\n\n // The following two handlers are workarounds for issues with anchor menu items in submenus.\n // Events can bubble up the DOM and get handled by the menu item in the parent menu. When that happens,\n // the menu item's handlers (FAST) return false and prevent the default action, i.e. navigation.\n // See tech debt issue: https://github.com/ni/nimble/issues/1740\n\n /**\n * @internal\n */\n public clickHandler(e: MouseEvent): boolean {\n e.stopPropagation();\n return true;\n }\n\n /**\n * @internal\n */\n public keydownHandler(e: KeyboardEvent): boolean {\n if (e.defaultPrevented) {\n return false;\n }\n switch (e.key) {\n case keyEnter:\n e.stopPropagation();\n break;\n default:\n }\n return true;\n }\n\n // The FAST Menu manages the `tabindex` of its menu items.\n // When keyboard navigating to an item, it sets that item's `tabindex` to 0.\n // We need to pass this on to the anchor, otherwise an anchor without an href\n // will not be focusable and will prevent arrowing through the menu.\n public override setAttribute(qualifiedName: string, value: string): void {\n if (qualifiedName === 'tabindex') {\n this.anchor.setAttribute(qualifiedName, value);\n } else {\n super.setAttribute(qualifiedName, value);\n }\n }\n\n public override get tabIndex(): number {\n return this.anchor.tabIndex;\n }\n\n public override set tabIndex(value: number) {\n this.anchor.tabIndex = value;\n }\n}\n\n// FoundationAnchor already applies the StartEnd mixin, so we don't need to do it here.\n\nconst nimbleAnchorMenuItem = AnchorMenuItem.compose<AnchorOptions>({\n baseName: 'anchor-menu-item',\n template,\n styles,\n shadowOptions: {\n delegatesFocus: true\n }\n});\n\nDesignSystem.getOrCreate()\n .withPrefix('nimble')\n .register(nimbleAnchorMenuItem());\nexport const anchorMenuItemTag = 'nimble-anchor-menu-item';\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ni/nimble-components",
3
- "version": "24.1.9",
3
+ "version": "24.1.10",
4
4
  "description": "Styled web components for the NI Nimble Design System",
5
5
  "scripts": {
6
6
  "build": "npm run generate-icons && npm run generate-workers && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",
@@ -66,7 +66,7 @@
66
66
  "dependencies": {
67
67
  "@microsoft/fast-colors": "^5.3.1",
68
68
  "@microsoft/fast-element": "^1.12.0",
69
- "@microsoft/fast-foundation": "2.49.4",
69
+ "@microsoft/fast-foundation": "^2.49.6",
70
70
  "@microsoft/fast-web-utilities": "^6.0.0",
71
71
  "@ni/nimble-tokens": "^6.13.1",
72
72
  "@tanstack/table-core": "^8.10.7",
@@ -109,7 +109,7 @@
109
109
  "@babel/cli": "^7.13.16",
110
110
  "@babel/core": "^7.20.12",
111
111
  "@chromatic-com/storybook": "^1.2.25",
112
- "@microsoft/fast-react-wrapper": "0.3.22",
112
+ "@microsoft/fast-react-wrapper": "^0.3.22",
113
113
  "@ni/eslint-config-javascript": "^4.2.0",
114
114
  "@ni/eslint-config-typescript": "^4.2.0",
115
115
  "@ni/jasmine-parameterized": "^0.2.3",