@spectric/ui 0.0.4 → 0.0.5

package/dist/components/splitview/splitview.d.ts

@@ -0,0 +1,73 @@
+import { PropertyValues } from 'lit-element';
+import { DisposableElement } from '../../classes/DisposibleElement';
+import { HTMLElementTagWithEvents, ReactElementWithPropsAndEvents } from '../types';
+export declare enum Orientations {
+    horizontal = "horizontal",
+    vertical = "vertical"
+}
+export interface SplitViewProps {
+    /** Controls the orientation of the splitter handle */
+    orientation: `${Orientations}`;
+    /** the percentage to split the view default: 50*/
+    percentage?: number;
+    /** Should the splitter handle be invisible? */
+    invisible?: boolean;
+    /** Clamps the minimum split percentage default: 10 */
+    min: number;
+    /** Clamps the maximum split percentage default: 90 */
+    max: number;
+    /** save and load split state to localstorage splitter must have an id attribute default: true */
+    useSavedState?: boolean;
+}
+export declare const ElementTag = "spectric-splitview";
+/**
+ * Split view will take a container and split it horizontally or vertically. This element can only have two children.
+ * If you supply the **id** attribute on the split view element it will save and load the state keeping the user defined position
+ * @slot - Element can only take 2 HTMLElements.
+ */
+export declare class SplitView extends DisposableElement implements SplitViewProps {
+    orientation: Orientations;
+    percentage: SplitViewProps['percentage'];
+    invisible: SplitViewProps['invisible'];
+    static styles: import('lit').CSSResult;
+    min: SplitViewProps['min'];
+    max: SplitViewProps['max'];
+    useSavedState: SplitViewProps['useSavedState'];
+    private isDragging;
+    private _error;
+    private _splitter;
+    private _panel1;
+    private _panel2;
+    constructor();
+    protected updated(changedProperties: PropertyValues): void;
+    _emitChange: () => void;
+    _onMouseMove: (...args: any[]) => void;
+    private _assignSlot;
+    render(): import('lit-html').TemplateResult<1>;
+}
+export interface SplitViewEvents {
+    'change': (event: CustomEvent<SplitViewProps>) => void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        [ElementTag]: HTMLElementTagWithEvents<SplitView, SplitViewEvents>;
+    }
+    namespace JSX {
+        interface IntrinsicElements {
+            /**
+             * @see {@link SplitView}
+             */
+            [ElementTag]: ReactElementWithPropsAndEvents<SplitView, SplitViewProps, SplitViewEvents>;
+        }
+    }
+    namespace React {
+        namespace JSX {
+            interface IntrinsicElements {
+                /**
+                 * @see {@link SplitView}
+                 */
+                [ElementTag]: ReactElementWithPropsAndEvents<SplitView, SplitViewProps, SplitViewEvents>;
+            }
+        }
+    }
+}

package/dist/components/types.d.ts

@@ -0,0 +1,21 @@
+export type HTMLElementTagWithEvents<ElementClass, EventsMap> = Omit<{
+    [P in keyof ElementClass]: ElementClass[P];
+}, "addEventListener" | "removeEventListener"> & WithEvents<EventsMap>;
+type WithEvents<EventsMap> = {
+    addEventListener<K extends keyof Omit<HTMLElementEventMap, keyof EventsMap>>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener<K extends keyof EventsMap>(type: K, listener: EventsMap[K], options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof Omit<HTMLElementEventMap, keyof EventsMap>>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener<K extends keyof EventsMap>(type: K, listener: EventsMap[K], options?: boolean | AddEventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+};
+export type ReactElementWithPropsAndEvents<Class, Props, Events = {}> = React.DetailedHTMLProps<Props & React.DOMAttributes<Class> & OverloadReactSyntheticEvents<Class, Events> & ReactEventMap<Events>, Class>;
+type OverloadReactSyntheticEvents<Class, Events> = Pick<ReactSyntheticEvents<Class, Events>, ExtractOverlappingEvents<Class, Events>>;
+type ExtractOverlappingEvents<Class, Events> = Extract<React.DOMAttributes<Class>, keyof ReactSyntheticEvents<Class, Events>>;
+export type ReactSyntheticEvents<Class, Events> = {
+    [Key in keyof Events as `on${Capitalize<string & Key>}`]: (e: React.SyntheticEvent<Class, Events[Key]>) => void;
+};
+export type ReactEventMap<Events> = Partial<{
+    [Key in keyof Events as `on${string & Key}`]: Events[Key];
+}>;
+export {};