@nectary/components 2.12.1 → 2.12.3

package/lib/esm/utils/csv.d.ts

@@ -0,0 +1,5 @@
+export declare const CSV_DELIMITER = ",";
+export declare const packCsv: (values: string[]) => string;
+export declare const unpackCsv: (csv: string) => string[];
+export declare const updateCsv: (csv: string, value: string, setActive: boolean) => string;
+export declare const getFirstCsvValue: (acc: string) => string | null;

package/lib/esm/utils/debounce.d.ts

@@ -0,0 +1,8 @@
+export declare const debounceTimeout: (ms: number) => (cb: () => void) => {
+    fn: () => void;
+    cancel: () => void;
+};
+export declare const debounceAnimationFrame: (cb: () => void) => {
+    fn: () => void;
+    cancel: () => void;
+};

package/lib/esm/utils/dom.d.ts

@@ -0,0 +1,34 @@
+export declare const updateExplicitBooleanAttribute: ($element: Element, attrName: string, attrValue: boolean | null | undefined) => void;
+export declare const isAttrTrue: (attrValue: string | null) => boolean;
+export declare const getBooleanAttribute: ($element: Element, attrName: string) => boolean;
+export declare const updateBooleanAttribute: ($element: Element, attrName: string, attrValue: boolean | null | undefined) => void;
+export declare const updateAttribute: ($element: Element, attrName: string, attrValue: string | number | boolean | null | undefined) => void;
+export declare function getAttribute($element: Element, attrName: string): string | null;
+export declare function getAttribute($element: Element, attrName: string, defaultValue: string): string;
+export declare const isLiteralValue: <T extends readonly string[]>(literals: T, value: string | null | undefined) => value is T[number];
+export declare const updateLiteralAttribute: <T extends readonly string[]>($element: Element, literals: T, attrName: string, attrValue: string | null | undefined) => void;
+export declare function getLiteralAttribute<T extends readonly string[]>($element: Element, literals: T, attrName: string): T[number];
+export declare function getLiteralAttribute<T extends readonly string[]>($element: Element, literals: T, attrName: string, defaultValue: null): T[number] | null;
+export declare function getLiteralAttribute<T extends readonly string[]>($element: Element, literals: T, attrName: string, defaultValue: T[number]): T[number];
+export declare const clampNumber: (value: number, min: number, max: number) => number;
+type IntegerOptions = {
+    min?: number;
+    max?: number;
+    defaultValue?: number | null;
+    itemSizeMultiplier?: number;
+    itemSpaceBetween?: number;
+};
+export declare const attrValueToInteger: (value: string | null, options?: IntegerOptions) => number | null;
+export declare const attrValueToPixels: (value: string | null, options?: IntegerOptions) => string;
+export declare const updateIntegerAttribute: ($element: Element, attrName: string, attrValue: string | number | null | undefined, options?: IntegerOptions) => void;
+export declare function getIntegerAttribute($element: Element, attrName: string): number | undefined;
+export declare function getIntegerAttribute($element: Element, attrName: string, defaultValue: null): number | null;
+export declare function getIntegerAttribute($element: Element, attrName: string, defaultValue: number): number;
+export declare const setClass: (elem: Element, name: string, isSet: boolean) => void;
+export declare const hasClass: (elem: Element, name: string) => boolean;
+export declare const getCssVar: (element: Element, variableName: string) => string | null;
+export declare const getCssVars: (element: Element, variableNames: string[]) => (string | null)[];
+export declare const cloneNode: (el: Element, deep: boolean) => Element;
+export declare const shouldReduceMotion: () => boolean;
+export declare const isAttrEqual: (oldVal: string | null, newVal: string | null) => boolean;
+export {};

package/lib/esm/utils/element.d.ts

@@ -0,0 +1,16 @@
+export declare const defineCustomElement: (name: string, constructor: CustomElementConstructor) => void;
+export declare const setNectaryRegistry: (registry: CustomElementRegistry) => void;
+declare global {
+    interface ShadowRootInit {
+        customElements?: CustomElementRegistry;
+    }
+}
+export declare class NectaryElement extends HTMLElement {
+    #private;
+    attachShadow(options?: Partial<ShadowRootInit>): ShadowRoot;
+    version: string;
+    get focusable(): boolean;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    get isDomConnected(): boolean;
+}

package/lib/esm/utils/element.js

