@pgcorp/ui-kit 0.2.0 → 0.3.1

package/src/components/shared/database/dataGrid.ts

@@ -1,5 +1,4 @@
 import type {
-  ScrollableViewportMaxBlockSize,
   TableColumnInlineSize,
   TableColumnMinInlineSize,
 } from '../../../internal/semanticSizing'
@@ -43,19 +42,4 @@ export type SDataGridCommitInput =
   | { source: 'draft' }
   | { source: 'value'; value: unknown }
 
-export interface SDataGridProps<Key extends SDataGridColumnKey = SDataGridColumnKey> {
-  columns: readonly SDataGridColumn<Key>[]
-  rows: readonly SDataGridRow<Key>[]
-  title?: string
-  loading?: boolean
-  disabled?: boolean
-  readOnly?: boolean
-  errorMessage?: string
-  emptyMessage?: string
-  selectedRowId?: string
-  maxHeight?: ScrollableViewportMaxBlockSize
-  /** Accessible name без visible title. / Accessible name when there is no visible title. */
-  ariaLabel?: string
-  /** DOM id external visible title. / DOM id of an external visible title. */
-  ariaLabelledby?: string
-}
+export type { SDataGridProps } from './SDataGrid.vue'

package/src/components/shared/navigation/SBottomNav.vue

@@ -270,6 +270,9 @@ const resolveOverflowTrigger = (item: BottomNavOverflowItem): HTMLButtonElement
     throw new Error(`SBottomNav: overflow trigger '${item.id}' is unavailable`);
   }
   const trigger = api.getElement();
+  if (!(trigger instanceof HTMLButtonElement)) {
+    throw new TypeError(`SBottomNav: overflow trigger '${item.id}' must be an action button`);
+  }
   const expectedId = overflowTriggerId(item);
   if (trigger.id !== expectedId) {
     throw new Error(

package/src/components/shared/navigation/STabs.vue

@@ -58,6 +58,7 @@ import {
   type VNodeChild,
 } from 'vue'
 import { useOwnedAttrs } from '../../../internal/ownedAttrs'
+import { lastItem } from '../../../internal/es2020'
 import {
   tabsContextKey,
   type STabListRegistrationKey,
@@ -425,7 +426,7 @@ function handleTabKeydown(key: STabRegistrationKey, event: KeyboardEvent): void
   }
   let next: TabRecord | undefined
   if (event.key === 'Home') next = enabled[0]
-  else if (event.key === 'End') next = enabled.at(-1)
+  else if (event.key === 'End') next = lastItem(enabled)
   else if (event.key === 'ArrowLeft') next = enabled[(currentIndex - 1 + enabled.length) % enabled.length]
   else if (event.key === 'ArrowRight') next = enabled[(currentIndex + 1) % enabled.length]
   if (!next) return

package/src/composables/uiPreferencesReset.ts

@@ -45,8 +45,9 @@ export function createUiPreferencesResetController(): UiPreferencesResetControll
         throw errors[0];
       }
       if (errors.length > 1) {
-        throw new AggregateError(errors, 'Не все owners UI-предпочтений смогли обработать сброс.');
+        throw createAggregateError(errors, 'Не все owners UI-предпочтений смогли обработать сброс.');
       }
     },
   };
 }
+import { createAggregateError } from '../internal/es2020';

package/src/composables/useClipboard.ts

@@ -28,10 +28,11 @@ export function useClipboard(): ClipboardService {
       const isDomException = typeof DOMException !== 'undefined' && cause instanceof DOMException
       const error = cause instanceof Error || isDomException
         ? cause
-        : new Error('Clipboard API rejected writeText without an Error object', { cause })
+        : withErrorCause(new Error('Clipboard API rejected writeText without an Error object'), cause)
       return { status: 'failed', error }
     }
   }
 
   return { copyText }
 }
+import { withErrorCause } from '../internal/es2020'

package/src/composables/useSidebarPanelState.ts

@@ -1,4 +1,5 @@
 import { computed, getCurrentScope, onScopeDispose, reactive, readonly, watch } from 'vue';
+import { hasOwn, lastItem } from '../internal/es2020';
 
 import {
   assertSidebarSectionsState,
@@ -284,7 +285,7 @@ function preferredFlexibleSectionKey(
     return config?.defaultIsOpen === true && config.defaultSize === null;
   });
   if (defaultFlexibleKey && state[defaultFlexibleKey]?.isOpen) return defaultFlexibleKey;
