@emuanalytics/flow-rdf-ui 0.0.23 → 0.0.25

package/dist/index.d.ts

@@ -4,6 +4,7 @@ import * as chartjs_chart_matrix from 'chartjs-chart-matrix';
 import * as chart_js from 'chart.js';
 import { Chart, ChartTypeRegistry, ChartOptions, ChartData, Plugin, ChartComponentLike } from 'chart.js';
 export { Chart as ChartJs } from 'chart.js';
+export { default as dayjs } from 'dayjs';
 
 type EventTypeRequiresDetail<T> = T extends keyof GlobalEventHandlersEventMap ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>> ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>> ? never : Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail'] ? never : T : never : never;
 type EventTypeDoesNotRequireDetail<T> = T extends keyof GlobalEventHandlersEventMap ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, unknown>> ? GlobalEventHandlersEventMap[T] extends CustomEvent<Record<PropertyKey, never>> ? T : Partial<GlobalEventHandlersEventMap[T]['detail']> extends GlobalEventHandlersEventMap[T]['detail'] ? T : never : T : T;
@@ -49,6 +50,9 @@ interface FlowRdfFormControl extends FlowRdfElement {
 }
 
 /**
+ *
+ *
+ * @tagname flow-ui-icon
  * @summary Icons are symbols that can be used to represent various options within an application.
  * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/icon
  * @status stable
@@ -82,7 +86,13 @@ declare class FlowIcon extends FlowRdfElement {
     firstUpdated(): void;
     disconnectedCallback(): void;
     private getUrl;
+    /**
+     * @internal
+     */
     handleLabelChange(): void;
+    /**
+     * @internal
+     */
     setIcon(): Promise<void>;
     render(): SVGElement | null;
 }
@@ -879,17 +889,28 @@ declare global {
  */
 declare class FlowCalendar extends FlowRdfElement {
     static styles: CSSResultGroup;
+    private _monthSelect;
+    private _yearSelect;
     private _displayDate;
-    private _selectedDate;
+    private _selectedDate?;
     value: string;
+    displayMode: 'date' | 'time' | 'datetime';
+    timezone: string;
+    size: 'small' | 'medium' | 'large';
     connectedCallback(): void;
     disconnectedCallback(): void;
     handleValueChange(): void;
     private dateClicked;
-    private changeDisplayDate;
+    private stepDisplayDate;
+    private yearOptionsForDate;
+    private makeDate;
+    private updateValue;
+    private handleHeaderSelectChange;
+    private handleTimeChange;
     private calendarHeaderTemplate;
     private dayOfWeekGridTemplate;
     private dayGridTemplate;
+    private timeTemplate;
     render(): lit.TemplateResult<1>;
 }
 
@@ -1788,6 +1809,150 @@ declare global {
     }
 }
 
