primenglab 22.0.0-beta.1

package/types/primenglab-types-dock.d.ts

@@ -0,0 +1,75 @@
+import { TemplateRef } from '@angular/core';
+import { MenuItem, PassThrough, PassThroughOption } from 'primenglab/api';
+
+/**
+ * Defines the position of the dock.
+ * @group Types
+ */
+type DockPosition = 'bottom' | 'top' | 'left' | 'right';
+/**
+ * Custom pass-through(pt) options.
+ * @template I Type of instance.
+ *
+ * @see {@link Dock.pt}
+ * @group Interface
+ */
+interface DockPassThroughOptions<I = unknown> {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: PassThroughOption<HTMLElement, I>;
+    /**
+     * Used to pass attributes to the list container's DOM element.
+     */
+    listContainer?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the list's DOM element.
+     */
+    list?: PassThroughOption<HTMLUListElement, I>;
+    /**
+     * Used to pass attributes to the item's DOM element.
+     */
+    item?: PassThroughOption<HTMLLIElement, I>;
+    /**
+     * Used to pass attributes to the item content's DOM element.
+     */
+    itemContent?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the item link's DOM element.
+     */
+    itemLink?: PassThroughOption<HTMLAnchorElement, I>;
+    /**
+     * Used to pass attributes to the item icon's DOM element.
+     */
+    itemIcon?: PassThroughOption<HTMLSpanElement, I>;
+}
+/**
+ * Defines valid pass-through options in Dock.
+ * @see {@link DockPassThroughOptions}
+ *
+ * @template I Type of instance.
+ */
+type DockPassThrough<I = unknown> = PassThrough<I, DockPassThroughOptions<I>>;
+/**
+ * Custom item template context.
+ * @group Interface
+ */
+interface DockItemTemplateContext {
+    /**
+     * Menu item instance.
+     */
+    $implicit: MenuItem;
+}
+/**
+ * Defines valid templates in Dock.
+ * @group Templates
+ */
+interface DockTemplates {
+    /**
+     * Custom template of item.
+     * @param {Object} context - item data.
+     */
+    item(context: DockItemTemplateContext): TemplateRef<DockItemTemplateContext>;
+}
+
+export type { DockItemTemplateContext, DockPassThrough, DockPassThroughOptions, DockPosition, DockTemplates };

package/types/primenglab-types-drawer.d.ts

@@ -0,0 +1,83 @@
+import { PassThrough, PassThroughOption } from 'primenglab/api';
+import { ButtonPassThrough } from 'primenglab/types/button';
+import { TemplateRef } from '@angular/core';
+import { MotionOptions } from '@primeuix/motion';
+
+type DrawerPosition = 'left' | 'right' | 'bottom' | 'top' | 'full';
+/**
+ * Custom pass-through(pt) options.
+ * @template I Type of instance.
+ *
+ * @see {@link Drawer.pt}
+ * @group Interface
+ */
+interface DrawerPassThroughOptions<I = unknown> {
+    /**
+     * Used to pass attributes to the host's DOM element.
+     */
+    host?: PassThroughOption<HTMLElement, I>;
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the header's DOM element.
+     */
+    header?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the title's DOM element.
+     */
+    title?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the close Button component.
+     * @see {@link ButtonPassThrough}
+     */
+    pcCloseButton?: ButtonPassThrough;
+    /**
+     * Used to pass attributes to the content's DOM element.
+     */
+    content?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the footer's DOM element.
+     */
+    footer?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass options to the motion component/directive.
+     */
+    motion?: MotionOptions;
+}
+/**
+ * Defines valid pass-through options in Drawer.
+ * @see {@link DrawerPassThroughOptions}
+ *
+ * @template I Type of instance.
+ */
+type DrawerPassThrough<I = unknown> = PassThrough<I, DrawerPassThroughOptions<I>>;
+/**
+ * Defines valid templates in Drawer.
+ * @group Templates
+ */
+interface DrawerTemplates {
+    /**
+     * Custom template of header.
+     */
+    header(): TemplateRef<void>;
+    /**
+     * Custom template of content.
+     */
+    content(): TemplateRef<void>;
+    /**
+     * Custom template of footer.
+     */
+    footer(): TemplateRef<void>;
+    /**
+     * Custom template of close icon.
+     */
+    closeicon(): TemplateRef<void>;
+    /**
+     * Headless template to replace the entire drawer content.
+     */
+    headless(): TemplateRef<void>;
+}
+
+export type { DrawerPassThrough, DrawerPassThroughOptions, DrawerPosition, DrawerTemplates };