-  return openKeys.at(-1) ?? null;
+  return lastItem(openKeys) ?? null;
 }
 
 /**
@@ -327,7 +328,7 @@ function decodePersistedDocument(
   if (!isPlainRecord(value)) {
     throw new SidebarPanelStateContractError('$', 'expected an object');
   }
-  if (Object.hasOwn(value, 'version') || Object.hasOwn(value, 'sections')) {
+  if (hasOwn(value, 'version') || hasOwn(value, 'sections')) {
     assertExactKeys(value, ['sections', 'version'], '$');
     if (value.version !== SIDEBAR_PANEL_STATE_SCHEMA_VERSION) {
       throw new SidebarPanelStateContractError(

package/src/internal/es2020.ts

@@ -0,0 +1,50 @@
+/** Проверяет собственное свойство без зависимости от ES2022 Object.hasOwn. / Checks an own property without the ES2022 Object.hasOwn API. */
+export function hasOwn(object: object, key: PropertyKey): boolean {
+  return Object.prototype.hasOwnProperty.call(object, key)
+}
+
+/** Возвращает последний элемент без зависимости от ES2022 Array.at. / Returns the last item without the ES2022 Array.at API. */
+export function lastItem<T>(items: readonly T[]): T | undefined {
+  return items.length > 0 ? items[items.length - 1] : undefined
+}
+
+/** Ошибка с ES2022-compatible cause, доступная в ES2020 runtime. / An ES2022-compatible error cause for ES2020 runtimes. */
+export type ErrorWithCause<T extends Error = Error> = T & { cause: unknown }
+
+/** Добавляет стандартный non-enumerable cause без требования ES2022 lib. / Adds the standard non-enumerable cause without requiring the ES2022 lib. */
+export function withErrorCause<T extends Error>(error: T, cause: unknown): ErrorWithCause<T> {
+  Object.defineProperty(error, 'cause', {
+    configurable: true,
+    value: cause,
+    writable: true,
+  })
+  return error as ErrorWithCause<T>
+}
+
+interface AggregateErrorLike extends Error {
+  readonly errors: readonly unknown[]
+}
+
+interface AggregateErrorConstructorLike {
+  new (errors: Iterable<unknown>, message?: string): AggregateErrorLike
+}
+
+class Es2020AggregateError extends Error implements AggregateErrorLike {
+  readonly errors: readonly unknown[]
+
+  constructor(errors: readonly unknown[], message: string) {
+    super(message)
+    this.name = 'AggregateError'
+    this.errors = [...errors]
+  }
+}
+
+/** Создаёт native AggregateError при наличии и точный ES2020 fallback иначе. / Creates a native AggregateError when available and an exact ES2020 fallback otherwise. */
+export function createAggregateError(errors: readonly unknown[], message: string): AggregateErrorLike {
+  const candidate: unknown = (globalThis as { AggregateError?: unknown }).AggregateError
+  if (typeof candidate === 'function') {
+    const AggregateErrorConstructor = candidate as AggregateErrorConstructorLike
+    return new AggregateErrorConstructor(errors, message)
+  }
+  return new Es2020AggregateError(errors, message)
+}

package/src/internal/inlineTokenEditorContract.ts

@@ -1,4 +1,5 @@
 import { validateBoundedInteger, validateNonEmptyString } from './runtimeContract'
+import { hasOwn, lastItem } from './es2020'
 
 export type InlineTokenEditorSegmentContract =
   | { readonly kind: 'text'; readonly text: string }