+/**
+ * @summary Tags are used as labels to organize things or to indicate a selection.
+ * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tag
+ * @status stable
+ * @since 2.0
+ *
+ * @dependency flow-ui-icon-button
+ *
+ * @slot - The tag's content.
+ *
+ * @event flow-ui-remove - Emitted when the remove button is activated.
+ *
+ * @csspart base - The component's base wrapper.
+ * @csspart content - The tag's content.
+ * @csspart remove-button - The tag's remove button, an `<flow-ui-icon-button>`.
+ * @csspart remove-button__base - The remove button's exported `base` part.
+ */
+declare class FlowTag extends FlowRdfElement {
+    static styles: CSSResultGroup;
+    private readonly localize;
+    /** The tag's theme variant. */
+    variant: 'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text';
+    /** The tag's size. */
+    size: 'small' | 'medium' | 'large';
+    /** Draws a pill-style tag with rounded edges. */
+    pill: boolean;
+    /** Makes the tag removable and shows a remove button. */
+    removable: boolean;
+    private handleRemoveClick;
+    render(): lit.TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'flow-ui-tag': FlowTag;
+    }
+}
+
+declare class FlowDatetimePicker extends FlowRdfElement implements FlowRdfFormControl {
+    static styles: CSSResultGroup;
+    private readonly formControlController;
+    private readonly hasSlotController;
+    private readonly localize;
+    popup: FlowPopup;
+    combobox: HTMLSlotElement;
+    displayInput: HTMLInputElement;
+    valueInput: HTMLInputElement;
+    calendarContainer: HTMLDivElement;
+    private hasFocus;
+    displayLabel: string;
+    /** The name of the select, submitted as a name/value pair with form data. */
+    name: string;
+    value: string;
+    displayMode: 'date' | 'time' | 'datetime';
+    format: string;
+    timezone: string;
+    /** The default value of the form control. Primarily used for resetting the form control. */
+    defaultValue: string;
+    /** The select's size. */
+    size: 'small' | 'medium' | 'large';
+    /** Placeholder text to show as a hint when the select is empty. */
+    placeholder: string;
+    /** Disables the select control. */
+    disabled: boolean;
+    /** Adds a clear button when the select is not empty. */
+    clearable: boolean;
+    /**
+     * Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
+     * use the `show()` and `hide()` methods and this attribute will reflect the select's open state.
+     */
+    open: boolean;
+    /**
+     * Enable this option to prevent the listbox from being clipped when the component is placed inside a container with
+     * `overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.
+     */
+    hoist: boolean;
+    /** Draws a filled select. */
+    filled: boolean;
+    /** Draws a pill-style select with rounded edges. */
+    pill: boolean;
+    /** The select's label. If you need to display HTML, use the `label` slot instead. */
+    label: string;
+    /**
+     * The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
+     * inside of the viewport.
+     */
+    placement: 'top' | 'top-end' | 'top-start' | 'bottom' | 'bottom-end' | 'bottom-start';
+    /** The select's help text. If you need to display HTML, use the `help-text` slot instead. */
+    helpText: string;
+    /**
+     * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
+     * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
+     * the same document or shadow root for this to work.
+     */
+    form: string;
+    /** The select's required attribute. */
+    required: boolean;
+    /** Gets the validity state object */
+    get validity(): ValidityState;
+    /** Gets the validation message */
+    get validationMessage(): string;
+    connectedCallback(): void;
+    private addOpenListeners;
+    private removeOpenListeners;
+    updateDisplayLabel(): void;
+    private handleFocus;
+    private handleBlur;
+    private handleDocumentFocusIn;
+    private handleDocumentKeyDown;
+    private handleDocumentMouseDown;
+    private handleLabelClick;
+    private handleComboboxMouseDown;
+    private handleComboboxKeyDown;
+    private handleClearClick;
+    private handleClearMouseDown;
+    private handleCalendarChange;
+    private handleInvalid;
+    handleDisabledChange(): void;
+    handleValueChange(): void;
+    handleOpenChange(): Promise<void>;
+    /** Shows the listbox. */
+    show(): Promise<void>;
+    /** Hides the listbox. */
+    hide(): Promise<void>;
+    /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
+    checkValidity(): boolean;
+    /** Gets the associated form, if one exists. */
+    getForm(): HTMLFormElement | null;
+    /** Checks for validity and shows the browser's validation message if the control is invalid. */
+    reportValidity(): boolean;
+    /** Sets a custom validation message. Pass an empty string to restore validity. */
+    setCustomValidity(message: string): void;
+    /** Sets focus on the control. */
+    focus(options?: FocusOptions): void;
+    /** Removes focus from the control. */
+    blur(): void;
+    render(): lit.TemplateResult<1>;
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'flow-ui-date-time-picker': FlowDatetimePicker;
+    }
+}
+
 /**
  * @summary Details show a brief summary and expand to show additional content.
  * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/details
@@ -2174,6 +2339,37 @@ declare global {
     }
 }
 
+/**
+
+ */
+declare class FlowNumberStepper extends FlowRdfElement {
+    static styles: CSSResultGroup;
+    private _input;
+    private _formatter;
+    value: number | '';
+    step: number;
+    min: number;
+    max: number;
+    format: string;
+    size: 'small' | 'medium' | 'large';
+    placeholder: string;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    stepUp(emitEvent?: boolean): void;
+    stepDown(emitEvent?: boolean): void;
+    handleValueChange(): void;
+    handleFormatChange(): void;
+    private handleInputChange;
+    private clampValue;
+    render(): lit.TemplateResult<1>;
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'flow-ui-number-stepper': FlowNumberStepper;
+    }
+}
+
 /**
  * @summary Options define the selectable items within various form controls such as [select](/components/select).
  * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/option
@@ -2783,43 +2979,6 @@ declare global {
     }
 }
 
-/**
- * @summary Tags are used as labels to organize things or to indicate a selection.
- * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tag
- * @status stable
- * @since 2.0
- *
- * @dependency flow-ui-icon-button
- *
- * @slot - The tag's content.
- *
- * @event flow-ui-remove - Emitted when the remove button is activated.
- *
- * @csspart base - The component's base wrapper.
- * @csspart content - The tag's content.
- * @csspart remove-button - The tag's remove button, an `<flow-ui-icon-button>`.
- * @csspart remove-button__base - The remove button's exported `base` part.
- */
-declare class FlowTag extends FlowRdfElement {
-    static styles: CSSResultGroup;
-    private readonly localize;
-    /** The tag's theme variant. */
-    variant: 'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text';
-    /** The tag's size. */
-    size: 'small' | 'medium' | 'large';
-    /** Draws a pill-style tag with rounded edges. */
-    pill: boolean;
-    /** Makes the tag removable and shows a remove button. */
-    removable: boolean;
-    private handleRemoveClick;
-    render(): lit.TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'flow-ui-tag': FlowTag;
-    }
-}
-
 /**
  * @summary Selects allow you to choose items from a menu of predefined options.
  * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/select
@@ -3625,6 +3784,22 @@ declare global {
     }
 }
 
+/**
+
+ */
+declare class FlowTimer extends FlowRdfElement {
+    static styles: CSSResultGroup;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): lit.TemplateResult<1>;
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'flow-ui-timer': FlowTimer;
+    }
+}
+
 /**
  * @summary A tree item serves as a hierarchical node that lives inside a [tree](/components/tree).
  * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tree-item
@@ -4424,4 +4599,4 @@ declare function registerIconLibrary(name: string, options: {
 /** Removes an icon library from the registry. */
 declare function unregisterIconLibrary(name: string): void;
 
