cmat 0.0.3

package/components/drawer/drawer.component.d.ts

@@ -0,0 +1,75 @@
+import { ElementRef, EventEmitter, OnChanges, OnDestroy, OnInit, Renderer2, SimpleChanges } from '@angular/core';
+import { AnimationBuilder } from '@angular/animations';
+import { BooleanInput } from '@angular/cdk/coercion';
+import { CmatDrawerService } from './drawer.service';
+import { CmatDrawerMode, CmatDrawerPosition } from './drawer.types';
+import { CmatUtilsService } from 'cmat/services/utils';
+import * as i0 from "@angular/core";
+export declare class CmatDrawerComponent implements OnChanges, OnInit, OnDestroy {
+    private _animationBuilder;
+    private _elementRef;
+    private _renderer2;
+    private _cmatDrawerService;
+    private _cmatUtilsService;
+    static ngAcceptInputType_fixed: BooleanInput;
+    static ngAcceptInputType_opened: BooleanInput;
+    static ngAcceptInputType_transparentOverlay: BooleanInput;
+    fixed: boolean;
+    mode: CmatDrawerMode;
+    name: string;
+    opened: boolean;
+    position: CmatDrawerPosition;
+    transparentOverlay: boolean;
+    readonly fixedChanged: EventEmitter<boolean>;
+    readonly modeChanged: EventEmitter<CmatDrawerMode>;
+    readonly openedChanged: EventEmitter<boolean>;
+    readonly positionChanged: EventEmitter<CmatDrawerPosition>;
+    private _animationsEnabled;
+    private _hovered;
+    private _overlay;
+    private _player;
+    constructor(_animationBuilder: AnimationBuilder, _elementRef: ElementRef, _renderer2: Renderer2, _cmatDrawerService: CmatDrawerService, _cmatUtilsService: CmatUtilsService);
+    get classList(): any;
+    get styleList(): any;
+    onMouseenter(): void;
+    onMouseleave(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    open(): void;
+    close(): void;
+    toggle(): void;
+    /**
+     * Enable the animations
+     *
+     * @private
+     */
+    private _enableAnimations;
+    /**
+     * Disable the animations
+     *
+     * @private
+     */
+    private _disableAnimations;
+    /**
+     * Show the backdrop
+     *
+     * @private
+     */
+    private _showOverlay;
+    /**
+     * Hide the backdrop
+     *
+     * @private
+     */
+    private _hideOverlay;
+    /**
+     * Open/close the drawer
+     *
+     * @param open
+     * @private
+     */
+    private _toggleOpened;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatDrawerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CmatDrawerComponent, "cmat-drawer", ["cmatDrawer"], { "fixed": { "alias": "fixed"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "name": { "alias": "name"; "required": false; }; "opened": { "alias": "opened"; "required": false; }; "position": { "alias": "position"; "required": false; }; "transparentOverlay": { "alias": "transparentOverlay"; "required": false; }; }, { "fixedChanged": "fixedChanged"; "modeChanged": "modeChanged"; "openedChanged": "openedChanged"; "positionChanged": "positionChanged"; }, never, ["*"], true, never>;
+}

package/components/drawer/drawer.component.scss

@@ -0,0 +1,133 @@
+/* Variables */
+:root {
+    --cmat-drawer-width: 320px;
+}
+
+cmat-drawer {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    flex: 1 1 auto;
+    width: var(--cmat-drawer-width);
+    min-width: var(--cmat-drawer-width);
+    max-width: var(--cmat-drawer-width);
+    z-index: 300;
+    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .35);
+    @apply bg-card;
+
+    /* Animations */
+    &.cmat-drawer-animations-enabled {
+        transition-duration: 400ms;
+        transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
+        transition-property: visibility, margin-left, margin-right, transform, width, max-width, min-width;
+
+        .cmat-drawer-content {
+            transition-duration: 400ms;
+            transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
+            transition-property: width, max-width, min-width;
+        }
+    }
+
+    /* Over mode */
+    &.cmat-drawer-mode-over {
+        position: absolute;
+        top: 0;
+        bottom: 0;
+
+        /* Fixed mode */
+        &.cmat-drawer-fixed {
+            position: fixed;
+        }
+    }
+
+    /* Left position */
+    &.cmat-drawer-position-left {
+
+        /* Side mode */
+        &.cmat-drawer-mode-side {
+            margin-left: calc(var(--cmat-drawer-width) * -1);
+
+            &.cmat-drawer-opened {
+                margin-left: 0;
+            }
+        }
+
+        /* Over mode */
+        &.cmat-drawer-mode-over {
+            left: 0;
+            transform: translate3d(-100%, 0, 0);
+
+            &.cmat-drawer-opened {
+                transform: translate3d(0, 0, 0);
+            }
+        }
+
+        /* Content */
+        .cmat-drawer-content {
+            left: 0;
+        }
+    }
+
+    /* Right position */
+    &.cmat-drawer-position-right {
+
+        /* Side mode */
+        &.cmat-drawer-mode-side {
+            margin-right: calc(var(--cmat-drawer-width) * -1);
+
+            &.cmat-drawer-opened {
+                margin-right: 0;
+            }
+        }
+
+        /* Over mode */
+        &.cmat-drawer-mode-over {
+            right: 0;
+            transform: translate3d(100%, 0, 0);
+
+            &.cmat-drawer-opened {
+                transform: translate3d(0, 0, 0);
+            }
+        }
+
+        /* Content */
+        .cmat-drawer-content {
+            right: 0;
+        }
+    }
+
+    /* Content */
+    .cmat-drawer-content {
+        position: absolute;
+        display: flex;
+        flex: 1 1 auto;
+        top: 0;
+        bottom: 0;
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+        @apply bg-card;
+    }
+}
+
+/* Overlay */
+.cmat-drawer-overlay {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 299;
+    opacity: 1;
+    background-color: rgba(0, 0, 0, 0.6);
+
+    /* Fixed mode */
+    &.cmat-drawer-overlay-fixed {
+        position: fixed;
+    }
+
+    /* Transparent overlay */
+    &.cmat-drawer-overlay-transparent {
+        background-color: transparent;
+    }
+}

package/components/drawer/drawer.service.d.ts

@@ -0,0 +1,26 @@
+import { CmatDrawerComponent } from './drawer.component';
+import * as i0 from "@angular/core";
+export declare class CmatDrawerService {
+    private _componentRegistry;
+    /**
+     * Register drawer component
+     *
+     * @param name
+     * @param component
+     */
+    registerComponent(name: string, component: CmatDrawerComponent): void;
+    /**
+     * Deregister drawer component
+     *
+     * @param name
+     */
+    deregisterComponent(name: string): void;
+    /**
+     * Get drawer component from the registry
+     *
+     * @param name
+     */
+    getComponent(name: string): CmatDrawerComponent | void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatDrawerService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CmatDrawerService>;
+}

package/components/drawer/drawer.types.d.ts

@@ -0,0 +1,2 @@
+export type CmatDrawerMode = 'over' | 'side';
+export type CmatDrawerPosition = 'left' | 'right';

package/components/drawer/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="cmat/components/drawer" />
+export * from './public-api';

package/components/drawer/public-api.d.ts

@@ -0,0 +1,3 @@
+export * from './drawer.component';
+export * from './drawer.service';
+export * from './drawer.types';

package/components/fullscreen/fullscreen.component.d.ts

@@ -0,0 +1,18 @@
+import { OnInit, TemplateRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class CmatFullscreenComponent implements OnInit {
+    private _document;
+    iconTpl: TemplateRef<any>;
+    tooltip: string;
+    private _fsDoc;
+    private _fsDocEl;
+    private _isFullscreen;
+    constructor(_document: Document);
+    ngOnInit(): void;
+    toggleFullscreen(): void;
+    private _getBrowserFullscreenElement;
+    private _openFullscreen;
+    private _closeFullscreen;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatFullscreenComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CmatFullscreenComponent, "cmat-fullscreen", ["cmatFullscreen"], { "iconTpl": { "alias": "iconTpl"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; }, {}, never, never, true, never>;
+}

package/components/fullscreen/fullscreen.types.d.ts

@@ -0,0 +1,13 @@
+export interface FSDocument extends Document {
+    mozFullScreenElement?: Element;
+    mozCancelFullScreen?: () => void;
+    msFullscreenElement?: Element;
+    msExitFullscreen?: () => void;
+    webkitFullscreenElement?: Element;
+    webkitExitFullscreen?: () => void;
+}
+export interface FSDocumentElement extends HTMLElement {
+    mozRequestFullScreen?: () => void;
+    msRequestFullscreen?: () => void;
+    webkitRequestFullscreen?: () => void;
+}

package/components/fullscreen/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="cmat/components/fullscreen" />
+export * from './public-api';

package/components/fullscreen/public-api.d.ts

@@ -0,0 +1,2 @@
+export * from './fullscreen.component';
+export * from './fullscreen.types';

package/components/highlight/highlight.component.d.ts

@@ -0,0 +1,21 @@
+import { AfterViewInit, ElementRef, OnChanges, SimpleChanges, TemplateRef, ViewContainerRef } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { CmatHighlightService } from './highlight.service';
+import * as i0 from "@angular/core";
+export declare class CmatHighlightComponent implements OnChanges, AfterViewInit {
+    private _domSanitizer;
+    private _elementRef;
+    private _cmatHighlightService;
+    private _viewContainerRef;
+    code: string;
+    lang: string;
+    templateRef: TemplateRef<any>;
+    highlightedCode: string | null;
+    private _viewRef;
+    constructor(_domSanitizer: DomSanitizer, _elementRef: ElementRef, _cmatHighlightService: CmatHighlightService, _viewContainerRef: ViewContainerRef);
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    private _highlightAndInsert;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatHighlightComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CmatHighlightComponent, "textarea[cmat-highlight]", ["cmatHighlight"], { "code": { "alias": "code"; "required": false; }; "lang": { "alias": "lang"; "required": false; }; }, {}, never, ["*"], true, never>;
+}

package/components/highlight/highlight.component.scss

@@ -0,0 +1,3 @@
+textarea[cmat-highlight] {
+    display: none;
+}

package/components/highlight/highlight.service.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class CmatHighlightService {
+    highlight(code: string, language: string): string;
+    private _format;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatHighlightService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CmatHighlightService>;
+}

package/components/highlight/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="cmat/components/highlight" />
+export * from './public-api';

package/components/highlight/public-api.d.ts

@@ -0,0 +1,2 @@
+export * from './highlight.component';
+export * from './highlight.service';

package/components/masonry/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="cmat/components/masonry" />
+export * from './public-api';

package/components/masonry/masonry.component.d.ts

@@ -0,0 +1,13 @@
+import { AfterViewInit, OnChanges, SimpleChanges, TemplateRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class CmatMasonryComponent implements OnChanges, AfterViewInit {
+    columnsTemplate: TemplateRef<any>;
+    columns: number;
+    items: any[];
+    distributedColumns: any[];
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    private _distributeItems;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatMasonryComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CmatMasonryComponent, "cmat-masonry", ["cmatMasonry"], { "columnsTemplate": { "alias": "columnsTemplate"; "required": true; }; "columns": { "alias": "columns"; "required": true; }; "items": { "alias": "items"; "required": false; }; }, {}, never, never, true, never>;
+}

package/components/masonry/public-api.d.ts

@@ -0,0 +1 @@
+export * from './masonry.component';

package/components/material-color-picker/base-color.d.ts

@@ -0,0 +1 @@
+export declare const baseColors: string[];

package/components/material-color-picker/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="cmat/components/material-color-picker" />
+export * from './public-api';

package/components/material-color-picker/material-color-picker.component.d.ts

@@ -0,0 +1,35 @@
+import { EventEmitter } from '@angular/core';
+import { CmatSelectedColor } from './selected-color';
+import { ControlValueAccessor } from '@angular/forms';
+import * as i0 from "@angular/core";
+export declare const CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR: any;
+export declare class CmatMaterialColorPickerComponent implements ControlValueAccessor {
+    colorChanged: EventEmitter<any>;
+    palettes: string[];
+    hues: string[];
+    view: string;
+    selectedColor: CmatSelectedColor;
+    selectedPalette: string;
+    selectedHue: string;
+    private _color;
+    private _title;
+    private _modelChange;
+    private _modelTouched;
+    constructor();
+    get color(): string;
+    set color(value: string);
+    get title(): string;
+    set title(value: string);
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    writeValue(color: any): void;
+    selectPalette(palette: string): void;
+    selectHue(hue: string): void;
+    removeColor(): void;
+    updateSelectedColor(): void;
+    goToPalettesView(): void;
+    onMenuOpen(opened: boolean): void;
+    trackByFn(index: number, item: any): any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatMaterialColorPickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CmatMaterialColorPickerComponent, "cmat-material-color-picker", ["cmatMaterialColorPicker"], { "color": { "alias": "color"; "required": false; }; "title": { "alias": "title"; "required": false; }; }, { "colorChanged": "colorChanged"; }, never, never, true, never>;
+}

package/components/material-color-picker/material-color-picker.component.scss

@@ -0,0 +1,5 @@
+cmat-material-color-picker {
+    .mat-mdc-select-arrow-wrapper {
+        display: none !important;
+    }
+}

package/components/material-color-picker/public-api.d.ts

@@ -0,0 +1,2 @@
+export * from './material-color-picker.component';
+export * from './selected-color';

package/components/material-color-picker/selected-color.d.ts

@@ -0,0 +1,5 @@
+export declare class CmatSelectedColor {
+    palette: string;
+    hue: string;
+    color: string;
+}

package/components/material-datetimepicker/calendar-body.d.ts

@@ -0,0 +1,43 @@
+import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * An internal class that represents the data corresponding to a single calendar cell.
+ */
+export declare class CmatDatetimepickerCalendarCellComponent {
+    value: number;
+    displayValue: string;
+    ariaLabel: string;
+    enabled: boolean;
+    constructor(value: number, displayValue: string, ariaLabel: string, enabled: boolean);
+}
+/**
+ * An internal component used to display calendar data in a table.
+ */
+export declare class CmatDatetimepickerCalendarBodyComponent {
+    /** The label for the table. (e.g. "Jan 2017"). */
+    label: string;
+    /** The cells to display in the table. */
+    rows: CmatDatetimepickerCalendarCellComponent[][];
+    /** The value in the table that corresponds to today. */
+    todayValue: number | null;
+    /** The value in the table that is currently selected. */
+    selectedValue: number | null;
+    /** The minimum number of free cells needed to fit the label in the first row. */
+    labelMinRequiredCells: number;
+    /** The number of columns in the table. */
+    numCols: number;
+    /** Whether to allow selection of disabled cells. */
+    allowDisabledSelection: boolean;
+    /** The cell number of the active cell in the table. */
+    activeCell: number;
+    /** Emits when a new value is selected. */
+    selectedValueChange: EventEmitter<number>;
+    class: string;
+    /** The number of blank cells to put at the beginning for the first row. */
+    get _firstRowOffset(): number;
+    cellClicked(cell: CmatDatetimepickerCalendarCellComponent): void;
+    isActiveCell(rowIndex: number, colIndex: number): boolean;
+    trackByFn(index: number, item: CmatDatetimepickerCalendarCellComponent): any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CmatDatetimepickerCalendarBodyComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CmatDatetimepickerCalendarBodyComponent, "[cmat-datetimepicker-calendar-body]", ["cmatDatetimepickerCalendarBody"], { "label": { "alias": "label"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "todayValue": { "alias": "todayValue"; "required": false; }; "selectedValue": { "alias": "selectedValue"; "required": false; }; "labelMinRequiredCells": { "alias": "labelMinRequiredCells"; "required": false; }; "numCols": { "alias": "numCols"; "required": false; }; "allowDisabledSelection": { "alias": "allowDisabledSelection"; "required": false; }; "activeCell": { "alias": "activeCell"; "required": false; }; }, { "selectedValueChange": "selectedValueChange"; }, never, never, true, never>;
+}

package/components/material-datetimepicker/calendar-body.scss

@@ -0,0 +1,58 @@
+@use 'sass:math';
+
+$calendar-body-label-padding-start: 5% !default;
+$calendar-body-label-side-padding: math.div(33%, 7) !default;
+$calendar-body-cell-min-size: 32px !default;
+$calendar-body-cell-size: math.div(100%, 7) !default;
+$calendar-body-cell-padding: math.div($calendar-body-cell-size, 2) !default;
+$calendar-body-cell-content-margin: 5% !default;
+$calendar-body-cell-content-border-width: 1px !default;
+$calendar-body-cell-radius: 999px !default;
+
+$calendar-body-min-size: 7 * $calendar-body-cell-min-size !default;
+$calendar-body-cell-content-size: 100% - $calendar-body-cell-content-margin * 2 !default;
+
+.cmat-datetimepicker-calendar-body {
+    min-width: $calendar-body-min-size;
+}
+
+.cmat-datetimepicker-calendar-body-label {
+    height: 0;
+    line-height: 0;
+    text-align: left;
+    padding: $calendar-body-cell-padding $calendar-body-label-side-padding;
+
+    [dir='rtl'] & {
+        text-align: right;
+    }
+}
+
+.cmat-datetimepicker-calendar-body-cell {
+    position: relative;
+    width: $calendar-body-cell-size;
+    height: 0;
+    line-height: 0;
+    padding: $calendar-body-cell-padding 0;
+    text-align: center;
+    outline: none;
+    cursor: pointer;
+}
+
+.cmat-datetimepicker-calendar-body-disabled {
+    cursor: default;
+    pointer-events: none;
+}
+
+.cmat-datetimepicker-calendar-body-cell-content {
+    position: absolute;
+    top: $calendar-body-cell-content-margin;
+    left: $calendar-body-cell-content-margin;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
+    width: $calendar-body-cell-content-size;
+    height: $calendar-body-cell-content-size;
+    border: $calendar-body-cell-content-border-width solid transparent;
+    border-radius: $calendar-body-cell-radius;
+}