@@ -0,0 +1,48 @@
+import pkg from '../../package.json';
+const nectaryDefinitions = new Map();
+let nectaryRegistry = null;
+export const defineCustomElement = (name, constructor) => {
+  if (nectaryRegistry !== null) {
+    if (nectaryRegistry.get(name) == null) {
+      nectaryRegistry.define(name, constructor);
+    }
+    return;
+  }
+  nectaryDefinitions.set(name, constructor);
+};
+export const setNectaryRegistry = registry => {
+  if (nectaryRegistry !== null) {
+    throw new Error('Nectary registry already set');
+  }
+  nectaryRegistry = registry;
+  for (const [name, ctor] of nectaryDefinitions.entries()) {
+    if (nectaryRegistry.get(name) == null) {
+      nectaryRegistry.define(name, ctor);
+    }
+  }
+  nectaryDefinitions.clear();
+};
+export class NectaryElement extends HTMLElement {
+  attachShadow(options) {
+    return super.attachShadow({
+      mode: 'open',
+      delegatesFocus: false,
+      customElements: nectaryRegistry,
+      ...options
+    });
+  }
+  version = pkg.version;
+  get focusable() {
+    return false;
+  }
+  #isDomConnected = false;
+  connectedCallback() {
+    this.#isDomConnected = true;
+  }
+  disconnectedCallback() {
+    this.#isDomConnected = false;
+  }
+  get isDomConnected() {
+    return this.#isDomConnected;
+  }
+}

package/lib/esm/utils/event-target.d.ts

@@ -0,0 +1,4 @@
+export declare const isTargetEqual: (e: Event, $elem: HTMLElement) => boolean;
+export declare const getTargetByAttribute: (e: Event, attr: string) => HTMLElement | null;
+export declare const getTargetAttribute: (e: Event, attr: string) => string | null;
+export declare const getTargetIndexInParent: (e: Event, parent: Element) => number;

package/lib/esm/utils/get-react-event-handler.d.ts

@@ -0,0 +1 @@
+export declare const getReactEventHandler: ($element: HTMLElement, handlerName: string) => ((arg?: any) => void) | null;

package/lib/esm/utils/index.d.ts

@@ -0,0 +1,12 @@
+export * from './context';
+export * from './csv';
+export * from './dom';
+export * from './element';
+export * from './rect';
+export * from './slot';
+export * from './throttle';
+export * from './debounce';
+export * from './get-react-event-handler';
+export * from './markdown';
+export * from './event-target';
+export * from './uid';

package/lib/esm/utils/markdown.d.ts

@@ -0,0 +1,19 @@
+export type TMarkdownInlineParams = {
+    isBold?: boolean;
+    isItalic?: boolean;
+    isStrikethrough?: boolean;
+};
+export type TMarkdownParseVisitor = {
+    link(text: string, href: string, attributes?: string[]): void;
+    emoji(emojiChar: string): void;
+    codetag(text: string): void;
+    inline(text: string, params: TMarkdownInlineParams): void;
+    linebreak(): void;
+    paragraph(): void;
+    list(isOrdered: boolean): void;
+    endList(): void;
+    listItem(): void;
+    end(): Node;
+};
+export declare const isEmojiString: (data: string) => boolean;
+export declare const parseMarkdown: (md: string, visitor: TMarkdownParseVisitor) => Node;

package/lib/esm/utils/rect.d.ts

@@ -0,0 +1,4 @@
+import type { TRect } from '../types';
+export declare const getRect: (el: Element) => TRect;
+export declare const rectOverlap: (targetRect: TRect, contentRect: TRect) => boolean;
+export declare const getTargetRect: (slot: HTMLSlotElement) => TRect | null;

package/lib/esm/utils/size.d.ts

@@ -0,0 +1,5 @@
+export type TSinchSize = 'l' | 'm' | 's';
+export type TSinchSizeEx = TSinchSize | 'xs';
+export declare const DEFAULT_SIZE: TSinchSize;
+export declare const sizeValues: readonly TSinchSize[];
+export declare const sizeExValues: readonly TSinchSizeEx[];

package/lib/esm/utils/slot.d.ts

@@ -0,0 +1,4 @@
+import type { NectaryElement } from './element';
+export declare const getFirstSlotElement: (root: HTMLSlotElement, isDeep?: boolean) => HTMLElement | null;
+export declare const getFirstFocusableElement: (root: Element) => NectaryElement | null;
+export declare const isElementFocused: ($el: Element | null) => boolean;

package/lib/esm/utils/throttle.d.ts

@@ -0,0 +1,4 @@
+export declare const throttleAnimationFrame: (cb: () => void) => {
+    fn: () => void;
+    cancel: () => void;
+};

package/lib/esm/utils/uid.d.ts

@@ -0,0 +1 @@
+export declare const getUid: () => string;

package/lib/esm/vertical-stepper/index.d.ts

@@ -0,0 +1,11 @@
+import type { TSinchVerticalStepperElement, TSinchVerticalStepperReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-vertical-stepper': TSinchVerticalStepperReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-vertical-stepper': TSinchVerticalStepperElement;
+    }
+}

package/lib/esm/vertical-stepper/types.d.ts

