import { DOCUMENT } from '@angular/common';
import { Component, Inject } from '@angular/core';
import { ResizableBase } from './resizable-base';
import * as i0 from "@angular/core";
import * as i1 from "../../core/cache.service";
/**
 * Make an element resizable horizontally by wrapping it in the ResizableComponent.
 * Default widths / limits are applied but you can optionally override them
 * with min-width and max-width with style attributes
 * @example
 * <ec-resizable [style.width.px]="200"
 *               [style.min-width.px]="75"
 *               [style.max-width.px]="300">
 *    <div> ... </div>
 * </ec-resizable>
 */
export class ResizableComponent extends ResizableBase {
    constructor(el, renderer, cacheService, document) {
        super(renderer, cacheService, document);
        this.el = el;
        //default rememberWidth to true for standard resizable, resizable tables default to false
        this.rememberWidth = true;
    }
    /** Store the host element to reference later */
    ngOnInit() {
        this.currentEl = this.el.nativeElement;
    }
    /**
     * Set the new width of the element and emit the new width to subscribers
     */
    setWidth(width) {
        this.renderer.setStyle(this.currentEl, 'width', width + 'px');
        this.saveWidths([width]);
    }
    /**Called from the base class when cached widths are available and restoring
     * width is enabled. We only care about the first one because we only have one width
     */
    restoreWidths(widths) {
        this.setWidth(widths[0]);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.CacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ResizableComponent, selector: "ec-resizable", usesInheritance: true, ngImport: i0, template: `<div class="content">
              <ng-content></ng-content>
            </div>
            <div class="handle" (mousedown)="startDrag($event)"></div>`, isInline: true, styles: [":host{width:240px;max-width:480px;min-width:100px;position:relative;border-right:1px solid var(--ec-border-color);display:flex}:host.is-active{-webkit-user-select:none;user-select:none}:host.is-active .handle:after{background-color:var(--ec-color-interactive)}.handle{position:absolute;right:-7px;width:13px;height:100%;top:0;padding:0 5px;z-index:var(--ec-z-index-splitter)}.handle:after{content:\"\";display:block;transition:background-color .3s ease;height:100%;position:relative}.handle:hover{cursor:col-resize}.handle:hover:after{background-color:var(--ec-color-interactive)}.content{overflow:hidden;display:flex;flex:1 1;min-height:0;min-width:0}.content ::ng-deep>*{flex:1 1;min-height:0;min-width:0}\n"] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ResizableComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ec-resizable', template: `<div class="content">
              <ng-content></ng-content>
            </div>
            <div class="handle" (mousedown)="startDrag($event)"></div>`, styles: [":host{width:240px;max-width:480px;min-width:100px;position:relative;border-right:1px solid var(--ec-border-color);display:flex}:host.is-active{-webkit-user-select:none;user-select:none}:host.is-active .handle:after{background-color:var(--ec-color-interactive)}.handle{position:absolute;right:-7px;width:13px;height:100%;top:0;padding:0 5px;z-index:var(--ec-z-index-splitter)}.handle:after{content:\"\";display:block;transition:background-color .3s ease;height:100%;position:relative}.handle:hover{cursor:col-resize}.handle:hover:after{background-color:var(--ec-color-interactive)}.content{overflow:hidden;display:flex;flex:1 1;min-height:0;min-width:0}.content ::ng-deep>*{flex:1 1;min-height:0;min-width:0}\n"] }]
        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.CacheService }, { type: Document, decorators: [{
                    type: Inject,
                    args: [DOCUMENT]
                }] }] });
//# sourceMappingURL=data:application/json;base64, 