@hashicorp/design-system-components 5.0.0-rc-20251014173443 → 5.0.0-rc-20251017103721
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.
- package/README.md +3 -3
- package/addon-main.cjs +6 -14
- package/declarations/components/hds/advanced-table/th-resize-handle.d.ts +2 -1
- package/declarations/components/hds/advanced-table/th.d.ts +0 -1
- package/declarations/components/hds/app-header/index.d.ts +2 -1
- package/declarations/components/hds/application-state/index.d.ts +2 -0
- package/declarations/components/hds/dropdown/index.d.ts +5 -4
- package/declarations/components/hds/dropdown/list-item/interactive.d.ts +0 -7
- package/declarations/components/hds/dropdown/toggle/icon.d.ts +1 -2
- package/declarations/components/hds/dropdown/toggle/types.d.ts +0 -5
- package/declarations/components/hds/form/text-input/field.d.ts +1 -1
- package/declarations/components/hds/icon/index.d.ts +1 -1
- package/declarations/components/hds/side-nav/index.d.ts +2 -9
- package/declarations/components/hds/stepper/task/indicator.d.ts +1 -1
- package/declarations/components.d.ts +0 -2
- package/declarations/template-registry.d.ts +0 -30
- package/dist/README.md +3 -3
- package/dist/components/hds/advanced-table/index.js +1 -1
- package/dist/components/hds/advanced-table/th-resize-handle.js.map +1 -1
- package/dist/components/hds/advanced-table/th.js.map +1 -1
- package/dist/components/hds/app-header/index.js +1 -1
- package/dist/components/hds/app-header/index.js.map +1 -1
- package/dist/components/hds/app-side-nav/portal/target.js +2 -2
- package/dist/components/hds/app-side-nav/portal/target.js.map +1 -1
- package/dist/components/hds/application-state/index.js +6 -0
- package/dist/components/hds/application-state/index.js.map +1 -1
- package/dist/components/hds/dropdown/index.js.map +1 -1
- package/dist/components/hds/dropdown/list-item/interactive.js +2 -24
- package/dist/components/hds/dropdown/list-item/interactive.js.map +1 -1
- package/dist/components/hds/dropdown/toggle/icon.js +3 -7
- package/dist/components/hds/dropdown/toggle/icon.js.map +1 -1
- package/dist/components/hds/dropdown/toggle/types.js +1 -6
- package/dist/components/hds/dropdown/toggle/types.js.map +1 -1
- package/dist/components/hds/side-nav/index.js +2 -21
- package/dist/components/hds/side-nav/index.js.map +1 -1
- package/dist/components/hds/side-nav/portal/target.js +2 -2
- package/dist/components/hds/side-nav/portal/target.js.map +1 -1
- package/dist/components/hds/time/index.js +2 -2
- package/dist/components/hds/time/index.js.map +1 -1
- package/dist/components/hds/time/range.js +2 -2
- package/dist/components/hds/time/range.js.map +1 -1
- package/dist/components.js +1 -3
- package/dist/components.js.map +1 -1
- package/dist/instance-initializers/load-sprite.js +3 -8
- package/dist/instance-initializers/load-sprite.js.map +1 -1
- package/dist/modifiers/hds-code-editor.js +2 -3
- package/dist/modifiers/hds-code-editor.js.map +1 -1
- package/dist/styles/@hashicorp/design-system-components.css +31 -79
- package/dist/styles/@hashicorp/design-system-components.scss +4 -1
- package/dist/styles/@hashicorp/design-system-ember-a11y-refocus.scss +31 -0
- package/dist/styles/components/application-state.scss +5 -1
- package/dist/styles/components/dropdown.scss +1 -1
- package/dist/styles/components/side-nav/header.scss +0 -26
- package/package.json +10 -20
- package/declarations/components/hds/flyout/body.d.ts +0 -16
- package/declarations/components/hds/flyout/description.d.ts +0 -17
- package/declarations/components/hds/flyout/footer.d.ts +0 -20
- package/declarations/components/hds/flyout/header.d.ts +0 -22
- package/declarations/components/hds/menu-primitive/index.d.ts +0 -36
- package/declarations/components/hds/modal/body.d.ts +0 -16
- package/declarations/components/hds/modal/footer.d.ts +0 -20
- package/declarations/components/hds/modal/header.d.ts +0 -22
- package/declarations/components/hds/side-nav/header/icon-button.d.ts +0 -19
- package/dist/_app_/components/hds/flyout/body.js +0 -1
- package/dist/_app_/components/hds/flyout/description.js +0 -1
- package/dist/_app_/components/hds/flyout/footer.js +0 -1
- package/dist/_app_/components/hds/flyout/header.js +0 -1
- package/dist/_app_/components/hds/menu-primitive.js +0 -1
- package/dist/_app_/components/hds/modal/body.js +0 -1
- package/dist/_app_/components/hds/modal/footer.js +0 -1
- package/dist/_app_/components/hds/modal/header.js +0 -1
- package/dist/_app_/components/hds/side-nav/header/icon-button.js +0 -1
- package/dist/components/hds/flyout/body.js +0 -31
- package/dist/components/hds/flyout/body.js.map +0 -1
- package/dist/components/hds/flyout/description.js +0 -31
- package/dist/components/hds/flyout/description.js.map +0 -1
- package/dist/components/hds/flyout/footer.js +0 -31
- package/dist/components/hds/flyout/footer.js.map +0 -1
- package/dist/components/hds/flyout/header.js +0 -31
- package/dist/components/hds/flyout/header.js.map +0 -1
- package/dist/components/hds/menu-primitive/index.js +0 -98
- package/dist/components/hds/menu-primitive/index.js.map +0 -1
- package/dist/components/hds/modal/body.js +0 -31
- package/dist/components/hds/modal/body.js.map +0 -1
- package/dist/components/hds/modal/footer.js +0 -31
- package/dist/components/hds/modal/footer.js.map +0 -1
- package/dist/components/hds/modal/header.js +0 -31
- package/dist/components/hds/modal/header.js.map +0 -1
- package/dist/components/hds/side-nav/header/icon-button.js +0 -38
- package/dist/components/hds/side-nav/header/icon-button.js.map +0 -1
- package/dist/styles/components/menu-primitive.scss +0 -13
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"th-resize-handle.js","sources":["../../../../src/components/hds/advanced-table/th-resize-handle.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { modifier } from 'ember-modifier';\nimport { requestAnimationFrameWaiter } from './utils.ts';\nimport { BORDER_WIDTH } from './index.ts';\n\nimport type HdsAdvancedTableColumn from './models/column.ts';\nimport type { HdsAdvancedTableSignature } from './index.ts';\n\nconst KEYBOARD_RESIZE_STEP = 10;\n\nfunction calculateEffectiveDelta(\n deltaX: number,\n col: HdsAdvancedTableColumn,\n startColW: number,\n nextCol: HdsAdvancedTableColumn,\n startNextColW: number\n): number {\n const colMin = col.pxMinWidth ?? 0;\n const colMax = col.pxMaxWidth ?? Infinity;\n const nextMin = nextCol.pxMinWidth ?? 0;\n const nextMax = nextCol.pxMaxWidth ?? Infinity;\n\n let effectiveDelta = 0;\n\n // expanding col, shrinking nextCol\n if (deltaX > 0) {\n const maxCanExpandCol = colMax - startColW;\n const maxCanShrinkNext = startNextColW - nextMin;\n\n effectiveDelta = Math.min(deltaX, maxCanExpandCol, maxCanShrinkNext);\n effectiveDelta = Math.max(0, effectiveDelta);\n }\n // shrinking col, expanding nextCol\n else if (deltaX < 0) {\n const absDeltaX = -deltaX;\n const maxCanShrinkCol = startColW - colMin;\n\n let maxCanExpandNext: number;\n if (startNextColW > nextMax) {\n maxCanExpandNext = Infinity;\n } else {\n maxCanExpandNext = nextMax - startNextColW;\n }\n\n effectiveDelta = -Math.min(absDeltaX, maxCanShrinkCol, maxCanExpandNext);\n effectiveDelta = Math.min(0, effectiveDelta);\n }\n\n return effectiveDelta;\n}\n\nexport interface HdsAdvancedTableThResizeHandleSignature {\n Args: {\n column: HdsAdvancedTableColumn;\n tableHeight?: number;\n onColumnResize?: HdsAdvancedTableSignature['Args']['onColumnResize'];\n };\n Blocks: {\n default?: [];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsAdvancedTableThResizeHandle extends Component<HdsAdvancedTableThResizeHandleSignature> {\n @tracked resizing: {\n startX: number;\n startColumnPxWidth: number;\n startNextColumnPxWidth?: number;\n } | null = null;\n // track the width change as it is changing, applied when resizing stops\n @tracked private _transientDelta: number = 0;\n @tracked private _isUpdateQueued: boolean = false;\n @tracked private _lastPointerEvent: PointerEvent | null = null;\n\n private _handleElement!: HdsAdvancedTableThResizeHandleSignature['Element'];\n private _boundResize: (event: PointerEvent) => void;\n private _boundStopResize: () => void;\n\n private _registerHandleElement = modifier(\n (element: HdsAdvancedTableThResizeHandleSignature['Element']) => {\n this._handleElement = element;\n }\n );\n\n constructor(\n owner: unknown,\n args: HdsAdvancedTableThResizeHandleSignature['Args']\n ) {\n super(owner, args);\n\n this._boundResize = this._resize.bind(this);\n this._boundStopResize = this._stopResize.bind(this);\n }\n\n get height(): string | undefined {\n const { tableHeight } = this.args;\n\n if (tableHeight === undefined) {\n return;\n }\n\n return `${tableHeight - BORDER_WIDTH * 2}px`;\n }\n\n get classNames(): string {\n const classes = ['hds-advanced-table__th-resize-handle'];\n\n if (this.resizing !== null) {\n classes.push('hds-advanced-table__th-resize-handle--resizing');\n }\n\n return classes.join(' ');\n }\n\n private _applyTransientWidths() {\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n\n column.width = column.appliedWidth;\n\n if (nextColumn !== undefined) {\n nextColumn.width = nextColumn.appliedWidth;\n }\n }\n\n @action\n onColumnResize(key?: string, width?: string): void {\n const { onColumnResize } = this.args;\n\n if (typeof onColumnResize === 'function' && key !== undefined) {\n onColumnResize(key, width);\n }\n }\n\n @action\n handleKeydown(event: KeyboardEvent): void {\n const validKeys = ['ArrowLeft', 'ArrowRight'];\n\n if (!validKeys.includes(event.key)) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n\n if (nextColumn === undefined) {\n return;\n }\n\n column.table.setTransientColumnWidths({ roundValues: true });\n\n const startColumnPxWidth = Math.round(column.pxAppliedWidth ?? 0);\n const startNextColumnPxWidth = Math.round(nextColumn.pxAppliedWidth ?? 0);\n const deltaX =\n event.key === 'ArrowRight' ? KEYBOARD_RESIZE_STEP : -KEYBOARD_RESIZE_STEP;\n\n this._applyResizeDelta(\n deltaX,\n column,\n startColumnPxWidth,\n nextColumn,\n startNextColumnPxWidth\n );\n\n // ensure the resize handle remains visible during keyboard navigation.\n this._handleElement.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n\n // use a microtask to commit the final state after the render pass.\n queueMicrotask(() => {\n // reset transient values\n this._setWidthDebts();\n this._applyTransientWidths();\n column.table.resetTransientColumnWidths();\n this._transientDelta = 0;\n\n this.onColumnResize(column.key, column.width);\n });\n }\n\n @action\n startResize(event: PointerEvent): void {\n if (event.button !== 0) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n\n column.table.setTransientColumnWidths();\n\n this.resizing = {\n startX: event.clientX,\n startColumnPxWidth: Math.round(column.pxAppliedWidth ?? 0),\n startNextColumnPxWidth: Math.round(nextColumn?.pxAppliedWidth ?? 0),\n };\n\n window.addEventListener('pointermove', this._boundResize);\n window.addEventListener('pointerup', this._boundStopResize);\n }\n\n private _setColumnWidth(column: HdsAdvancedTableColumn, width: number): void {\n if (width > column.pxMaxWidth || width < column.pxMinWidth) {\n column.pxTransientWidth = width;\n } else {\n column.setPxTransientWidth(width);\n }\n }\n\n private _applyResizeDelta(\n deltaX: number,\n column: HdsAdvancedTableColumn,\n startColumnPxWidth: number,\n nextColumn?: HdsAdvancedTableColumn,\n startNextColumnPxWidth?: number\n ): void {\n const canResizeNeighbor =\n nextColumn !== undefined && startNextColumnPxWidth !== undefined;\n\n if (canResizeNeighbor) {\n const effectiveDelta = calculateEffectiveDelta(\n deltaX,\n column,\n startColumnPxWidth,\n nextColumn,\n startNextColumnPxWidth\n );\n\n // set the width for the current column\n this._setColumnWidth(\n column,\n Math.round(startColumnPxWidth + effectiveDelta)\n );\n\n // the actual new column width may differ from the intended width due to min/max constraints.\n const actualNewColumnWidth = column.pxAppliedWidth ?? startColumnPxWidth;\n const actualAppliedDelta = actualNewColumnWidth - startColumnPxWidth;\n\n // set the width for the next sibling column\n this._setColumnWidth(\n nextColumn,\n Math.round(startNextColumnPxWidth - actualAppliedDelta)\n );\n\n this._transientDelta = actualAppliedDelta;\n } else {\n column.setPxTransientWidth(Math.round(startColumnPxWidth + deltaX));\n }\n }\n\n private _resize(event: PointerEvent): void {\n this._lastPointerEvent = event;\n\n if (this._isUpdateQueued) {\n return;\n }\n\n this._isUpdateQueued = true;\n\n requestAnimationFrameWaiter(() => {\n if (this.resizing === null || this._lastPointerEvent === null) {\n this._isUpdateQueued = false;\n\n return;\n }\n\n const event = this._lastPointerEvent;\n\n event.preventDefault();\n\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n const { startX, startColumnPxWidth, startNextColumnPxWidth } =\n this.resizing;\n const deltaX = event.clientX - startX;\n\n this._applyResizeDelta(\n deltaX,\n column,\n startColumnPxWidth, // Width at the start of the drag\n nextColumn,\n startNextColumnPxWidth // Width of next col at the start of the drag\n );\n\n this._isUpdateQueued = false;\n });\n }\n\n private _stopResize(): void {\n const { column } = this.args;\n\n window.removeEventListener('pointermove', this._boundResize);\n window.removeEventListener('pointerup', this._boundStopResize);\n\n this._setWidthDebts();\n\n this._applyTransientWidths();\n\n // reset the transient width\n column.table.resetTransientColumnWidths();\n\n // reset the resizing state\n this.resizing = null;\n this._transientDelta = 0;\n\n this.onColumnResize(column.key, column.appliedWidth);\n }\n\n private _addDebt(\n borrower: HdsAdvancedTableColumn,\n lenderKey: string,\n amount: number\n ): void {\n borrower.widthDebts = {\n ...borrower.widthDebts,\n [lenderKey]: (borrower.widthDebts[lenderKey] ?? 0) + amount,\n };\n }\n\n private _setWidthDebts(): void {\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n const delta = this._transientDelta;\n\n if (\n delta === 0 ||\n nextColumn === undefined ||\n nextColumn.key === undefined ||\n column.key === undefined\n ) {\n return;\n }\n\n // Determine the borrower, lender, and the amount of width transferred\n const borrower = delta > 0 ? column : nextColumn;\n const lender = delta > 0 ? nextColumn : column;\n let amount = Math.abs(delta);\n\n if (borrower.key === undefined || lender.key === undefined) {\n return;\n }\n\n // Check if the lender already has a debt to the borrower.\n // If so, this transaction is a \"payment\" against that existing debt.\n const existingDebt = lender.widthDebts[borrower.key] ?? 0;\n\n if (existingDebt > 0) {\n const paymentAmount = Math.min(amount, existingDebt);\n\n // Reduce the lender's debt by the payment amount\n lender.widthDebts[borrower.key] = existingDebt - paymentAmount;\n\n if (lender.widthDebts[borrower.key]! <= 0) {\n delete lender.widthDebts[borrower.key];\n }\n\n // The amount of the new debt is reduced by the amount paid\n amount = amount - paymentAmount;\n }\n\n // If there is still a remaining amount, create a new debt for the borrower.\n if (amount > 0) {\n this._addDebt(borrower, lender.key, amount);\n }\n }\n}\n"],"names":["KEYBOARD_RESIZE_STEP","calculateEffectiveDelta","deltaX","col","startColW","nextCol","startNextColW","colMin","pxMinWidth","colMax","pxMaxWidth","Infinity","nextMin","nextMax","effectiveDelta","maxCanExpandCol","maxCanShrinkNext","Math","min","max","absDeltaX","maxCanShrinkCol","maxCanExpandNext","HdsAdvancedTableThResizeHandle","Component","g","prototype","tracked","i","void 0","_handleElement","_boundResize","_boundStopResize","_registerHandleElement","modifier","element","constructor","owner","args","_resize","bind","_stopResize","height","tableHeight","undefined","BORDER_WIDTH","classNames","classes","resizing","push","join","_applyTransientWidths","column","next","nextColumn","siblings","width","appliedWidth","onColumnResize","key","n","action","handleKeydown","event","validKeys","includes","preventDefault","stopPropagation","table","setTransientColumnWidths","roundValues","startColumnPxWidth","round","pxAppliedWidth","startNextColumnPxWidth","_applyResizeDelta","scrollIntoView","behavior","block","inline","queueMicrotask","_setWidthDebts","resetTransientColumnWidths","_transientDelta","startResize","button","startX","clientX","window","addEventListener","_setColumnWidth","pxTransientWidth","setPxTransientWidth","canResizeNeighbor","actualNewColumnWidth","actualAppliedDelta","_lastPointerEvent","_isUpdateQueued","requestAnimationFrameWaiter","removeEventListener","_addDebt","borrower","lenderKey","amount","widthDebts","delta","lender","abs","existingDebt","paymentAmount","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"th-resize-handle.js","sources":["../../../../src/components/hds/advanced-table/th-resize-handle.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { modifier } from 'ember-modifier';\nimport { requestAnimationFrameWaiter } from './utils.ts';\nimport { BORDER_WIDTH } from './index.ts';\nimport type Owner from '@ember/owner';\n\nimport type HdsAdvancedTableColumn from './models/column.ts';\nimport type { HdsAdvancedTableSignature } from './index.ts';\n\nconst KEYBOARD_RESIZE_STEP = 10;\n\nfunction calculateEffectiveDelta(\n deltaX: number,\n col: HdsAdvancedTableColumn,\n startColW: number,\n nextCol: HdsAdvancedTableColumn,\n startNextColW: number\n): number {\n const colMin = col.pxMinWidth ?? 0;\n const colMax = col.pxMaxWidth ?? Infinity;\n const nextMin = nextCol.pxMinWidth ?? 0;\n const nextMax = nextCol.pxMaxWidth ?? Infinity;\n\n let effectiveDelta = 0;\n\n // expanding col, shrinking nextCol\n if (deltaX > 0) {\n const maxCanExpandCol = colMax - startColW;\n const maxCanShrinkNext = startNextColW - nextMin;\n\n effectiveDelta = Math.min(deltaX, maxCanExpandCol, maxCanShrinkNext);\n effectiveDelta = Math.max(0, effectiveDelta);\n }\n // shrinking col, expanding nextCol\n else if (deltaX < 0) {\n const absDeltaX = -deltaX;\n const maxCanShrinkCol = startColW - colMin;\n\n let maxCanExpandNext: number;\n if (startNextColW > nextMax) {\n maxCanExpandNext = Infinity;\n } else {\n maxCanExpandNext = nextMax - startNextColW;\n }\n\n effectiveDelta = -Math.min(absDeltaX, maxCanShrinkCol, maxCanExpandNext);\n effectiveDelta = Math.min(0, effectiveDelta);\n }\n\n return effectiveDelta;\n}\n\nexport interface HdsAdvancedTableThResizeHandleSignature {\n Args: {\n column: HdsAdvancedTableColumn;\n tableHeight?: number;\n onColumnResize?: HdsAdvancedTableSignature['Args']['onColumnResize'];\n };\n Blocks: {\n default?: [];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsAdvancedTableThResizeHandle extends Component<HdsAdvancedTableThResizeHandleSignature> {\n @tracked resizing: {\n startX: number;\n startColumnPxWidth: number;\n startNextColumnPxWidth?: number;\n } | null = null;\n // track the width change as it is changing, applied when resizing stops\n @tracked private _transientDelta: number = 0;\n @tracked private _isUpdateQueued: boolean = false;\n @tracked private _lastPointerEvent: PointerEvent | null = null;\n\n private _handleElement!: HdsAdvancedTableThResizeHandleSignature['Element'];\n private _boundResize: (event: PointerEvent) => void;\n private _boundStopResize: () => void;\n\n private _registerHandleElement = modifier(\n (element: HdsAdvancedTableThResizeHandleSignature['Element']) => {\n this._handleElement = element;\n }\n );\n\n constructor(\n owner: Owner,\n args: HdsAdvancedTableThResizeHandleSignature['Args']\n ) {\n super(owner, args);\n\n this._boundResize = this._resize.bind(this);\n this._boundStopResize = this._stopResize.bind(this);\n }\n\n get height(): string | undefined {\n const { tableHeight } = this.args;\n\n if (tableHeight === undefined) {\n return;\n }\n\n return `${tableHeight - BORDER_WIDTH * 2}px`;\n }\n\n get classNames(): string {\n const classes = ['hds-advanced-table__th-resize-handle'];\n\n if (this.resizing !== null) {\n classes.push('hds-advanced-table__th-resize-handle--resizing');\n }\n\n return classes.join(' ');\n }\n\n private _applyTransientWidths() {\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n\n column.width = column.appliedWidth;\n\n if (nextColumn !== undefined) {\n nextColumn.width = nextColumn.appliedWidth;\n }\n }\n\n @action\n onColumnResize(key?: string, width?: string): void {\n const { onColumnResize } = this.args;\n\n if (typeof onColumnResize === 'function' && key !== undefined) {\n onColumnResize(key, width);\n }\n }\n\n @action\n handleKeydown(event: KeyboardEvent): void {\n const validKeys = ['ArrowLeft', 'ArrowRight'];\n\n if (!validKeys.includes(event.key)) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n\n if (nextColumn === undefined) {\n return;\n }\n\n column.table.setTransientColumnWidths({ roundValues: true });\n\n const startColumnPxWidth = Math.round(column.pxAppliedWidth ?? 0);\n const startNextColumnPxWidth = Math.round(nextColumn.pxAppliedWidth ?? 0);\n const deltaX =\n event.key === 'ArrowRight' ? KEYBOARD_RESIZE_STEP : -KEYBOARD_RESIZE_STEP;\n\n this._applyResizeDelta(\n deltaX,\n column,\n startColumnPxWidth,\n nextColumn,\n startNextColumnPxWidth\n );\n\n // ensure the resize handle remains visible during keyboard navigation.\n this._handleElement.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n inline: 'nearest',\n });\n\n // use a microtask to commit the final state after the render pass.\n queueMicrotask(() => {\n // reset transient values\n this._setWidthDebts();\n this._applyTransientWidths();\n column.table.resetTransientColumnWidths();\n this._transientDelta = 0;\n\n this.onColumnResize(column.key, column.width);\n });\n }\n\n @action\n startResize(event: PointerEvent): void {\n if (event.button !== 0) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n\n column.table.setTransientColumnWidths();\n\n this.resizing = {\n startX: event.clientX,\n startColumnPxWidth: Math.round(column.pxAppliedWidth ?? 0),\n startNextColumnPxWidth: Math.round(nextColumn?.pxAppliedWidth ?? 0),\n };\n\n window.addEventListener('pointermove', this._boundResize);\n window.addEventListener('pointerup', this._boundStopResize);\n }\n\n private _setColumnWidth(column: HdsAdvancedTableColumn, width: number): void {\n if (width > column.pxMaxWidth || width < column.pxMinWidth) {\n column.pxTransientWidth = width;\n } else {\n column.setPxTransientWidth(width);\n }\n }\n\n private _applyResizeDelta(\n deltaX: number,\n column: HdsAdvancedTableColumn,\n startColumnPxWidth: number,\n nextColumn?: HdsAdvancedTableColumn,\n startNextColumnPxWidth?: number\n ): void {\n const canResizeNeighbor =\n nextColumn !== undefined && startNextColumnPxWidth !== undefined;\n\n if (canResizeNeighbor) {\n const effectiveDelta = calculateEffectiveDelta(\n deltaX,\n column,\n startColumnPxWidth,\n nextColumn,\n startNextColumnPxWidth\n );\n\n // set the width for the current column\n this._setColumnWidth(\n column,\n Math.round(startColumnPxWidth + effectiveDelta)\n );\n\n // the actual new column width may differ from the intended width due to min/max constraints.\n const actualNewColumnWidth = column.pxAppliedWidth ?? startColumnPxWidth;\n const actualAppliedDelta = actualNewColumnWidth - startColumnPxWidth;\n\n // set the width for the next sibling column\n this._setColumnWidth(\n nextColumn,\n Math.round(startNextColumnPxWidth - actualAppliedDelta)\n );\n\n this._transientDelta = actualAppliedDelta;\n } else {\n column.setPxTransientWidth(Math.round(startColumnPxWidth + deltaX));\n }\n }\n\n private _resize(event: PointerEvent): void {\n this._lastPointerEvent = event;\n\n if (this._isUpdateQueued) {\n return;\n }\n\n this._isUpdateQueued = true;\n\n requestAnimationFrameWaiter(() => {\n if (this.resizing === null || this._lastPointerEvent === null) {\n this._isUpdateQueued = false;\n\n return;\n }\n\n const event = this._lastPointerEvent;\n\n event.preventDefault();\n\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n const { startX, startColumnPxWidth, startNextColumnPxWidth } =\n this.resizing;\n const deltaX = event.clientX - startX;\n\n this._applyResizeDelta(\n deltaX,\n column,\n startColumnPxWidth, // Width at the start of the drag\n nextColumn,\n startNextColumnPxWidth // Width of next col at the start of the drag\n );\n\n this._isUpdateQueued = false;\n });\n }\n\n private _stopResize(): void {\n const { column } = this.args;\n\n window.removeEventListener('pointermove', this._boundResize);\n window.removeEventListener('pointerup', this._boundStopResize);\n\n this._setWidthDebts();\n\n this._applyTransientWidths();\n\n // reset the transient width\n column.table.resetTransientColumnWidths();\n\n // reset the resizing state\n this.resizing = null;\n this._transientDelta = 0;\n\n this.onColumnResize(column.key, column.appliedWidth);\n }\n\n private _addDebt(\n borrower: HdsAdvancedTableColumn,\n lenderKey: string,\n amount: number\n ): void {\n borrower.widthDebts = {\n ...borrower.widthDebts,\n [lenderKey]: (borrower.widthDebts[lenderKey] ?? 0) + amount,\n };\n }\n\n private _setWidthDebts(): void {\n const { column } = this.args;\n const { next: nextColumn } = column.siblings;\n const delta = this._transientDelta;\n\n if (\n delta === 0 ||\n nextColumn === undefined ||\n nextColumn.key === undefined ||\n column.key === undefined\n ) {\n return;\n }\n\n // Determine the borrower, lender, and the amount of width transferred\n const borrower = delta > 0 ? column : nextColumn;\n const lender = delta > 0 ? nextColumn : column;\n let amount = Math.abs(delta);\n\n if (borrower.key === undefined || lender.key === undefined) {\n return;\n }\n\n // Check if the lender already has a debt to the borrower.\n // If so, this transaction is a \"payment\" against that existing debt.\n const existingDebt = lender.widthDebts[borrower.key] ?? 0;\n\n if (existingDebt > 0) {\n const paymentAmount = Math.min(amount, existingDebt);\n\n // Reduce the lender's debt by the payment amount\n lender.widthDebts[borrower.key] = existingDebt - paymentAmount;\n\n if (lender.widthDebts[borrower.key]! <= 0) {\n delete lender.widthDebts[borrower.key];\n }\n\n // The amount of the new debt is reduced by the amount paid\n amount = amount - paymentAmount;\n }\n\n // If there is still a remaining amount, create a new debt for the borrower.\n if (amount > 0) {\n this._addDebt(borrower, lender.key, amount);\n }\n }\n}\n"],"names":["KEYBOARD_RESIZE_STEP","calculateEffectiveDelta","deltaX","col","startColW","nextCol","startNextColW","colMin","pxMinWidth","colMax","pxMaxWidth","Infinity","nextMin","nextMax","effectiveDelta","maxCanExpandCol","maxCanShrinkNext","Math","min","max","absDeltaX","maxCanShrinkCol","maxCanExpandNext","HdsAdvancedTableThResizeHandle","Component","g","prototype","tracked","i","void 0","_handleElement","_boundResize","_boundStopResize","_registerHandleElement","modifier","element","constructor","owner","args","_resize","bind","_stopResize","height","tableHeight","undefined","BORDER_WIDTH","classNames","classes","resizing","push","join","_applyTransientWidths","column","next","nextColumn","siblings","width","appliedWidth","onColumnResize","key","n","action","handleKeydown","event","validKeys","includes","preventDefault","stopPropagation","table","setTransientColumnWidths","roundValues","startColumnPxWidth","round","pxAppliedWidth","startNextColumnPxWidth","_applyResizeDelta","scrollIntoView","behavior","block","inline","queueMicrotask","_setWidthDebts","resetTransientColumnWidths","_transientDelta","startResize","button","startX","clientX","window","addEventListener","_setColumnWidth","pxTransientWidth","setPxTransientWidth","canResizeNeighbor","actualNewColumnWidth","actualAppliedDelta","_lastPointerEvent","_isUpdateQueued","requestAnimationFrameWaiter","removeEventListener","_addDebt","borrower","lenderKey","amount","widthDebts","delta","lender","abs","existingDebt","paymentAmount","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"th.js","sources":["../../../../src/components/hds/advanced-table/th.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { guidFor } from '@ember/object/internals';\nimport { assert } from '@ember/debug';\nimport { action } from '@ember/object';\nimport { tracked } from '@glimmer/tracking';\nimport { focusable, type FocusableElement } from 'tabbable';\nimport { modifier } from 'ember-modifier';\nimport HdsAdvancedTableColumn from './models/column.ts';\nimport { onFocusTrapDeactivate } from '../../../modifiers/hds-advanced-table-cell/dom-management.ts';\nimport { HdsAdvancedTableHorizontalAlignmentValues } from './types.ts';\n\nimport type Owner from '@ember/owner';\nimport type {\n HdsAdvancedTableHorizontalAlignment,\n HdsAdvancedTableScope,\n HdsAdvancedTableExpandState,\n HdsAdvancedTableColumnReorderSide,\n} from './types.ts';\nimport type { HdsAdvancedTableThReorderHandleSignature } from './th-reorder-handle.ts';\nimport type { HdsAdvancedTableThResizeHandleSignature } from './th-resize-handle.ts';\nimport type { HdsAdvancedTableSignature } from './index.ts';\n\nexport const ALIGNMENTS: HdsAdvancedTableHorizontalAlignment[] = Object.values(\n HdsAdvancedTableHorizontalAlignmentValues\n);\nexport const DEFAULT_ALIGN = HdsAdvancedTableHorizontalAlignmentValues.Left;\n\nexport interface HdsAdvancedTableThSignature {\n Args: {\n align?: HdsAdvancedTableHorizontalAlignment;\n column?: HdsAdvancedTableColumn;\n colspan?: number;\n depth?: number;\n hasExpandAllButton?: boolean;\n hasReorderableColumns?: HdsAdvancedTableSignature['Args']['hasReorderableColumns'];\n hasResizableColumns?: HdsAdvancedTableSignature['Args']['hasResizableColumns'];\n hasSelectableRows?: HdsAdvancedTableSignature['Args']['isSelectable'];\n isExpanded?: HdsAdvancedTableExpandState;\n isExpandable?: boolean;\n isStickyColumn?: boolean;\n isStickyColumnPinned?: boolean;\n isVisuallyHidden?: boolean;\n newLabel?: string;\n parentId?: string;\n rowspan?: number;\n scope?: HdsAdvancedTableScope;\n tooltip?: string;\n tableHeight?: number;\n didInsertExpandButton?: (button: HTMLButtonElement) => void;\n onClickToggle?: () => void;\n onColumnResize?: HdsAdvancedTableSignature['Args']['onColumnResize'];\n onPinFirstColumn?: () => void;\n onReorderDragEnd?: () => void;\n onReorderDragStart?: (column: HdsAdvancedTableColumn) => void;\n onReorderDrop?: (\n column: HdsAdvancedTableColumn,\n side: HdsAdvancedTableColumnReorderSide\n ) => void;\n willDestroyExpandButton?: (button: HTMLButtonElement) => void;\n };\n Blocks: {\n default?: [];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsAdvancedTableTh extends Component<HdsAdvancedTableThSignature> {\n private _labelId = this.args.newLabel ? this.args.newLabel : guidFor(this);\n private _element!: HTMLDivElement;\n\n @tracked private _shouldTrapFocus = false;\n @tracked\n private _reorderHandleElement?: HdsAdvancedTableThReorderHandleSignature['Element'];\n @tracked\n private _resizeHandleElement?: HdsAdvancedTableThResizeHandleSignature['Element'];\n\n constructor(owner: Owner, args: HdsAdvancedTableThSignature['Args']) {\n super(owner, args);\n\n const { rowspan, colspan, isStickyColumn } = args;\n\n if (isStickyColumn) {\n assert(\n 'Cannot have custom rowspan or colspan if there are nested rows.',\n rowspan === undefined || colspan === undefined\n );\n }\n }\n\n get scope(): HdsAdvancedTableScope {\n const { scope = 'col' } = this.args;\n return scope;\n }\n\n get role(): string {\n if (this.scope === 'col') return 'columnheader';\n else return 'rowheader';\n }\n\n get align(): HdsAdvancedTableHorizontalAlignment {\n const { align = DEFAULT_ALIGN } = this.args;\n\n assert(\n `@align for \"Hds::Table::Th\" must be one of the following: ${ALIGNMENTS.join(\n ', '\n )}; received: ${align}`,\n ALIGNMENTS.includes(align)\n );\n\n return align;\n }\n\n // rowspan and colspan have to return 'auto' if not defined because otherwise the style modifier sets grid-area: undefined on the cell, which breaks the grid styles\n get rowspan(): string {\n if (this.args.rowspan) {\n return `span ${this.args.rowspan}`;\n }\n return 'auto';\n }\n\n get colspan(): string | undefined {\n if (this.args.colspan) {\n return `span ${this.args.colspan}`;\n }\n return 'auto';\n }\n\n get paddingLeft(): string | undefined {\n if (this.args.depth) {\n return `calc(${this.args.depth} * 32px + 16px)`;\n }\n }\n\n get classNames(): string {\n const classes = ['hds-advanced-table__th'];\n\n // add a class based on the @align argument\n if (this.align) {\n classes.push(`hds-advanced-table__th--align-${this.align}`);\n }\n\n if (this.args.isStickyColumn) {\n classes.push('hds-advanced-table__th--is-sticky-column');\n }\n\n if (this.args.isStickyColumn && this.args.isStickyColumnPinned) {\n classes.push('hds-advanced-table__th--is-sticky-column-pinned');\n }\n\n if (this.args.column?.isBeingDragged) {\n classes.push('hds-advanced-table__th--is-being-dragged');\n }\n\n return classes.join(' ');\n }\n\n @action\n handleDragStart(column: HdsAdvancedTableColumn): void {\n this.args.onReorderDragStart?.(column);\n }\n\n @action onFocusTrapDeactivate(): void {\n this._shouldTrapFocus = false;\n onFocusTrapDeactivate(this._element);\n }\n\n @action enableFocusTrap(): void {\n this._shouldTrapFocus = true;\n }\n\n @action getInitialFocus(): FocusableElement | undefined {\n const cellFocusableElements = focusable(this._element);\n return cellFocusableElements[0];\n }\n\n @action setElement(element: HTMLDivElement): void {\n this._element = element;\n\n if (this.args.column !== undefined) {\n this.args.column.thElement = element;\n }\n }\n\n private _registerReorderHandleElement = modifier(\n (element: HdsAdvancedTableThReorderHandleSignature['Element']) => {\n this._reorderHandleElement = element;\n }\n );\n\n private _registerResizeHandleElement = modifier(\n (element: HdsAdvancedTableThResizeHandleSignature['Element']) => {\n this._resizeHandleElement = element;\n }\n );\n\n private _manageExpandButton = modifier((button: HTMLButtonElement) => {\n const { didInsertExpandButton, willDestroyExpandButton } = this.args;\n if (typeof didInsertExpandButton === 'function') {\n didInsertExpandButton(button);\n }\n\n return () => {\n if (typeof willDestroyExpandButton === 'function') {\n willDestroyExpandButton(button);\n }\n };\n });\n}\n"],"names":["ALIGNMENTS","Object","values","HdsAdvancedTableHorizontalAlignmentValues","DEFAULT_ALIGN","Left","HdsAdvancedTableTh","Component","_labelId","args","newLabel","guidFor","_element","g","prototype","tracked","i","void 0","constructor","owner","rowspan","colspan","isStickyColumn","assert","undefined","scope","role","align","join","includes","paddingLeft","depth","classNames","classes","push","isStickyColumnPinned","column","isBeingDragged","handleDragStart","onReorderDragStart","n","action","onFocusTrapDeactivate","_shouldTrapFocus","enableFocusTrap","getInitialFocus","cellFocusableElements","focusable","setElement","element","thElement","_registerReorderHandleElement","modifier","_reorderHandleElement","_registerResizeHandleElement","_resizeHandleElement","_manageExpandButton","button","didInsertExpandButton","willDestroyExpandButton","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"th.js","sources":["../../../../src/components/hds/advanced-table/th.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { guidFor } from '@ember/object/internals';\nimport { assert } from '@ember/debug';\nimport { action } from '@ember/object';\nimport { tracked } from '@glimmer/tracking';\nimport { focusable, type FocusableElement } from 'tabbable';\nimport { modifier } from 'ember-modifier';\nimport HdsAdvancedTableColumn from './models/column.ts';\nimport { onFocusTrapDeactivate } from '../../../modifiers/hds-advanced-table-cell/dom-management.ts';\nimport { HdsAdvancedTableHorizontalAlignmentValues } from './types.ts';\n\nimport type Owner from '@ember/owner';\nimport type {\n HdsAdvancedTableHorizontalAlignment,\n HdsAdvancedTableScope,\n HdsAdvancedTableExpandState,\n HdsAdvancedTableColumnReorderSide,\n} from './types.ts';\nimport type { HdsAdvancedTableThReorderHandleSignature } from './th-reorder-handle.ts';\nimport type { HdsAdvancedTableThResizeHandleSignature } from './th-resize-handle.ts';\nimport type { HdsAdvancedTableSignature } from './index.ts';\n\nexport const ALIGNMENTS: HdsAdvancedTableHorizontalAlignment[] = Object.values(\n HdsAdvancedTableHorizontalAlignmentValues\n);\nexport const DEFAULT_ALIGN = HdsAdvancedTableHorizontalAlignmentValues.Left;\n\nexport interface HdsAdvancedTableThSignature {\n Args: {\n align?: HdsAdvancedTableHorizontalAlignment;\n column?: HdsAdvancedTableColumn;\n colspan?: number;\n depth?: number;\n hasExpandAllButton?: boolean;\n hasReorderableColumns?: HdsAdvancedTableSignature['Args']['hasReorderableColumns'];\n hasResizableColumns?: HdsAdvancedTableSignature['Args']['hasResizableColumns'];\n hasSelectableRows?: HdsAdvancedTableSignature['Args']['isSelectable'];\n isExpanded?: HdsAdvancedTableExpandState;\n isExpandable?: boolean;\n isStickyColumn?: boolean;\n isStickyColumnPinned?: boolean;\n newLabel?: string;\n parentId?: string;\n rowspan?: number;\n scope?: HdsAdvancedTableScope;\n tooltip?: string;\n tableHeight?: number;\n didInsertExpandButton?: (button: HTMLButtonElement) => void;\n onClickToggle?: () => void;\n onColumnResize?: HdsAdvancedTableSignature['Args']['onColumnResize'];\n onPinFirstColumn?: () => void;\n onReorderDragEnd?: () => void;\n onReorderDragStart?: (column: HdsAdvancedTableColumn) => void;\n onReorderDrop?: (\n column: HdsAdvancedTableColumn,\n side: HdsAdvancedTableColumnReorderSide\n ) => void;\n willDestroyExpandButton?: (button: HTMLButtonElement) => void;\n };\n Blocks: {\n default?: [];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsAdvancedTableTh extends Component<HdsAdvancedTableThSignature> {\n private _labelId = this.args.newLabel ? this.args.newLabel : guidFor(this);\n private _element!: HTMLDivElement;\n\n @tracked private _shouldTrapFocus = false;\n @tracked\n private _reorderHandleElement?: HdsAdvancedTableThReorderHandleSignature['Element'];\n @tracked\n private _resizeHandleElement?: HdsAdvancedTableThResizeHandleSignature['Element'];\n\n constructor(owner: Owner, args: HdsAdvancedTableThSignature['Args']) {\n super(owner, args);\n\n const { rowspan, colspan, isStickyColumn } = args;\n\n if (isStickyColumn) {\n assert(\n 'Cannot have custom rowspan or colspan if there are nested rows.',\n rowspan === undefined || colspan === undefined\n );\n }\n }\n\n get scope(): HdsAdvancedTableScope {\n const { scope = 'col' } = this.args;\n return scope;\n }\n\n get role(): string {\n if (this.scope === 'col') return 'columnheader';\n else return 'rowheader';\n }\n\n get align(): HdsAdvancedTableHorizontalAlignment {\n const { align = DEFAULT_ALIGN } = this.args;\n\n assert(\n `@align for \"Hds::Table::Th\" must be one of the following: ${ALIGNMENTS.join(\n ', '\n )}; received: ${align}`,\n ALIGNMENTS.includes(align)\n );\n\n return align;\n }\n\n // rowspan and colspan have to return 'auto' if not defined because otherwise the style modifier sets grid-area: undefined on the cell, which breaks the grid styles\n get rowspan(): string {\n if (this.args.rowspan) {\n return `span ${this.args.rowspan}`;\n }\n return 'auto';\n }\n\n get colspan(): string | undefined {\n if (this.args.colspan) {\n return `span ${this.args.colspan}`;\n }\n return 'auto';\n }\n\n get paddingLeft(): string | undefined {\n if (this.args.depth) {\n return `calc(${this.args.depth} * 32px + 16px)`;\n }\n }\n\n get classNames(): string {\n const classes = ['hds-advanced-table__th'];\n\n // add a class based on the @align argument\n if (this.align) {\n classes.push(`hds-advanced-table__th--align-${this.align}`);\n }\n\n if (this.args.isStickyColumn) {\n classes.push('hds-advanced-table__th--is-sticky-column');\n }\n\n if (this.args.isStickyColumn && this.args.isStickyColumnPinned) {\n classes.push('hds-advanced-table__th--is-sticky-column-pinned');\n }\n\n if (this.args.column?.isBeingDragged) {\n classes.push('hds-advanced-table__th--is-being-dragged');\n }\n\n return classes.join(' ');\n }\n\n @action\n handleDragStart(column: HdsAdvancedTableColumn): void {\n this.args.onReorderDragStart?.(column);\n }\n\n @action onFocusTrapDeactivate(): void {\n this._shouldTrapFocus = false;\n onFocusTrapDeactivate(this._element);\n }\n\n @action enableFocusTrap(): void {\n this._shouldTrapFocus = true;\n }\n\n @action getInitialFocus(): FocusableElement | undefined {\n const cellFocusableElements = focusable(this._element);\n return cellFocusableElements[0];\n }\n\n @action setElement(element: HTMLDivElement): void {\n this._element = element;\n\n if (this.args.column !== undefined) {\n this.args.column.thElement = element;\n }\n }\n\n private _registerReorderHandleElement = modifier(\n (element: HdsAdvancedTableThReorderHandleSignature['Element']) => {\n this._reorderHandleElement = element;\n }\n );\n\n private _registerResizeHandleElement = modifier(\n (element: HdsAdvancedTableThResizeHandleSignature['Element']) => {\n this._resizeHandleElement = element;\n }\n );\n\n private _manageExpandButton = modifier((button: HTMLButtonElement) => {\n const { didInsertExpandButton, willDestroyExpandButton } = this.args;\n if (typeof didInsertExpandButton === 'function') {\n didInsertExpandButton(button);\n }\n\n return () => {\n if (typeof willDestroyExpandButton === 'function') {\n willDestroyExpandButton(button);\n }\n };\n });\n}\n"],"names":["ALIGNMENTS","Object","values","HdsAdvancedTableHorizontalAlignmentValues","DEFAULT_ALIGN","Left","HdsAdvancedTableTh","Component","_labelId","args","newLabel","guidFor","_element","g","prototype","tracked","i","void 0","constructor","owner","rowspan","colspan","isStickyColumn","assert","undefined","scope","role","align","join","includes","paddingLeft","depth","classNames","classes","push","isStickyColumnPinned","column","isBeingDragged","handleDragStart","onReorderDragStart","n","action","onFocusTrapDeactivate","_shouldTrapFocus","enableFocusTrap","getInitialFocus","cellFocusableElements","focusable","setElement","element","thElement","_registerReorderHandleElement","modifier","_reorderHandleElement","_registerResizeHandleElement","_resizeHandleElement","_manageExpandButton","button","didInsertExpandButton","willDestroyExpandButton","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
@@ -8,7 +8,7 @@ import { precompileTemplate } from '@ember/template-compilation';
|
|
|
8
8
|
import { g, i, n } from 'decorator-transforms/runtime';
|
|
9
9
|
import { setComponentTemplate } from '@ember/component';
|
|
10
10
|
|
|
11
|
-
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n\n<div\n class={{this.classNames}}\n {{! @glint-expect-error - https://github.com/josemarluedke/ember-focus-trap/issues/86 }}\n {{focus-trap isActive=this.shouldTrapFocus}}\n ...attributes\n>\n {{#if (and this.hasA11yRefocus (not this._isOpen))}}\n
|
|
11
|
+
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n\n<div\n class={{this.classNames}}\n {{! @glint-expect-error - https://github.com/josemarluedke/ember-focus-trap/issues/86 }}\n {{focus-trap isActive=this.shouldTrapFocus}}\n ...attributes\n>\n {{#if (and this.hasA11yRefocus (not this._isOpen))}}\n <NavigationNarrator\n @routeChangeValidator={{@a11yRefocusRouteChangeValidator}}\n @skipTo={{this.a11yRefocusSkipTo}}\n @skipText={{@a11yRefocusSkipText}}\n @navigationText={{@a11yRefocusNavigationText}}\n @excludeAllQueryParams={{@a11yRefocusExcludeAllQueryParams}}\n />\n {{/if}}\n\n {{yield (hash close=this.close) to=\"logo\"}}\n\n {{#if (not this._isDesktop)}}\n <Hds::AppHeader::MenuButton\n @onClickToggle={{this.onClickToggle}}\n @isOpen={{this._isOpen}}\n @menuContentId={{this._menuContentId}}\n />\n {{/if}}\n\n <div class=\"hds-app-header__actions\" id={{this._menuContentId}}>\n <div class=\"hds-app-header__global-actions\">\n {{yield (hash close=this.close) to=\"globalActions\"}}\n </div>\n\n <div class=\"hds-app-header__utility-actions\">\n {{yield (hash close=this.close) to=\"utilityActions\"}}\n </div>\n </div>\n</div>");
|
|
12
12
|
|
|
13
13
|
/**
|
|
14
14
|
* Copyright (c) HashiCorp, Inc.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/app-header/index.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { guidFor } from '@ember/object/internals';\nimport { tracked } from '@glimmer/tracking';\nimport { registerDestructor } from '@ember/destroyable';\nimport type Owner from '@ember/owner';\n\nimport { hdsBreakpoints } from '../../../utils/hds-breakpoints.ts';\n\nexport interface HdsAppHeaderSignature {\n Args: {\n breakpoint?: string;\n hasA11yRefocus?: boolean;\n a11yRefocusSkipTo?: string;\n a11yRefocusSkipText?: string;\n a11yRefocusNavigationText?: string;\n a11yRefocusRouteChangeValidator?:
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/app-header/index.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { guidFor } from '@ember/object/internals';\nimport { tracked } from '@glimmer/tracking';\nimport { registerDestructor } from '@ember/destroyable';\nimport type Owner from '@ember/owner';\nimport type { NavigationNarratorSignature } from 'ember-a11y-refocus/components/navigation-narrator';\n\nimport { hdsBreakpoints } from '../../../utils/hds-breakpoints.ts';\n\nexport interface HdsAppHeaderSignature {\n Args: {\n breakpoint?: string;\n hasA11yRefocus?: boolean;\n a11yRefocusSkipTo?: string;\n a11yRefocusSkipText?: string;\n a11yRefocusNavigationText?: string;\n a11yRefocusRouteChangeValidator?: NavigationNarratorSignature['Args']['routeChangeValidator'];\n a11yRefocusExcludeAllQueryParams?: boolean;\n };\n Blocks: {\n logo?: [\n {\n close: () => void;\n },\n ];\n globalActions?: [\n {\n close: () => void;\n },\n ];\n utilityActions?: [\n {\n close: () => void;\n },\n ];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsAppHeader extends Component<HdsAppHeaderSignature> {\n @tracked private _isOpen = false;\n @tracked private _isDesktop = true;\n @tracked private _hasOverflowContent = false;\n private _desktopMQ: MediaQueryList;\n hasA11yRefocus = this.args.hasA11yRefocus ?? true;\n a11yRefocusSkipTo = '#' + (this.args.a11yRefocusSkipTo ?? 'hds-main');\n\n // Generates a unique ID for the Menu Content\n private _menuContentId = 'hds-menu-content-' + guidFor(this);\n\n // we use the `md` breakpoint for `desktop` viewports, but consumers can override its value\n private _desktopMQVal = this.args.breakpoint ?? hdsBreakpoints['md'].px;\n\n constructor(owner: Owner, args: Record<string, never>) {\n super(owner, args);\n this._desktopMQ = window.matchMedia(`(min-width: ${this._desktopMQVal})`);\n this.addEventListeners();\n registerDestructor(this, (): void => {\n this.removeEventListeners();\n });\n }\n\n addEventListeners(): void {\n // eslint-disable-next-line @typescript-eslint/unbound-method\n document.addEventListener('keydown', this.escapePress, true);\n this._desktopMQ.addEventListener(\n 'change',\n // eslint-disable-next-line @typescript-eslint/unbound-method\n this.updateDesktopVariable,\n true\n );\n\n // set initial state based on viewport using a \"synthetic\" event\n const syntheticEvent = new MediaQueryListEvent('change', {\n matches: this._desktopMQ.matches,\n media: this._desktopMQ.media,\n });\n this.updateDesktopVariable(syntheticEvent);\n }\n\n removeEventListeners(): void {\n // eslint-disable-next-line @typescript-eslint/unbound-method\n document.removeEventListener('keydown', this.escapePress, true);\n this._desktopMQ.removeEventListener(\n 'change',\n // eslint-disable-next-line @typescript-eslint/unbound-method\n this.updateDesktopVariable,\n true\n );\n }\n\n // In mobile view when the menu is open, trap focus within the AppHeader\n get shouldTrapFocus(): boolean {\n return !this._isDesktop && this._isOpen;\n }\n\n // Get the class names to apply to the component.\n get classNames(): string {\n const classes = ['hds-app-header'];\n\n if (this._isDesktop) {\n classes.push('hds-app-header--is-desktop');\n } else {\n classes.push('hds-app-header--is-mobile');\n\n // open and closed menu states are only relevant on mobile\n if (this._isOpen) {\n classes.push('hds-app-header--menu-is-open');\n } else {\n classes.push('hds-app-header--menu-is-closed');\n }\n }\n\n return classes.join(' ');\n }\n\n @action\n escapePress(event: KeyboardEvent): void {\n if (event.key === 'Escape' && this._isOpen && !this._isDesktop) {\n this._isOpen = false;\n }\n }\n\n @action\n onClickToggle(): void {\n this._isOpen = !this._isOpen;\n }\n\n @action close(): void {\n if (this._isOpen && !this._isDesktop) {\n this._isOpen = false;\n }\n }\n\n @action\n updateDesktopVariable(event: MediaQueryListEvent): void {\n this._isDesktop = event.matches;\n\n // Close the menu when switching to desktop view\n // (prevents menu from being open when resizing which causes Skip button to not render)\n if (this._isDesktop) {\n this._isOpen = false;\n }\n }\n}\n"],"names":["HdsAppHeader","Component","g","prototype","tracked","i","void 0","_desktopMQ","hasA11yRefocus","args","a11yRefocusSkipTo","_menuContentId","guidFor","_desktopMQVal","breakpoint","hdsBreakpoints","px","constructor","owner","window","matchMedia","addEventListeners","registerDestructor","removeEventListeners","document","addEventListener","escapePress","updateDesktopVariable","syntheticEvent","MediaQueryListEvent","matches","media","removeEventListener","shouldTrapFocus","_isDesktop","_isOpen","classNames","classes","push","join","event","key","n","action","onClickToggle","close","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import Component from '@glimmer/component';
|
|
2
|
-
import {
|
|
2
|
+
import { service } from '@ember/service';
|
|
3
3
|
import { tracked } from '@glimmer/tracking';
|
|
4
4
|
import { action } from '@ember/object';
|
|
5
5
|
import { macroCondition, isTesting } from '@embroider/macros';
|
|
@@ -16,7 +16,7 @@ var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-
|
|
|
16
16
|
|
|
17
17
|
class HdsAppSideNavPortalTarget extends Component {
|
|
18
18
|
static {
|
|
19
|
-
g(this.prototype, "router", [
|
|
19
|
+
g(this.prototype, "router", [service]);
|
|
20
20
|
}
|
|
21
21
|
#router = (i(this, "router"), void 0);
|
|
22
22
|
static {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"target.js","sources":["../../../../../src/components/hds/app-side-nav/portal/target.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { inject as service } from '@ember/service';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { macroCondition, isTesting } from '@embroider/macros';\n\nimport type { HdsAppSideNavPortalSignature } from './index';\nimport type { Registry as Services } from '@ember/service';\n\ninterface HdsAppSideNavPortalTargetSignature {\n Args: {\n targetName?: HdsAppSideNavPortalSignature['Args']['targetName'];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsAppSideNavPortalTarget extends Component<HdsAppSideNavPortalTargetSignature> {\n @service router!: Services['router'];\n\n @tracked private _numSubnavs = 0;\n @tracked private _lastPanelEl: Element | undefined;\n\n static get prefersReducedMotionOverride(): boolean {\n return macroCondition(isTesting()) ? true : false;\n }\n\n private _prefersReducedMotionMQ = window.matchMedia(\n '(prefers-reduced-motion: reduce)'\n );\n\n get prefersReducedMotion(): boolean {\n return (\n HdsAppSideNavPortalTarget.prefersReducedMotionOverride ||\n (this._prefersReducedMotionMQ && this._prefersReducedMotionMQ.matches)\n );\n }\n\n @action\n panelsChanged(portalCount: number): void {\n this._numSubnavs = portalCount;\n }\n\n @action\n didUpdateSubnav(element: HTMLElement, [count]: [number]): void {\n this.animateSubnav(element, [count]);\n }\n\n @action\n animateSubnav(element: HTMLElement, [count]: [number]): void {\n /*\n * Here is ascii art of what the layout looks like for this setup\n *\n\n AppSideNav\n +----------------------+\n | +------------------+ |\n | | (\"header\") | |\n | +------------------+ |\n | |\n | +------------------+ |\n | | (\"body\") | |\n (PortalTarget) | | | |\n +----------------------------------------------+ | |\n | +----------+ +----------+ | +----------+ | | |\n | | (Portal) | | (Portal) | | (Portal) | | | |\n | | | | | | | | | | |\n | | hidden | | hidden | | *active* | | | |\n | | panel | | panel | | | panel | | | |\n | | | | | | | | | |\n | | | | | | | | | | |\n | | | | | | | | | |\n | | | | | | | | | | |\n | | | | | | | | | |\n | | | | | | | | | | |\n | | | | | | | | | |\n | +----------+ +----------+ | +----------+ | | |\n +----------------------------------------------+ | |\n | | | |\n | +------------------+ |\n | |\n | +------------------+ |\n | | (\"footer\") | |\n | +------------------+ |\n +----------------------+\n\n *\n * every time `HcAppFrame::SideNav::Portal` renders, it contains a portaled \"panel\"\n * that is rendered into the `hds-app-side-nav__content-panels` (inside the PortalTarget).\n *\n * Rendering or unrendering other `HcAppFrame::SideNav::Portal`s triggers the number of\n * subnavs to change (via `numSubnavs`), so this function runs and slides\n * `hds-app-side-nav__content-panels` left or right using the `element.animate` api.\n *\n * */\n\n const activeIndex = count - 1;\n const targetElement = element;\n const { prefersReducedMotion } = this;\n\n const styles = getComputedStyle(targetElement);\n const columnWidth = styles.getPropertyValue(\n '--hds-app-sidenav-width-expanded'\n );\n const slideDuration = prefersReducedMotion ? 0 : 150;\n let fadeDuration = prefersReducedMotion ? 0 : 175;\n let fadeDelay = prefersReducedMotion ? 0 : 50;\n\n // slide entire parent panel\n const start = styles.transform;\n const end = `translateX(-${activeIndex * parseInt(columnWidth, 10)}px)`;\n const anim = targetElement.animate(\n [{ transform: start }, { transform: end }],\n {\n duration: slideDuration,\n easing: 'cubic-bezier(0.65, 0, 0.35, 1)',\n fill: 'forwards',\n }\n );\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n anim.finished.then((): void => {\n // uncomment this if we need/want to scroll the element to the top\n // targetElement.scrollIntoView(true);\n if (activeIndex > 0) {\n const allPrev = Array.from(targetElement.children).slice(\n 0,\n activeIndex\n ) as HTMLElement[];\n for (const ele of allPrev) {\n ele.ariaHidden = 'true';\n ele.style.setProperty('visibility', 'hidden');\n ele.style.setProperty('opacity', '0');\n }\n }\n // Notice: we don't add the styles by default because it writes a `style` attribute to the element and it causes an additional re-render\n if (macroCondition(isTesting())) {\n // Check the visibility of the element before attempting to commitStyles.\n if (targetElement.offsetParent !== null) {\n anim.commitStyles();\n }\n }\n });\n\n // fade in next panel\n const nextPanelEl = targetElement.children[activeIndex] as HTMLElement;\n\n // get reference to last child panel\n const lastPanelEl = targetElement.children[\n targetElement.children.length - 1\n ] as HTMLElement;\n\n if (nextPanelEl) {\n nextPanelEl.ariaHidden = 'false';\n nextPanelEl.style.setProperty('visibility', 'visible');\n // this eliminates a flicker if there's only one subnav rendering or if we\n // already just rendered this panel.\n if (this._lastPanelEl) {\n if (activeIndex === 0 || nextPanelEl.isSameNode(this._lastPanelEl)) {\n fadeDelay = 0;\n fadeDuration = 0;\n }\n }\n\n // remember the last panel\n this._lastPanelEl = lastPanelEl;\n\n nextPanelEl.animate([{ opacity: '0' }, { opacity: '1' }], {\n delay: fadeDelay,\n duration: fadeDuration,\n fill: 'forwards',\n });\n }\n }\n}\n"],"names":["HdsAppSideNavPortalTarget","Component","g","prototype","service","i","void 0","tracked","prefersReducedMotionOverride","macroCondition","isTesting","_prefersReducedMotionMQ","window","matchMedia","prefersReducedMotion","matches","panelsChanged","portalCount","_numSubnavs","n","action","didUpdateSubnav","element","count","animateSubnav","activeIndex","targetElement","styles","getComputedStyle","columnWidth","getPropertyValue","slideDuration","fadeDuration","fadeDelay","start","transform","end","parseInt","anim","animate","duration","easing","fill","finished","then","allPrev","Array","from","children","slice","ele","ariaHidden","style","setProperty","offsetParent","commitStyles","nextPanelEl","lastPanelEl","length","_lastPanelEl","isSameNode","opacity","delay","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"target.js","sources":["../../../../../src/components/hds/app-side-nav/portal/target.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { service } from '@ember/service';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { macroCondition, isTesting } from '@embroider/macros';\n\nimport type { HdsAppSideNavPortalSignature } from './index';\nimport type { Registry as Services } from '@ember/service';\n\ninterface HdsAppSideNavPortalTargetSignature {\n Args: {\n targetName?: HdsAppSideNavPortalSignature['Args']['targetName'];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsAppSideNavPortalTarget extends Component<HdsAppSideNavPortalTargetSignature> {\n @service router!: Services['router'];\n\n @tracked private _numSubnavs = 0;\n @tracked private _lastPanelEl: Element | undefined;\n\n static get prefersReducedMotionOverride(): boolean {\n return macroCondition(isTesting()) ? true : false;\n }\n\n private _prefersReducedMotionMQ = window.matchMedia(\n '(prefers-reduced-motion: reduce)'\n );\n\n get prefersReducedMotion(): boolean {\n return (\n HdsAppSideNavPortalTarget.prefersReducedMotionOverride ||\n (this._prefersReducedMotionMQ && this._prefersReducedMotionMQ.matches)\n );\n }\n\n @action\n panelsChanged(portalCount: number): void {\n this._numSubnavs = portalCount;\n }\n\n @action\n didUpdateSubnav(element: HTMLElement, [count]: [number]): void {\n this.animateSubnav(element, [count]);\n }\n\n @action\n animateSubnav(element: HTMLElement, [count]: [number]): void {\n /*\n * Here is ascii art of what the layout looks like for this setup\n *\n\n AppSideNav\n +----------------------+\n | +------------------+ |\n | | (\"header\") | |\n | +------------------+ |\n | |\n | +------------------+ |\n | | (\"body\") | |\n (PortalTarget) | | | |\n +----------------------------------------------+ | |\n | +----------+ +----------+ | +----------+ | | |\n | | (Portal) | | (Portal) | | (Portal) | | | |\n | | | | | | | | | | |\n | | hidden | | hidden | | *active* | | | |\n | | panel | | panel | | | panel | | | |\n | | | | | | | | | |\n | | | | | | | | | | |\n | | | | | | | | | |\n | | | | | | | | | | |\n | | | | | | | | | |\n | | | | | | | | | | |\n | | | | | | | | | |\n | +----------+ +----------+ | +----------+ | | |\n +----------------------------------------------+ | |\n | | | |\n | +------------------+ |\n | |\n | +------------------+ |\n | | (\"footer\") | |\n | +------------------+ |\n +----------------------+\n\n *\n * every time `HcAppFrame::SideNav::Portal` renders, it contains a portaled \"panel\"\n * that is rendered into the `hds-app-side-nav__content-panels` (inside the PortalTarget).\n *\n * Rendering or unrendering other `HcAppFrame::SideNav::Portal`s triggers the number of\n * subnavs to change (via `numSubnavs`), so this function runs and slides\n * `hds-app-side-nav__content-panels` left or right using the `element.animate` api.\n *\n * */\n\n const activeIndex = count - 1;\n const targetElement = element;\n const { prefersReducedMotion } = this;\n\n const styles = getComputedStyle(targetElement);\n const columnWidth = styles.getPropertyValue(\n '--hds-app-sidenav-width-expanded'\n );\n const slideDuration = prefersReducedMotion ? 0 : 150;\n let fadeDuration = prefersReducedMotion ? 0 : 175;\n let fadeDelay = prefersReducedMotion ? 0 : 50;\n\n // slide entire parent panel\n const start = styles.transform;\n const end = `translateX(-${activeIndex * parseInt(columnWidth, 10)}px)`;\n const anim = targetElement.animate(\n [{ transform: start }, { transform: end }],\n {\n duration: slideDuration,\n easing: 'cubic-bezier(0.65, 0, 0.35, 1)',\n fill: 'forwards',\n }\n );\n\n // eslint-disable-next-line @typescript-eslint/no-floating-promises\n anim.finished.then((): void => {\n // uncomment this if we need/want to scroll the element to the top\n // targetElement.scrollIntoView(true);\n if (activeIndex > 0) {\n const allPrev = Array.from(targetElement.children).slice(\n 0,\n activeIndex\n ) as HTMLElement[];\n for (const ele of allPrev) {\n ele.ariaHidden = 'true';\n ele.style.setProperty('visibility', 'hidden');\n ele.style.setProperty('opacity', '0');\n }\n }\n // Notice: we don't add the styles by default because it writes a `style` attribute to the element and it causes an additional re-render\n if (macroCondition(isTesting())) {\n // Check the visibility of the element before attempting to commitStyles.\n if (targetElement.offsetParent !== null) {\n anim.commitStyles();\n }\n }\n });\n\n // fade in next panel\n const nextPanelEl = targetElement.children[activeIndex] as HTMLElement;\n\n // get reference to last child panel\n const lastPanelEl = targetElement.children[\n targetElement.children.length - 1\n ] as HTMLElement;\n\n if (nextPanelEl) {\n nextPanelEl.ariaHidden = 'false';\n nextPanelEl.style.setProperty('visibility', 'visible');\n // this eliminates a flicker if there's only one subnav rendering or if we\n // already just rendered this panel.\n if (this._lastPanelEl) {\n if (activeIndex === 0 || nextPanelEl.isSameNode(this._lastPanelEl)) {\n fadeDelay = 0;\n fadeDuration = 0;\n }\n }\n\n // remember the last panel\n this._lastPanelEl = lastPanelEl;\n\n nextPanelEl.animate([{ opacity: '0' }, { opacity: '1' }], {\n delay: fadeDelay,\n duration: fadeDuration,\n fill: 'forwards',\n });\n }\n }\n}\n"],"names":["HdsAppSideNavPortalTarget","Component","g","prototype","service","i","void 0","tracked","prefersReducedMotionOverride","macroCondition","isTesting","_prefersReducedMotionMQ","window","matchMedia","prefersReducedMotion","matches","panelsChanged","portalCount","_numSubnavs","n","action","didUpdateSubnav","element","count","animateSubnav","activeIndex","targetElement","styles","getComputedStyle","columnWidth","getPropertyValue","slideDuration","fadeDuration","fadeDelay","start","transform","end","parseInt","anim","animate","duration","easing","fill","finished","then","allPrev","Array","from","children","slice","ele","ariaHidden","style","setProperty","offsetParent","commitStyles","nextPanelEl","lastPanelEl","length","_lastPanelEl","isSameNode","opacity","delay","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;;;;AAAA;AACA;AACA;AACA;;AAkBe,MAAMA,yBAAyB,SAASC,SAAS,CAAqC;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,QAAA,EAAA,CAClGC,OAAO,CAAA,CAAA;AAAA;AAAA,EAAA,OAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,QAAA,CAAA,EAAAC,MAAA;AAAA,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,aAAA,EAAA,CAEPI,OAAO,CAAA,EAAA,YAAA;AAAA,MAAA,OAAuB,CAAC;AAAA,IAAA,CAAA,CAAA;AAAA;AAAA,EAAA,YAAA,IAAAF,CAAA,CAAA,IAAA,EAAA,aAAA,CAAA,EAAAC,MAAA;AAAA,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,cAAA,EAAA,CAC/BI,OAAO,CAAA,CAAA;AAAA;AAAA,EAAA,aAAA,IAAAF,CAAA,CAAA,IAAA,EAAA,cAAA,CAAA,EAAAC,MAAA;EAER,WAAWE,4BAA4BA,GAAY;IACjD,OAAOC,cAAc,CAACC,SAAS,EAAE,CAAC,GAAG,IAAI,GAAG,KAAK;AACnD,EAAA;AAEQC,EAAAA,uBAAuB,GAAGC,MAAM,CAACC,UAAU,CACjD,kCACF,CAAC;EAED,IAAIC,oBAAoBA,GAAY;AAClC,IAAA,OACEd,yBAAyB,CAACQ,4BAA4B,IACrD,IAAI,CAACG,uBAAuB,IAAI,IAAI,CAACA,uBAAuB,CAACI,OAAQ;AAE1E,EAAA;EAGAC,aAAaA,CAACC,WAAmB,EAAQ;IACvC,IAAI,CAACC,WAAW,GAAGD,WAAW;AAChC,EAAA;AAAC,EAAA;IAAAE,CAAA,CAAA,IAAA,CAAAhB,SAAA,EAAA,eAAA,EAAA,CAHAiB,MAAM,CAAA,CAAA;AAAA;AAMPC,EAAAA,eAAeA,CAACC,OAAoB,EAAE,CAACC,KAAK,CAAW,EAAQ;IAC7D,IAAI,CAACC,aAAa,CAACF,OAAO,EAAE,CAACC,KAAK,CAAC,CAAC;AACtC,EAAA;AAAC,EAAA;IAAAJ,CAAA,CAAA,IAAA,CAAAhB,SAAA,EAAA,iBAAA,EAAA,CAHAiB,MAAM,CAAA,CAAA;AAAA;AAMPI,EAAAA,aAAaA,CAACF,OAAoB,EAAE,CAACC,KAAK,CAAW,EAAQ;AAC3D;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAII,IAAA,MAAME,WAAW,GAAGF,KAAK,GAAG,CAAC;IAC7B,MAAMG,aAAa,GAAGJ,OAAO;IAC7B,MAAM;AAAER,MAAAA;AAAqB,KAAC,GAAG,IAAI;AAErC,IAAA,MAAMa,MAAM,GAAGC,gBAAgB,CAACF,aAAa,CAAC;AAC9C,IAAA,MAAMG,WAAW,GAAGF,MAAM,CAACG,gBAAgB,CACzC,kCACF,CAAC;AACD,IAAA,MAAMC,aAAa,GAAGjB,oBAAoB,GAAG,CAAC,GAAG,GAAG;AACpD,IAAA,IAAIkB,YAAY,GAAGlB,oBAAoB,GAAG,CAAC,GAAG,GAAG;AACjD,IAAA,IAAImB,SAAS,GAAGnB,oBAAoB,GAAG,CAAC,GAAG,EAAE;;AAE7C;AACA,IAAA,MAAMoB,KAAK,GAAGP,MAAM,CAACQ,SAAS;IAC9B,MAAMC,GAAG,GAAG,CAAA,YAAA,EAAeX,WAAW,GAAGY,QAAQ,CAACR,WAAW,EAAE,EAAE,CAAC,CAAA,GAAA,CAAK;AACvE,IAAA,MAAMS,IAAI,GAAGZ,aAAa,CAACa,OAAO,CAChC,CAAC;AAAEJ,MAAAA,SAAS,EAAED;AAAM,KAAC,EAAE;AAAEC,MAAAA,SAAS,EAAEC;AAAI,KAAC,CAAC,EAC1C;AACEI,MAAAA,QAAQ,EAAET,aAAa;AACvBU,MAAAA,MAAM,EAAE,gCAAgC;AACxCC,MAAAA,IAAI,EAAE;AACR,KACF,CAAC;;AAED;AACAJ,IAAAA,IAAI,CAACK,QAAQ,CAACC,IAAI,CAAC,MAAY;AAC7B;AACA;MACA,IAAInB,WAAW,GAAG,CAAC,EAAE;AACnB,QAAA,MAAMoB,OAAO,GAAGC,KAAK,CAACC,IAAI,CAACrB,aAAa,CAACsB,QAAQ,CAAC,CAACC,KAAK,CACtD,CAAC,EACDxB,WACF,CAAkB;AAClB,QAAA,KAAK,MAAMyB,GAAG,IAAIL,OAAO,EAAE;UACzBK,GAAG,CAACC,UAAU,GAAG,MAAM;UACvBD,GAAG,CAACE,KAAK,CAACC,WAAW,CAAC,YAAY,EAAE,QAAQ,CAAC;UAC7CH,GAAG,CAACE,KAAK,CAACC,WAAW,CAAC,SAAS,EAAE,GAAG,CAAC;AACvC,QAAA;AACF,MAAA;AACA;AACA,MAAA,IAAI5C,cAAc,CAACC,SAAS,EAAE,CAAC,EAAE;AAC/B;AACA,QAAA,IAAIgB,aAAa,CAAC4B,YAAY,KAAK,IAAI,EAAE;UACvChB,IAAI,CAACiB,YAAY,EAAE;AACrB,QAAA;AACF,MAAA;AACF,IAAA,CAAC,CAAC;;AAEF;AACA,IAAA,MAAMC,WAAW,GAAG9B,aAAa,CAACsB,QAAQ,CAACvB,WAAW,CAAgB;;AAEtE;AACA,IAAA,MAAMgC,WAAW,GAAG/B,aAAa,CAACsB,QAAQ,CACxCtB,aAAa,CAACsB,QAAQ,CAACU,MAAM,GAAG,CAAC,CACnB;AAEhB,IAAA,IAAIF,WAAW,EAAE;MACfA,WAAW,CAACL,UAAU,GAAG,OAAO;MAChCK,WAAW,CAACJ,KAAK,CAACC,WAAW,CAAC,YAAY,EAAE,SAAS,CAAC;AACtD;AACA;MACA,IAAI,IAAI,CAACM,YAAY,EAAE;AACrB,QAAA,IAAIlC,WAAW,KAAK,CAAC,IAAI+B,WAAW,CAACI,UAAU,CAAC,IAAI,CAACD,YAAY,CAAC,EAAE;AAClE1B,UAAAA,SAAS,GAAG,CAAC;AACbD,UAAAA,YAAY,GAAG,CAAC;AAClB,QAAA;AACF,MAAA;;AAEA;MACA,IAAI,CAAC2B,YAAY,GAAGF,WAAW;MAE/BD,WAAW,CAACjB,OAAO,CAAC,CAAC;AAAEsB,QAAAA,OAAO,EAAE;AAAI,OAAC,EAAE;AAAEA,QAAAA,OAAO,EAAE;AAAI,OAAC,CAAC,EAAE;AACxDC,QAAAA,KAAK,EAAE7B,SAAS;AAChBO,QAAAA,QAAQ,EAAER,YAAY;AACtBU,QAAAA,IAAI,EAAE;AACR,OAAC,CAAC;AACJ,IAAA;AACF,EAAA;AAAC,EAAA;IAAAvB,CAAA,CAAA,IAAA,CAAAhB,SAAA,EAAA,eAAA,EAAA,CA7HAiB,MAAM,CAAA,CAAA;AAAA;AA8HT;AAAC2C,oBAAA,CAAAC,QAAA,EA7JoBhE,yBAAyB,CAAA;;;;"}
|
|
@@ -13,6 +13,9 @@ var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-
|
|
|
13
13
|
|
|
14
14
|
const ALIGNS = Object.values(HdsApplicationStateAlignValues);
|
|
15
15
|
class HdsApplicationState extends Component {
|
|
16
|
+
get isAutoCentered() {
|
|
17
|
+
return this.args.isAutoCentered ?? true;
|
|
18
|
+
}
|
|
16
19
|
get align() {
|
|
17
20
|
const validAlignValues = Object.values(HdsApplicationStateAlignValues);
|
|
18
21
|
assert(`@align for "Hds::ApplicationState" must be one of the following: ${validAlignValues.join(', ')}; received: ${this.args.align}`, this.args.align == null || validAlignValues.includes(this.args.align));
|
|
@@ -23,6 +26,9 @@ class HdsApplicationState extends Component {
|
|
|
23
26
|
|
|
24
27
|
// add a class based on the @align argument
|
|
25
28
|
classes.push(`hds-application-state--align-${this.align}`);
|
|
29
|
+
if (this.isAutoCentered) {
|
|
30
|
+
classes.push('hds-application-state--is-auto-centered');
|
|
31
|
+
}
|
|
26
32
|
return classes.join(' ');
|
|
27
33
|
}
|
|
28
34
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/application-state/index.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsApplicationStateAlignValues } from './types.ts';\n\nimport type { ComponentLike } from '@glint/template';\nimport type { HdsApplicationStateAligns } from './types';\nimport type { HdsApplicationStateMediaSignature } from './media';\nimport type { HdsApplicationStateHeaderSignature } from './header';\nimport type { HdsApplicationStateBodySignature } from './body';\nimport type { HdsApplicationStateFooterSignature } from './footer';\n\nexport const ALIGNS: HdsApplicationStateAligns[] = Object.values(\n HdsApplicationStateAlignValues\n);\nexport interface HdsApplicationStateSignature {\n Args: {\n align?: HdsApplicationStateAligns;\n };\n Blocks: {\n default: [\n {\n Media?: ComponentLike<HdsApplicationStateMediaSignature>;\n Header?: ComponentLike<HdsApplicationStateHeaderSignature>;\n Body?: ComponentLike<HdsApplicationStateBodySignature>;\n Footer?: ComponentLike<HdsApplicationStateFooterSignature>;\n },\n ];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsApplicationState extends Component<HdsApplicationStateSignature> {\n get align(): HdsApplicationStateAligns {\n const validAlignValues: HdsApplicationStateAligns[] = Object.values(\n HdsApplicationStateAlignValues\n );\n\n assert(\n `@align for \"Hds::ApplicationState\" must be one of the following: ${validAlignValues.join(\n ', '\n )}; received: ${this.args.align}`,\n this.args.align == null || validAlignValues.includes(this.args.align)\n );\n\n return this.args.align ?? HdsApplicationStateAlignValues.Left;\n }\n\n get classNames(): string {\n const classes = ['hds-application-state'];\n\n // add a class based on the @align argument\n classes.push(`hds-application-state--align-${this.align}`);\n\n return classes.join(' ');\n }\n}\n"],"names":["ALIGNS","Object","values","HdsApplicationStateAlignValues","HdsApplicationState","Component","align","validAlignValues","assert","join","
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/application-state/index.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\nimport { HdsApplicationStateAlignValues } from './types.ts';\n\nimport type { ComponentLike } from '@glint/template';\nimport type { HdsApplicationStateAligns } from './types';\nimport type { HdsApplicationStateMediaSignature } from './media';\nimport type { HdsApplicationStateHeaderSignature } from './header';\nimport type { HdsApplicationStateBodySignature } from './body';\nimport type { HdsApplicationStateFooterSignature } from './footer';\n\nexport const ALIGNS: HdsApplicationStateAligns[] = Object.values(\n HdsApplicationStateAlignValues\n);\nexport interface HdsApplicationStateSignature {\n Args: {\n align?: HdsApplicationStateAligns;\n isAutoCentered?: boolean;\n };\n Blocks: {\n default: [\n {\n Media?: ComponentLike<HdsApplicationStateMediaSignature>;\n Header?: ComponentLike<HdsApplicationStateHeaderSignature>;\n Body?: ComponentLike<HdsApplicationStateBodySignature>;\n Footer?: ComponentLike<HdsApplicationStateFooterSignature>;\n },\n ];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsApplicationState extends Component<HdsApplicationStateSignature> {\n get isAutoCentered(): boolean {\n return this.args.isAutoCentered ?? true;\n }\n\n get align(): HdsApplicationStateAligns {\n const validAlignValues: HdsApplicationStateAligns[] = Object.values(\n HdsApplicationStateAlignValues\n );\n\n assert(\n `@align for \"Hds::ApplicationState\" must be one of the following: ${validAlignValues.join(\n ', '\n )}; received: ${this.args.align}`,\n this.args.align == null || validAlignValues.includes(this.args.align)\n );\n\n return this.args.align ?? HdsApplicationStateAlignValues.Left;\n }\n\n get classNames(): string {\n const classes = ['hds-application-state'];\n\n // add a class based on the @align argument\n classes.push(`hds-application-state--align-${this.align}`);\n\n if (this.isAutoCentered) {\n classes.push('hds-application-state--is-auto-centered');\n }\n\n return classes.join(' ');\n }\n}\n"],"names":["ALIGNS","Object","values","HdsApplicationStateAlignValues","HdsApplicationState","Component","isAutoCentered","args","align","validAlignValues","assert","join","includes","Left","classNames","classes","push","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;;AAaO,MAAMA,MAAmC,GAAGC,MAAM,CAACC,MAAM,CAC9DC,8BACF;AAmBe,MAAMC,mBAAmB,SAASC,SAAS,CAA+B;EACvF,IAAIC,cAAcA,GAAY;AAC5B,IAAA,OAAO,IAAI,CAACC,IAAI,CAACD,cAAc,IAAI,IAAI;AACzC,EAAA;EAEA,IAAIE,KAAKA,GAA8B;AACrC,IAAA,MAAMC,gBAA6C,GAAGR,MAAM,CAACC,MAAM,CACjEC,8BACF,CAAC;AAEDO,IAAAA,MAAM,CACJ,CAAA,iEAAA,EAAoED,gBAAgB,CAACE,IAAI,CACvF,IACF,CAAC,CAAA,YAAA,EAAe,IAAI,CAACJ,IAAI,CAACC,KAAK,EAAE,EACjC,IAAI,CAACD,IAAI,CAACC,KAAK,IAAI,IAAI,IAAIC,gBAAgB,CAACG,QAAQ,CAAC,IAAI,CAACL,IAAI,CAACC,KAAK,CACtE,CAAC;IAED,OAAO,IAAI,CAACD,IAAI,CAACC,KAAK,IAAIL,8BAA8B,CAACU,IAAI;AAC/D,EAAA;EAEA,IAAIC,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CAAC,uBAAuB,CAAC;;AAEzC;IACAA,OAAO,CAACC,IAAI,CAAC,CAAA,6BAAA,EAAgC,IAAI,CAACR,KAAK,EAAE,CAAC;IAE1D,IAAI,IAAI,CAACF,cAAc,EAAE;AACvBS,MAAAA,OAAO,CAACC,IAAI,CAAC,yCAAyC,CAAC;AACzD,IAAA;AAEA,IAAA,OAAOD,OAAO,CAACJ,IAAI,CAAC,GAAG,CAAC;AAC1B,EAAA;AACF;AAACM,oBAAA,CAAAC,QAAA,EAhCoBd,mBAAmB,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/dropdown/index.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { assert } from '@ember/debug';\n\nimport {\n // map Dropdown's `listPosition` values to PopoverPrimitive's `placement` values\n HdsDropdownPositionToPlacementValues,\n // Dropdown's `listPosition` values\n HdsDropdownPositionValues,\n} from './types.ts';\n\nimport type { ComponentLike } from '@glint/template';\nimport type {
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/hds/dropdown/index.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { assert } from '@ember/debug';\n\nimport {\n // map Dropdown's `listPosition` values to PopoverPrimitive's `placement` values\n HdsDropdownPositionToPlacementValues,\n // Dropdown's `listPosition` values\n HdsDropdownPositionValues,\n} from './types.ts';\n\nimport type { ComponentLike } from '@glint/template';\nimport type { HdsPopoverPrimitiveSignature } from '../popover-primitive/index.ts';\nimport type { HdsDropdownFooterSignature } from './footer';\nimport type { HdsDropdownHeaderSignature } from './header';\nimport type { HdsDropdownListItemCheckboxSignature } from './list-item/checkbox';\nimport type { HdsDropdownListItemCheckmarkSignature } from './list-item/checkmark';\nimport type { HdsDropdownListItemCopyItemSignature } from './list-item/copy-item';\nimport type { HdsDropdownListItemDescriptionSignature } from './list-item/description';\nimport type { HdsDropdownListItemGenericSignature } from './list-item/generic';\nimport type { HdsDropdownListItemInteractiveSignature } from './list-item/interactive';\nimport type { HdsDropdownListItemRadioSignature } from './list-item/radio';\nimport type { HdsDropdownListItemSeparatorSignature } from './list-item/separator';\nimport type { HdsDropdownListItemTitleSignature } from './list-item/title';\nimport type { HdsDropdownToggleButtonSignature } from './toggle/button';\nimport type { HdsDropdownToggleIconSignature } from './toggle/icon';\nimport type { HdsDropdownPositions } from './types';\n\nimport type { HdsAnchoredPositionOptions } from '../../../modifiers/hds-anchored-position.ts';\n\nexport const DEFAULT_POSITION = HdsDropdownPositionValues.BottomRight;\nexport const POSITIONS: HdsDropdownPositions[] = Object.values(\n HdsDropdownPositionValues\n);\n\nexport interface HdsDropdownSignature {\n Args: {\n height?: string;\n isInline?: boolean;\n isOpen?: HdsPopoverPrimitiveSignature['Args']['isOpen'];\n listPosition?: HdsDropdownPositions;\n width?: string;\n enableCollisionDetection?: HdsAnchoredPositionOptions['enableCollisionDetection'];\n preserveContentInDom?: boolean;\n matchToggleWidth?: boolean;\n onClose?: HdsPopoverPrimitiveSignature['Args']['onClose'];\n };\n Blocks: {\n default: [\n {\n Footer?: ComponentLike<HdsDropdownFooterSignature>;\n Header?: ComponentLike<HdsDropdownHeaderSignature>;\n Checkbox?: ComponentLike<HdsDropdownListItemCheckboxSignature>;\n Checkmark?: ComponentLike<HdsDropdownListItemCheckmarkSignature>;\n CopyItem?: ComponentLike<HdsDropdownListItemCopyItemSignature>;\n Description?: ComponentLike<HdsDropdownListItemDescriptionSignature>;\n Generic?: ComponentLike<HdsDropdownListItemGenericSignature>;\n Interactive?: ComponentLike<HdsDropdownListItemInteractiveSignature>;\n Radio?: ComponentLike<HdsDropdownListItemRadioSignature>;\n Separator?: ComponentLike<HdsDropdownListItemSeparatorSignature>;\n Title?: ComponentLike<HdsDropdownListItemTitleSignature>;\n ToggleButton?: ComponentLike<HdsDropdownToggleButtonSignature>;\n ToggleIcon?: ComponentLike<HdsDropdownToggleIconSignature>;\n close: (event?: Event) => void;\n },\n ];\n };\n Element: HTMLDivElement;\n}\n\nexport default class HdsDropdown extends Component<HdsDropdownSignature> {\n /**\n * @param listPosition\n * @type {string}\n * @default bottom-right\n * @description Determines the position of the \"list\"\n */\n get listPosition(): HdsDropdownPositions {\n const { listPosition = DEFAULT_POSITION } = this.args;\n\n assert(\n `@listPosition for \"Hds::Dropdown::Index\" must be one of the following: ${POSITIONS.join(\n ', '\n )}; received: ${listPosition}`,\n POSITIONS.includes(listPosition)\n );\n\n return listPosition;\n }\n\n get enableCollisionDetection(): HdsAnchoredPositionOptions['enableCollisionDetection'] {\n return this.args.enableCollisionDetection ?? false;\n }\n\n get matchToggleWidth(): HdsAnchoredPositionOptions['matchToggleWidth'] {\n return this.args.matchToggleWidth ?? false;\n }\n\n get anchoredPositionOptions(): {\n placement: HdsAnchoredPositionOptions['placement'];\n offsetOptions: HdsAnchoredPositionOptions['offsetOptions'];\n enableCollisionDetection: HdsAnchoredPositionOptions['enableCollisionDetection'];\n matchToggleWidth: HdsAnchoredPositionOptions['matchToggleWidth'];\n } {\n // custom options specific for the `RichTooltip` component\n // for details see the `hds-anchored-position` modifier\n return {\n placement: HdsDropdownPositionToPlacementValues[this.listPosition],\n offsetOptions: 4,\n enableCollisionDetection: this.enableCollisionDetection ? 'flip' : false,\n matchToggleWidth: this.matchToggleWidth,\n };\n }\n\n /**\n * Get the class names to apply to the element\n * @method classNames\n * @return {string} The \"class\" attribute to apply to the root element\n */\n get classNames(): string {\n const classes = ['hds-dropdown'];\n\n // add a class based on the @isInline argument\n if (this.args.isInline) {\n classes.push('hds-dropdown--is-inline');\n }\n\n return classes.join(' ');\n }\n\n /**\n * Get the class names to apply to the content\n * @method classNamesContent\n * @return {string} The \"class\" attribute to apply to the disclosed content\n */\n get classNamesContent(): string {\n const classes = ['hds-dropdown__content'];\n\n // add a class based on the @listPosition argument\n // TODO: we preserved these classes to avoid introducing breaking changes for consumers who rely on these classes for tests, but we aim to remove them in the next major release\n // context: https://github.com/hashicorp/design-system/pull/2309#discussion_r1706941892\n classes.push(`hds-dropdown__content--position-${this.listPosition}`);\n\n // add a class based on the @width or @matchToggleWidth arguments\n if (this.args.width || this.args.matchToggleWidth) {\n classes.push('hds-dropdown__content--fixed-width');\n }\n\n return classes.join(' ');\n }\n\n @action\n didInsertList(element: HTMLUListElement): void {\n const checkmarkItems = element.querySelectorAll(`[role=\"option\"]`);\n if (checkmarkItems.length) {\n const toggleButtonId = element\n .closest('.hds-dropdown')\n ?.querySelector('.hds-dropdown-toggle-button')\n ?.getAttribute('id');\n\n element.setAttribute('role', 'listbox');\n\n if (toggleButtonId) {\n element.setAttribute('aria-labelledby', toggleButtonId);\n }\n }\n }\n}\n"],"names":["DEFAULT_POSITION","HdsDropdownPositionValues","BottomRight","POSITIONS","Object","values","HdsDropdown","Component","listPosition","args","assert","join","includes","enableCollisionDetection","matchToggleWidth","anchoredPositionOptions","placement","HdsDropdownPositionToPlacementValues","offsetOptions","classNames","classes","isInline","push","classNamesContent","width","didInsertList","element","checkmarkItems","querySelectorAll","length","toggleButtonId","closest","querySelector","getAttribute","setAttribute","n","prototype","action","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import Component from '@glimmer/component';
|
|
2
|
-
import {
|
|
2
|
+
import { assert } from '@ember/debug';
|
|
3
3
|
import { HdsDropdownListItemInteractiveColorValues } from './types.js';
|
|
4
4
|
import { precompileTemplate } from '@ember/template-compilation';
|
|
5
5
|
import { setComponentTemplate } from '@ember/component';
|
|
6
6
|
|
|
7
|
-
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<li class={{this.classNames}}>\n {{#if @isLoading}}\n <div class=\"hds-dropdown-list-item__interactive-loading-wrapper\" ...attributes>\n <div class=\"hds-dropdown-list-item__interactive-icon hds-dropdown-list-item__interactive-icon--leading\">\n <Hds::Icon @name=\"loading\" />\n </div>\n <Hds::Text::Body @tag=\"div\" @size=\"100\" @weight=\"regular\" class=\"hds-dropdown-list-item__interactive-text\">\n {{
|
|
7
|
+
var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-License-Identifier: MPL-2.0\n}}\n<li class={{this.classNames}}>\n {{#if @isLoading}}\n <div class=\"hds-dropdown-list-item__interactive-loading-wrapper\" ...attributes>\n <div class=\"hds-dropdown-list-item__interactive-icon hds-dropdown-list-item__interactive-icon--leading\">\n <Hds::Icon @name=\"loading\" />\n </div>\n <Hds::Text::Body @tag=\"div\" @size=\"100\" @weight=\"regular\" class=\"hds-dropdown-list-item__interactive-text\">\n {{yield (hash Badge=(component \"hds/badge\" size=\"small\"))}}\n </Hds::Text::Body>\n </div>\n {{else}}\n <Hds::Interactive\n @current-when={{@current-when}}\n @models={{hds-link-to-models @model @models}}\n @query={{hds-link-to-query @query}}\n @replace={{@replace}}\n @route={{@route}}\n @isRouteExternal={{@isRouteExternal}}\n @href={{@href}}\n @isHrefExternal={{@isHrefExternal}}\n ...attributes\n >\n {{#if @icon}}\n <span class=\"hds-dropdown-list-item__interactive-icon hds-dropdown-list-item__interactive-icon--leading\">\n <Hds::Icon @name={{@icon}} />\n </span>\n {{/if}}\n <Hds::Text::Body class=\"hds-dropdown-list-item__interactive-text\" @tag=\"span\" @size=\"200\" @weight=\"medium\">\n {{yield (hash Badge=(component \"hds/badge\" size=\"small\"))}}\n </Hds::Text::Body>\n {{#if @trailingIcon}}\n <span class=\"hds-dropdown-list-item__interactive-icon hds-dropdown-list-item__interactive-icon--trailing\">\n <Hds::Icon @name={{@trailingIcon}} />\n </span>\n {{/if}}\n </Hds::Interactive>\n {{/if}}\n</li>");
|
|
8
8
|
|
|
9
9
|
/**
|
|
10
10
|
* Copyright (c) HashiCorp, Inc.
|
|
@@ -14,28 +14,6 @@ var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-
|
|
|
14
14
|
const DEFAULT_COLOR = HdsDropdownListItemInteractiveColorValues.Action;
|
|
15
15
|
const COLORS = Object.values(HdsDropdownListItemInteractiveColorValues);
|
|
16
16
|
class HdsDropdownListItemInteractive extends Component {
|
|
17
|
-
constructor(owner, args) {
|
|
18
|
-
super(owner, args);
|
|
19
|
-
if (args.text !== undefined) {
|
|
20
|
-
deprecate('The `@text` argument for "Hds::Dropdown::ListItem::Interactive" has been deprecated. Please put text in the yielded block.', false, {
|
|
21
|
-
id: 'hds.dropdown.list-item.interactive',
|
|
22
|
-
until: '5.0.0',
|
|
23
|
-
url: 'https://helios.hashicorp.design/components/dropdown?tab=version%20history#4100',
|
|
24
|
-
for: '@hashicorp/design-system-components',
|
|
25
|
-
since: {
|
|
26
|
-
available: '4.10.0',
|
|
27
|
-
enabled: '5.0.0'
|
|
28
|
-
}
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
get text() {
|
|
33
|
-
const {
|
|
34
|
-
text
|
|
35
|
-
} = this.args;
|
|
36
|
-
assert('@text for "Hds::Dropdown::ListItem::Interactive" must have a valid value', text !== undefined);
|
|
37
|
-
return text;
|
|
38
|
-
}
|
|
39
17
|
get color() {
|
|
40
18
|
const {
|
|
41
19
|
color = DEFAULT_COLOR
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interactive.js","sources":["../../../../../src/components/hds/dropdown/list-item/interactive.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert
|
|
1
|
+
{"version":3,"file":"interactive.js","sources":["../../../../../src/components/hds/dropdown/list-item/interactive.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { assert } from '@ember/debug';\n\nimport { HdsDropdownListItemInteractiveColorValues } from './types.ts';\n\nimport type { HdsIconSignature } from '../../icon';\nimport type { HdsInteractiveSignature } from '../../interactive';\nimport type { HdsDropdownListItemInteractiveColors } from './types.ts';\nimport type { ComponentLike } from '@glint/template';\nimport type { HdsBadgeSignature } from '../../badge/index.ts';\n\nexport const DEFAULT_COLOR = HdsDropdownListItemInteractiveColorValues.Action;\nexport const COLORS: HdsDropdownListItemInteractiveColors[] = Object.values(\n HdsDropdownListItemInteractiveColorValues\n);\n\nexport interface HdsDropdownListItemInteractiveSignature {\n Args: HdsInteractiveSignature['Args'] & {\n color?: HdsDropdownListItemInteractiveColors;\n icon?: HdsIconSignature['Args']['name'];\n isLoading?: boolean;\n trailingIcon?: HdsIconSignature['Args']['name'];\n };\n Blocks: {\n default?: [\n {\n Badge?: ComponentLike<HdsBadgeSignature>;\n },\n ];\n };\n Element: HTMLDivElement | HdsInteractiveSignature['Element'];\n}\n\nexport default class HdsDropdownListItemInteractive extends Component<HdsDropdownListItemInteractiveSignature> {\n get color(): HdsDropdownListItemInteractiveColors {\n const { color = DEFAULT_COLOR } = this.args;\n\n assert(\n `@color for \"Hds::Dropdown::ListItem::Interactive\" must be one of the following: ${COLORS.join(\n ', '\n )}; received: ${color}`,\n COLORS.includes(color)\n );\n\n return color;\n }\n\n get classNames(): string {\n const classes = [\n 'hds-dropdown-list-item',\n 'hds-dropdown-list-item--variant-interactive',\n ];\n\n // add a class based on the @color argument\n classes.push(`hds-dropdown-list-item--color-${this.color}`);\n\n return classes.join(' ');\n }\n}\n"],"names":["DEFAULT_COLOR","HdsDropdownListItemInteractiveColorValues","Action","COLORS","Object","values","HdsDropdownListItemInteractive","Component","color","args","assert","join","includes","classNames","classes","push","setComponentTemplate","TEMPLATE"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;;AAaO,MAAMA,aAAa,GAAGC,yCAAyC,CAACC;AAChE,MAAMC,MAA8C,GAAGC,MAAM,CAACC,MAAM,CACzEJ,yCACF;AAmBe,MAAMK,8BAA8B,SAASC,SAAS,CAA0C;EAC7G,IAAIC,KAAKA,GAAyC;IAChD,MAAM;AAAEA,MAAAA,KAAK,GAAGR;KAAe,GAAG,IAAI,CAACS,IAAI;AAE3CC,IAAAA,MAAM,CACJ,CAAA,gFAAA,EAAmFP,MAAM,CAACQ,IAAI,CAC5F,IACF,CAAC,CAAA,YAAA,EAAeH,KAAK,CAAA,CAAE,EACvBL,MAAM,CAACS,QAAQ,CAACJ,KAAK,CACvB,CAAC;AAED,IAAA,OAAOA,KAAK;AACd,EAAA;EAEA,IAAIK,UAAUA,GAAW;AACvB,IAAA,MAAMC,OAAO,GAAG,CACd,wBAAwB,EACxB,6CAA6C,CAC9C;;AAED;IACAA,OAAO,CAACC,IAAI,CAAC,CAAA,8BAAA,EAAiC,IAAI,CAACP,KAAK,EAAE,CAAC;AAE3D,IAAA,OAAOM,OAAO,CAACH,IAAI,CAAC,GAAG,CAAC;AAC1B,EAAA;AACF;AAACK,oBAAA,CAAAC,QAAA,EAzBoBX,8BAA8B,CAAA;;;;"}
|
|
@@ -2,7 +2,7 @@ import Component from '@glimmer/component';
|
|
|
2
2
|
import { action } from '@ember/object';
|
|
3
3
|
import { assert } from '@ember/debug';
|
|
4
4
|
import { tracked } from '@glimmer/tracking';
|
|
5
|
-
import { HdsDropdownToggleIconSizeValues
|
|
5
|
+
import { HdsDropdownToggleIconSizeValues } from './types.js';
|
|
6
6
|
import { precompileTemplate } from '@ember/template-compilation';
|
|
7
7
|
import { g, i, n } from 'decorator-transforms/runtime';
|
|
8
8
|
import { setComponentTemplate } from '@ember/component';
|
|
@@ -16,7 +16,6 @@ var TEMPLATE = precompileTemplate("{{!\n Copyright (c) HashiCorp, Inc.\n SPDX-
|
|
|
16
16
|
|
|
17
17
|
const DEFAULT_SIZE = HdsDropdownToggleIconSizeValues.Medium;
|
|
18
18
|
const SIZES = Object.values(HdsDropdownToggleIconSizeValues);
|
|
19
|
-
const ALLOWED_ICON_LIST = Object.values(HdsDropdownToggleIconAllowedIconValues);
|
|
20
19
|
class HdsDropdownToggleIcon extends Component {
|
|
21
20
|
static {
|
|
22
21
|
g(this.prototype, "_hasImage", [tracked], function () {
|
|
@@ -87,16 +86,13 @@ class HdsDropdownToggleIcon extends Component {
|
|
|
87
86
|
}
|
|
88
87
|
|
|
89
88
|
/**
|
|
90
|
-
* Indicates if a dropdown chevron icon should be displayed; should be displayed unless the "more-horizontal"
|
|
89
|
+
* Indicates if a dropdown chevron icon should be displayed; should be displayed unless the "more-horizontal" icon is used.
|
|
91
90
|
*
|
|
92
91
|
* @param hasChevron
|
|
93
92
|
* @type {boolean}
|
|
94
93
|
* @default true
|
|
95
94
|
*/
|
|
96
95
|
get hasChevron() {
|
|
97
|
-
if (this.args.icon && !ALLOWED_ICON_LIST.includes(this.args.icon) && this.args.hasChevron === false) {
|
|
98
|
-
assert(`@hasChevron for "Hds::Dropdown::Toggle::Icon" must be true unless the icon is one of the following: ${ALLOWED_ICON_LIST.join(', ')}; received: ${this.args.icon}`);
|
|
99
|
-
}
|
|
100
96
|
return this.args.hasChevron ?? true;
|
|
101
97
|
}
|
|
102
98
|
|
|
@@ -125,5 +121,5 @@ class HdsDropdownToggleIcon extends Component {
|
|
|
125
121
|
}
|
|
126
122
|
setComponentTemplate(TEMPLATE, HdsDropdownToggleIcon);
|
|
127
123
|
|
|
128
|
-
export {
|
|
124
|
+
export { DEFAULT_SIZE, SIZES, HdsDropdownToggleIcon as default };
|
|
129
125
|
//# sourceMappingURL=icon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.js","sources":["../../../../../src/components/hds/dropdown/toggle/icon.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { assert } from '@ember/debug';\nimport { tracked } from '@glimmer/tracking';\nimport {
|
|
1
|
+
{"version":3,"file":"icon.js","sources":["../../../../../src/components/hds/dropdown/toggle/icon.ts"],"sourcesContent":["/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { action } from '@ember/object';\nimport { assert } from '@ember/debug';\nimport { tracked } from '@glimmer/tracking';\nimport { HdsDropdownToggleIconSizeValues } from './types.ts';\n\nimport type { HdsIconSignature } from '../../icon';\nimport type { HdsDropdownToggleIconSizes } from './types';\nimport type { ModifierLike } from '@glint/template';\nimport type { SetupPrimitiveToggleModifier } from '../../popover-primitive/index.ts';\nimport type Owner from '@ember/owner';\n\nexport const DEFAULT_SIZE = HdsDropdownToggleIconSizeValues.Medium;\nexport const SIZES: HdsDropdownToggleIconSizes[] = Object.values(\n HdsDropdownToggleIconSizeValues\n);\n\nexport interface HdsDropdownToggleIconSignature {\n Args: {\n hasChevron?: boolean;\n icon?: HdsIconSignature['Args']['name'];\n imageSrc?: string;\n isOpen?: boolean;\n size?: HdsDropdownToggleIconSizes;\n text: string;\n setupPrimitiveToggle?: ModifierLike<SetupPrimitiveToggleModifier>;\n };\n Element: HTMLButtonElement;\n}\n\nexport default class HdsDropdownToggleIcon extends Component<HdsDropdownToggleIconSignature> {\n @tracked private _hasImage = true;\n\n constructor(owner: Owner, args: HdsDropdownToggleIconSignature['Args']) {\n super(owner, args);\n if (!(this.args.icon || this.args.imageSrc)) {\n assert(\n '@icon or @imageSrc must be defined for \"Hds::Dropdown::Toggle::Icon\"'\n );\n }\n }\n\n @action\n onDidUpdateImageSrc(): void {\n this._hasImage = true;\n }\n\n @action\n onImageLoadError(): void {\n this._hasImage = false;\n }\n\n /**\n * @param text\n * @type {string}\n * @description The text of the `aria-label` applied to the toggle\n */\n get text(): string {\n const { text } = this.args;\n\n assert(\n '@text for \"Hds::Dropdown::Toggle::Icon\" must have a valid value',\n text !== undefined\n );\n\n return text;\n }\n\n /**\n * @param size\n * @type {string}\n * @default medium\n * @description The size of the button; acceptable values are `small` and `medium`\n */\n get size(): HdsDropdownToggleIconSizes {\n const { size = DEFAULT_SIZE } = this.args;\n\n assert(\n `@size for \"Hds::Dropdown::Toggle::Icon\" must be one of the following: ${SIZES.join(\n ', '\n )}; received: ${size}`,\n SIZES.includes(size)\n );\n\n return size;\n }\n\n /**\n * @param iconSize\n * @type {string}\n * @default 24\n * @description ensures that the correct icon size is used\n */\n get iconSize(): HdsIconSignature['Args']['size'] {\n if (this.args.size === 'medium' && !this.hasChevron) {\n // in this special case we use a larger SVG\n return '24';\n } else {\n // this is the default size (notice: for the \"small\" variant with chevron, we set the actual size to `12px` via CSS)\n return '16';\n }\n }\n\n /**\n * Indicates if a dropdown chevron icon should be displayed; should be displayed unless the \"more-horizontal\" icon is used.\n *\n * @param hasChevron\n * @type {boolean}\n * @default true\n */\n get hasChevron(): boolean {\n return this.args.hasChevron ?? true;\n }\n\n /**\n * Get the class names to apply to the component.\n * @method ToggleIcon#classNames\n * @return {string} The \"class\" attribute to apply to the component.\n */\n get classNames(): string {\n const classes = ['hds-dropdown-toggle-icon'];\n\n // add a class based on the @size argument\n classes.push(`hds-dropdown-toggle-icon--size-${this.size}`);\n\n // add a class based on the @isOpen argument\n if (this.args.isOpen) {\n classes.push('hds-dropdown-toggle-icon--is-open');\n }\n\n // add a class based on the @hasChevron argument\n if (this.hasChevron) {\n classes.push('hds-dropdown-toggle-icon--has-chevron');\n }\n\n return classes.join(' ');\n }\n}\n"],"names":["DEFAULT_SIZE","HdsDropdownToggleIconSizeValues","Medium","SIZES","Object","values","HdsDropdownToggleIcon","Component","g","prototype","tracked","i","void 0","constructor","owner","args","icon","imageSrc","assert","onDidUpdateImageSrc","_hasImage","n","action","onImageLoadError","text","undefined","size","join","includes","iconSize","hasChevron","classNames","classes","push","isOpen","setComponentTemplate","TEMPLATE"],"mappings":"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"}
|
|
@@ -18,11 +18,6 @@ let HdsDropdownToggleButtonColorValues = /*#__PURE__*/function (HdsDropdownToggl
|
|
|
18
18
|
HdsDropdownToggleButtonColorValues["Secondary"] = "secondary";
|
|
19
19
|
return HdsDropdownToggleButtonColorValues;
|
|
20
20
|
}({});
|
|
21
|
-
let HdsDropdownToggleIconAllowedIconValues = /*#__PURE__*/function (HdsDropdownToggleIconAllowedIconValues) {
|
|
22
|
-
HdsDropdownToggleIconAllowedIconValues["MoreHorizontal"] = "more-horizontal";
|
|
23
|
-
HdsDropdownToggleIconAllowedIconValues["MoreVertical"] = "more-vertical";
|
|
24
|
-
return HdsDropdownToggleIconAllowedIconValues;
|
|
25
|
-
}({});
|
|
26
21
|
|
|
27
|
-
export { HdsDropdownToggleButtonColorValues, HdsDropdownToggleButtonSizeValues,
|
|
22
|
+
export { HdsDropdownToggleButtonColorValues, HdsDropdownToggleButtonSizeValues, HdsDropdownToggleIconSizeValues };
|
|
28
23
|
//# sourceMappingURL=types.js.map
|