@@ -0,0 +1,13 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchVerticalStepperElement = HTMLElement & {
+    /** Current item index, starting from 1 */
+    index: string;
+    /** Current item index, starting from 1 */
+    setAttribute(name: 'index', value: string): void;
+};
+export type TSinchVerticalStepperReact = TSinchElementReact<TSinchVerticalStepperElement> & {
+    /** Current item index, starting from 1 */
+    index: string;
+    /** Label that is used for a11y */
+    'aria-label': string;
+};

package/lib/esm/vertical-stepper/types.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/vertical-stepper-item/index.d.ts

@@ -0,0 +1,14 @@
+import '../icon';
+import '../title';
+import '../text';
+import type { TSinchVerticalStepperItemElement, TSinchVerticalStepperItemReact } from './types';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-vertical-stepper-item': TSinchVerticalStepperItemReact;
+        }
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-vertical-stepper-item': TSinchVerticalStepperItemElement;
+    }
+}

package/lib/esm/vertical-stepper-item/types.d.ts

@@ -0,0 +1,24 @@
+import type { TSinchElementReact } from '../types';
+export type TSinchVerticalStepperStatusType = 'error' | 'skip';
+export type TSinchVerticalStepperItemElement = HTMLElement & {
+    /** Label */
+    label: string;
+    /** Description */
+    description: string | null;
+    /** Status */
+    status: TSinchVerticalStepperStatusType | null;
+    /** Label */
+    setAttribute(name: 'label', value: string): void;
+    /** Description */
+    setAttribute(name: 'description', value: string): void;
+    /** Status */
+    setAttribute(name: 'status', value: TSinchVerticalStepperStatusType): void;
+};
+export type TSinchVerticalStepperItemReact = TSinchElementReact<TSinchVerticalStepperItemElement> & {
+    /** Label */
+    label: string;
+    /** Description */
+    description?: string;
+    /** Status */
+    status?: TSinchVerticalStepperStatusType;
+};

package/lib/esm/vertical-stepper-item/utils.d.ts

@@ -0,0 +1,2 @@
+import type { TSinchVerticalStepperStatusType } from './types';
+export declare const statusValues: TSinchVerticalStepperStatusType[];

package/lib/package.json

@@ -0,0 +1 @@
+{ "version": "2.8.8" }

package/package.json

