@amiceli/papierjs 0.8.0 → 0.9.0

package/dist/papierjs/p-cec4e9a5.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["buttonCss","PButtonStyle0","Button","constructor","hostRef","this","type","outline","large","small","block","disabled","dark","getClass","types","cssClass","includes","getParentClass","render","h","key","class","dropdownCss","PDropdownStyle0","Alert","preventSelected","value","open","detectOutsideClick","ev","el","contains","target","resetItem","items","Array","from","getElementsByTagName","item","removeAttribute","componentWillLoad","setAttribute","selected","addEventListener","e","selectEvent","emit","detail","selectValue","getSelectedValue","list","querySelectorAll","find","innerText","placeholder","arrowIcon","feather","icons","toSvg","onClick","innerHTML","PDropdownItemStyle0","DropdownItem","sendClick","changeEvent"],"sources":["src/components/button/button.scss?tag=p-button&encapsulation=shadow","src/components/button/button.tsx","src/components/dropdown/dropdown/dropdown.scss?tag=p-dropdown&encapsulation=shadow","src/components/dropdown/dropdown/dropdown.tsx","src/components/dropdown/dropdown/dropdown.scss?tag=p-dropdown-item&encapsulation=shadow","src/components/dropdown/dropdown-item/dropdown-item.tsx"],"sourcesContent":[":host {\n    @import \"../common\";\n\n    @include useBlock();\n}","import { Component, Prop, h } from '@stencil/core'\n\ntype ButtonColor = 'success' | 'secondary' | 'primary' | 'danger' | 'warning'\n\n/**\n * @slot - button content\n */\n@Component({\n    tag: 'p-button',\n    styleUrl: 'button.scss',\n    shadow: true,\n})\nexport class Button {\n    @Prop()\n    type?: ButtonColor = 'primary'\n    @Prop()\n    outline?: boolean = false\n    @Prop()\n    large?: boolean = false\n    @Prop()\n    small?: boolean = false\n    @Prop()\n    block?: boolean = false\n    @Prop()\n    disabled?: boolean = false\n    @Prop()\n    dark?: boolean = false\n\n    public getClass(): string {\n        const types = ['success', 'secondary', 'primary', 'danger', 'warning']\n        let cssClass = ''\n\n        if (!types.includes(this.type)) {\n            cssClass = 'btn-primary'\n        } else {\n            cssClass = `btn-${this.type}`\n        }\n\n        if (this.disabled) {\n            cssClass = 'disabled'\n        }\n\n        cssClass = `${cssClass}${this.outline ? '-outline' : ''}`\n        cssClass = `${cssClass}${this.large ? ' btn-large' : ''}`\n        cssClass = `${cssClass}${this.small ? ' btn-small' : ''}`\n        cssClass = `${cssClass}${this.block ? ' btn-block' : ''}`\n\n        return cssClass\n    }\n\n    public getParentClass() {\n        let cssClass = 'papier'\n\n        if (this.block) {\n            cssClass = `${cssClass} is--block`\n        }\n\n        if (this.dark) {\n            cssClass = `${cssClass} is--dark`\n        }\n\n        return cssClass\n    }\n    render() {\n        return (\n            <div class={this.getParentClass()}>\n                <button\n                    disabled={this.disabled}\n                    type=\"button\"\n                    class={this.getClass()}\n                >\n                    <slot />\n                </button>\n            </div>\n        )\n    }\n}\n",":host {\n    @import \"../../common\";\n\n    @include useBlock();\n\n    height: 27px;\n\n    .dropdown-item {\n        width: 100%;\n        background: white;\n        height: 27px;\n\n        &.is--dark {\n            background: #41403e;\n        }\n\n        &:hover {\n            cursor: pointer;\n\n            .border {\n                cursor: pointer;\n            }\n        }\n\n        .border {\n            height: 27px;\n            padding-left: 10px;\n            box-sizing: border-box;\n            border-top: none;\n        }\n    }\n\n    .dropdown {\n        position: relative;\n        height: 27px;\n\n        &.is--dark {\n            color : white;\n            .dropdown__header, .dropdown__children {\n                background: #41403e;\n            }\n        }\n\n        &__header {\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            padding-left: 10px;\n            padding-right: 10px;\n            cursor: pointer;\n            position: relative;\n            z-index: 20;\n        }\n\n        &__children {\n            position: absolute;\n            z-index: 222;\n            top: 31px;\n            left: 0;\n            width: 100%;\n            max-height: 200px;\n            display: grid;\n            grid-auto-rows: 27px;\n            max-height: calc(27px * 5);\n            overflow-y: auto;\n            background: white;\n        }\n\n        .for--icon {\n            position: relative;\n            top: 2px;\n            transition: all 0.3s linear;\n            transform: rotate(0deg);\n        }\n\n        &:not(.is--open) {\n            .dropdown__children {\n                display: none;\n            }\n        }\n\n        &.is--open {\n            .dropdown__children {\n                display: grid;\n            }\n\n            .for--icon {\n                transform: rotate(180deg);\n                top: -3px;\n            }\n        }\n    }\n\n    .dropdown {\n        &:not(.is--block) {\n            display: inline-block;\n            min-width: 200px;\n        }\n\n        &.is--block {\n            display: block;\n            width: 100%;\n            box-sizing: border-box;\n        }\n    }\n\n}","import {\n    Component,\n    Element,\n    Event,\n    type EventEmitter,\n    Listen,\n    Prop,\n    State,\n    h,\n} from '@stencil/core'\nimport feather from 'feather-icons'\n\n/**\n * @slot - slot for p-dropdown-item\n */\n@Component({\n    tag: 'p-dropdown',\n    styleUrl: 'dropdown.scss',\n    shadow: true,\n})\nexport class Alert {\n    @Prop()\n    dark?: boolean = false\n    /** Prevent dropdown self update selected value */\n    @Prop()\n    preventSelected?: boolean = false\n    /** Selected item value */\n    @Prop({ mutable: true })\n    value?: string = ''\n    @State()\n    open?: boolean = false\n    @Prop()\n    placeholder?: string\n    @State()\n    selectedValue?: string\n    @Element()\n    public el: HTMLElement\n\n    @Event({ eventName: 'select' })\n    public selectEvent: EventEmitter<string>\n\n    public getParentClass() {\n        return {\n            'papier dropdown': true,\n            'is--dark': this.dark,\n            'is--open': this.open,\n        }\n    }\n\n    @Listen('click', { target: 'window' })\n    public detectOutsideClick(ev) {\n        if (!this.el.contains(ev.target)) {\n            this.open = false\n        }\n    }\n\n    public resetItem() {\n        const items = Array.from(\n            this.el.getElementsByTagName('p-dropdown-item'),\n        )\n\n        for (const item of items) {\n            item.removeAttribute('selected')\n        }\n    }\n\n    public componentWillLoad() {\n        const items = Array.from(\n            this.el.getElementsByTagName('p-dropdown-item'),\n        )\n\n        for (const item of items) {\n            if (this.dark) {\n                item.setAttribute('dark', 'true')\n            }\n            if (item.selected === true) {\n                this.value = item.value\n            }\n            item.addEventListener('change', (e) => {\n                this.selectEvent.emit(e.detail)\n                this.open = !this.open\n\n                if (!this.preventSelected) {\n                    this.resetItem()\n                    item.setAttribute('selected', '')\n                    this.value = e.detail\n                }\n            })\n        }\n    }\n\n    public selectValue(value: string) {\n        this.selectEvent.emit(value)\n    }\n\n    public getSelectedValue(): string {\n        const list = Array.from(this.el.querySelectorAll('p-dropdown-item'))\n        const selected = list.find((item) => {\n            return item.value === this.value\n        })\n\n        return selected?.innerText || this.placeholder || ''\n    }\n\n    render() {\n        const selected = this.getSelectedValue()\n        const arrowIcon = feather.icons['chevron-down'].toSvg()\n\n        return (\n            <div class={this.getParentClass()}>\n                <div\n                    class=\"dropdown__header border border-primary\"\n                    onClick={() => {\n                        this.open = !this.open\n                    }}\n                >\n                    <span>{selected}</span>\n                    <span class=\"for--icon\" innerHTML={arrowIcon} />\n                </div>\n                <div class=\"dropdown__children\">\n                    <slot />\n                </div>\n            </div>\n        )\n    }\n}\n",":host {\n    @import \"../../common\";\n\n    @include useBlock();\n\n    height: 27px;\n\n    .dropdown-item {\n        width: 100%;\n        background: white;\n        height: 27px;\n\n        &.is--dark {\n            background: #41403e;\n        }\n\n        &:hover {\n            cursor: pointer;\n\n            .border {\n                cursor: pointer;\n            }\n        }\n\n        .border {\n            height: 27px;\n            padding-left: 10px;\n            box-sizing: border-box;\n            border-top: none;\n        }\n    }\n\n    .dropdown {\n        position: relative;\n        height: 27px;\n\n        &.is--dark {\n            color : white;\n            .dropdown__header, .dropdown__children {\n                background: #41403e;\n            }\n        }\n\n        &__header {\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            padding-left: 10px;\n            padding-right: 10px;\n            cursor: pointer;\n            position: relative;\n            z-index: 20;\n        }\n\n        &__children {\n            position: absolute;\n            z-index: 222;\n            top: 31px;\n            left: 0;\n            width: 100%;\n            max-height: 200px;\n            display: grid;\n            grid-auto-rows: 27px;\n            max-height: calc(27px * 5);\n            overflow-y: auto;\n            background: white;\n        }\n\n        .for--icon {\n            position: relative;\n            top: 2px;\n            transition: all 0.3s linear;\n            transform: rotate(0deg);\n        }\n\n        &:not(.is--open) {\n            .dropdown__children {\n                display: none;\n            }\n        }\n\n        &.is--open {\n            .dropdown__children {\n                display: grid;\n            }\n\n            .for--icon {\n                transform: rotate(180deg);\n                top: -3px;\n            }\n        }\n    }\n\n    .dropdown {\n        &:not(.is--block) {\n            display: inline-block;\n            min-width: 200px;\n        }\n\n        &.is--block {\n            display: block;\n            width: 100%;\n            box-sizing: border-box;\n        }\n    }\n\n}","import { Component, Event, type EventEmitter, Prop, h } from '@stencil/core'\n\n@Component({\n    tag: 'p-dropdown-item',\n    styleUrl: '../dropdown/dropdown.scss',\n    shadow: true,\n})\nexport class DropdownItem {\n    @Prop()\n    value!: string\n    @Prop()\n    selected?: boolean = false\n    @Prop()\n    dark?: boolean = false\n\n    @Event({ eventName: 'change' })\n    public changeEvent: EventEmitter<string>\n\n    public getParentClass() {\n        return {\n            'papier dropdown-item': true,\n            'is--dark': this.dark,\n        }\n    }\n\n    public sendClick() {\n        this.changeEvent.emit(this.value)\n    }\n\n    render() {\n        return (\n            <div class={this.getParentClass()} onClick={() => this.sendClick()}>\n                <div\n                    class={{\n                        'background-success': this.selected,\n                        'border border-primary': true,\n                    }}\n                >\n                    <slot />\n                </div>\n            </div>\n        )\n    }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/papierjs/p-d3e11d7d.entry.js

@@ -1,2 +0,0 @@
-import{r as e,h as t,g as i}from"./p-4cb8bb30.js";const a=class{constructor(t){e(this,t)}addNotification(e){const t=this.el.querySelector("p-notification-handler");if(t){t.pushNotification(Object.assign({type:this.notificationType,canclose:false,text:`${this.notificationType||"primary"} notification`},e))}}render(){return t("div",{key:"f91b39bf657b53b7541bae0fd67c154268fcd32e"},t("p-notification-handler",{key:"28dee556aa50fa3fb9b23f194574cb3ee4a11c38"}),t("p-dropdown",{key:"51a6a668015f0c8028aed169a3438aeaf294b2a7",placeholder:"Choose notification type",onSelect:e=>{this.notificationType=e.detail}},["primary","secondary","success","warning","danger"].map((e=>t("p-dropdown-item",{key:e,value:e},e)))),t("div",{key:"6a3bad38217205aa55f2f00aa704e119f33b7826",style:{marginTop:"20px"}},t("p-button",{key:"6f835b88824a47d1b683475e22dd2d306ec9b160",style:{marginRight:"20px"},type:"primary",onClick:()=>{this.addNotification({})}},"Add notification"),t("p-button",{key:"b1223604689ff1fb087ce42e0eefcc0b4dc36752",type:"secondary",style:{marginRight:"20px"},onClick:()=>{this.addNotification({canclose:true})}},"Add closable notification"),t("p-button",{key:"91223a491636b94f13141c800e34e91110d4e994",type:"success",onClick:()=>{this.addNotification({timeout:2e3})}},"Add timeout notification")))}get el(){return i(this)}};export{a as p_notification_preview};
-//# sourceMappingURL=p-d3e11d7d.entry.js.map