package/types/primenglab-types-editor.d.ts

@@ -0,0 +1,210 @@
+import { TemplateRef } from '@angular/core';
+import { PassThrough, PassThroughOption } from 'primenglab/api';
+
+/**
+ * Custom passthrough(pt) options.
+ * @template I Type of instance.
+ *
+ * @see {@link Editor.pt}
+ * @group Interface
+ */
+interface EditorPassThroughOptions<I = unknown> {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the toolbar's DOM element.
+     */
+    toolbar?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the formats span's DOM element.
+     */
+    formats?: PassThroughOption<HTMLSpanElement, I>;
+    /**
+     * Used to pass attributes to the header select's DOM element.
+     */
+    header?: PassThroughOption<HTMLSelectElement, I>;
+    /**
+     * Used to pass attributes to the option's DOM element.
+     */
+    option?: PassThroughOption<HTMLOptionElement, I>;
+    /**
+     * Used to pass attributes to the bold button's DOM element.
+     */
+    bold?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the italic button's DOM element.
+     */
+    italic?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the underline button's DOM element.
+     */
+    underline?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the color select's DOM element.
+     */
+    color?: PassThroughOption<HTMLSelectElement, I>;
+    /**
+     * Used to pass attributes to the background select's DOM element.
+     */
+    background?: PassThroughOption<HTMLSelectElement, I>;
+    /**
+     * Used to pass attributes to the list button's DOM element.
+     */
+    list?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the select's DOM element.
+     */
+    select?: PassThroughOption<HTMLSelectElement, I>;
+    /**
+     * Used to pass attributes to the link button's DOM element.
+     */
+    link?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the image button's DOM element.
+     */
+    image?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the code block button's DOM element.
+     */
+    codeBlock?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the clean button's DOM element.
+     */
+    clean?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the content's DOM element.
+     */
+    content?: PassThroughOption<HTMLDivElement, I>;
+}
+/**
+ * Defines valid pass-through options in Editor component.
+ * @see {@link EditorPassThroughOptions}
+ *
+ * @template I Type of instance.
+ */
+type EditorPassThrough<I = unknown> = PassThrough<I, EditorPassThroughOptions<I>>;
+/**
+ * Quill Delta object interface for text changes.
+ * @group Interfaces
+ */
+interface QuillDelta {
+    ops?: any[];
+    retain?: number;
+    delete?: number;
+    insert?: string | object;
+    attributes?: {
+        [key: string]: any;
+    };
+}
+/**
+ * Quill Range object interface for selection changes.
+ * @group Interfaces
+ */
+interface QuillRange {
+    index: number;
+    length: number;
+}
+/**
+ * Custom text change event.
+ * @see {@link Editor.onTextChange}
+ * @group Events
+ */
+interface EditorTextChangeEvent {
+    /**
+     * Current value as html.
+     */
+    htmlValue: string | null;
+    /**
+     * Current value as text.
+     */
+    textValue: string;
+    /**
+     * Representation of the change as Quill Delta.
+     */
+    delta: QuillDelta;
+    /**
+     * Source of change. Will be 'user', 'api', or 'silent'.
+     */
+    source: 'user' | 'api' | 'silent';
+}
+/**
+ * Custom selection change event.
+ * @see {@link Editor.onSelectionChange}
+ * @group Events
+ */
+interface EditorSelectionChangeEvent {
+    /**
+     * Representation of the selection boundaries.
+     */
+    range: QuillRange | null;
+    /**
+     * Representation of the previous selection boundaries.
+     */
+    oldRange: QuillRange | null;
+    /**
+     * Source of change. Will be 'user', 'api', or 'silent'.
+     */
+    source: 'user' | 'api' | 'silent';
+}
+/**
+ * Custom editor change event.
+ * @see {@link Editor.onEditorChange}
+ * @group Events
+ */
+interface EditorChangeEvent {
+    /**
+     * Type of change ('text-change' or 'selection-change').
+     */
+    eventName: 'text-change' | 'selection-change';
+    /**
+     * Arguments passed to the change event.
+     */
+    args: any[];
+}
+/**
+ * Custom focus event.
+ * @see {@link Editor.onFocus}
+ * @group Events
+ */
+interface EditorFocusEvent {
+    /**
+     * Source of the focus event.
+     */
+    source: 'user' | 'api' | 'silent';
+}
+/**
+ * Custom blur event.
+ * @see {@link Editor.onBlur}
+ * @group Events
+ */
+interface EditorBlurEvent {
+    /**
+     * Source of the blur event.
+     */
+    source: 'user' | 'api' | 'silent';
+}
+/**
+ * Custom load event.
+ * @see {@link Editor.onInit}
+ * @group Events
+ */
+interface EditorInitEvent {
+    /**
+     * Text editor instance.
+     */
+    editor: any;
+}
+/**
+ * Defines valid templates in Editor.
+ * @group Templates
+ */
+interface EditorTemplates {
+    /**
+     * Custom header template.
+     */
+    header(): TemplateRef<any>;
+}
+
+export type { EditorBlurEvent, EditorChangeEvent, EditorFocusEvent, EditorInitEvent, EditorPassThrough, EditorPassThroughOptions, EditorSelectionChangeEvent, EditorTemplates, EditorTextChangeEvent, QuillDelta, QuillRange };

