@vendure/admin-ui 1.7.4 → 1.8.0

package/package/core/shared/components/radio-card/radio-card-fieldset.component.d.ts

@@ -0,0 +1,21 @@
+import { ChangeDetectorRef, EventEmitter, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
+import { Subject } from 'rxjs';
+export declare class RadioCardFieldsetComponent<T = any> implements OnInit, OnChanges, OnDestroy {
+    private changeDetector;
+    selectedItemId: string;
+    idFn: (item: T) => string;
+    selectItem: EventEmitter<T>;
+    groupName: string;
+    selectedIdChange$: Subject<string>;
+    focussedId: string | undefined;
+    private idChange$;
+    private subscription;
+    constructor(changeDetector: ChangeDetectorRef);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    isSelected(item: T): boolean;
+    isFocussed(item: T): boolean;
+    selectChanged(item: T): void;
+    setFocussedId(item: T | undefined): void;
+}

package/package/core/shared/components/radio-card/radio-card.component.d.ts

@@ -0,0 +1,19 @@
+import { ChangeDetectorRef, OnDestroy, OnInit, TemplateRef } from '@angular/core';
+import { RadioCardFieldsetComponent } from './radio-card-fieldset.component';
+export declare class RadioCardComponent<T = any> implements OnInit, OnDestroy {
+    private fieldset;
+    private changeDetector;
+    item: T;
+    itemTemplate: TemplateRef<T>;
+    constructor(fieldset: RadioCardFieldsetComponent, changeDetector: ChangeDetectorRef);
+    private idChange$;
+    private subscription;
+    name: string;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    isSelected(item: T): boolean;
+    isFocussed(item: T): boolean;
+    selectChanged(item: T): void;
+    setFocussedId(item: T | undefined): void;
+    getItemId(item: T): string;
+}

package/package/core/shared/components/rich-text-editor/prosemirror/context-menu/context-menu.component.d.ts

@@ -0,0 +1,28 @@
+import { Overlay } from '@angular/cdk/overlay';
+import { AfterViewInit, OnDestroy, ViewContainerRef } from '@angular/core';
+import { Observable } from 'rxjs';
+import { ContextMenuConfig, ContextMenuItem, ContextMenuService } from './context-menu.service';
+export declare class ContextMenuComponent implements AfterViewInit, OnDestroy {
+    private overlay;
+    private viewContainerRef;
+    contextMenuService: ContextMenuService;
+    editorMenuElement: HTMLElement | null | undefined;
+    private menuTemplate;
+    menuConfig: ContextMenuConfig | undefined;
+    hideTrigger$: Observable<boolean>;
+    private triggerIsHidden;
+    private menuPortal;
+    private overlayRef;
+    private contextMenuSub;
+    private contentArea;
+    private hideTriggerHandler;
+    constructor(overlay: Overlay, viewContainerRef: ViewContainerRef, contextMenuService: ContextMenuService);
+    onScroll: () => void;
+    ngAfterViewInit(): void;
+    triggerClick(): void;
+    ngOnDestroy(): void;
+    clickItem(item: ContextMenuItem): void;
+    private getPositionStrategy;
+    /** Inverts an overlay position. */
+    private invertPosition;
+}

package/package/core/shared/components/rich-text-editor/prosemirror/context-menu/context-menu.service.d.ts

@@ -0,0 +1,31 @@
+import { Observable } from 'rxjs';
+export interface ContextMenuConfig {
+    ref: any;
+    iconShape?: string;
+    title: string;
+    element: Element;
+    coords: {
+        left: number;
+        right: number;
+        top: number;
+        bottom: number;
+    };
+    items: ContextMenuItem[];
+}
+export interface ContextMenuItem {
+    separator?: boolean;
+    iconClass?: string;
+    iconShape?: string;
+    label: string;
+    enabled: boolean;
+    onClick: () => void;
+}
+export declare class ContextMenuService {
+    contextMenu$: Observable<ContextMenuConfig | undefined>;
+    private menuIsVisible$;
+    private setContextMenuConfig$;
+    constructor();
+    setVisibility(isVisible: boolean): void;
+    setContextMenu(config: ContextMenuConfig): void;
+    clearContextMenu(): void;
+}

package/package/core/shared/components/rich-text-editor/prosemirror/custom-nodes.d.ts

@@ -0,0 +1,4 @@
+import { NodeSpec } from 'prosemirror-model';
+import { NodeViewConstructor } from 'prosemirror-view';
+export declare const iframeNode: NodeSpec;
+export declare const iframeNodeView: NodeViewConstructor;

package/package/core/shared/components/rich-text-editor/prosemirror/inputrules.d.ts

@@ -0,0 +1,8 @@
+import { Schema } from 'prosemirror-model';
+import { Plugin } from 'prosemirror-state';
+export declare function blockQuoteRule(nodeType: any): import("prosemirror-inputrules").InputRule;
+export declare function orderedListRule(nodeType: any): import("prosemirror-inputrules").InputRule;
+export declare function bulletListRule(nodeType: any): import("prosemirror-inputrules").InputRule;
+export declare function codeBlockRule(nodeType: any): import("prosemirror-inputrules").InputRule;
+export declare function headingRule(nodeType: any, maxLevel: any): import("prosemirror-inputrules").InputRule;
+export declare function buildInputRules(schema: Schema): Plugin;

package/package/core/shared/components/rich-text-editor/prosemirror/menu/links.d.ts

@@ -0,0 +1,4 @@
+import { MenuItem } from 'prosemirror-menu';
+import { MarkType } from 'prosemirror-model';
+import { ModalService } from '../../../../../providers/modal/modal.service';
+export declare function linkItem(linkMark: MarkType, modalService: ModalService): MenuItem;

package/package/core/shared/components/rich-text-editor/prosemirror/menu/menu-common.d.ts

@@ -0,0 +1,16 @@
+import { NodeType } from 'prosemirror-model';
+import { EditorState } from 'prosemirror-state';
+import { EditorView } from 'prosemirror-view';
+export declare function markActive(state: any, type: any): any;
+export declare function canInsert(state: EditorState, nodeType: NodeType): boolean;
+export interface ClarityIconOptions {
+    shape: string;
+    size?: number;
+    label?: string;
+}
+export declare function renderClarityIcon(options: ClarityIconOptions): (view: EditorView) => HTMLElement;
+export declare function wrapInMenuItemWithIcon(...elements: Array<HTMLElement | undefined | null>): HTMLSpanElement;
+export declare const IconSize: {
+    Large: number;
+    Small: number;
+};

package/package/core/shared/components/rich-text-editor/prosemirror/menu/menu-plugin.d.ts

@@ -0,0 +1,9 @@
+import { Injector } from '@angular/core';
+import { Schema } from 'prosemirror-model';
+import { Plugin } from 'prosemirror-state';
+export interface CustomMenuPluginOptions {
+    floatingMenu?: boolean;
+    schema: Schema;
+    injector: Injector;
+}
+export declare function customMenuPlugin(options: CustomMenuPluginOptions): Plugin<any>;

package/package/core/shared/components/rich-text-editor/prosemirror/menu/sub-menu-with-icon.d.ts

@@ -0,0 +1,14 @@
+import { DropdownSubmenu, MenuElement } from 'prosemirror-menu';
+import { EditorState } from 'prosemirror-state';
+import { EditorView } from 'prosemirror-view';
+export declare class SubMenuWithIcon extends DropdownSubmenu {
+    private icon;
+    constructor(content: readonly MenuElement[] | MenuElement, options: {
+        label?: string;
+        icon: () => HTMLElement;
+    });
+    render(view: EditorView): {
+        dom: HTMLElement;
+        update: (state: EditorState) => boolean;
+    };
+}

package/package/core/shared/components/rich-text-editor/prosemirror/plugins/image-plugin.d.ts

@@ -0,0 +1,7 @@
+import { MenuItem } from 'prosemirror-menu';
+import { NodeType } from 'prosemirror-model';
+import { Plugin } from 'prosemirror-state';
+import { ModalService } from '../../../../../providers/modal/modal.service';
+import { ContextMenuService } from '../context-menu/context-menu.service';
+export declare function insertImageItem(nodeType: NodeType, modalService: ModalService): MenuItem;
+export declare const imageContextMenuPlugin: (contextMenuService: ContextMenuService, modalService: ModalService) => Plugin<any>;

package/package/core/shared/components/rich-text-editor/prosemirror/plugins/link-select-plugin.d.ts

@@ -0,0 +1,5 @@
+import { Plugin } from 'prosemirror-state';
+/**
+ * Causes the entire link to be selected when clicked.
+ */
+export declare const linkSelectPlugin: Plugin<any>;

package/package/core/shared/components/rich-text-editor/prosemirror/plugins/raw-editor-plugin.d.ts

@@ -0,0 +1,7 @@
+import { Plugin } from 'prosemirror-state';
+import { ModalService } from '../../../../../providers/modal/modal.service';
+import { ContextMenuService } from '../context-menu/context-menu.service';
+/**
+ * Implements editing of raw HTML for the selected node in the editor.
+ */
+export declare const rawEditorPlugin: (contextMenuService: ContextMenuService, modalService: ModalService) => Plugin<any>;

package/package/core/shared/components/rich-text-editor/prosemirror/plugins/tables-plugin.d.ts

@@ -0,0 +1,13 @@
+import { MenuElement } from 'prosemirror-menu';
+import { Schema } from 'prosemirror-model';
+import { Plugin } from 'prosemirror-state';
+import { ContextMenuService } from '../context-menu/context-menu.service';
+export declare const tableContextMenuPlugin: (contextMenuService: ContextMenuService) => Plugin<any>;
+export declare function getTableNodes(): import("prosemirror-tables").TableNodes;
+export declare function getTableMenu(schema: Schema): MenuElement[];
+export declare function addTable(state: any, dispatch: any, { rowsCount, colsCount, withHeaderRow, cellContent }: {
+    rowsCount: any;
+    colsCount: any;
+    withHeaderRow: any;
+    cellContent: any;
+}): void;

package/package/core/shared/components/rich-text-editor/prosemirror/prosemirror.service.d.ts

@@ -0,0 +1,25 @@
+import { Injector } from '@angular/core';
+import { EditorView } from 'prosemirror-view';
+import { Observable } from 'rxjs';
+import { ContextMenuService } from './context-menu/context-menu.service';
+export interface CreateEditorViewOptions {
+    onTextInput: (content: string) => void;
+    element: HTMLElement;
+    isReadOnly: () => boolean;
+}
+export declare class ProsemirrorService {
+    private injector;
+    private contextMenuService;
+    editorView: EditorView;
+    private mySchema;
+    private enabled;
+    constructor(injector: Injector, contextMenuService: ContextMenuService);
+    contextMenuItems$: Observable<string>;
+    createEditorView(options: CreateEditorViewOptions): void;
+    update(text: string): void;
+    destroy(): void;
+    setEnabled(enabled: boolean): void;
+    private getStateFromText;
+    private getTextFromState;
+    private configurePlugins;
+}

package/package/core/shared/components/rich-text-editor/prosemirror/types.d.ts

@@ -0,0 +1,9 @@
+import { Schema } from 'prosemirror-model';
+export interface SetupOptions {
+    schema: Schema;
+    mapKeys?: Keymap;
+    menuBar?: boolean;
+    history?: boolean;
+    floatingMenu?: boolean;
+}
+export declare type Keymap = Record<string, string | false>;

package/package/core/shared/components/rich-text-editor/raw-html-dialog/raw-html-dialog.component.d.ts

@@ -0,0 +1,18 @@
+import { OnInit } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { ConfigArgDefinition } from '../../../../common/generated-types';
+import { Dialog } from '../../../../providers/modal/modal.service';
+export declare class RawHtmlDialogComponent implements OnInit, Dialog<string> {
+    html: string;
+    formControl: FormControl;
+    config: ConfigArgDefinition;
+    resolveWith: (html: string | undefined) => void;
+    ngOnInit(): void;
+    process(str: string): string;
+    /**
+     * Taken from https://stackoverflow.com/a/26361620/772859
+     */
+    format(node: Element, level?: number): Element;
+    cancel(): void;
+    select(): void;
+}

package/package/core/shared/components/rich-text-editor/rich-text-editor.component.d.ts

@@ -0,0 +1,39 @@
+import { AfterViewInit, ChangeDetectorRef, OnDestroy, ViewContainerRef } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import { ContextMenuService } from './prosemirror/context-menu/context-menu.service';
+import { ProsemirrorService } from './prosemirror/prosemirror.service';
+/**
+ * @description
+ * A rich text (HTML) editor based on Prosemirror (https://prosemirror.net/)
+ *
+ * @example
+ * ```HTML
+ * <vdr-rich-text-editor
+ *     [(ngModel)]="description"
+ *     label="Description"
+ * ></vdr-rich-text-editor>
+ * ```
+ *
+ * @docsCategory components
+ */
+export declare class RichTextEditorComponent implements ControlValueAccessor, AfterViewInit, OnDestroy {
+    private changeDetector;
+    private prosemirrorService;
+    private viewContainerRef;
+    contextMenuService: ContextMenuService;
+    label: string;
+    set readonly(value: any);
+    _readonly: boolean;
+    onChange: (val: any) => void;
+    onTouch: () => void;
+    private value;
+    private editorEl;
+    constructor(changeDetector: ChangeDetectorRef, prosemirrorService: ProsemirrorService, viewContainerRef: ViewContainerRef, contextMenuService: ContextMenuService);
+    get menuElement(): HTMLDivElement | null;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    writeValue(value: any): void;
+}

package/package/core/shared/dynamic-form-inputs/code-editor-form-input/base-code-editor-form-input.component.d.ts

@@ -0,0 +1,27 @@
+import { AfterViewInit, ChangeDetectorRef } from '@angular/core';
+import { FormControl, ValidatorFn } from '@angular/forms';
+import { DefaultFormComponentConfig } from '@vendure/common/lib/shared-types';
+import { CodeJar } from 'codejar';
+import { FormInputComponent } from '../../../common/component-registry-types';
+export interface CodeEditorConfig {
+    validator: ValidatorFn;
+    getErrorMessage: (content: string) => string | undefined;
+    highlight: (content: string, errorPos: number | undefined) => string;
+}
+export declare abstract class BaseCodeEditorFormInputComponent implements FormInputComponent, AfterViewInit {
+    protected changeDetector: ChangeDetectorRef;
+    readonly: boolean;
+    formControl: FormControl;
+    config: DefaultFormComponentConfig<'json-editor-form-input'>;
+    isValid: boolean;
+    errorMessage: string | undefined;
+    private editorElementRef;
+    jar: CodeJar;
+    private highlight;
+    private getErrorMessage;
+    protected constructor(changeDetector: ChangeDetectorRef);
+    get height(): string | undefined;
+    configure(config: CodeEditorConfig): void;
+    ngAfterViewInit(): void;
+    protected getErrorPos(errorMessage: string | undefined): number | undefined;
+}

package/package/core/shared/dynamic-form-inputs/code-editor-form-input/html-editor-form-input.component.d.ts

@@ -0,0 +1,19 @@
+import { AfterViewInit, ChangeDetectorRef, OnInit } from '@angular/core';
+import { DefaultFormComponentId } from '@vendure/common/lib/shared-types';
+import { FormInputComponent } from '../../../common/component-registry-types';
+import { BaseCodeEditorFormInputComponent } from './base-code-editor-form-input.component';
+/**
+ * @description
+ * A JSON editor input with syntax highlighting and error detection. Works well
+ * with `text` type fields.
+ *
+ * @docsCategory custom-input-components
+ * @docsPage default-inputs
+ */
+export declare class HtmlEditorFormInputComponent extends BaseCodeEditorFormInputComponent implements FormInputComponent, AfterViewInit, OnInit {
+    protected changeDetector: ChangeDetectorRef;
+    static readonly id: DefaultFormComponentId;
+    constructor(changeDetector: ChangeDetectorRef);
+    ngOnInit(): void;
+    private encodeHtmlChars;
+}

package/package/core/shared/dynamic-form-inputs/code-editor-form-input/json-editor-form-input.component.d.ts

@@ -0,0 +1,20 @@
+import { AfterViewInit, ChangeDetectorRef, OnInit } from '@angular/core';
+import { ValidatorFn } from '@angular/forms';
+import { DefaultFormComponentId } from '@vendure/common/lib/shared-types';
+import { FormInputComponent } from '../../../common/component-registry-types';
+import { BaseCodeEditorFormInputComponent } from './base-code-editor-form-input.component';
+export declare function jsonValidator(): ValidatorFn;
+/**
+ * @description
+ * A JSON editor input with syntax highlighting and error detection. Works well
+ * with `text` type fields.
+ *
+ * @docsCategory custom-input-components
+ * @docsPage default-inputs
+ */
+export declare class JsonEditorFormInputComponent extends BaseCodeEditorFormInputComponent implements FormInputComponent, AfterViewInit, OnInit {
+    protected changeDetector: ChangeDetectorRef;
+    static readonly id: DefaultFormComponentId;
+    constructor(changeDetector: ChangeDetectorRef);
+    ngOnInit(): void;
+}

package/package/core/shared/dynamic-form-inputs/register-dynamic-input-components.d.ts

@@ -0,0 +1,90 @@
+import { FactoryProvider, Type } from '@angular/core';
+import { FormInputComponent } from '../../common/component-registry-types';
+import { CustomFieldControl, CustomFieldEntityName } from '../../providers/custom-field-component/custom-field-component.service';
+import { HtmlEditorFormInputComponent } from './code-editor-form-input/html-editor-form-input.component';
+import { JsonEditorFormInputComponent } from './code-editor-form-input/json-editor-form-input.component';
+import { CombinationModeFormInputComponent } from './combination-mode-form-input/combination-mode-form-input.component';
+import { CurrencyFormInputComponent } from './currency-form-input/currency-form-input.component';
+import { CustomerGroupFormInputComponent } from './customer-group-form-input/customer-group-form-input.component';
+import { FacetValueFormInputComponent } from './facet-value-form-input/facet-value-form-input.component';
+import { PasswordFormInputComponent } from './password-form-input/password-form-input.component';
+import { ProductMultiSelectorFormInputComponent } from './product-multi-selector-form-input/product-multi-selector-form-input.component';
+import { ProductSelectorFormInputComponent } from './product-selector-form-input/product-selector-form-input.component';
+import { SelectFormInputComponent } from './select-form-input/select-form-input.component';
+export declare const defaultFormInputs: (typeof HtmlEditorFormInputComponent | typeof ProductSelectorFormInputComponent | typeof CustomerGroupFormInputComponent | typeof PasswordFormInputComponent | typeof CurrencyFormInputComponent | typeof SelectFormInputComponent | typeof FacetValueFormInputComponent | typeof JsonEditorFormInputComponent | typeof ProductMultiSelectorFormInputComponent | typeof CombinationModeFormInputComponent)[];
+/**
+ * @description
+ * Registers a custom FormInputComponent which can be used to control the argument inputs
+ * of a {@link ConfigurableOperationDef} (e.g. CollectionFilter, ShippingMethod etc) or for
+ * a custom field.
+ *
+ * @example
+ * ```TypeScript
+ * \@NgModule({
+ *   imports: [SharedModule],
+ *   declarations: [MyCustomFieldControl],
+ *   providers: [
+ *       registerFormInputComponent('my-custom-input', MyCustomFieldControl),
+ *   ],
+ * })
+ * export class MyUiExtensionModule {}
+ * ```
+ *
+ * This input component can then be used in a custom field:
+ *
+ * @example
+ * ```TypeScript
+ * const config = {
+ *   // ...
+ *   customFields: {
+ *     ProductVariant: [
+ *       {
+ *         name: 'rrp',
+ *         type: 'int',
+ *         ui: { component: 'my-custom-input' },
+ *       },
+ *     ]
+ *   }
+ * }
+ * ```
+ *
+ * or with an argument of a {@link ConfigurableOperationDef}:
+ *
+ * @example
+ * ```TypeScript
+ * args: {
+ *   rrp: { type: 'int', ui: { component: 'my-custom-input' } },
+ * }
+ * ```
+ *
+ * @docsCategory custom-input-components
+ */
+export declare function registerFormInputComponent(id: string, component: Type<FormInputComponent>): FactoryProvider;
+/**
+ * @description
+ * **Deprecated** use `registerFormInputComponent()` in combination with the customField `ui` config instead.
+ *
+ * Registers a custom component to act as the form input control for the given custom field.
+ * This should be used in the NgModule `providers` array of your ui extension module.
+ *
+ * @example
+ * ```TypeScript
+ * \@NgModule({
+ *   imports: [SharedModule],
+ *   declarations: [MyCustomFieldControl],
+ *   providers: [
+ *       registerCustomFieldComponent('Product', 'someCustomField', MyCustomFieldControl),
+ *   ],
+ * })
+ * export class MyUiExtensionModule {}
+ * ```
+ *
+ * @deprecated use `registerFormInputComponent()` in combination with the customField `ui` config instead.
+ *
+ * @docsCategory custom-input-components
+ */
+export declare function registerCustomFieldComponent(entity: CustomFieldEntityName, fieldName: string, component: Type<CustomFieldControl>): FactoryProvider;
+/**
+ * Registers the default form input components.
+ */
+export declare function registerDefaultFormInputs(): FactoryProvider[];