@@ -44,7 +45,7 @@ export function parseInlineTokenEditorSource(
   const parsed: InlineTokenEditorSegmentContract[] = []
   const tokenOccurrences = new Map<string, number>()
   for (let index = 0; index < segments.length; index += 1) {
-    if (!Object.hasOwn(segments, index)) {
+    if (!hasOwn(segments, index)) {
       throw new TypeError(`SInlineTokenEditor: segments[${index}] отсутствует в sparse array. / SInlineTokenEditor: segments[${index}] is missing from a sparse array.`)
     }
     const record = assertPlainRecord(`SInlineTokenEditor.segments[${index}]`, segments[index])
@@ -54,7 +55,7 @@ export function parseInlineTokenEditorSource(
         throw new TypeError(`SInlineTokenEditor: segments[${index}].text должен быть непустой строкой. / SInlineTokenEditor: segments[${index}].text must be a non-empty string.`)
       }
       const text = record.text
-      if (parsed.at(-1)?.kind === 'text') {
+      if (lastItem(parsed)?.kind === 'text') {
         throw new TypeError(`SInlineTokenEditor: segments[${index}] является смежным text segment; объедините его в источнике. / SInlineTokenEditor: segments[${index}] is an adjacent text segment; merge it at the source.`)
       }
       parsed.push({ kind: 'text', text })
@@ -122,7 +123,7 @@ export function composeInlineTokenSegments(
   for (const segment of segments) {
     if (segment.kind === 'text') {
       if (segment.text.length === 0) continue
-      const previous = result.at(-1)
+      const previous = lastItem(result)
       if (previous?.kind === 'text') {
         result[result.length - 1] = { kind: 'text', text: previous.text + segment.text }
       } else {

package/src/internal/ownedAttrs.ts

@@ -126,6 +126,13 @@ export const ownedAttributeSchemas = Object.freeze({
     onPointerdown: 'listener',
     tabindex: 'string-or-number',
   }),
+  SSwitch: defineOwnedAttributeSchema({
+    'aria-label': 'string',
+    'aria-describedby': 'string',
+    onClick: 'listener',
+    onPointerdown: 'listener',
+    tabindex: 'string-or-number',
+  }),
   SCheckboxGroup: defineOwnedAttributeSchema({
     'aria-describedby': 'string',
     'data-testid': 'data',
@@ -137,6 +144,10 @@ export const ownedAttributeSchemas = Object.freeze({
   SColorSelect: defineOwnedAttributeSchema({
     'aria-label': 'string',
   }),
+  SCombobox: defineOwnedAttributeSchema({
+    'aria-describedby': 'string',
+    'aria-label': 'string',
+  }),
   SDragHandle: defineOwnedAttributeSchema({
     'data-testid': 'data',
   }),
@@ -158,7 +169,12 @@ export const ownedAttributeSchemas = Object.freeze({
     title: 'string',
   }),
   SInputText: defineOwnedAttributeSchema({
+    'aria-activedescendant': 'string',
+    'aria-autocomplete': 'string',
+    'aria-controls': 'string',
     'aria-describedby': 'string',
+    'aria-expanded': 'aria-boolean',
+    'aria-haspopup': 'aria-haspopup',
     'aria-invalid': 'aria-boolean',
     'aria-label': 'string',
     'data-testid': 'data',
@@ -168,10 +184,12 @@ export const ownedAttributeSchemas = Object.freeze({
     max: 'string-or-number',
     min: 'string-or-number',
     onBlur: 'listener',
+    onClick: 'listener',
     onFocus: 'listener',
     onKeydown: 'listener',
     onKeyup: 'listener',
     pattern: 'string',
+    role: 'string',
     step: 'string-or-number',
     title: 'string',
   }),
@@ -237,6 +255,10 @@ export const ownedAttributeSchemas = Object.freeze({
     'data-testid': 'data',
     title: 'string',
   }),
+  SChip: defineOwnedAttributeSchema({
+    'aria-label': 'string',
+    title: 'string',
+  }),
   SCodeBlock: defineOwnedAttributeSchema({
     'aria-label': 'string',
     'data-testid': 'data',
@@ -338,7 +360,7 @@ type OwnedAttributeValue<Name extends string, Kind extends OwnedAttributeValueKi
 
 export type OwnedAttributeBindings<Component extends OwnedAttributeComponent> = Readonly<Partial<{
   [Name in OwnedAttributeName<Component>]: OwnedAttributeValue<Name, OwnedAttributeKind<Component, Name>>
-}>>
+}> & Partial<Record<`data-${string}`, string | number | boolean>>>
 
 export interface OwnedAttrsOptions<Component extends OwnedAttributeComponent> {
   /** Имя public-компонента для диагностики контракта. / Public component name used in contract diagnostics. */
@@ -420,7 +442,7 @@ export function useOwnedAttrs<Component extends OwnedAttributeComponent>(
           `raw "${name}" запрещён; атрибут "${name}" не объявлен в exact owned-attrs schema; используйте типизированные props/tokens UI-kit или consumer layout wrapper. Raw "${name}" is forbidden and is not declared by the exact owned-attrs schema; use typed UI-kit props/tokens or a consumer layout wrapper`,
         )
       }
-      const kind = schema[name]
+      const kind = schema[name] ?? (name.startsWith('data-') && name.length > 5 ? 'data' : undefined)
       if (!kind) {
         throw attributeBoundaryError(
           options.component,

package/src/internal/pointerInteractionLease.ts

@@ -19,7 +19,7 @@ let preservedCursor = ''
 let preservedUserSelect = ''
 
 const applyActiveInteraction = (): void => {
-  const interaction = activeInteractions.at(-1)
+  const interaction = lastItem(activeInteractions)
   if (!lockedBody || !interaction) return
   lockedBody.style.cursor = interaction.cursor
   lockedBody.style.userSelect = 'none'
@@ -79,3 +79,4 @@ export function acquirePointerInteractionLease(
     },
   }
 }
+import { lastItem } from './es2020'