-export { BaseColorMapperField, BaseColorStopOptions, ColorMapperField, ColorMapperOptions, ColorMapperValue, ColorStopOptions, ColorStopValue, FlowAfterCollapseEvent, FlowAfterExpandEvent, FlowAfterHideEvent, FlowAfterShowEvent, FlowAlert, FlowAnimation, FlowAvatar, FlowBadge, FlowBlurEvent, FlowBreadcrumb, FlowBreadcrumbItem, FlowButton, FlowButtonGroup, FlowCalendar, FlowCancelEvent, FlowCard, FlowCarousel, FlowCarouselItem, FlowChangeEvent, FlowChart, FlowCheckbox, FlowClearEvent, FlowCloseEvent, FlowCollapseEvent, FlowColorMapper, FlowColorPicker, FlowColorStopComponent as FlowColorStop, FlowDetails, FlowDialog, FlowDivider, FlowDragEndEvent, FlowDragEvent, FlowDragStartEvent, FlowDrawer, FlowDropdown, FlowErrorEvent, FlowExpandEvent, FlowFinishEvent, FlowFocusEvent, FlowGauge, FlowHideEvent, FlowHoverEvent, FlowIcon, FlowIconButton, FlowInitialFocusEvent, FlowInput, FlowInputEvent, FlowInvalidEvent, FlowLazyChangeEvent, FlowLazyLoadEvent, FlowLoadEvent, FlowMenu, FlowMenuItem, FlowMenuLabel, FlowMutationEvent, FlowMutationObserver, FlowOption, FlowSplitViewPanel as FlowPanel, FlowPanelHeader, FlowPanelToggleEvent, FlowPopup, FlowProgressBar, FlowProgressRing, FlowRadio, FlowRadioGroup, FlowRange, FlowRemoveEvent, FlowRepositionEvent, FlowRequestCloseEvent, FlowResizeEvent, FlowResizeObserver, FlowScrollView, FlowSelect, FlowSelectEvent, FlowSelectionChangeEvent, FlowShowEvent, FlowSlideChange, FlowSpinner, FlowSplitView, FlowPanelDivider as FlowSplitViewDivider, FlowSplitViewPane, FlowSplitViewToggleButton, FlowStartEvent, FlowStepper, FlowStepperPanel, FlowSwitch, FlowTab, FlowTabGroup, FlowTabHideEvent, FlowTabPanel, FlowTabShowEvent, FlowTag, FlowTextarea, FlowToolButton, FlowToolButtonGroup, FlowTooltip, FlowTree, FlowTreeItem, FlowVisuallyHidden, NumberColorMapperField, NumberColorStopOptions, SelectColorMapperField, SelectColorStopOptions, StringColorMapperField, StringColorStopOptions, addIcons, colorMapperValueToMaplibreExpression, escapeMaplibreString, getAnimationNames, getBasePath, getEasingNames, initializeChartJs, registerChartComponent, registerIconLibrary, setBasePath, unregisterIconLibrary };
+export { BaseColorMapperField, BaseColorStopOptions, ColorMapperField, ColorMapperOptions, ColorMapperValue, ColorStopOptions, ColorStopValue, FlowAfterCollapseEvent, FlowAfterExpandEvent, FlowAfterHideEvent, FlowAfterShowEvent, FlowAlert, FlowAnimation, FlowAvatar, FlowBadge, FlowBlurEvent, FlowBreadcrumb, FlowBreadcrumbItem, FlowButton, FlowButtonGroup, FlowCalendar, FlowCancelEvent, FlowCard, FlowCarousel, FlowCarouselItem, FlowChangeEvent, FlowChart, FlowCheckbox, FlowClearEvent, FlowCloseEvent, FlowCollapseEvent, FlowColorMapper, FlowColorPicker, FlowColorStopComponent as FlowColorStop, FlowDatetimePicker as FlowDateTimePicker, FlowDetails, FlowDialog, FlowDivider, FlowDragEndEvent, FlowDragEvent, FlowDragStartEvent, FlowDrawer, FlowDropdown, FlowErrorEvent, FlowExpandEvent, FlowFinishEvent, FlowFocusEvent, FlowGauge, FlowHideEvent, FlowHoverEvent, FlowIcon, FlowIconButton, FlowInitialFocusEvent, FlowInput, FlowInputEvent, FlowInvalidEvent, FlowLazyChangeEvent, FlowLazyLoadEvent, FlowLoadEvent, FlowMenu, FlowMenuItem, FlowMenuLabel, FlowMutationEvent, FlowMutationObserver, FlowNumberStepper, FlowOption, FlowSplitViewPanel as FlowPanel, FlowPanelHeader, FlowPanelToggleEvent, FlowPopup, FlowProgressBar, FlowProgressRing, FlowRadio, FlowRadioGroup, FlowRange, FlowRemoveEvent, FlowRepositionEvent, FlowRequestCloseEvent, FlowResizeEvent, FlowResizeObserver, FlowScrollView, FlowSelect, FlowSelectEvent, FlowSelectionChangeEvent, FlowShowEvent, FlowSlideChange, FlowSpinner, FlowSplitView, FlowPanelDivider as FlowSplitViewDivider, FlowSplitViewPane, FlowSplitViewToggleButton, FlowStartEvent, FlowStepper, FlowStepperPanel, FlowSwitch, FlowTab, FlowTabGroup, FlowTabHideEvent, FlowTabPanel, FlowTabShowEvent, FlowTag, FlowTextarea, FlowTimer, FlowToolButton, FlowToolButtonGroup, FlowTooltip, FlowTree, FlowTreeItem, FlowVisuallyHidden, NumberColorMapperField, NumberColorStopOptions, SelectColorMapperField, SelectColorStopOptions, StringColorMapperField, StringColorStopOptions, addIcons, colorMapperValueToMaplibreExpression, escapeMaplibreString, getAnimationNames, getBasePath, getEasingNames, initializeChartJs, registerChartComponent, registerIconLibrary, setBasePath, unregisterIconLibrary };