@@ -1,22 +1,42 @@
 {
   "name": "@nectary/components",
-  "version": "2.12.1",
+  "version": "2.12.3",
   "files": [
-    "**/*/*.css",
-    "**/*/*.json",
-    "**/*/*.js",
-    "**/*/*.d.ts",
-    "standalone.ts",
-    "standalone.d.ts",
-    "standalone.js",
-    "types.d.ts",
-    "colors.json"
+    "lib"
   ],
+  "exports": {
+    "./package.json": "./package.json",
+    "./changelog.md": "./changelog.md",
+    "./*/types": "./lib/esm/*/types.d.ts",
+    "./*.json": "./lib/esm/*.json",
+    "./utils/*.json": "./lib/esm/utils/*.json",
+    "./*/utils": {
+      "types": "./lib/esm/*/utils.d.ts",
+      "require": "./lib/cjs/*/utils.js",
+      "default": "./lib/esm/*/utils.js"
+    },
+    "./utils/*": {
+      "types": "./lib/esm/utils/*.d.ts",
+      "require": "./lib/cjs/utils/*.js",
+      "default": "./lib/esm/utils/*.js"
+    },
+    "./utils": {
+      "types": "./lib/esm/utils/index.d.ts",
+      "require": "./lib/cjs/utils/index.js",
+      "default": "./lib/esm/utils/index.js"
+    },
+    "./*": {
+      "types": "./lib/esm/*/index.d.ts",
+      "require": "./lib/cjs/*/index.js",
+      "default": "./lib/esm/*/index.js"
+    }
+  },
   "publishConfig": {
     "access": "public"
   },
   "scripts": {
-    "build": "NODE_ENV=production babel . --extensions '.ts' --out-dir . && tsc --declaration --emitDeclarationOnly"
+    "prebuild": "rimraf lib",
+    "build": "./build-lib.sh"
   },
   "dependencies": {
     "@babel/runtime": "^7.22.15"
@@ -24,12 +44,14 @@
   "devDependencies": {
     "@babel/cli": "^7.22.15",
     "@babel/core": "^7.22.20",
+    "@babel/plugin-transform-modules-commonjs": "^7.24.1",
     "@babel/plugin-transform-runtime": "^7.22.15",
     "@babel/preset-env": "^7.22.20",
     "@babel/preset-typescript": "^7.22.15",
     "@types/node": "^18.17.17",
     "@types/react": "^18.2.21",
     "babel-plugin-html-inline-minifier": "workspace:*",
+    "rimraf": "^5.0.7",
     "typescript": "^5.2.2"
   }
 }

package/standalone.ts

@@ -1,93 +0,0 @@
-// Standalone file with all Nectary components installed into window
-// AUTOGENERATED: DO NOT EDIT
-/* eslint-disable import/first */
-import { setNectaryRegistry } from './utils'
-
-setNectaryRegistry(window.customElements)
-
-// Reminder: Keep this list updated as we add new components
-import './accordion-item/index.js'
-import './accordion/index.js'
-import './action-menu-option/index.js'
-import './action-menu/index.js'
-import './alert/index.js'
-import './avatar/index.js'
-import './badge/index.js'
-import './button/index.js'
-import './card-container/index.js'
-import './card/index.js'
-import './chat-block/index.js'
-import './chat-bubble/index.js'
-import './chat/index.js'
-import './checkbox/index.js'
-import './chip/index.js'
-import './code-tag/index.js'
-import './color-menu-option/index.js'
-import './color-menu/index.js'
-import './color-swatch/index.js'
-import './date-picker/index.js'
-import './dialog/index.js'
-import './emoji-picker/index.js'
-import './emoji/index.js'
-import './field/index.js'
-import './file-drop/index.js'
-import './file-picker/index.js'
-import './file-status/index.js'
-import './flag/index.js'
-import './grid-item/index.js'
-import './grid/index.js'
-import './help-tooltip/index.js'
-import './horizontal-stepper-item/index.js'
-import './horizontal-stepper/index.js'
-import './icon-button/index.js'
-import './icon/index.js'
-import './inline-alert/index.js'
-import './input/index.js'
-import './link/index.js'
-import './list-item/index.js'
-import './list/index.js'
-import './pagination/index.js'
-import './pop/index.js'
-import './popover/index.js'
-import './progress-stepper-item/index.js'
-import './progress-stepper/index.js'
-import './progress/index.js'
-import './radio-option/index.js'
-import './radio/index.js'
-import './rich-text/index.js'
-import './rich-textarea/index.js'
-import './segment-collapse/index.js'
-import './segment/index.js'
-import './segmented-control-option/index.js'
-import './segmented-control/index.js'
-import './segmented-icon-control-option/index.js'
-import './segmented-icon-control/index.js'
-import './select-button/index.js'
-import './select-menu-option/index.js'
-import './select-menu/index.js'
-import './skeleton-item/index.js'
-import './skeleton/index.js'
-import './spinner/index.js'
-import './stop-events/index.js'
-import './table-body/index.js'
-import './table-cell/index.js'
-import './table-head-cell/index.js'
-import './table-head/index.js'
-import './table-row/index.js'
-import './table/index.js'
-import './tabs-icon-option/index.js'
-import './tabs-option/index.js'
-import './tabs/index.js'
-import './tag/index.js'
-import './text/index.js'
-import './textarea/index.js'
-import './tile-control-option/index.js'
-import './tile-control/index.js'
-import './time-picker/index.js'
-import './title/index.js'
-import './toast-manager/index.js'
-import './toast/index.js'
-import './toggle/index.js'
-import './tooltip/index.js'
-import './vertical-stepper-item/index.js'
-import './vertical-stepper/index.js'

package/utils/element.js

@@ -1,48 +0,0 @@
-import pkg from '../package.json';
-const nectaryDefinitions = new Map();
-let nectaryRegistry = null;
-export const defineCustomElement = (name, constructor) => {
-  if (nectaryRegistry !== null) {
-    if (nectaryRegistry.get(name) == null) {
-      nectaryRegistry.define(name, constructor);
-    }
-    return;
-  }
-  nectaryDefinitions.set(name, constructor);
-};
-export const setNectaryRegistry = registry => {
-  if (nectaryRegistry !== null) {
-    throw new Error('Nectary registry already set');
-  }
-  nectaryRegistry = registry;
-  for (const [name, ctor] of nectaryDefinitions.entries()) {
-    if (nectaryRegistry.get(name) == null) {
-      nectaryRegistry.define(name, ctor);
-    }
-  }
-  nectaryDefinitions.clear();
-};
-export class NectaryElement extends HTMLElement {
-  attachShadow(options) {
-    return super.attachShadow({
-      mode: 'open',
-      delegatesFocus: false,
-      customElements: nectaryRegistry,
-      ...options
-    });
-  }
-  version = pkg.version;
-  get focusable() {
-    return false;
-  }
-  #isDomConnected = false;
-  connectedCallback() {
-    this.#isDomConnected = true;
-  }
-  disconnectedCallback() {
-    this.#isDomConnected = false;
-  }
-  get isDomConnected() {
-    return this.#isDomConnected;
-  }
-}