package/types/primenglab-types-fieldset.d.ts

@@ -0,0 +1,120 @@
+import { TemplateRef } from '@angular/core';
+import { MotionOptions } from '@primeuix/motion';
+import { PassThrough, PassThroughOption } from 'primenglab/api';
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link Fieldset.pt}
+ * @group Interface
+ */
+interface FieldsetPassThroughOptions<I = unknown> {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: PassThroughOption<HTMLFieldSetElement, I>;
+    /**
+     * Used to pass attributes to the legend's DOM element.
+     */
+    legend?: PassThroughOption<HTMLLegendElement, I>;
+    /**
+     * Used to pass attributes to the toggle button's DOM element.
+     */
+    toggleButton?: PassThroughOption<HTMLButtonElement, I>;
+    /**
+     * Used to pass attributes to the toggle icon's DOM element.
+     */
+    toggleIcon?: PassThroughOption<SVGElement | HTMLSpanElement, I>;
+    /**
+     * Used to pass attributes to the legend label's DOM element.
+     */
+    legendLabel?: PassThroughOption<HTMLSpanElement, I>;
+    /**
+     * Used to pass attributes to the content container's DOM element.
+     */
+    contentContainer?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the content wrapper DOM element.
+     */
+    contentWrapper?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass attributes to the content's DOM element.
+     */
+    content?: PassThroughOption<HTMLDivElement, I>;
+    /**
+     * Used to pass options to the motion component/directive.
+     */
+    motion?: MotionOptions;
+}
+/**
+ * Defines valid pass-through options in Fieldset component.
+ * @see {@link FieldsetPassThroughOptions}
+ *
+ * @template I Type of instance.
+ */
+type FieldsetPassThrough<I = unknown> = PassThrough<I, FieldsetPassThroughOptions<I>>;
+/**
+ * Custom panel toggle event, emits after toggle.
+ * @see {@link Fieldset.onAfterToggle}
+ * @group Events
+ */
+interface FieldsetAfterToggleEvent {
+    /**
+     * Browser event.
+     */
+    originalEvent: Event;
+    /**
+     * Collapsed state of the panel.
+     */
+    collapsed: boolean | undefined;
+}
+/**
+ * Custom panel toggle event, emits before toggle.
+ * @see {@link Fieldset.onBeforeToggle}
+ * @extends {FieldsetAfterToggleEvent}
+ * @group Events
+ */
+interface FieldsetBeforeToggleEvent extends FieldsetAfterToggleEvent {
+}
+/**
+ * Defines valid templates in Fieldset.
+ * @group Templates
+ */
+interface FieldsetTemplates {
+    /**
+     * Custom header template.
+     */
+    header(): TemplateRef<void>;
+    /**
+     * Custom content template.
+     */
+    content(): TemplateRef<void>;
+    /**
+     * Custom toggler icon template.
+     * @param {FieldsetToggleIconTemplateContext} context - toggler icon context.
+     */
+    toggleicon(context: FieldsetToggleIconTemplateContext): TemplateRef<FieldsetToggleIconTemplateContext>;
+    /**
+     * Custom expand icon template.
+     */
+    expandicon(): TemplateRef<void>;
+    /**
+     * Custom collapse icon template.
+     */
+    collapseicon(): TemplateRef<void>;
+}
+/**
+ * Context of the toggler icon template.
+ * @group Interface
+ */
+interface FieldsetToggleIconTemplateContext {
+    /**
+     * Collapsed state as a boolean.
+     */
+    $implicit: boolean | undefined;
+    /**
+     * Collapsed state as a boolean.
+     */
+    collapsed: boolean | undefined;
+}
+
+export type { FieldsetAfterToggleEvent, FieldsetBeforeToggleEvent, FieldsetPassThrough, FieldsetPassThroughOptions, FieldsetTemplates, FieldsetToggleIconTemplateContext };