q2-tecton-elements 1.37.1 → 1.38.1

package/dist/esm/index-74a659a5.js.map

@@ -1 +0,0 @@
-{"file":"index-74a659a5.js","mappings":"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","names":["smoothScroll"],"sources":["../../node_modules/smoothscroll-polyfill/dist/smoothscroll.js","./src/utils/index.tsx"],"sourcesContent":["/* smoothscroll v0.4.4 - 2019 - Dustan Kasten, Jeremias Menichelli - MIT License */\n(function () {\n  'use strict';\n\n  // polyfill\n  function polyfill() {\n    // aliases\n    var w = window;\n    var d = document;\n\n    // return if scroll behavior is supported and polyfill is not forced\n    if (\n      'scrollBehavior' in d.documentElement.style &&\n      w.__forceSmoothScrollPolyfill__ !== true\n    ) {\n      return;\n    }\n\n    // globals\n    var Element = w.HTMLElement || w.Element;\n    var SCROLL_TIME = 468;\n\n    // object gathering original scroll methods\n    var original = {\n      scroll: w.scroll || w.scrollTo,\n      scrollBy: w.scrollBy,\n      elementScroll: Element.prototype.scroll || scrollElement,\n      scrollIntoView: Element.prototype.scrollIntoView\n    };\n\n    // define timing method\n    var now =\n      w.performance && w.performance.now\n        ? w.performance.now.bind(w.performance)\n        : Date.now;\n\n    /**\n     * indicates if a the current browser is made by Microsoft\n     * @method isMicrosoftBrowser\n     * @param {String} userAgent\n     * @returns {Boolean}\n     */\n    function isMicrosoftBrowser(userAgent) {\n      var userAgentPatterns = ['MSIE ', 'Trident/', 'Edge/'];\n\n      return new RegExp(userAgentPatterns.join('|')).test(userAgent);\n    }\n\n    /*\n     * IE has rounding bug rounding down clientHeight and clientWidth and\n     * rounding up scrollHeight and scrollWidth causing false positives\n     * on hasScrollableSpace\n     */\n    var ROUNDING_TOLERANCE = isMicrosoftBrowser(w.navigator.userAgent) ? 1 : 0;\n\n    /**\n     * changes scroll position inside an element\n     * @method scrollElement\n     * @param {Number} x\n     * @param {Number} y\n     * @returns {undefined}\n     */\n    function scrollElement(x, y) {\n      this.scrollLeft = x;\n      this.scrollTop = y;\n    }\n\n    /**\n     * returns result of applying ease math function to a number\n     * @method ease\n     * @param {Number} k\n     * @returns {Number}\n     */\n    function ease(k) {\n      return 0.5 * (1 - Math.cos(Math.PI * k));\n    }\n\n    /**\n     * indicates if a smooth behavior should be applied\n     * @method shouldBailOut\n     * @param {Number|Object} firstArg\n     * @returns {Boolean}\n     */\n    function shouldBailOut(firstArg) {\n      if (\n        firstArg === null ||\n        typeof firstArg !== 'object' ||\n        firstArg.behavior === undefined ||\n        firstArg.behavior === 'auto' ||\n        firstArg.behavior === 'instant'\n      ) {\n        // first argument is not an object/null\n        // or behavior is auto, instant or undefined\n        return true;\n      }\n\n      if (typeof firstArg === 'object' && firstArg.behavior === 'smooth') {\n        // first argument is an object and behavior is smooth\n        return false;\n      }\n\n      // throw error when behavior is not supported\n      throw new TypeError(\n        'behavior member of ScrollOptions ' +\n          firstArg.behavior +\n          ' is not a valid value for enumeration ScrollBehavior.'\n      );\n    }\n\n    /**\n     * indicates if an element has scrollable space in the provided axis\n     * @method hasScrollableSpace\n     * @param {Node} el\n     * @param {String} axis\n     * @returns {Boolean}\n     */\n    function hasScrollableSpace(el, axis) {\n      if (axis === 'Y') {\n        return el.clientHeight + ROUNDING_TOLERANCE < el.scrollHeight;\n      }\n\n      if (axis === 'X') {\n        return el.clientWidth + ROUNDING_TOLERANCE < el.scrollWidth;\n      }\n    }\n\n    /**\n     * indicates if an element has a scrollable overflow property in the axis\n     * @method canOverflow\n     * @param {Node} el\n     * @param {String} axis\n     * @returns {Boolean}\n     */\n    function canOverflow(el, axis) {\n      var overflowValue = w.getComputedStyle(el, null)['overflow' + axis];\n\n      return overflowValue === 'auto' || overflowValue === 'scroll';\n    }\n\n    /**\n     * indicates if an element can be scrolled in either axis\n     * @method isScrollable\n     * @param {Node} el\n     * @param {String} axis\n     * @returns {Boolean}\n     */\n    function isScrollable(el) {\n      var isScrollableY = hasScrollableSpace(el, 'Y') && canOverflow(el, 'Y');\n      var isScrollableX = hasScrollableSpace(el, 'X') && canOverflow(el, 'X');\n\n      return isScrollableY || isScrollableX;\n    }\n\n    /**\n     * finds scrollable parent of an element\n     * @method findScrollableParent\n     * @param {Node} el\n     * @returns {Node} el\n     */\n    function findScrollableParent(el) {\n      while (el !== d.body && isScrollable(el) === false) {\n        el = el.parentNode || el.host;\n      }\n\n      return el;\n    }\n\n    /**\n     * self invoked function that, given a context, steps through scrolling\n     * @method step\n     * @param {Object} context\n     * @returns {undefined}\n     */\n    function step(context) {\n      var time = now();\n      var value;\n      var currentX;\n      var currentY;\n      var elapsed = (time - context.startTime) / SCROLL_TIME;\n\n      // avoid elapsed times higher than one\n      elapsed = elapsed > 1 ? 1 : elapsed;\n\n      // apply easing to elapsed time\n      value = ease(elapsed);\n\n      currentX = context.startX + (context.x - context.startX) * value;\n      currentY = context.startY + (context.y - context.startY) * value;\n\n      context.method.call(context.scrollable, currentX, currentY);\n\n      // scroll more if we have not reached our destination\n      if (currentX !== context.x || currentY !== context.y) {\n        w.requestAnimationFrame(step.bind(w, context));\n      }\n    }\n\n    /**\n     * scrolls window or element with a smooth behavior\n     * @method smoothScroll\n     * @param {Object|Node} el\n     * @param {Number} x\n     * @param {Number} y\n     * @returns {undefined}\n     */\n    function smoothScroll(el, x, y) {\n      var scrollable;\n      var startX;\n      var startY;\n      var method;\n      var startTime = now();\n\n      // define scroll context\n      if (el === d.body) {\n        scrollable = w;\n        startX = w.scrollX || w.pageXOffset;\n        startY = w.scrollY || w.pageYOffset;\n        method = original.scroll;\n      } else {\n        scrollable = el;\n        startX = el.scrollLeft;\n        startY = el.scrollTop;\n        method = scrollElement;\n      }\n\n      // scroll looping over a frame\n      step({\n        scrollable: scrollable,\n        method: method,\n        startTime: startTime,\n        startX: startX,\n        startY: startY,\n        x: x,\n        y: y\n      });\n    }\n\n    // ORIGINAL METHODS OVERRIDES\n    // w.scroll and w.scrollTo\n    w.scroll = w.scrollTo = function() {\n      // avoid action when no arguments are passed\n      if (arguments[0] === undefined) {\n        return;\n      }\n\n      // avoid smooth behavior if not required\n      if (shouldBailOut(arguments[0]) === true) {\n        original.scroll.call(\n          w,\n          arguments[0].left !== undefined\n            ? arguments[0].left\n            : typeof arguments[0] !== 'object'\n              ? arguments[0]\n              : w.scrollX || w.pageXOffset,\n          // use top prop, second argument if present or fallback to scrollY\n          arguments[0].top !== undefined\n            ? arguments[0].top\n            : arguments[1] !== undefined\n              ? arguments[1]\n              : w.scrollY || w.pageYOffset\n        );\n\n        return;\n      }\n\n      // LET THE SMOOTHNESS BEGIN!\n      smoothScroll.call(\n        w,\n        d.body,\n        arguments[0].left !== undefined\n          ? ~~arguments[0].left\n          : w.scrollX || w.pageXOffset,\n        arguments[0].top !== undefined\n          ? ~~arguments[0].top\n          : w.scrollY || w.pageYOffset\n      );\n    };\n\n    // w.scrollBy\n    w.scrollBy = function() {\n      // avoid action when no arguments are passed\n      if (arguments[0] === undefined) {\n        return;\n      }\n\n      // avoid smooth behavior if not required\n      if (shouldBailOut(arguments[0])) {\n        original.scrollBy.call(\n          w,\n          arguments[0].left !== undefined\n            ? arguments[0].left\n            : typeof arguments[0] !== 'object' ? arguments[0] : 0,\n          arguments[0].top !== undefined\n            ? arguments[0].top\n            : arguments[1] !== undefined ? arguments[1] : 0\n        );\n\n        return;\n      }\n\n      // LET THE SMOOTHNESS BEGIN!\n      smoothScroll.call(\n        w,\n        d.body,\n        ~~arguments[0].left + (w.scrollX || w.pageXOffset),\n        ~~arguments[0].top + (w.scrollY || w.pageYOffset)\n      );\n    };\n\n    // Element.prototype.scroll and Element.prototype.scrollTo\n    Element.prototype.scroll = Element.prototype.scrollTo = function() {\n      // avoid action when no arguments are passed\n      if (arguments[0] === undefined) {\n        return;\n      }\n\n      // avoid smooth behavior if not required\n      if (shouldBailOut(arguments[0]) === true) {\n        // if one number is passed, throw error to match Firefox implementation\n        if (typeof arguments[0] === 'number' && arguments[1] === undefined) {\n          throw new SyntaxError('Value could not be converted');\n        }\n\n        original.elementScroll.call(\n          this,\n          // use left prop, first number argument or fallback to scrollLeft\n          arguments[0].left !== undefined\n            ? ~~arguments[0].left\n            : typeof arguments[0] !== 'object' ? ~~arguments[0] : this.scrollLeft,\n          // use top prop, second argument or fallback to scrollTop\n          arguments[0].top !== undefined\n            ? ~~arguments[0].top\n            : arguments[1] !== undefined ? ~~arguments[1] : this.scrollTop\n        );\n\n        return;\n      }\n\n      var left = arguments[0].left;\n      var top = arguments[0].top;\n\n      // LET THE SMOOTHNESS BEGIN!\n      smoothScroll.call(\n        this,\n        this,\n        typeof left === 'undefined' ? this.scrollLeft : ~~left,\n        typeof top === 'undefined' ? this.scrollTop : ~~top\n      );\n    };\n\n    // Element.prototype.scrollBy\n    Element.prototype.scrollBy = function() {\n      // avoid action when no arguments are passed\n      if (arguments[0] === undefined) {\n        return;\n      }\n\n      // avoid smooth behavior if not required\n      if (shouldBailOut(arguments[0]) === true) {\n        original.elementScroll.call(\n          this,\n          arguments[0].left !== undefined\n            ? ~~arguments[0].left + this.scrollLeft\n            : ~~arguments[0] + this.scrollLeft,\n          arguments[0].top !== undefined\n            ? ~~arguments[0].top + this.scrollTop\n            : ~~arguments[1] + this.scrollTop\n        );\n\n        return;\n      }\n\n      this.scroll({\n        left: ~~arguments[0].left + this.scrollLeft,\n        top: ~~arguments[0].top + this.scrollTop,\n        behavior: arguments[0].behavior\n      });\n    };\n\n    // Element.prototype.scrollIntoView\n    Element.prototype.scrollIntoView = function() {\n      // avoid smooth behavior if not required\n      if (shouldBailOut(arguments[0]) === true) {\n        original.scrollIntoView.call(\n          this,\n          arguments[0] === undefined ? true : arguments[0]\n        );\n\n        return;\n      }\n\n      // LET THE SMOOTHNESS BEGIN!\n      var scrollableParent = findScrollableParent(this);\n      var parentRects = scrollableParent.getBoundingClientRect();\n      var clientRects = this.getBoundingClientRect();\n\n      if (scrollableParent !== d.body) {\n        // reveal element inside parent\n        smoothScroll.call(\n          this,\n          scrollableParent,\n          scrollableParent.scrollLeft + clientRects.left - parentRects.left,\n          scrollableParent.scrollTop + clientRects.top - parentRects.top\n        );\n\n        // reveal parent in viewport unless is fixed\n        if (w.getComputedStyle(scrollableParent).position !== 'fixed') {\n          w.scrollBy({\n            left: parentRects.left,\n            top: parentRects.top,\n            behavior: 'smooth'\n          });\n        }\n      } else {\n        // reveal element in viewport\n        w.scrollBy({\n          left: clientRects.left,\n          top: clientRects.top,\n          behavior: 'smooth'\n        });\n      }\n    };\n  }\n\n  if (typeof exports === 'object' && typeof module !== 'undefined') {\n    // commonjs\n    module.exports = { polyfill: polyfill };\n  } else {\n    // global\n    polyfill();\n  }\n\n}());\n","import { h } from '@stencil/core';\nimport { Q2Btn } from 'src/components/q2-btn';\nimport { Q2Calendar } from 'src/components/q2-calendar';\nimport { Q2Carousel } from 'src/components/q2-carousel';\nimport { Q2Checkbox } from 'src/components/q2-checkbox';\nimport { Q2Dropdown } from 'src/components/q2-dropdown';\nimport { Q2DropdownItem } from 'src/components/q2-dropdown-item';\nimport { Q2EditableField } from 'src/components/q2-editable-field';\nimport { Q2Input } from 'src/components/q2-input';\nimport { Q2Loading } from 'src/components/q2-loading';\nimport { Q2Radio } from 'src/components/q2-radio';\nimport { Q2Select } from 'src/components/q2-select';\nimport { FormFieldTypes, IDict } from 'src/util';\nimport smoothScroll from 'smoothscroll-polyfill';\n\nexport function isMobile(): boolean {\n    return /Android|webOS|iPhone|iPad|iPod|BlackBerry|Mobile|IEMobile|Windows Phone|Opera Mini/i.test(\n        navigator.userAgent\n    );\n}\n\nexport function isHostLosingFocus(event: FocusEvent, hostElement: HTMLElement) {\n    const type = event.type;\n    const focusInTypes = ['focusin', 'focus'];\n    const isFocusIn = focusInTypes.includes(type);\n\n    // on focusin: `target` is element losing focus, `relatedTarget` is element gaining focus\n    // on focusout: `target` is element gaining focus, `relatedTarget` is element losing focus\n    const elementGainingFocus = isFocusIn ? event.target : event.relatedTarget;\n\n    const isElementNestedInHostElement = (element: HTMLElement) => {\n        if (element === hostElement) return true;\n        if (element.parentElement) {\n            return isElementNestedInHostElement(element.parentElement);\n        }\n        return false;\n    };\n\n    if (!(elementGainingFocus instanceof HTMLElement)) return true;\n    return !isElementNestedInHostElement(elementGainingFocus);\n}\n\nexport function isRelatedTargetWithinHost(event: FocusEvent, element: HTMLElement) {\n    return event.relatedTarget !== element && !element.contains(event.relatedTarget as Node);\n}\n\nexport function isEventFromElement(event: Event, element: HTMLElement): boolean {\n    return event.composedPath?.()[0] === element;\n}\n\nexport function overrideFocus(hostElement: HTMLElement) {\n    hostElement.focus = () => hostElement?.dispatchEvent(new FocusEvent('focus', { bubbles: false }));\n}\n\nexport function addSmoothScrollPolyfill() {\n    if (!isSafari()) return false;\n    smoothScroll.polyfill();\n    return (window.__forceSmoothScrollPolyfill__ = true);\n}\n\nexport function isFirefox() {\n    const userAgent = navigator.userAgent.toLowerCase();\n    return userAgent.includes('firefox');\n}\n\nexport function isTouchDevice() {\n    return 'ontouchstart' in window || navigator.maxTouchPoints > 0;\n}\n\nexport function isSafari() {\n    const userAgent = navigator.userAgent.toLowerCase();\n    return userAgent.includes('safari') && !userAgent.includes('chrome');\n}\n\nlet guid: number = 1000;\nexport function createGuid(): number {\n    return guid++;\n}\n\nexport function nextPaint(fn: (value?: unknown) => void) {\n    requestAnimationFrame(() => {\n        requestAnimationFrame(fn);\n    });\n}\n\nexport function waitForNextPaint() {\n    return new Promise(resolve => nextPaint(resolve));\n}\n\nexport function capitalize(value: string) {\n    return `${value.charAt(0).toUpperCase()}${value.slice(1)}`;\n}\n\nexport function pick(props: string[]): (obj: object) => object {\n    return obj => {\n        return props.reduce((memo, prop) => {\n            return {\n                ...memo,\n                [prop]: obj[prop],\n            };\n        }, {});\n    };\n}\n\nexport function loc(key: string, subs?: IDict<any> | string[]) {\n    if (!key) return '';\n    if (window.Tecton?.noStrings === true) {\n        return key;\n    }\n    return window?.TectonElements?.loc(key, subs) ?? key;\n}\n\nexport function labelDOM(target: FormFieldTypes) {\n    const { label, hideLabel, optional, readonly } = target;\n    const labelClasses: string[] = ['input-label'];\n    let helpText = '';\n\n    if (hideLabel) labelClasses.push('sr');\n    if (optional) {\n        helpText = <span class=\"optional-tag\">{loc('tecton.element.input.optional')}</span>;\n    }\n    if (readonly) {\n        helpText = <span class=\"optional-tag\">{loc('tecton.element.input.readonly')}</span>;\n        labelClasses.push('readonly-field');\n    }\n    return (\n        <label\n            htmlFor={target.inputId}\n            class={labelClasses.join(' ')}\n        >\n            <slot name=\"label\">\n                {label ? loc(label) : undefined}\n                {helpText}\n            </slot>\n        </label>\n    );\n}\n\nexport function handleAriaLabel(\n    target:\n        | Q2Input\n        | Q2Select\n        | Q2Radio\n        | Q2Checkbox\n        | Q2EditableField\n        | Q2Dropdown\n        | Q2DropdownItem\n        | Q2Loading\n        | Q2Carousel\n        | Q2Calendar\n        | Q2Btn\n) {\n    const { ariaLabel } = target;\n    if (!ariaLabel) return;\n\n    // If empty ariaLabel prop is set to primitive symbol by framework wrapper, set ariaLabel to undefined and return\n    const FW_WRAPPERS_EMPTY_PROP = Symbol().toString();\n    if (ariaLabel === FW_WRAPPERS_EMPTY_PROP) {\n        target.ariaLabel = undefined;\n        return;\n    }\n\n    // If ariaLabel is set, set hideLabel to true and set label to ariaLabel\n    if ('hideLabel' in target) target.hideLabel = true;\n    target.label = loc(ariaLabel);\n    target.ariaLabel = undefined;\n}\n\n/**\n * Handles when a prop has been renamed on a component without introducing a breaking change.\n */\nexport function handleRenamedProp(target: object, oldProp: string, newProp: string, removeOldProp?: boolean) {\n    if (typeof target[oldProp] === 'undefined') return;\n\n    // If old prop has value, aka set in component, call handleDeprecationWarning()\n    if (target[oldProp]) {\n        handleDeprecationWarning(target, oldProp, 'prop');\n    }\n\n    target[newProp] = target[oldProp];\n\n    if (removeOldProp) {\n        delete target[oldProp];\n    }\n}\n\nexport function handleDeprecationWarning(\n    target: object,\n    deprecatedItemName: string,\n    deprecatedItemType: 'function' | 'prop' | 'method' | 'event'\n) {\n    if (window.location.hostname === 'localhost' || window.location.host === 'stack.q2developer.com') {\n        if (target[deprecatedItemName] === 'undefined') return;\n\n        const componentName = target.constructor.name.toLowerCase().slice(2);\n\n        switch (deprecatedItemType) {\n            case 'prop':\n                if (deprecatedItemName === 'size' && componentName === 'btn') {\n                    console.warn(\n                        `The property of size in q2-btn should not be typeof number, or typeof string containing a number. This functionality will be deprecated in an upcoming relase. Instead please use typeof string with any of the following values: \"small\" / \"medium\" / \"large\" / \"none\" `\n                    );\n                } else {\n                    console.warn(\n                        `The property ${deprecatedItemName} in q2-${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n                    );\n                }\n                break;\n\n            case 'function':\n                console.warn(\n                    `The function ${deprecatedItemName} in ${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n                );\n                break;\n\n            case 'method':\n                console.warn(\n                    `The method ${deprecatedItemName} in ${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n                );\n                break;\n\n            case 'event':\n                console.warn(\n                    `The event ${deprecatedItemName} in ${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n                );\n                break;\n\n            default:\n                console.error(\n                    `handleDeprecationWarning --> No type found for desired deprecation: ${deprecatedItemName} in q2-${componentName}: deprecatedItemType = ${deprecatedItemName}`\n                );\n        }\n    }\n}\n\nexport function messagesDOM(target: FormFieldTypes) {\n    const type = target.hasError ? 'danger' : 'info';\n\n    return (\n        <div class=\"messages-container\">\n            <q2-message\n                appearance=\"minimal\"\n                description\n                type={type}\n                test-id=\"message\"\n            >\n                <ul id={target.inputDescribedBy}>\n                    {target.messages.map(message => (\n                        <li test-id=\"messageListItem\">{loc(message)}</li>\n                    ))}\n                </ul>\n            </q2-message>\n        </div>\n    );\n}\n\nexport function setMessageHeight(target: FormFieldTypes) {\n    const messageContainer = (target.hostElement.shadowRoot as ShadowRoot).querySelector<HTMLDivElement>(\n        '.messages-container'\n    );\n    const q2Message = messageContainer.querySelector('q2-message');\n    nextPaint(() => {\n        const height = target.showMessages && target.hasFocus ? q2Message.getBoundingClientRect().height : 0;\n\n        if (messageContainer.style.getPropertyValue('height') === `${height}px`) return;\n\n        if (height === 0) {\n            q2Message.classList.add('invisible');\n            messageContainer.style.removeProperty('height');\n        } else {\n            q2Message.classList.remove('invisible');\n            messageContainer.style.setProperty('height', `${height}px`);\n        }\n    });\n}\n\nexport const resizeIframe = () => {\n    return window.TectonElements?.resizeIframe?.();\n};\n\n// Handling color attribute (deprecated)\nexport const handleColor = (target: Q2Btn) => {\n    if (!target.intent && ['primary', 'secondary'].includes(target.color)) {\n        target.intent = `workflow-${target.color}` as HTMLQ2BtnElement['intent'];\n        target.color = undefined;\n    }\n};\n"],"version":3}

package/dist/q2-tecton-elements/p-077107c1.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as a,h as r,F as i,g as e}from"./p-277dc8cd.js";import{b as o,o as s,i as c}from"./p-ef856249.js";const n="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}.container{position:relative;width:100%;text-align:start;height:100%;display:grid;gap:var(--tct-card-gap, var(--t-card-gap, var(--app-scale-3x, 15px)));margin:0;color:var(--tct-card-color, var(--t-card-color, var(--t-text, #4d4d4d)));--comp-avatar-size:var(--tct-card-avatar-size, var(--t-card-avatar-size, 44px));--comp-chevron-size:0;--comp-bar-width:var(--tct-card-bar-width, var(--t-card-bar-width, var(--app-scale-2x, 10px)));--comp-card-padding:var(--tct-card-padding, var(--t-card-padding, var(--app-scale-4x, 20px)))}.container.is-small{--comp-avatar-size:var(--tct-card-avatar-size, var(--t-card-avatar-size, 26px))}.container.has-avatar{grid-template-columns:var(--comp-avatar-size) 1fr;--tct-avatar-width:var(--comp-avatar-size);--tct-avatar-height:var(--comp-avatar-size);--tct-icon-size:var(--comp-avatar-size)}:host([bar][is-static]) .container{padding-left:var(--comp-card-padding)}:host(:not([is-static])) .container{--comp-border-radius:var(--tct-card-border-radius, var(--t-card-border-radius, var(--app-border-radius-1, 3px)));--comp-border-width:var(--tct-card-border-width, var(--t-card-border-width, 0px));border:none;background:var(--tct-card-background, var(--t-card-background, var(--t-base, #ffffff)));padding:var(--comp-card-padding);text-decoration:none;border-width:var(--comp-border-width);border-color:var(--tct-card-border-color, var(--t-card-border-color, transparent));border-style:var(--tct-card-border-style, solid);border-radius:var(--comp-border-radius);transition:box-shadow var(--tct-tween-1, var(--app-tween-1, 0.2s ease));box-shadow:var(--tct-card-box-shadow, var(--t-card-box-shadow, var(--app-shadow-2, 0 3px 6px rgba(0, 0, 0, 0.3))))}:host(:not([is-static])) .container.clickable{cursor:pointer}@media (hover: hover){:host(:not([is-static])) .container.clickable{--comp-card-hover-box-shadow:var(--tct-card-hover-box-shadow, var(--t-card-hover-box-shadow, var(--app-shadow-3, 0 4px 12px rgba(0, 0, 0, 0.3))))}:host(:not([is-static])) .container.clickable:hover,:host(:not([is-static])) .container.clickable:active,:host(:not([is-static])) .container.clickable:focus{color:var(--tct-card-color, var(--t-card-color, var(--t-text, #4d4d4d)));box-shadow:var(--const-double-focus-ring)}:host(:not([is-static])) .container.clickable:hover{box-shadow:var(--comp-card-hover-box-shadow)}:host(:not([is-static])) .container.clickable:focus:hover{box-shadow:var(--const-double-focus-ring), var(--comp-card-hover-box-shadow)}:host(:not([is-static])) .container.clickable:active{box-shadow:var(--tct-card-active-box-shadow, var(--t-card-active-box-shadow, var(--app-shadow-1, 0 2px 4px rgba(0, 0, 0, 0.3))))}}:host(:not([is-static])) .container.is-touch{--comp-chevron-size:var(--tct-card-chevron-size, var(--t-card-chevron-size, 26px));grid-template-columns:1fr var(--comp-chevron-size)}:host(:not([is-static])) .container.has-avatar.is-touch{grid-template-columns:var(--comp-avatar-size) 1fr var(--comp-chevron-size)}.content{overflow:hidden;display:grid;gap:var(--tct-card-content-gap, var(--t-card-content-gap, var(--app-scale-1x, 5px)));align-content:start}h3,p{margin:0;padding:0;line-height:var(--tct-card-font-height, var(--t-card-font-height, 20px))}h3{font-weight:var(--tct-card-font-weight, var(--t-card-font-weight, 600));font-size:var(--tct-card-font-size, var(--t-card-font-size, 17px));text-overflow:ellipsis;overflow:hidden;white-space:nowrap}p{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.bar{--comp-bar-border-radius:calc(var(--comp-border-radius) - var(--comp-border-width));border-radius:var(--comp-bar-border-radius) 0 0 var(--comp-bar-border-radius);position:absolute;inset:0 auto auto 0;width:var(--comp-bar-width);background:var(--comp-bar-color);height:100%}.touch-indicator{align-self:center;--tct-icon-size:var(--comp-chevron-size)}";const d=["primary","secondary","tertiary","accent-1","accent-2","accent-3","accent-4","accent-5","accent-6","accent-7","accent-8","accent-9","accent-10","accent-11","accent-12"];const h=["info","success","warning","alert"];const l=class{constructor(r){t(this,r);this.click=a(this,"click",7);this.handleClick=t=>{if(this.url)return true;t.preventDefault();t.stopPropagation();this.click.emit()};this.title=undefined;this.description=undefined;this.avatarName=undefined;this.avatarInitials=undefined;this.avatarIcon=undefined;this.avatarSrc=undefined;this.isSmall=undefined;this.bar=undefined;this.isStatic=undefined;this.isTouch=o();this.url=undefined;this.target=undefined;this.type="clickable";this.isAutoTouch=false;this.isAutoSmall=false}componentWillLoad(){this.checkBar()}componentDidLoad(){const{hostElement:t,clickableElement:a}=this;t.click=()=>a.click();s(this.hostElement);this.resizeObserver=new ResizeObserver((()=>this.determineAutoSmall()));this.resizeObserver.observe(this.hostElement)}disconnectedCallback(){this.resizeObserver=null}onHostElementFocus(t){if(!c(t,this.hostElement))return;this.clickableElement.focus()}checkBar(){const{bar:t}=this;if(!t)return;if(d.includes(t)){this.barColor=`var(--t-${t})`}else if(h.includes(t)){this.barColor=`var(--const-stoplight-${t})`}else{this.barColor=t}}determineAutoTouch(){if(this.hostElement.hasAttribute("is-touch"))return;this.isAutoTouch=o()}determineAutoSmall(){var t,a;if(this.isStatic)return;if(this.hostElement.hasAttribute("is-small"))return;const{containerElement:r,avatarElement:i}=this;const e=(t=i===null||i===void 0?void 0:i.offsetWidth)!==null&&t!==void 0?t:0;const o=(a=r===null||r===void 0?void 0:r.offsetWidth)!==null&&a!==void 0?a:0;const s=e+o;this.isAutoSmall=s<350}generateAvatar(){const{avatarName:t,avatarInitials:a,avatarSrc:i,avatarIcon:e}=this;if(e){return r("q2-icon",{type:e,ref:t=>this.avatarElement=t,"test-id":"avatar"})}else if(t||a||i){return r("q2-avatar",{name:t,initials:a,src:i,ref:t=>this.avatarElement=t,"test-id":"avatar"})}}generateContent(){return r(i,null,this.bar&&r("div",{class:"bar","test-id":"bar",style:{"--comp-bar-color":this.barColor}}),this.generateAvatar(),r("div",{class:"content","test-id":"contentContainer",ref:t=>this.containerElement=t},this.title&&r("h3",{"test-id":"title"},this.title),this.description&&r("p",{"test-id":"description"},this.description),r("slot",null)),this.isTouch&&!this.isStatic&&r("q2-icon",{"test-id":"touchIndicator",type:"chevron-right",class:"touch-indicator"}))}generateContainerClasses(){const{isSmall:t,isAutoSmall:a,avatarName:r,avatarInitials:i,avatarSrc:e,avatarIcon:o,isTouch:s,isAutoTouch:c,isStatic:n,type:d}=this;const h=["container",d];const l=t||a;const v=s||c;const p=r||i||e||o;if(l)h.push("is-small");if(v&&!n)h.push("is-touch");if(p)h.push("has-avatar");if(n)h.push("is-static");return h.join(" ")}render(){const{url:t,isStatic:a,type:i}=this;if(a||i==="non-clickable")return r("div",{ref:t=>this.clickableElement=t,class:this.generateContainerClasses(),"test-id":"clickableElement"},this.generateContent());else if(!!t)return r("a",{ref:t=>this.clickableElement=t,href:this.url,class:this.generateContainerClasses(),target:this.target,rel:"noopener noreferrer","test-id":"clickableElement",onClick:this.handleClick},this.generateContent());else return r("button",{ref:t=>this.clickableElement=t,class:this.generateContainerClasses(),"test-id":"clickableElement",type:"button",onClick:this.handleClick},this.generateContent())}get hostElement(){return e(this)}static get watchers(){return{bar:["checkBar"]}}};l.style=n;export{l as q2_card};
-//# sourceMappingURL=p-077107c1.entry.js.map

package/dist/q2-tecton-elements/p-09d4b3d3.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as e,F as o,g as a}from"./p-277dc8cd.js";import{l as s,w as r}from"./p-ef856249.js";const n='*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}@keyframes showBackdrop{from{opacity:0}}@keyframes hideBackdrop{to{opacity:0}}dialog{--comp-border-radius-default:var(--app-scale-3x, 15px) var(--app-scale-3x, 15px) 0 0;--comp-border-radius:var(--tct-action-sheet-border-radius, var(--comp-border-radius-default));--comp-desktop-border-radius:var(--tct-action-sheet-border-radius, var(--app-scale-3x, 15px));--comp-close-button-size:var(--tct-action-sheet-close-button-size, var(--t-a11y-min-size, 44px));--comp-header-height:var(--tct-action-sheet-header-height, var(--t-a11y-min-size, 44px));--comp-dialog-background:var(--tct-action-sheet-background, var(--t-base, #ffffff));--comp-dialog-color:var(--tct-action-sheet-color, var(--t-text, #4d4d4d));--comp-dialog-padding:var(--tct-action-sheet-padding, var(--app-scale-3x, 15px));--comp-content-gradient-height:var(--tct-action-sheet-content-gradient-height, var(--app-scale-2x, 10px));--comp-dialog-gap:var(--tct-action-sheet-gap, var(--app-scale-2x, 10px));--comp-dialog-max-width:var(--tct-action-sheet-max-width, 400px);--comp-dialog-max-height:var(--tct-action-sheet-max-height, var(--comp-action-sheet-computed-max-height, 75vh));--comp-dialog-min-height:var(--tct-action-sheet-min-height, var(--comp-action-sheet-computed-min-height, 20vh));--comp-dialog-box-shadow:var(--tct-action-sheet-box-shadow, var(--app-shadow-2, 0 3px 6px rgba(0, 0, 0, 0.3)));position:fixed;top:100%;bottom:unset;color:var(--comp-dialog-color);background:var(--comp-dialog-background);transition:transform var(--tct-action-sheet-tween, var(--app-tween-2, 0.4s ease)), opacity var(--tct-action-sheet-tween, var(--app-tween-2, 0.4s ease));width:100%;max-width:var(--comp-dialog-max-width);border:0;border-radius:var(--comp-border-radius);box-shadow:var(--comp-dialog-box-shadow);padding:0;height:auto;overflow:hidden;min-height:var(--comp-dialog-min-height);max-height:var(--comp-dialog-max-height)}dialog::backdrop{opacity:0;background:var(--tct-action-sheet-backdrop-background, var(--t-top-a2, rgba(13, 13, 13, 0.6)))}dialog[open].is-opening,dialog[open].is-open{transform:translateY(-100%)}@media screen and (min-width: 1200px){dialog[open].is-opening,dialog[open].is-open{opacity:1;transform:translateY(0)}}dialog[open].is-opening::backdrop,dialog[open].is-open::backdrop{opacity:1;animation:showBackdrop var(--tct-action-sheet-tween, var(--app-tween-2, 0.4s ease))}dialog[open].is-closing{transform:translateY(10%)}dialog[open].is-closing::backdrop{animation:hideBackdrop var(--tct-action-sheet-tween, var(--app-tween-2, 0.4s ease))}@media screen and (min-width: 1200px){dialog{border-radius:var(--comp-desktop-border-radius);top:0px;bottom:0px;height:fit-content;transform:translateY(10%);opacity:0}}.content{overflow-y:auto;--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 3px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}.content::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}.content::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}.content::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}.interior{display:grid;grid-template-rows:44px 1fr auto;gap:var(--comp-dialog-gap);max-height:calc(var(--comp-dialog-max-height) - var(--comp-dialog-padding));padding:var(--comp-dialog-padding)}.interior.is-list header,.interior.is-list footer{position:relative}.interior.is-list header:before,.interior.is-list footer:before{content:"";display:block;position:absolute;left:0;height:var(--comp-content-gradient-height);width:100%;z-index:1}header{display:grid;grid-template-columns:var(--comp-close-button-size) 1fr var(--comp-close-button-size);grid-template-areas:". title close";gap:var(--comp-dialog-gap)}header .title{grid-area:title;text-align:center;line-height:var(--comp-header-height)}header .btn-close{grid-area:close;width:var(--comp-close-button-size);height:var(--comp-close-button-size)}footer{display:flex;justify-content:end}';var c=undefined&&undefined.__rest||function(t,i){var e={};for(var o in t)if(Object.prototype.hasOwnProperty.call(t,o)&&i.indexOf(o)<0)e[o]=t[o];if(t!=null&&typeof Object.getOwnPropertySymbols==="function")for(var a=0,o=Object.getOwnPropertySymbols(t);a<o.length;a++){if(i.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(t,o[a]))e[o[a]]=t[o[a]]}return e};const l=class{constructor(a){t(this,a);this.close=i(this,"close",7);this.ready=i(this,"ready",3);this.initialSelectedOptions=[];this.selectedOptions={values:[],value:""};this.minHeight=.2;this.maxHeight=.75;this.generateOption=t=>{const i=document.createElement("q2-option");const e=c(t,["innerHTML"]);if(t.innerHTML)i.innerHTML=t.innerHTML;Object.entries(e).forEach((([t,e])=>{if(e===undefined)return;if(typeof e==="boolean"){if(e)i.setAttribute(t,"")}else{i.setAttribute(t,e)}}));return i};this.generateOptgroup=t=>{const i=document.createElement("q2-optgroup");if(t.label)i.setAttribute("label",t.label);if(t.disabled)i.setAttribute("disabled","");if(!!t.options.length)t.options.forEach((t=>i.appendChild(this.generateOption(t))));return i};this.onClick=t=>{const i=t.target;if(!(i instanceof HTMLElement))return;const e=!!i.closest(".interior, q2-action-sheet");if(e)return;this.onCancel(t)};this.onCancel=t=>{var i,e;t.preventDefault();const{initialSelectedOptions:o}=this;this.hide({value:(e=(i=o===null||o===void 0?void 0:o[0])===null||i===void 0?void 0:i.value)!==null&&e!==void 0?e:"",values:o,type:"cancel"})};this.onListChange=t=>{this.selectedOptions=t.detail};this.onListPopoverStateChange=t=>{if(t.detail.open)return;if(t.detail.action==="close"){this.onCancel(t)}else{this.onListDone()}};this.onListDone=()=>{this.hide(Object.assign(Object.assign({},this.selectedOptions),{type:"confirm"}))};this.renderSlot=()=>e("div",{class:"content",ref:t=>this.contentElement=t},e("slot",null));this.renderMessage=({data:t})=>e("q2-message",{type:t.type},t.title&&e("h2",null,t.title),t.description&&e("p",null,t.description));this.renderList=({data:t})=>{const{listProps:i}=t;return e(o,null,e("div",{class:"content",ref:t=>this.contentElement=t},e("q2-option-list",{ref:t=>this.optionListElement=t,multiple:i.multiple,noSelect:i.noSelect,onChange:this.onListChange,onPopoverState:this.onListPopoverStateChange,selectedOptions:i.selectedOptions},e("slot",null))),e("footer",null,i.multiple&&e("q2-btn",{"test-id":"btnDone",intent:"workflow-primary",onClick:this.onListDone},s("tecton.element.actionSheet.done"))))};this.data=undefined;this.title=undefined;this.hideClose=undefined;this.isScrollable=false;this.renderStatus="is-closing"}componentDidLoad(){this.dialogElement.addEventListener("cancel",this.onCancel);this.ready.emit()}disconnectedCallback(){this.dialogElement.removeEventListener("cancel",this.onCancel)}storeInitialValues(){const{data:t}=this;if(!t)return;if(t.appearance==="list"){this.initialSelectedOptions=t.listProps.selectedOptions}}focusContent(){const{data:t}=this;if(!t)return;if(t.appearance==="list"){const{event:i}=t;if(i instanceof KeyboardEvent){this.optionListElement.handleExternalKeydown(i)}else{this.optionListElement.focus()}}}hidePostHook(){const{data:t}=this;if(!t)return;if(t.appearance==="list"){this.hostElement.innerHTML=null}}showPreHook(){const{data:t}=this;if(!t)return;if(t.appearance==="list"){this.hostElement.innerHTML=null;t.options.forEach((t=>{this.hostElement.appendChild("options"in t?this.generateOptgroup(t):this.generateOption(t))}))}}updateDialogMinMaxHeight(){const t=window.innerHeight;this.dialogElement.style.setProperty("--comp-action-sheet-computed-min-height",`${Math.floor(t*this.minHeight)}px`);this.dialogElement.style.setProperty("--comp-action-sheet-computed-max-height",`${Math.floor(t*this.maxHeight)}px`)}async hide(t={value:"",values:[],type:"confirm"}){this.close.emit(t);this.renderStatus="is-closing";this.dialogElement.addEventListener("transitionend",(()=>{if(this.renderStatus!=="is-closing")return;this.dialogElement.close();this.renderStatus=null;this.data=undefined;this.initialSelectedOptions=[];this.selectedOptions={values:[],value:""};this.hidePostHook()}),{once:true})}async show(){this.showPreHook();await r();this.updateDialogMinMaxHeight();this.storeInitialValues();if(this.dialogElement.open)return;this.dialogElement.showModal();this.renderStatus="is-opening";this.dialogElement.addEventListener("transitionend",(()=>{if(this.renderStatus!=="is-opening")return;this.renderStatus="is-open";this.focusContent()}),{once:true})}render(){var t;const{data:i}=this;const o=(i===null||i===void 0?void 0:i.title)||this.title||!this.hideClose;const a=this.renderStatus||"";let s=null;switch(i===null||i===void 0?void 0:i.appearance){case"message":s=this.renderMessage;break;case"list":s=this.renderList;break;default:s=this.renderSlot;break}const r=(i===null||i===void 0?void 0:i.appearance)||"slot";const n=`interior is-${r}`;return e("dialog",{ref:t=>this.dialogElement=t,class:a,onClick:this.onClick},e("div",{class:n},o&&e("header",null,e("div",{class:"title"},(i===null||i===void 0?void 0:i.title)||this.title),!this.hideClose&&e("q2-btn",{class:"btn-close","test-id":"btnClose",onClick:this.onCancel,label:"tecton.element.actionSheet.close","hide-label":true},e("q2-icon",{type:"close"}))),((t=this.data)===null||t===void 0?void 0:t.description)&&e("p",null,i.description),s&&e(s,{data:this.data})))}get hostElement(){return a(this)}};l.style=n;export{l as q2_action_sheet};
-//# sourceMappingURL=p-09d4b3d3.entry.js.map

package/dist/q2-tecton-elements/p-0d4aec6e.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as o,h as t,g as c}from"./p-277dc8cd.js";import{c as r,h as i,o as a,i as h,l}from"./p-ef856249.js";const s='*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{--comp-checkbox-padding:var(--tct-checkbox-padding, var(--tct-checkbox-vertical-padding, var(--t-checkbox-vertical-padding, var(--tct-scale-2, var(--app-scale-2x, 10px)))) 0);display:block;position:relative;padding:var(--comp-checkbox-padding)}.container{--comp-checkbox-size:var(--tct-checkbox-size, var(--t-checkbox-size, 20px));--comp-checkbox-default-column-gap:var(--app-scale-2x, 10px);--comp-checkbox-default-row-gap:0;--comp-checkbox-default-gap:var(--comp-checkbox-default-row-gap) var(--comp-checkbox-default-column-gap);--comp-checkbox-tween:var(--tct-tween-1, var(--app-tween-1, 0.2s ease));--comp-checkbox-toggle-width:var(--tct-checkbox-toggle-width, var(--t-checkbox-toggle-width, 46px));--comp-checkbox-gap:var(--tct-checkbox-gap, var(--t-checkbox-gap, var(--comp-checkbox-default-gap)));--comp-checkbox-outer-stroke-color:var(--tct-checkbox-outer-stroke-color, var(--t-checkbox-outer-stroke-color, var(--t-a11y-gray-color-AA, #949494)));--comp-checkbox-outer-fill-color:var(--tct-checkbox-outer-fill-color, var(--t-checkbox-outer-fill-color, var(--tct-white, var(--app-white, #ffffff))));--comp-checkbox-checked-color:var(--tct-checkbox-check-stroke-color, var(--t-checkbox-check-stroke-color, var(--t-checkbox-fill, var(--t-a11y-active-gray-color-AA, #404040))));--comp-control-width:var(--comp-checkbox-size);display:grid;grid-template-areas:"svg label" "svg description";align-items:center;gap:var(--comp-checkbox-gap);grid-template-columns:var(--comp-control-width) calc(100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap))}:host([type=favorite]) .container{--comp-checkbox-favorite-stroke-color:var(--tct-checkbox-favorite-stroke-color, var(--t-checkbox-favorite-stroke-color, var(--t-a11y-gray-color-AA, #949494)));--comp-checkbox-favorite-fill-color:var(--tct-checkbox-favorite-fill-color, var(--t-checkbox-favorite-fill-color, #db7d24))}:host([hide-label]:not([hide-label=false])) .container{grid-template-areas:"svg";grid-template-columns:var(--comp-control-width)}:host([type=toggle]) .container{--comp-control-width:var(--comp-checkbox-toggle-width)}:host([alignment=right]) .container,:host([type=toggle]:not([alignment])) .container{grid-template-areas:"label svg" "description svg";grid-template-columns:calc(100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)) var(--comp-control-width)}.label-control{align-items:center;display:flex}.label-text{grid-area:label;font-weight:var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 400))}:host([description]) .label-text{font-weight:var(--tct-checkbox-label-font-weight, var(--t-checkbox-label-font-weight, 600))}:host([checked]) .label-text{font-weight:var(--tct-checkbox-checked-label-font-weight, var(--t-checkbox-checked-label-font-weight, 600))}.description-text{grid-area:description;font-weight:var(--tct-checkbox-description-font-weight, var(--t-checkbox-description-font-weight, 400))}label{color:var(--tct-checkbox-label-color);cursor:pointer}:host([disabled]:not([disabled=false])),:host([group-disabled]){opacity:var(--tct-checkbox-disabled-opacity, var(--t-checkbox-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4))))}:host([disabled]:not([disabled=false])) label,:host([group-disabled]) label{cursor:not-allowed}.checkbox-icon{--t-icon-stroke-primary:var(--comp-checkbox-outer-stroke-color);width:var(--comp-checkbox-size);height:var(--comp-checkbox-size);border-radius:var(--tct-checkbox-outer-border-radius, var(--t-checkbox-outer-border-radius, var(--tct-border-radius-1, var(--app-border-radius-1, 3px))));stroke:var(--comp-checkbox-outer-stroke-color);color:var(--comp-checkbox-outer-stroke-color);stroke-width:var(--tct-checkbox-outer-stroke-width, var(--t-checkbox-outer-stroke-width, 2));fill:var(--comp-checkbox-outer-fill-color);flex-shrink:0}:host([checked]) .checkbox-icon{fill:var(--tct-checkbox-checked-outer-fill-color, var(--t-checkbox-checked-outer-fill-color, var(--comp-checkbox-outer-fill-color)));stroke:var(--tct-checkbox-checked-outer-stroke-color, var(--t-checkbox-checked-outer-stroke-color, var(--comp-checkbox-outer-stroke-color)))}:host(:focus-within) .checkbox-icon{box-shadow:var(--const-double-focus-ring), var(--tct-global-focus, 0 0 0 2px #33b4ff);stroke:var(--tct-checkbox-focused-outer-stroke-color, var(--t-checkbox-focused-outer-stroke-color, var(--comp-checkbox-checked-color)))}:host([type=favorite]) .checkbox-icon{--tct-icon-stroke-width:var(--tct-checkbox-favorite-stroke-width, var(--t-checkbox-favorite-stroke-width, 1));--tct-icon-stroke-primary:var(--comp-checkbox-favorite-stroke-color);transition:fill var(--comp-checkbox-tween), color var(--comp-checkbox-tween), stroke var(--comp-checkbox-tween)}:host([type=favorite]:focus-within) .checkbox-icon,:host([type=favorite]:hover) .checkbox-icon{--tct-icon-stroke-primary:var(--comp-checkbox-favorite-fill-color);--tct-icon-stroke-width:var(--tct-checkbox-favorite-hover-stroke-width, var(--t-checkbox-favorite-hover-stroke-width, 2))}:host([checked][type=favorite]) .checkbox-icon{--tct-icon-stroke-primary:var(--comp-checkbox-favorite-fill-color);fill:var(--comp-checkbox-favorite-fill-color);transition:fill var(--comp-checkbox-tween), color var(--comp-checkbox-tween), stroke var(--comp-checkbox-tween)}:host([checked][type=favorite]:focus-within) .checkbox-icon,:host([checked][type=favorite]:hover) .checkbox-icon{--tct-icon-stroke-primary:var(--comp-checkbox-favorite-stroke-color);--tct-icon-fill-primary:var(--comp-checkbox-favorite-fill-color);--tct-icon-stroke-width:var(--tct-checkbox-favorite-hover-stroke-width, var(--t-checkbox-favorite-hover-stroke-width, 2))}:host([has-error]) .checkbox-icon{stroke:var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000))}.checkbox-fill{stroke:var(--comp-checkbox-checked-color)}.checked-fill{stroke-width:var(--tct-checkbox-check-stroke-width, var(--t-checkbox-check-stroke-width, 2.5));stroke-linecap:round;stroke-linejoin:round}:host([type=toggle]) .checked-fill{stroke:var(--tct-checkbox-toggle-icon-stroke, var(--t-checkbox-toggle-icon-stroke, var(--tct-white, var(--app-white, #ffffff))));transition:opacity var(--comp-checkbox-tween)}:host([type=toggle][checked]) .checked-fill{stroke:var(--tct-checkbox-toggle-checked-icon-stroke, var(--t-checkbox-toggle-checked-icon-stroke, var(--t-checkbox-text, var(--tct-white, var(--app-white, #ffffff)))))}.indeterminate-fill{stroke-width:var(--tct-checkbox-indeterminate-stroke-width, var(--t-checkbox-indeterminate-stroke-width, 3.5))}.toggle-svg{height:30px;width:var(--comp-checkbox-toggle-width);position:relative;text-align:initial}.toggle-track,.toggle-indicator{position:absolute;top:50%;transform:translateY(-50%)}.toggle-track{fill:var(--tct-checkbox-toggle-track-color, var(--t-checkbox-toggle-track-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))));height:14px;width:46px}:host([checked]) .toggle-track{fill:var(--tct-checkbox-toggle-checked-color, var(--t-checkbox-toggle-checked-color, var(--comp-checkbox-checked-color)));opacity:0.5}.toggle-indicator{transition:left var(--comp-checkbox-tween);height:30px;width:30px;left:0;border-radius:50%}:host([checked]) .toggle-indicator{left:21px}.toggle-circle{fill:var(--tct-checkbox-toggle-circle-color, var(--t-checkbox-toggle-circle-color, var(--t-a11y-gray-color-AA, #949494)))}:host([checked]) .toggle-circle{fill:var(--tct-checkbox-toggle-checked-color, var(--t-checkbox-toggle-checked-color, var(--comp-checkbox-checked-color)))}:host(:focus-within) .toggle-circle{stroke:var(--tct-checkbox-toggle-checked-color, var(--t-checkbox-toggle-checked-color, var(--comp-checkbox-checked-color)));stroke-width:10px;stroke-opacity:0.5}:host(:not([checked]):focus-within) .toggle-circle{stroke:var(--tct-checkbox-toggle-circle-color, var(--t-checkbox-toggle-circle-color, var(--t-a11y-gray-color-AA, #949494)))}:host([checked]) .off,:host(:not([checked])) .on{opacity:0}';const n=class{constructor(t){e(this,t);this.change=o(this,"change",7);this._id=`checkbox-${r()}`;this.onInputClick=e=>{e.stopPropagation();e.preventDefault();const o=this.disabled||this.readonly;if(o)return;if(!(e.target instanceof HTMLInputElement))return;const{value:t,checked:c}=e.target;this.change.emit({value:t,checked:c});this.inputElement.focus()};this.checked=false;this.disabled=undefined;this.hasError=false;this.hideLabel=undefined;this.indeterminate=undefined;this.label=undefined;this.name=undefined;this.readonly=undefined;this.type=undefined;this.value=undefined;this.groupDisabled=undefined;this.alignment=undefined;this.description=undefined;this.ariaLabel=undefined}componentWillLoad(){i(this)}componentDidLoad(){a(this.hostElement);this.hostElement.click=()=>this.inputElement.click()}defaultChangeHandler(e){setTimeout((()=>this.handleChangeEvent(e)),0)}delegateFocus(e){if(!h(e,this.hostElement))return;this.hostElement.shadowRoot.querySelector("input").focus()}ariaLabelObserver(){i(this)}handleChangeEvent(e){if(this.readonly||this.disabled||this.hostElement.onchange||e.defaultPrevented||e.target!==this.hostElement||!e.detail){return}this.checked=e.detail.checked}render(){const e=["label-text"];if(this.hideLabel)e.push("sr");return t("div",{class:"container"},t("input",{ref:e=>this.inputElement=e,"aria-describedby":this.description?"description":undefined,"aria-invalid":`${this.hasError}`,checked:this.indeterminate||this.checked||false,class:"sr",disabled:!!this.disabled||!!this.groupDisabled,id:this._id,name:this.name||this._id,onClick:this.onInputClick,"test-id":"q2CheckboxInnerCheckBox",type:"checkbox",value:this.value}),t("label",{htmlFor:this._id,class:"label-control","test-id":"checkboxButton"},this.generateCheckboxSVG()),t("div",{class:e.join(" ")},t("label",{"test-id":"checkboxLabel",htmlFor:this._id},l(this.label),t("slot",null))),this.description&&t("div",{class:"description-text","test-id":"checkboxDescription",id:"description"},l(this.description)))}generateCheckboxSVG(){if(this.type==="favorite"){return t("q2-icon",{type:"star",class:"checkbox-icon"})}if(this.type==="toggle"){return this.generateToggleSVG()}return t("svg",{"aria-hidden":"true",width:"20",height:"20",viewBox:"0 0 20 20",class:"checkbox-icon",focusable:"false"},t("rect",{x:"1",y:"1",width:"18",height:"18",rx:"3"}),(this.checked||this.indeterminate)&&this.generateCheckBoxSVGFill())}generateCheckBoxSVGFill(){if(this.indeterminate){return t("line",{class:"checkbox-fill indeterminate-fill",x1:"4",y1:"10",x2:"16",y2:"10"})}return t("polyline",{class:"checkbox-fill checked-fill",points:"5 11 8.5 14.5 15 6"})}generateToggleSVG(){return t("div",{class:"toggle-svg"},t("svg",{"aria-hidden":"true",focusable:"false",viewBox:"0 0 46 14",class:"toggle-track","test-id":"toggleTrack"},t("rect",{width:"36",height:"14",rx:"7",x:"5"})),t("svg",{"aria-hidden":"true",focusable:"false",viewBox:"0 0 30 30",class:"toggle-indicator","test-id":"toggleIndicator"},t("circle",{class:"toggle-circle",width:"20",height:"20",cx:"15",cy:"15",r:"10"}),t("line",{class:"off checked-fill",x1:"12",y1:"18",x2:"18",y2:"12"}),t("line",{class:"off checked-fill",x1:"12",y1:"12",x2:"18",y2:"18"}),t("polyline",{class:"on checked-fill",points:"11,16 14,19 18,12 14,19"})))}get hostElement(){return c(this)}static get watchers(){return{ariaLabel:["ariaLabelObserver"]}}};n.style=s;export{n as q2_checkbox};
-//# sourceMappingURL=p-0d4aec6e.entry.js.map

package/dist/q2-tecton-elements/p-0d4aec6e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","Q2Checkbox","this","_id","createGuid","onInputClick","event","stopPropagation","preventDefault","isNotInteractive","disabled","readonly","target","HTMLInputElement","value","checked","change","emit","inputElement","focus","componentWillLoad","handleAriaLabel","componentDidLoad","overrideFocus","hostElement","click","defaultChangeHandler","setTimeout","handleChangeEvent","delegateFocus","isEventFromElement","shadowRoot","querySelector","ariaLabelObserver","onchange","defaultPrevented","detail","render","textLabelClasses","hideLabel","push","h","class","ref","el","description","undefined","hasError","indeterminate","groupDisabled","id","name","onClick","type","htmlFor","generateCheckboxSVG","join","loc","label","generateToggleSVG","width","height","viewBox","focusable","x","y","rx","generateCheckBoxSVGFill","x1","y1","x2","y2","points","cx","cy","r"],"sources":["./src/components/q2-checkbox/styles.scss?tag=q2-checkbox&encapsulation=shadow","./src/components/q2-checkbox/index.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    --comp-checkbox-padding: #{var-list(\n            --tct-checkbox-padding,\n            unquote('#{var-list(var-prefixer(checkbox-vertical-padding), --tct-scale-2, --app-scale-2x, 10px)} 0')\n        )};\n    display: block;\n    position: relative;\n    padding: var(--comp-checkbox-padding);\n}\n\n.container {\n    --comp-checkbox-size: #{var-list(var-prefixer(checkbox-size), 20px)};\n    --comp-checkbox-default-column-gap: var(--app-scale-2x, 10px);\n    --comp-checkbox-default-row-gap: 0;\n    --comp-checkbox-default-gap: #{var(--comp-checkbox-default-row-gap) var(--comp-checkbox-default-column-gap)};\n    --comp-checkbox-tween: #{var-list(--tct-tween-1, --app-tween-1, unquote('0.2s ease'))};\n    --comp-checkbox-toggle-width: #{var-list(var-prefixer(checkbox-toggle-width), 46px)};\n    --comp-checkbox-gap: #{var-list(var-prefixer(checkbox-gap), --comp-checkbox-default-gap)};\n    --comp-checkbox-outer-stroke-color: #{var-list(\n            var-prefixer(checkbox-outer-stroke-color),\n            --t-a11y-gray-color-AA,\n            #949494\n        )};\n    --comp-checkbox-outer-fill-color: #{var-list(\n            var-prefixer(checkbox-outer-fill-color),\n            --tct-white,\n            --app-white,\n            #ffffff\n        )};\n    --comp-checkbox-checked-color: #{var-list(\n            var-prefixer(checkbox-check-stroke-color),\n            --t-checkbox-fill,\n            --t-a11y-active-gray-color-AA,\n            #404040\n        )};\n    --comp-control-width: var(--comp-checkbox-size);\n\n    :host([type='favorite']) & {\n        --comp-checkbox-favorite-stroke-color: #{var-list(\n                var-prefixer(checkbox-favorite-stroke-color),\n                --t-a11y-gray-color-AA,\n                #949494\n            )};\n        --comp-checkbox-favorite-fill-color: #{var-list(var-prefixer(checkbox-favorite-fill-color), #db7d24)};\n    }\n\n    display: grid;\n    grid-template-areas:\n        'svg label'\n        'svg description';\n    align-items: center;\n    gap: var(--comp-checkbox-gap);\n    grid-template-columns: var(--comp-control-width) calc(\n            100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)\n        );\n\n    :host([hide-label]:not([hide-label='false'])) & {\n        grid-template-areas: 'svg';\n        grid-template-columns: var(--comp-control-width);\n    }\n\n    :host([type='toggle']) & {\n        --comp-control-width: var(--comp-checkbox-toggle-width);\n    }\n\n    :host([alignment='right']) &,\n    :host([type='toggle']:not([alignment])) & {\n        grid-template-areas:\n            'label svg'\n            'description svg';\n        grid-template-columns: calc(100% - var(--comp-control-width) - var(--comp-checkbox-default-column-gap)) var(\n                --comp-control-width\n            );\n    }\n}\n\n.label-control {\n    align-items: center;\n    display: flex;\n}\n\n.label-text {\n    grid-area: label;\n    font-weight: var-list(var-prefixer(checkbox-label-font-weight), 400);\n\n    :host([description]) & {\n        font-weight: var-list(var-prefixer(checkbox-label-font-weight), 600);\n    }\n    :host([checked]) & {\n        font-weight: var-list(var-prefixer(checkbox-checked-label-font-weight), 600);\n    }\n}\n\n.description-text {\n    grid-area: description;\n    font-weight: var-list(var-prefixer(checkbox-description-font-weight), 400);\n}\n\nlabel {\n    color: var-list(--tct-checkbox-label-color);\n    cursor: pointer;\n}\n\n:host([disabled]:not([disabled='false'])),\n:host([group-disabled]) {\n    opacity: var-list(var-prefixer(checkbox-disabled-opacity), --tct-disabled-opacity, --app-disabled-opacity, 0.4);\n\n    label {\n        cursor: not-allowed;\n    }\n}\n\n.checkbox-icon {\n    --t-icon-stroke-primary: var(--comp-checkbox-outer-stroke-color);\n    width: var(--comp-checkbox-size);\n    height: var(--comp-checkbox-size);\n    border-radius: var-list(\n        var-prefixer(checkbox-outer-border-radius),\n        --tct-border-radius-1,\n        --app-border-radius-1,\n        3px\n    );\n    stroke: var(--comp-checkbox-outer-stroke-color);\n    color: var(--comp-checkbox-outer-stroke-color);\n    stroke-width: var-list(var-prefixer(checkbox-outer-stroke-width), 2);\n    fill: var(--comp-checkbox-outer-fill-color);\n    flex-shrink: 0;\n\n    :host([checked]) & {\n        fill: var-list(var-prefixer(checkbox-checked-outer-fill-color), --comp-checkbox-outer-fill-color);\n        stroke: var-list(var-prefixer(checkbox-checked-outer-stroke-color), --comp-checkbox-outer-stroke-color);\n    }\n    :host(:focus-within) & {\n        box-shadow: var(--const-double-focus-ring), var-list(--tct-global-focus, unquote('0 0 0 2px #33b4ff'));\n        stroke: var-list(var-prefixer(checkbox-focused-outer-stroke-color), --comp-checkbox-checked-color);\n    }\n\n    // Favorite\n    :host([type='favorite']) & {\n        --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-stroke-width), 1)};\n        --tct-icon-stroke-primary: var(--comp-checkbox-favorite-stroke-color);\n        transition: fill var(--comp-checkbox-tween), color var(--comp-checkbox-tween), stroke var(--comp-checkbox-tween);\n    }\n    :host([type='favorite']:focus-within) &,\n    :host([type='favorite']:hover) & {\n        --tct-icon-stroke-primary: var(--comp-checkbox-favorite-fill-color);\n        --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n    }\n\n    // Checked favorite\n    :host([checked][type='favorite']) & {\n        --tct-icon-stroke-primary: var(--comp-checkbox-favorite-fill-color);\n        fill: var(--comp-checkbox-favorite-fill-color);\n        transition: fill var(--comp-checkbox-tween), color var(--comp-checkbox-tween), stroke var(--comp-checkbox-tween);\n    }\n    :host([checked][type='favorite']:focus-within) &,\n    :host([checked][type='favorite']:hover) & {\n        --tct-icon-stroke-primary: var(--comp-checkbox-favorite-stroke-color);\n        --tct-icon-fill-primary: var(--comp-checkbox-favorite-fill-color);\n        --tct-icon-stroke-width: #{var-list(var-prefixer(checkbox-favorite-hover-stroke-width), 2)};\n    }\n\n    :host([has-error]) & {\n        stroke: var-list(--tct-stoplight-error, --const-stoplight-alert, #c30000);\n    }\n}\n\n.checkbox-fill {\n    stroke: var(--comp-checkbox-checked-color);\n}\n\n.checked-fill {\n    stroke-width: var-list(var-prefixer(checkbox-check-stroke-width), 2.5);\n    stroke-linecap: round;\n    stroke-linejoin: round;\n\n    :host([type='toggle']) & {\n        stroke: var-list(var-prefixer(checkbox-toggle-icon-stroke), --tct-white, --app-white, #ffffff);\n        transition: opacity var(--comp-checkbox-tween);\n    }\n    :host([type='toggle'][checked]) & {\n        stroke: var-list(\n            var-prefixer(checkbox-toggle-checked-icon-stroke),\n            --t-checkbox-text,\n            --tct-white,\n            --app-white,\n            #ffffff\n        );\n    }\n}\n\n.indeterminate-fill {\n    stroke-width: var-list(var-prefixer(checkbox-indeterminate-stroke-width), 3.5);\n}\n\n.toggle-svg {\n    height: 30px;\n    width: var(--comp-checkbox-toggle-width);\n    position: relative;\n    text-align: initial;\n}\n\n.toggle-track,\n.toggle-indicator {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n}\n\n.toggle-track {\n    fill: var-list(\n        var-prefixer(checkbox-toggle-track-color),\n        var-prefixer(gray-11),\n        --tct-gray-l1,\n        --app-gray-l1,\n        #cccccc\n    );\n    height: 14px;\n    width: 46px;\n\n    :host([checked]) & {\n        fill: var-list(var-prefixer(checkbox-toggle-checked-color), --comp-checkbox-checked-color);\n        opacity: 0.5;\n    }\n}\n\n.toggle-indicator {\n    transition: left var(--comp-checkbox-tween);\n    height: 30px;\n    width: 30px;\n    left: 0;\n    border-radius: 50%;\n\n    :host([checked]) & {\n        left: 21px;\n    }\n}\n\n.toggle-circle {\n    fill: var-list(var-prefixer(checkbox-toggle-circle-color), --t-a11y-gray-color-AA, #949494);\n    :host([checked]) & {\n        fill: var-list(var-prefixer(checkbox-toggle-checked-color), --comp-checkbox-checked-color);\n    }\n\n    :host(:focus-within) & {\n        stroke: var-list(var-prefixer(checkbox-toggle-checked-color), --comp-checkbox-checked-color);\n        stroke-width: 10px;\n        stroke-opacity: 0.5;\n    }\n\n    :host(:not([checked]):focus-within) & {\n        stroke: var-list(var-prefixer(checkbox-toggle-circle-color), --t-a11y-gray-color-AA, #949494);\n    }\n}\n\n:host([checked]) .off,\n:host(:not([checked])) .on {\n    opacity: 0;\n}\n","import { Component, ComponentInterface, Prop, Element, Listen, Watch, Event, EventEmitter, h } from '@stencil/core';\nimport { createGuid, handleAriaLabel, isEventFromElement, loc, overrideFocus } from 'src/utils';\n\n@Component({\n    tag: 'q2-checkbox',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Checkbox implements ComponentInterface {\n    @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true }) hasError: boolean = false;\n    @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n    @Prop({ reflect: true }) indeterminate: boolean;\n    @Prop({ reflect: true, mutable: true }) label: string;\n    @Prop({ reflect: true }) name: string;\n    @Prop({ reflect: true }) readonly: boolean;\n    @Prop({ reflect: true }) type: 'favorite' | 'toggle';\n    @Prop({ reflect: true }) value: string;\n\n    /**\n     * Used by q2-checkbox-group to disable all checkboxes in the group\n     * @private\n     */\n    @Prop({ reflect: true }) groupDisabled: boolean;\n    @Prop({ reflect: true }) alignment: string;\n    @Prop({ reflect: true }) description: string;\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n    @Element() hostElement: HTMLElement;\n    _id: string = `checkbox-${createGuid()}`;\n    inputElement: HTMLInputElement;\n\n    ////////// LIFECYCLE HOOKS ////////\n\n    componentWillLoad() {\n        handleAriaLabel(this);\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n        this.hostElement.click = () => this.inputElement.click();\n    }\n\n    //////// Host Element Events ////////\n    @Listen('change')\n    defaultChangeHandler(event: CustomEvent) {\n        // We use setTimeout to give an opportunity to call preventDefault\n        setTimeout(() => this.handleChangeEvent(event), 0);\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector('input').focus();\n    }\n\n    ////////// OBSERVERS //////////\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    ///// Event ////////\n    @Event() change: EventEmitter<{ value: string; checked: boolean }>;\n\n    ///// Actions ////////\n    onInputClick = (event: Event) => {\n        event.stopPropagation();\n        event.preventDefault();\n\n        const isNotInteractive = this.disabled || this.readonly;\n        if (isNotInteractive) return;\n        if (!(event.target instanceof HTMLInputElement)) return;\n        const { value, checked } = event.target;\n\n        this.change.emit({\n            value,\n            checked,\n        });\n        this.inputElement.focus();\n    };\n\n    handleChangeEvent(event: CustomEvent<{ checked: boolean; value: string }>) {\n        if (\n            this.readonly ||\n            this.disabled ||\n            this.hostElement.onchange ||\n            event.defaultPrevented ||\n            event.target !== this.hostElement ||\n            !event.detail\n        ) {\n            return;\n        }\n        this.checked = event.detail.checked;\n    }\n\n    /////// View Methods ///////\n    render() {\n        const textLabelClasses = ['label-text'];\n        if (this.hideLabel) textLabelClasses.push('sr');\n        return (\n            <div class=\"container\">\n                <input\n                    ref={el => (this.inputElement = el)}\n                    aria-describedby={this.description ? 'description' : undefined}\n                    aria-invalid={`${this.hasError}`}\n                    checked={this.indeterminate || this.checked || false}\n                    class=\"sr\"\n                    disabled={!!this.disabled || !!this.groupDisabled}\n                    id={this._id}\n                    name={this.name || this._id}\n                    onClick={this.onInputClick}\n                    test-id=\"q2CheckboxInnerCheckBox\"\n                    type=\"checkbox\"\n                    value={this.value}\n                />\n                <label\n                    htmlFor={this._id}\n                    class=\"label-control\"\n                    test-id=\"checkboxButton\"\n                >\n                    {this.generateCheckboxSVG()}\n                </label>\n                <div class={textLabelClasses.join(' ')}>\n                    <label\n                        test-id=\"checkboxLabel\"\n                        htmlFor={this._id}\n                    >\n                        {loc(this.label)}\n                        <slot />\n                    </label>\n                </div>\n                {this.description && (\n                    <div\n                        class=\"description-text\"\n                        test-id=\"checkboxDescription\"\n                        id=\"description\"\n                    >\n                        {loc(this.description)}\n                    </div>\n                )}\n            </div>\n        );\n    }\n\n    generateCheckboxSVG() {\n        if (this.type === 'favorite') {\n            return (\n                <q2-icon\n                    type=\"star\"\n                    class=\"checkbox-icon\"\n                />\n            );\n        }\n\n        if (this.type === 'toggle') {\n            return this.generateToggleSVG();\n        }\n\n        return (\n            <svg\n                aria-hidden=\"true\"\n                width=\"20\"\n                height=\"20\"\n                viewBox=\"0 0 20 20\"\n                class=\"checkbox-icon\"\n                focusable=\"false\"\n            >\n                <rect\n                    x=\"1\"\n                    y=\"1\"\n                    width=\"18\"\n                    height=\"18\"\n                    rx=\"3\"\n                />\n                {(this.checked || this.indeterminate) && this.generateCheckBoxSVGFill()}\n            </svg>\n        );\n    }\n\n    generateCheckBoxSVGFill() {\n        if (this.indeterminate) {\n            return (\n                <line\n                    class=\"checkbox-fill indeterminate-fill\"\n                    x1=\"4\"\n                    y1=\"10\"\n                    x2=\"16\"\n                    y2=\"10\"\n                />\n            );\n        }\n        return (\n            <polyline\n                class=\"checkbox-fill checked-fill\"\n                points=\"5 11 8.5 14.5 15 6\"\n            />\n        );\n    }\n\n    generateToggleSVG() {\n        return (\n            <div class=\"toggle-svg\">\n                <svg\n                    aria-hidden=\"true\"\n                    focusable=\"false\"\n                    viewBox=\"0 0 46 14\"\n                    class=\"toggle-track\"\n                    test-id=\"toggleTrack\"\n                >\n                    <rect\n                        width=\"36\"\n                        height=\"14\"\n                        rx=\"7\"\n                        x=\"5\"\n                    />\n                </svg>\n                <svg\n                    aria-hidden=\"true\"\n                    focusable=\"false\"\n                    viewBox=\"0 0 30 30\"\n                    class=\"toggle-indicator\"\n                    test-id=\"toggleIndicator\"\n                >\n                    <circle\n                        class=\"toggle-circle\"\n                        width=\"20\"\n                        height=\"20\"\n                        cx=\"15\"\n                        cy=\"15\"\n                        r=\"10\"\n                    />\n                    <line\n                        class=\"off checked-fill\"\n                        x1=\"12\"\n                        y1=\"18\"\n                        x2=\"18\"\n                        y2=\"12\"\n                    />\n                    <line\n                        class=\"off checked-fill\"\n                        x1=\"12\"\n                        y1=\"12\"\n                        x2=\"18\"\n                        y2=\"18\"\n                    />\n                    <polyline\n                        class=\"on checked-fill\"\n                        points=\"11,16 14,19 18,12 14,19\"\n                    />\n                </svg>\n            </div>\n        );\n    }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/p-1c993698.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as s,g as e}from"./p-277dc8cd.js";import{j as a,o,n as r,i,l as n}from"./p-ef856249.js";const c="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}:host([hidden]){display:none}.message{border-left-width:var(--tct-message-bar-width, var(--t-message-bar-width, var(--app-scale-1x, 5px)));border-left-style:solid;--comp-line-height:var(--tct-message-line-height, var(--t-message-line-height, var(--app-line-height, 1.428571429em)));display:grid;gap:var(--tct-scale-1, var(--app-scale-1x, 5px));align-items:flex-start;background:var(--tct-message-background, var(--tct-message-bg, var(--t-message-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, #f2f2f2)))))));color:var(--tct-message-font-color, var(--t-message-font-color, inherit));box-shadow:var(--tct-message-box-shadow, var(--t-message-box-shadow, inherit));border-radius:var(--tct-message-border-radius, var(--t-message-border-radius, inherit))}.message:focus{box-shadow:var(--const-global-focus)}.message-icon{--comp-top-offset:calc(calc(var(--comp-line-height) - var(--comp-icon-size)) / 2);--tct-icon-size:var(--comp-icon-size);top:var(--comp-top-offset);margin-bottom:calc(var(--comp-top-offset) * -1)}.message-content{flex:1;line-height:var(--comp-line-height)}::slotted(ul){padding-left:var(--tct-scale-l3, var(--app-scale-3x, 15px))}:host(:not([appearance])),:host([appearance=standard]){margin:var(--tct-scale-l3, var(--app-scale-3x, 15px)) 0}:host(:not([appearance])) .message,:host([appearance=standard]) .message{--comp-icon-size:var(--tct-message-icon-size, var(--t-message-icon-size, 24px));--comp-padding:var(--tct-message-padding, var(--t-message-padding, var(--app-scale-3x, 15px)));grid-template-columns:var(--comp-icon-size) 1fr;padding:var(--comp-padding);padding-left:calc(var(--comp-padding) - var(--tct-scale-2, var(--app-scale-2x, 10px)));padding-bottom:calc(var(--comp-padding) - var(--tct-scale-1, var(--app-scale-1x, 5px)))}:host(:not([appearance])) ::slotted(ul),:host([appearance=standard]) ::slotted(ul){margin:var(--tct-scale-l3, var(--app-scale-3x, 15px)) 0}:host([appearance=minimal]){margin:0}:host([appearance=minimal]) .message{padding:var(--tct-message-minimal-padding, var(--t-message-minimal-padding, var(--app-scale-2x, 10px)));grid-template-columns:1fr}:host([appearance=minimal]) ::slotted(ul){margin:var(--tct-scale-1, var(--app-scale-1x, 5px)) 0}:host(:not([type])) .message,:host([type=info]) .message{border-left-color:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))}:host(:not([type])) .message-icon,:host([type=info]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1));--tct-icon-stroke-secondary:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))}:host([type=success]) .message{border-left-color:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00))}:host([type=success]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00));--tct-icon-stroke-secondary:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00))}:host([type=warning]) .message{border-left-color:var(--tct-stoplight-warning, var(--const-stoplight-warning, #C35500))}:host([type=warning]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-warning, var(--const-stoplight-warning, #C35500));--tct-icon-stroke-secondary:var(--tct-stoplight-warning, var(--const-stoplight-warning, #C35500))}:host([type=error]) .message,:host([type=danger]) .message{border-left-color:var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000))}:host([type=error]) .message-icon,:host([type=danger]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000));--tct-icon-stroke-secondary:var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000))}";const p=class{constructor(s){t(this,s);this.type="info";this.appearance="standard";this.description=false;this.presentToggle=undefined}get isFirefox(){return a()}componentDidLoad(){o(this.hostElement)}async present(){const{isFirefox:t}=this;this.presentToggle=!this.presentToggle;if(!t)return;r((()=>{this.presentToggle=false}))}delegateFocus(t){if(!i(t,this.hostElement))return;this.hostElement.shadowRoot.querySelector(".message").focus()}render(){const{isFirefox:t}=this;const e=t&&this.presentToggle;const a=!t&&this.presentToggle;const{description:o}=this;const r=n(`tecton.element.message.type.${this.type?this.type:"info"}`);return s("div",{tabindex:"-1",class:"message",role:o?undefined:"alert","aria-live":o?undefined:"assertive","aria-atomic":o?undefined:"true","aria-relevant":o?undefined:"all","test-id":"messageContainer"},this.appearance==="standard"?this.messageIcon(this.type):"",a&&s("div",{class:"sr"}),s("div",{class:"sr message-label"},r),s("div",{class:"message-content","aria-hidden":e?"true":undefined},s("slot",null)))}messageIcon(t){const e={success:"success",warning:"warning",danger:"error",error:"error",info:"info"};const a=e[t]||e.info;return s("q2-icon",{type:a,class:"message-icon"})}get hostElement(){return e(this)}};p.style=c;export{p as q2_message};
-//# sourceMappingURL=p-1c993698.entry.js.map

package/dist/q2-tecton-elements/p-252889b7.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as a,g as r}from"./p-277dc8cd.js";import{c as o,s as i,o as n,i as s,m as c,g as d,l as h}from"./p-ef856249.js";const l="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block;margin:var(--tct-textarea-margin-top, var(--t-textarea-margin-top, var(--app-scale-6x, 30px))) 0 var(--tct-textarea-margin-bottom, var(--t-textarea-margin-bottom, var(--app-scale-6x, 30px)));font-size:var(--tct-textarea-font-size, var(--t-textarea-font-size, var(--app-font-size, inherit)))}:host([hidden]){display:none}label{--comp-label-padding:var(--tct-textarea-label-padding, 0 var(--tct-textarea-label-padding-right, var(--t-textarea-label-padding-right, 0)) 0 var(--tct-textarea-label-padding-left, var(--t-textarea-label-padding-left, 0)));--comp-label-margin:var(--tct-textarea-label-margin, var(--tct-textarea-label-margin-top, var(--t-textarea-label-margin-top, 0)) 0 var(--tct-textarea-label-margin-bottom, var(--t-textarea-label-margin-bottom, var(--tct-scale-1x, var(--app-scale-1x, 5px)))));display:block;padding:var(--comp-label-padding);margin:var(--comp-label-margin);color:var(--tct-textarea-label-font-color, var(--t-textarea-label-font-color, inherit));font-size:var(--tct-textarea-label-font-size, var(--t-textarea-label-font-size, inherit));font-weight:var(--tct-textarea-label-font-weight, var(--t-textarea-label-font-weight, 600));text-transform:var(--tct-textarea-label-text-transform, var(--t-textarea-label-text-transform, none));letter-spacing:var(--tct-textarea-label-letter-spacing, var(--t-textarea-label-letter-spacing, normal));transition:color var(--tct-textarea-tween, var(--t-textarea-tween, var(--tct-tween-2, var(--app-tween-2, 0.4s ease))))}.optional-tag{--comp-label-optional-margin:var(--tct-textarea-label-optional-margin, 0 0 0 var(--tct-textarea-label-optional-margin-left, var(--t-textarea-label-optional-margin-left, var(--tct-scale-1x, var(--app-scale-1x, 5px)))));margin:var(--comp-label-optional-margin);color:var(--tct-textarea-label-optional-font-color, var(--t-textarea-label-optional-font-color, var(--t-textA, var(--t-a11y-gray-color, rgba(77, 77, 77, 0.77)))));font-size:var(--tct-textarea-label-optional-font-size, var(--t-textarea-label-optional-font-size, 12px));font-weight:var(--tct-textarea-label-optional-font-weight, var(--t-textarea-label-optional-font-weight, 400))}.input-container{min-height:var(--tct-textarea-min-height, var(--t-textarea-min-height, var(--comp-textarea-min-height)));height:100%;--comp-default-border-radius:var(--tct-border-radius-1, var(--app-border-radius-1, 3px));--comp-textarea-border-top-left-radius:var(--tct-textarea-border-top-left-radius, var(--t-textarea-border-top-left-radius, var(--comp-default-border-radius)));--comp-textarea-border-top-right-radius:var(--tct-textarea-border-top-right-radius, var(--t-textarea-border-top-right-radius, var(--comp-default-border-radius)));--comp-textarea-border-bottom-right-radius:var(--tct-textarea-border-bottom-right-radius, var(--t-textarea-border-bottom-right-radius, var(--comp-default-border-radius)));--comp-textarea-border-bottom-left-radius:var(--tct-textarea-border-bottom-left-radius, var(--t-textarea-border-bottom-left-radius, var(--comp-default-border-radius)));--comp-textarea-border-radius:var(--comp-textarea-border-top-left-radius)\n      var(--comp-textarea-border-top-right-radius) var(--comp-textarea-border-bottom-right-radius)\n      var(--comp-textarea-border-bottom-left-radius);--comp-textarea-border-width:var(--tct-textarea-border-top-width, var(--t-textarea-border-top-width, 1px)) var(--tct-textarea-border-right-width, var(--t-textarea-border-right-width, 1px)) var(--tct-textarea-border-bottom-width, var(--t-textarea-border-bottom-width, 1px)) var(--tct-textarea-border-left-width, var(--t-textarea-border-left-width, 1px));--comp-textarea-focus-border-width:var(--tct-textarea-focus-border-top-width, var(--t-textarea-focus-border-top-width, 1px)) var(--tct-textarea-focus-border-right-width, var(--t-textarea-focus-border-right-width, 1px)) var(--tct-textarea-focus-border-bottom-width, var(--t-textarea-focus-border-bottom-width, 1px)) var(--tct-textarea-focus-border-left-width, var(--t-textarea-focus-border-left-width, 1px));--comp-textarea-icon-clearance:34px}:host([disabled]) .input-container{cursor:not-allowed;opacity:var(--tct-textarea-disabled-opacity, var(--t-textarea-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4))))}.content-container{--comp-textarea-min-height:44px;--comp-textarea-min-width:150px;position:relative;display:inline-block;min-height:var(--tct-textarea-min-height, var(--t-textarea-min-height, var(--comp-textarea-min-height)));min-width:var(--tct-textarea-min-width, var(--t-textarea-min-width, var(--comp-textarea-min-width)))}:host(:not([cols])) .content-container{width:100%}textarea{--comp-textarea-padding:var(--tct-textarea-padding, var(--tct-textarea-vertical-padding, var(--t-textarea-vertical-padding, var(--tct-scale-2x, var(--app-scale-2x, 10px)))) var(--tct-textarea-horizontal-padding, var(--t-textarea-horizontal-padding, var(--tct-scale-2x, var(--app-scale-2x, 10px)))));resize:none;height:100%;-webkit-appearance:none;appearance:none;display:block;box-sizing:border-box;min-height:var(--tct-textarea-min-height, var(--t-textarea-min-height, var(--comp-textarea-min-height)));padding:var(--comp-textarea-padding);background:var(--tct-textarea-background, var(--tct-textarea-bg, var(--t-textarea-bg, var(--tct-input-background, var(--tct-input-bg, var(--t-input-bg, var(--t-gray-14, #fcfcfd)))))));color:var(--tct-textarea-font-color, var(--t-textarea-font-color, var(--t-input-font-color, inherit)));border-width:var(--comp-textarea-border-width);border-style:solid;border-color:var(--tct-textarea-border-color, var(--t-textarea-border-color, var(--tct-input-border-color, var(--t-input-border-color, var(--t-a11y-gray-color-AA, #949494)))));border-radius:var(--comp-textarea-border-radius);box-shadow:var(--tct-textarea-box-shadow, var(--t-textarea-box-shadow, none));scrollbar-width:thin;scrollbar-color:var(--t-a11y-gray-color) transparent;--comp-textarea-tween:var(--tct-textarea-tween, var(--t-textarea-tween, var(--tct-tween-2, var(--app-tween-2, 0.4s ease))));transition:border-width var(--comp-textarea-tween), border-color var(--comp-textarea-tween), box-shadow var(--comp-textarea-tween)}textarea::-webkit-scrollbar{width:var(--app-scale-1x);height:var(--app-scale-1x);margin:var(--app-scale-1x)}textarea::-webkit-scrollbar-thumb{background:var(--t-a11y-gray-color);border-radius:2px}textarea::-webkit-scrollbar-track{background:transparent}textarea:not([cols]){width:100%}textarea:focus{border-width:var(--comp-textarea-focus-border-width, 1px);border-color:var(--tct-textarea-focus-border-color, var(--t-textarea-focus-border-color, var(--tct-input-focus-border-color, var(--t-input-focus-border-color, var(--t-a11y-active-gray-color-AA, #404040)))));box-shadow:var(--const-double-focus-ring), var(--tct-textarea-focus-box-shadow, var(--t-textarea-focus-box-shadow, 0 0 transparent))}textarea::placeholder{color:var(--tct-textarea-placeholder-font-color, var(--t-textarea-placeholder-font-color, var(--t-input-placeholder-font-color, var(--tct-gray-7, var(--app-gray-7, var(--tct-gray-d1, var(--app-gray-d1, #666666)))))))}textarea[disabled]{cursor:not-allowed}.has-error textarea{padding-right:var(--comp-textarea-icon-clearance)}.has-error textarea:not(:focus){border-color:var(--tct-textarea-error-border-color, var(--t-textarea-error-border-color, var(--const-stoplight-alert, #c30000)))}q2-icon{margin-top:calc(var(--tct-textarea-border-top-width, var(--t-textarea-border-top-width, 1px)) / 2);margin-bottom:calc(var(--tct-textarea-border-bottom-width, var(--t-textarea-border-bottom-width, 1px)) / 2);pointer-events:none;position:absolute;top:var(--tct-textarea-vertical-padding, var(--t-textarea-vertical-padding, var(--tct-scale-2x, var(--app-scale-2x, 10px))));color:var(--tct-textarea-icon-stroke-primary, var(--t-textarea-icon-stroke-primary, var(--app-gray-9, var(--tct-gray, var(--app-gray, #999999)))));right:0;margin-right:var(--tct-scale-2x, var(--app-scale-2x, 10px));--tct-icon-stroke-primary:var(--tct-textarea-icon-stroke-primary, var(--t-textarea-icon-stroke-primary, var(--tct-gray-9, var(--t-gray-9, var(--tct-gray, var(--app-gray, #999999))))));--t-icon-stroke-primary:var(--tct-textarea-icon-stroke-primary, var(--t-textarea-icon-stroke-primary, var(--tct-gray-9, var(--t-gray-9, var(--tct-gray, var(--app-gray, #999999))))))}.icon-error{color:var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000));--tct-icon-stroke-primary:var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000));--t-icon-stroke-primary:var(--tct-stoplight-error, var(--const-stoplight-alert, #c30000))}.messages-container{height:0px;overflow:hidden;background:var(--tct-message-background, var(--tct-message-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, #f2f2f2))))));box-shadow:var(--tct-textarea-message-box-shadow, var(--t-textarea-message-box-shadow, var(--tct-box-shadow-1, var(--app-shadow-1, 0 2px 4px rgba(0, 0, 0, 0.3)))));transition:height var(--tct-textarea-messages-tween, var(--t-textarea-messages-tween, var(--tct-tween-1, var(--app-tween-1, 0.2s ease))));margin-top:2px;z-index:1;position:absolute;width:100%;color:var(--tct-textarea-messages-font-color, var(--t-textarea-messages-font-color, inherit))}.has-error label{color:var(--tct-textarea-error-label-font-color, var(--t-textarea-error-label-font-color, var(--tct-textarea-label-font-color, inherit)))}.max-length{color:var(--tct-textarea-max-length-color, var(--t-textarea-max-length-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-textarea-max-length-font-size, var(--t-textarea-max-length-font-size, var(--tct-font-size-small, var(--app-font-size-small, 12px))));position:absolute;right:0}.btn-resize{--tct-textarea-resize-icon-padding:calc(\n      calc(\n              var(--tct-textarea-resize-btn-width, var(--t-textarea-resize-btn-width, var(--tct-btn-icon-width, 44px))) - var(--tct-textarea-resize-icon-size, var(--t-textarea-resize-icon-size, 12px))\n          ) / 2\n  );width:var(--tct-textarea-resize-btn-width, var(--t-textarea-resize-btn-width, var(--tct-btn-icon-width, 44px)));height:var(--tct-textarea-resize-btn-height, var(--t-textarea-resize-btn-height, var(--tct-btn-icon-height, 44px)));background:var(--tct-textarea-resize-btn-background, var(--t-textarea-resize-btn-background, transparent));stroke:var(--tct-textarea-resize-color, var(--t-textarea-resize-color, var(--t-textA, rgba(77, 77, 77, 0.77))));border:0;position:absolute;right:calc(var(--tct-textarea-resize-icon-padding, var(--t-textarea-resize-icon-padding)) * -1 + 2px);bottom:calc(var(--tct-textarea-resize-icon-padding, var(--t-textarea-resize-icon-padding)) * -1 + 2px);display:block;padding:var(--tct-textarea-resize-icon-padding, var(--t-textarea-resize-icon-padding));font-size:0}.btn-resize:focus{outline:none;box-shadow:none}:host([resize=both]) .btn-resize{cursor:se-resize}:host([resize=vertical]) .btn-resize{cursor:s-resize}:host([resize=horizontal]) .btn-resize{cursor:e-resize}";const v=class{constructor(a){t(this,a);this.input=e(this,"input",7);this.change=e(this,"change",7);this.scheduledAfterRender=[];this.guid=o();this.checkRows=()=>{const{contentContainer:t,rows:e,textareaField:a,resize:r}=this;if(!e||["none","horizontal"].includes(r))return;t.style.height=`${t.offsetHeight}px`;a.removeAttribute("rows")};this.checkCols=()=>{const{contentContainer:t,cols:e,textareaField:a,resize:r}=this;if(!e||["none","vertical"].includes(r))return;t.style.width=`${t.offsetWidth}px`;a.removeAttribute("cols")};this.onTextareaFocus=()=>{this.hasFocus=true;this.valueOnFocus=this.value;i(this)};this.onTextareaBlur=()=>{const{valueOnFocus:t,textareaField:{value:e}}=this;this.hasFocus=false;i(this);if(t!==e)this.change.emit({value:e})};this.onTextareaInput=t=>{t.stopPropagation();const e=t.target.value;this.input.emit({value:e})};this.onTextareaChange=t=>{t.stopPropagation();const e=t.target.value;this.change.emit({value:e})};this.onMouseDown=t=>{const{contentContainer:e}=this;this.downParams={width:e.offsetWidth,height:e.offsetHeight,x:t.clientX,y:t.clientY};document.addEventListener("mousemove",this.onMouseMove);document.addEventListener("mouseup",this.onMouseUp)};this.onMouseMove=t=>{this.setHeight(t);this.setWidth(t)};this.onTouchStart=t=>{if(t.touches.length!==1)return;t.preventDefault();const{contentContainer:e}=this;const a=t.touches[0];this.downParams={width:e.offsetWidth,height:e.offsetHeight,x:a.pageX,y:a.pageY};document.addEventListener("touchmove",this.onTouchMove);document.addEventListener("touchend",this.onTouchMove)};this.onTouchMove=t=>{this.setHeight(t);this.setWidth(t)};this.onMouseUp=()=>{document.removeEventListener("mousemove",this.onMouseMove);this.downParams=null};this.value=undefined;this.label=undefined;this.hideLabel=undefined;this.hideMessages=undefined;this.optional=undefined;this.placeholder=undefined;this.disabled=undefined;this.readonly=undefined;this.spellcheck=undefined;this.maxlength=undefined;this.rows=undefined;this.cols=undefined;this.resize="vertical";this.errors=undefined;this.hints=undefined;this.hasFocus=undefined;this.downParams=undefined}componentWillLoad(){if(isNaN(this.maxlength)){this.maxlength=undefined}}componentDidRender(){this.scheduledAfterRender.push(this.checkRows,this.checkCols);this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}componentDidLoad(){n(this.hostElement)}get hasError(){return Array.isArray(this.errors)&&this.errors.length>0}get messages(){return this.errors&&this.errors.length>0&&this.errors||this.hints&&this.hints.length>0&&this.hints||[]}get showMessages(){return this.messages.length>0&&!this.hideMessages}get inputId(){return`input-guid-${this.guid}`}get inputDescribedBy(){return this.showMessages?`${this.inputId}-description`:undefined}get wrapperClasses(){const t=this.hasError?" has-error":"";const e=!!this.value?" has-value":"";const a=this.hasFocus?" has-focus":"";return`field-container${t}${e}${a}`}get showResize(){const{resize:t}=this;return t&&t!=="none"}valueObserver(){const{maxlength:t,value:e=""}=this;if(!t)return;const a=e.substr(0,t);if(a===e)return;this.change.emit({value:a})}rowsObserver(){this.contentContainer.style.height=null}colsObserver(){this.contentContainer.style.width=null}hintsObserver(){this.hasFocus&&this.scheduledAfterRender.push((()=>i(this)))}errorsObserver(){this.hasFocus&&this.scheduledAfterRender.push((()=>i(this)))}onHostElementFocus(t){if(!s(t,this.hostElement))return;this.textareaField.focus()}onHostElementChange(t){if(t.target===this.hostElement&&!this.hostElement.onchange){this.value=t.detail.value}}onHostElementInput(t){if(t.target===this.hostElement&&!this.hostElement.oninput){this.value=t.detail.value}}setValue(t){const{textareaField:e}=this;e.focus();e.value=t;e.dispatchEvent(new InputEvent("input"))}setWidth(t){var e,a;const{contentContainer:r,resize:o,downParams:{width:i,x:n}}=this;const s=["both","horizontal"].includes(o);if(!s)return;const c=t instanceof MouseEvent?t.clientX:(a=(e=t.touches[0])===null||e===void 0?void 0:e.pageX)!==null&&a!==void 0?a:0;const d=i-(n-c);r.style.width=`${d}px`}setHeight(t){var e,a;const{contentContainer:r,resize:o,downParams:{height:i,y:n}}=this;const s=["both","vertical"].includes(o);if(!s)return;const c=t instanceof MouseEvent?t.clientY:(a=(e=t.touches[0])===null||e===void 0?void 0:e.pageY)!==null&&a!==void 0?a:0;const d=i-(n-c);r.style.height=`${d}px`}render(){return a("div",{class:this.wrapperClasses},d(this),a("div",{class:"content-container",ref:t=>this.contentContainer=t},this.inputDOM(),this.maxlength?this.maxLengthDOM():"",c(this)))}maxLengthDOM(){var t;return a("div",{class:"max-length","aria-hidden":"true"},((t=this.value)===null||t===void 0?void 0:t.length)||0,"/",this.maxlength)}inputDOM(){return a("div",{class:"input-container"},a("textarea",{id:this.inputId,placeholder:this.placeholder&&h(this.placeholder)||undefined,"test-id":"inputField",maxLength:this.maxlength,"aria-describedby":this.inputDescribedBy,"aria-invalid":`${this.hasError}`,"aria-required":`${!this.optional}`,"aria-label":this.hideLabel&&this.label,spellcheck:this.spellcheck,rows:this.rows||3,cols:this.cols,value:this.value,ref:t=>this.textareaField=t,readonly:!!this.readonly,disabled:!!this.disabled,maxlength:this.maxlength,onInput:this.onTextareaInput,onChange:this.onTextareaChange,onFocus:this.onTextareaFocus,onBlur:this.onTextareaBlur}),this.hasError?a("q2-icon",{type:"error",class:"icon-error"}):"",this.showResize&&a("button",{onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart,class:"btn-resize","aria-label":h("tecton.element.input.resize"),tabIndex:-1},a("svg",{"aria-hidden":"true",viewBox:"0 0 12 12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M8.5 11.5l3-3m-7 3l7-7m-11 7l11-11",fill:"none","stroke-stroke-linecap":"square"}))))}get hostElement(){return r(this)}static get watchers(){return{value:["valueObserver"],rows:["rowsObserver"],cols:["colsObserver"],hints:["hintsObserver"],errors:["errorsObserver"]}}};v.style=l;export{v as q2_textarea};
-//# sourceMappingURL=p-252889b7.entry.js.map

package/dist/q2-tecton-elements/p-252889b7.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","Q2Textarea","this","scheduledAfterRender","guid","createGuid","checkRows","contentContainer","rows","textareaField","resize","includes","style","height","offsetHeight","removeAttribute","checkCols","cols","width","offsetWidth","onTextareaFocus","hasFocus","valueOnFocus","value","setMessageHeight","onTextareaBlur","change","emit","onTextareaInput","event","stopPropagation","target","input","onTextareaChange","onMouseDown","downParams","x","clientX","y","clientY","document","addEventListener","onMouseMove","onMouseUp","setHeight","setWidth","onTouchStart","touches","length","preventDefault","firstTouch","pageX","pageY","onTouchMove","removeEventListener","componentWillLoad","isNaN","maxlength","undefined","componentDidRender","push","forEach","fn","componentDidLoad","overrideFocus","hostElement","hasError","Array","isArray","errors","messages","hints","showMessages","hideMessages","inputId","inputDescribedBy","wrapperClasses","errorClass","valueClass","focusClass","showResize","valueObserver","truncatedValue","substr","rowsObserver","colsObserver","hintsObserver","errorsObserver","onHostElementFocus","isEventFromElement","focus","onHostElementChange","onchange","detail","onHostElementInput","oninput","setValue","dispatchEvent","InputEvent","resizeX","eventX","MouseEvent","_b","_a","newWidth","resizeY","eventY","newHeight","render","h","class","labelDOM","ref","el","inputDOM","maxLengthDOM","messagesDOM","id","placeholder","loc","maxLength","optional","hideLabel","label","spellcheck","readonly","disabled","onInput","onChange","onFocus","onBlur","type","tabIndex","viewBox","xmlns","d","fill"],"sources":["./src/components/q2-textarea/styles.scss?tag=q2-textarea&encapsulation=shadow","./src/components/q2-textarea/index.tsx"],"sourcesContent":["@import '../../styles/host';\n@import '../../styles/functions';\n\n:host {\n    display: block;\n    margin: var-list(var-prefixer(textarea-margin-top), --app-scale-6x, 30px) 0\n        var-list(var-prefixer(textarea-margin-bottom), --app-scale-6x, 30px);\n    font-size: var-list(var-prefixer(textarea-font-size), --app-font-size, inherit);\n}\n\n:host([hidden]) {\n    display: none;\n}\n\nlabel {\n    --comp-label-padding: #{var-list(\n            --tct-textarea-label-padding,\n            unquote(\n                '0 #{var-list(var-prefixer(textarea-label-padding-right), 0)} 0 #{var-list(var-prefixer(textarea-label-padding-left), 0)}'\n            )\n        )};\n    --comp-label-margin: #{var-list(\n            --tct-textarea-label-margin,\n            unquote(\n                '#{var-list(var-prefixer(textarea-label-margin-top), 0)} 0 #{var-list(var-prefixer(textarea-label-margin-bottom), --tct-scale-1x, --app-scale-1x, 5px)}'\n            )\n        )};\n    display: block;\n    padding: var(--comp-label-padding);\n    margin: var(--comp-label-margin);\n    color: var-list(var-prefixer(textarea-label-font-color), inherit);\n    font-size: var-list(var-prefixer(textarea-label-font-size), inherit);\n    font-weight: var-list(var-prefixer(textarea-label-font-weight), 600);\n    text-transform: var-list(var-prefixer(textarea-label-text-transform), none);\n    letter-spacing: var-list(var-prefixer(textarea-label-letter-spacing), normal);\n    transition: color var-list(var-prefixer(textarea-tween), --tct-tween-2, --app-tween-2, unquote('0.4s ease'));\n}\n\n.optional-tag {\n    --comp-label-optional-margin: #{var-list(\n            --tct-textarea-label-optional-margin,\n            unquote(\n                '0 0 0 #{var-list(var-prefixer(textarea-label-optional-margin-left), --tct-scale-1x, --app-scale-1x, 5px)}'\n            )\n        )};\n    margin: var(--comp-label-optional-margin);\n    color: var-list(\n        var-prefixer(textarea-label-optional-font-color),\n        --t-textA,\n        --t-a11y-gray-color,\n        rgba(77, 77, 77, 0.77)\n    );\n    font-size: var-list(var-prefixer(textarea-label-optional-font-size), 12px);\n    font-weight: var-list(var-prefixer(textarea-label-optional-font-weight), 400);\n}\n\n.input-container {\n    min-height: var-list(var-prefixer(textarea-min-height), --comp-textarea-min-height);\n    height: 100%;\n    --comp-default-border-radius: #{var-list(--tct-border-radius-1, --app-border-radius-1, 3px)};\n    --comp-textarea-border-top-left-radius: #{var-list(\n            var-prefixer(textarea-border-top-left-radius),\n            --comp-default-border-radius\n        )};\n    --comp-textarea-border-top-right-radius: #{var-list(\n            var-prefixer(textarea-border-top-right-radius),\n            --comp-default-border-radius\n        )};\n    --comp-textarea-border-bottom-right-radius: #{var-list(\n            var-prefixer(textarea-border-bottom-right-radius),\n            --comp-default-border-radius\n        )};\n    --comp-textarea-border-bottom-left-radius: #{var-list(\n            var-prefixer(textarea-border-bottom-left-radius),\n            --comp-default-border-radius\n        )};\n    --comp-textarea-border-radius: var(--comp-textarea-border-top-left-radius)\n        var(--comp-textarea-border-top-right-radius) var(--comp-textarea-border-bottom-right-radius)\n        var(--comp-textarea-border-bottom-left-radius);\n    --comp-textarea-border-width: #{var-list(var-prefixer(textarea-border-top-width), 1px)\n        var-list(var-prefixer(textarea-border-right-width), 1px)\n        var-list(var-prefixer(textarea-border-bottom-width), 1px)\n        var-list(var-prefixer(textarea-border-left-width), 1px)};\n    --comp-textarea-focus-border-width: #{var-list(var-prefixer(textarea-focus-border-top-width), 1px)\n        var-list(var-prefixer(textarea-focus-border-right-width), 1px)\n        var-list(var-prefixer(textarea-focus-border-bottom-width), 1px)\n        var-list(var-prefixer(textarea-focus-border-left-width), 1px)};\n    --comp-textarea-icon-clearance: 34px;\n\n    :host([disabled]) & {\n        cursor: not-allowed;\n        opacity: var-list(var-prefixer(textarea-disabled-opacity), --tct-disabled-opacity, --app-disabled-opacity, 0.4);\n    }\n}\n\n.content-container {\n    --comp-textarea-min-height: 44px;\n    --comp-textarea-min-width: 150px;\n    position: relative;\n    display: inline-block;\n    min-height: var-list(var-prefixer(textarea-min-height), --comp-textarea-min-height);\n    min-width: var-list(var-prefixer(textarea-min-width) --comp-textarea-min-width);\n\n    :host(:not([cols])) & {\n        width: 100%;\n    }\n}\n\ntextarea {\n    --comp-textarea-padding: #{var-list(\n            --tct-textarea-padding,\n            unquote(\n                '#{var-list(var-prefixer(textarea-vertical-padding), --tct-scale-2x, --app-scale-2x, 10px)} #{var-list(var-prefixer(textarea-horizontal-padding), --tct-scale-2x, --app-scale-2x, 10px)}'\n            )\n        )};\n    resize: none;\n    height: 100%;\n    -webkit-appearance: none;\n    appearance: none;\n    display: block;\n    box-sizing: border-box;\n    min-height: var-list(var-prefixer(textarea-min-height), --comp-textarea-min-height);\n    padding: var(--comp-textarea-padding);\n    background: var-list(\n        --tct-textarea-background,\n        var-prefixer(textarea-bg),\n        --tct-input-background,\n        var-prefixer(input-bg),\n        --t-gray-14,\n        #fcfcfd\n    );\n    color: var-list(var-prefixer(textarea-font-color), --t-input-font-color, inherit);\n    border-width: var(--comp-textarea-border-width);\n    border-style: solid;\n    border-color: var-list(\n        var-prefixer(textarea-border-color),\n        var-prefixer(input-border-color),\n        --t-a11y-gray-color-AA,\n        #949494\n    );\n    border-radius: var(--comp-textarea-border-radius);\n    box-shadow: var-list(var-prefixer(textarea-box-shadow), none);\n    scrollbar-width: thin;\n    scrollbar-color: var(--t-a11y-gray-color) transparent;\n    --comp-textarea-tween: #{var-list(var-prefixer(textarea-tween), --tct-tween-2, --app-tween-2, unquote('0.4s ease'))};\n    transition: border-width var(--comp-textarea-tween), border-color var(--comp-textarea-tween),\n        box-shadow var(--comp-textarea-tween);\n\n    &::-webkit-scrollbar {\n        width: var(--app-scale-1x);\n        height: var(--app-scale-1x);\n        margin: var(--app-scale-1x);\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background: var(--t-a11y-gray-color);\n        border-radius: 2px;\n    }\n\n    &::-webkit-scrollbar-track {\n        background: transparent;\n    }\n\n    &:not([cols]) {\n        width: 100%;\n    }\n\n    &:focus {\n        border-width: var(--comp-textarea-focus-border-width, 1px);\n        border-color: var-list(\n            var-prefixer(textarea-focus-border-color),\n            var-prefixer(input-focus-border-color),\n            --t-a11y-active-gray-color-AA,\n            #404040\n        );\n        box-shadow: var(--const-double-focus-ring),\n            var-list(var-prefixer(textarea-focus-box-shadow), unquote('0 0 transparent'));\n    }\n\n    &::placeholder {\n        color: var-list(\n            var-prefixer(textarea-placeholder-font-color),\n            --t-input-placeholder-font-color,\n            --tct-gray-7,\n            --app-gray-7,\n            --tct-gray-d1,\n            --app-gray-d1,\n            #666666\n        );\n    }\n\n    &[disabled] {\n        cursor: not-allowed;\n    }\n\n    .has-error & {\n        padding-right: var(--comp-textarea-icon-clearance);\n\n        &:not(:focus) {\n            border-color: var-list(var-prefixer(textarea-error-border-color), --const-stoplight-alert, #c30000);\n        }\n    }\n}\n\nq2-icon {\n    margin-top: calc(#{var-list(var-prefixer(textarea-border-top-width), 1px)} / 2);\n    margin-bottom: calc(#{var-list(var-prefixer(textarea-border-bottom-width), 1px)} / 2);\n    pointer-events: none;\n    position: absolute;\n    top: var-list(var-prefixer(textarea-vertical-padding), --tct-scale-2x, --app-scale-2x, 10px);\n    color: var-list(var-prefixer(textarea-icon-stroke-primary), --app-gray-9, --tct-gray, --app-gray, #999999);\n    right: 0;\n    margin-right: var-list(--tct-scale-2x, --app-scale-2x, 10px);\n    --tct-icon-stroke-primary: #{var-list(\n            var-prefixer(textarea-icon-stroke-primary),\n            var-prefixer(gray-9),\n            --tct-gray,\n            --app-gray,\n            #999999\n        )};\n    --t-icon-stroke-primary: #{var-list(\n            var-prefixer(textarea-icon-stroke-primary),\n            var-prefixer(gray-9),\n            --tct-gray,\n            --app-gray,\n            #999999\n        )};\n}\n\n.icon-error {\n    color: var-list(--tct-stoplight-error, --const-stoplight-alert, #c30000);\n    --tct-icon-stroke-primary: #{var-list(--tct-stoplight-error, --const-stoplight-alert, #c30000)};\n    --t-icon-stroke-primary: #{var-list(--tct-stoplight-error, --const-stoplight-alert, #c30000)};\n}\n\n.messages-container {\n    height: 0px;\n    overflow: hidden;\n    background: var-list(\n        --tct-message-background,\n        --tct-message-bg,\n        var-prefixer(gray-14),\n        --tct-gray-l3,\n        --app-gray-l3,\n        #f2f2f2\n    );\n    box-shadow: var-list(\n        var-prefixer(textarea-message-box-shadow),\n        --tct-box-shadow-1,\n        --app-shadow-1,\n        unquote('0 2px 4px rgba(0, 0, 0, 0.3)')\n    );\n    transition: height\n        var-list(var-prefixer(textarea-messages-tween), --tct-tween-1, --app-tween-1, unquote('0.2s ease'));\n    margin-top: 2px;\n    z-index: 1;\n    position: absolute;\n    width: 100%;\n    color: var-list(var-prefixer(textarea-messages-font-color), inherit);\n}\n\n.has-error label {\n    color: var-list(var-prefixer(textarea-error-label-font-color), --tct-textarea-label-font-color, inherit);\n}\n\n.max-length {\n    color: var-list(var-prefixer(textarea-max-length-color), --t-textA, rgba(77, 77, 77, 0.77));\n    font-size: var-list(\n        var-prefixer(textarea-max-length-font-size),\n        --tct-font-size-small,\n        --app-font-size-small,\n        12px\n    );\n    position: absolute;\n    right: 0;\n}\n\n.btn-resize {\n    --tct-textarea-resize-icon-padding: calc(\n        calc(\n                #{var-list(var-prefixer(textarea-resize-btn-width), --tct-btn-icon-width, 44px)} - #{var-list(\n                        var-prefixer(textarea-resize-icon-size),\n                        12px\n                    )}\n            ) / 2\n    );\n    width: var-list(var-prefixer(textarea-resize-btn-width), --tct-btn-icon-width, 44px);\n    height: var-list(var-prefixer(textarea-resize-btn-height), --tct-btn-icon-height, 44px);\n    background: var-list(var-prefixer(textarea-resize-btn-background), transparent);\n    stroke: var-list(var-prefixer(textarea-resize-color), --t-textA, rgba(77, 77, 77, 0.77));\n    border: 0;\n    position: absolute;\n    right: calc(#{var-list(var-prefixer(textarea-resize-icon-padding))} * -1 + 2px);\n    bottom: calc(#{var-list(var-prefixer(textarea-resize-icon-padding))} * -1 + 2px);\n    display: block;\n    padding: var-list(var-prefixer(textarea-resize-icon-padding));\n    font-size: 0;\n\n    &:focus {\n        outline: none;\n        box-shadow: none;\n    }\n\n    :host([resize='both']) & {\n        cursor: se-resize;\n    }\n\n    :host([resize='vertical']) & {\n        cursor: s-resize;\n    }\n\n    :host([resize='horizontal']) & {\n        cursor: e-resize;\n    }\n}\n","import { Component, EventEmitter, Prop, Event, Element, State, h, Watch, Listen, Method } from '@stencil/core';\nimport { IDict } from 'src/util';\nimport { createGuid, isEventFromElement, labelDOM, loc, messagesDOM, overrideFocus, setMessageHeight } from 'src/utils';\n\n@Component({\n    tag: 'q2-textarea',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Textarea {\n    private textareaField?: HTMLTextAreaElement;\n    private contentContainer?: HTMLDivElement;\n    private valueOnFocus: string;\n    private scheduledAfterRender: (() => void)[] = [];\n    private guid = createGuid();\n\n    @Prop({ mutable: true }) value: string;\n    @Prop({ reflect: true }) label: string;\n    @Prop({ reflect: true }) hideLabel: boolean;\n    @Prop({ reflect: true }) hideMessages: boolean;\n    @Prop({ reflect: true }) optional: boolean;\n    @Prop({ reflect: true }) placeholder: string;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true }) readonly: boolean;\n    @Prop({ reflect: true }) spellcheck: boolean;\n    @Prop({ reflect: true, mutable: true }) maxlength: number;\n    @Prop({ reflect: true }) rows: number;\n    @Prop({ reflect: true }) cols: number;\n    @Prop({ reflect: true }) resize: 'none' | 'vertical' | 'horizontal' | 'both' = 'vertical';\n    @Prop() errors: string[];\n    @Prop() hints: string[];\n\n    @State() hasFocus: boolean;\n    @State() downParams: IDict<number>;\n\n    /////// LIFECYCLE HOOKS ////////\n\n    componentWillLoad() {\n        if (isNaN(this.maxlength)) {\n            this.maxlength = undefined;\n        }\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.push(this.checkRows, this.checkCols);\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    componentDidLoad() {\n        overrideFocus(this.hostElement);\n    }\n\n    checkRows = () => {\n        const { contentContainer, rows, textareaField, resize } = this;\n\n        if (!rows || ['none', 'horizontal'].includes(resize)) return;\n        contentContainer.style.height = `${contentContainer.offsetHeight}px`;\n        textareaField.removeAttribute('rows');\n    };\n\n    checkCols = () => {\n        const { contentContainer, cols, textareaField, resize } = this;\n\n        if (!cols || ['none', 'vertical'].includes(resize)) return;\n        contentContainer.style.width = `${contentContainer.offsetWidth}px`;\n        textareaField.removeAttribute('cols');\n    };\n\n    @Element() hostElement: HTMLElement;\n\n    get hasError() {\n        return Array.isArray(this.errors) && this.errors.length > 0;\n    }\n\n    get messages(): string[] {\n        return (\n            (this.errors && this.errors.length > 0 && this.errors) ||\n            (this.hints && this.hints.length > 0 && this.hints) ||\n            []\n        );\n    }\n\n    get showMessages() {\n        return this.messages.length > 0 && !this.hideMessages;\n    }\n\n    get inputId() {\n        return `input-guid-${this.guid}`;\n    }\n\n    get inputDescribedBy() {\n        return this.showMessages ? `${this.inputId}-description` : undefined;\n    }\n\n    get wrapperClasses() {\n        const errorClass = this.hasError ? ' has-error' : '';\n        const valueClass = !!this.value ? ' has-value' : '';\n        const focusClass = this.hasFocus ? ' has-focus' : '';\n\n        return `field-container${errorClass}${valueClass}${focusClass}`;\n    }\n\n    get showResize() {\n        const { resize } = this;\n        return resize && resize !== 'none';\n    }\n\n    //////// OBSERVERS //////////\n\n    @Watch('value')\n    valueObserver() {\n        const { maxlength, value = '' } = this;\n        if (!maxlength) return;\n\n        const truncatedValue = value.substr(0, maxlength);\n        if (truncatedValue === value) return;\n\n        this.change.emit({ value: truncatedValue });\n    }\n\n    @Watch('rows')\n    rowsObserver() {\n        this.contentContainer.style.height = null;\n    }\n\n    @Watch('cols')\n    colsObserver() {\n        this.contentContainer.style.width = null;\n    }\n\n    @Watch('hints')\n    hintsObserver() {\n        this.hasFocus && this.scheduledAfterRender.push(() => setMessageHeight(this));\n    }\n\n    @Watch('errors')\n    errorsObserver() {\n        this.hasFocus && this.scheduledAfterRender.push(() => setMessageHeight(this));\n    }\n\n    ///////// HOST ELEMENT EVENTS //////\n    @Listen('focus')\n    onHostElementFocus(event: Event) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.textareaField.focus();\n    }\n\n    @Listen('change')\n    onHostElementChange(event: CustomEvent) {\n        if (event.target === this.hostElement && !this.hostElement.onchange) {\n            this.value = event.detail.value;\n        }\n    }\n\n    @Listen('input')\n    onHostElementInput(event: CustomEvent) {\n        if (event.target === this.hostElement && !this.hostElement.oninput) {\n            this.value = event.detail.value;\n        }\n    }\n\n    ///////// Events /////////\n\n    @Event() input: EventEmitter<any>;\n    @Event() change: EventEmitter<any>;\n\n    /// Methods ///\n    @Method()\n    setValue(value: string) {\n        const { textareaField } = this;\n        textareaField.focus();\n        textareaField.value = value;\n        textareaField.dispatchEvent(new InputEvent('input'));\n    }\n\n    ///// ACTIONS ////////\n\n    onTextareaFocus = () => {\n        this.hasFocus = true;\n        this.valueOnFocus = this.value;\n        setMessageHeight(this);\n    };\n\n    onTextareaBlur = () => {\n        const {\n            valueOnFocus,\n            textareaField: { value },\n        } = this;\n        this.hasFocus = false;\n        setMessageHeight(this);\n        if (valueOnFocus !== value) this.change.emit({ value });\n    };\n\n    onTextareaInput = (event: InputEvent) => {\n        event.stopPropagation();\n        const value = (event.target as HTMLTextAreaElement).value;\n\n        this.input.emit({ value });\n    };\n\n    onTextareaChange = (event: InputEvent) => {\n        event.stopPropagation();\n        const value = (event.target as HTMLTextAreaElement).value;\n\n        this.change.emit({ value });\n    };\n\n    onMouseDown = (event: MouseEvent) => {\n        const { contentContainer } = this;\n        this.downParams = {\n            width: contentContainer.offsetWidth,\n            height: contentContainer.offsetHeight,\n            x: event.clientX,\n            y: event.clientY,\n        };\n        document.addEventListener('mousemove', this.onMouseMove);\n        document.addEventListener('mouseup', this.onMouseUp);\n    };\n\n    onMouseMove = (event: MouseEvent) => {\n        this.setHeight(event);\n        this.setWidth(event);\n    };\n\n    onTouchStart = (event: TouchEvent) => {\n        if (event.touches.length !== 1) return;\n\n        event.preventDefault();\n\n        const { contentContainer } = this;\n        const firstTouch = event.touches[0];\n\n        this.downParams = {\n            width: contentContainer.offsetWidth,\n            height: contentContainer.offsetHeight,\n            x: firstTouch.pageX,\n            y: firstTouch.pageY,\n        };\n\n        document.addEventListener('touchmove', this.onTouchMove);\n        document.addEventListener('touchend', this.onTouchMove);\n    };\n\n    onTouchMove = (event: TouchEvent) => {\n        this.setHeight(event);\n        this.setWidth(event);\n    };\n\n    setWidth(event: MouseEvent | TouchEvent) {\n        const {\n            contentContainer,\n            resize,\n            downParams: { width, x },\n        } = this;\n\n        const resizeX = ['both', 'horizontal'].includes(resize);\n\n        if (!resizeX) return;\n        const eventX = event instanceof MouseEvent ? event.clientX : event.touches[0]?.pageX ?? 0;\n        const newWidth = width - (x - eventX);\n        contentContainer.style.width = `${newWidth}px`;\n    }\n\n    setHeight(event: MouseEvent | TouchEvent) {\n        const {\n            contentContainer,\n            resize,\n            downParams: { height, y },\n        } = this;\n\n        const resizeY = ['both', 'vertical'].includes(resize);\n        if (!resizeY) return;\n        const eventY = event instanceof MouseEvent ? event.clientY : event.touches[0]?.pageY ?? 0;\n        const newHeight = height - (y - eventY);\n        contentContainer.style.height = `${newHeight}px`;\n    }\n\n    onMouseUp = () => {\n        document.removeEventListener('mousemove', this.onMouseMove);\n        this.downParams = null;\n    };\n\n    /////// VIEW METHODS ///////\n\n    render() {\n        return (\n            <div class={this.wrapperClasses}>\n                {labelDOM(this)}\n                <div\n                    class=\"content-container\"\n                    ref={el => (this.contentContainer = el)}\n                >\n                    {this.inputDOM()}\n                    {this.maxlength ? this.maxLengthDOM() : ''}\n                    {messagesDOM(this)}\n                </div>\n            </div>\n        );\n    }\n\n    maxLengthDOM() {\n        return (\n            <div\n                class=\"max-length\"\n                aria-hidden=\"true\"\n            >\n                {this.value?.length || 0}/{this.maxlength}\n            </div>\n        );\n    }\n\n    inputDOM() {\n        return (\n            <div class=\"input-container\">\n                <textarea\n                    id={this.inputId}\n                    placeholder={(this.placeholder && loc(this.placeholder)) || undefined}\n                    test-id=\"inputField\"\n                    maxLength={this.maxlength}\n                    aria-describedby={this.inputDescribedBy}\n                    aria-invalid={`${this.hasError}`}\n                    aria-required={`${!this.optional}`}\n                    aria-label={this.hideLabel && this.label}\n                    spellcheck={this.spellcheck}\n                    rows={this.rows || 3}\n                    cols={this.cols}\n                    value={this.value}\n                    ref={el => (this.textareaField = el)}\n                    readonly={!!this.readonly}\n                    disabled={!!this.disabled}\n                    maxlength={this.maxlength}\n                    onInput={this.onTextareaInput}\n                    onChange={this.onTextareaChange}\n                    onFocus={this.onTextareaFocus}\n                    onBlur={this.onTextareaBlur}\n                ></textarea>\n                {this.hasError ? (\n                    <q2-icon\n                        type=\"error\"\n                        class=\"icon-error\"\n                    />\n                ) : (\n                    ''\n                )}\n                {this.showResize && (\n                    <button\n                        onMouseDown={this.onMouseDown}\n                        onTouchStart={this.onTouchStart}\n                        class=\"btn-resize\"\n                        aria-label={loc('tecton.element.input.resize')}\n                        tabIndex={-1}\n                    >\n                        <svg\n                            aria-hidden=\"true\"\n                            viewBox=\"0 0 12 12\"\n                            xmlns=\"http://www.w3.org/2000/svg\"\n                        >\n                            <path\n                                d=\"M8.5 11.5l3-3m-7 3l7-7m-11 7l11-11\"\n                                fill=\"none\"\n                                stroke-stroke-linecap=\"square\"\n                            />\n                        </svg>\n                    </button>\n                )}\n            </div>\n        );\n    }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/p-25bd1b18.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as e,g as o}from"./p-277dc8cd.js";import{r,o as n,l as a,i as l}from"./p-ef856249.js";import{s as c,a as s}from"./p-788adb51.js";const p="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;position:relative;line-height:0}:host(:not(:last-child)){margin-inline-end:var(--tct-pill-margin, var(--t-pill-margin, var(--app-scale-2x, 10px)))}q2-popover,.btn-wrapper{--comp-pill-min-height:var(--tct-pill-min-height, var(--t-pill-min-height, 44px));--comp-pill-btn-height:var(--tct-pill-btn-height, var(--t-pill-btn-height, 30px))}.btn-wrapper{--comp-pill-btn-border-width:var(--tct-pill-btn-border-width, var(--t-pill-btn-border-width, 2px));--comp-close-size:0px;--comp-btn-background:var(--tct-pill-btn-background, var(--t-pill-btn-background, var(--t-base, #ffffff)));--comp-hover-btn-background:var(--tct-pill-hover-btn-background, var(--t-pill-hover-btn-background, var(--t-gray-13, #e6e6e6)));--comp-btn-padding:var(--tct-pill-btn-padding-inline, var(--t-pill-btn-padding-inline, var(--app-scale-3x, 15px)));--comp-btn-color:var(--tct-pill-btn-color, var(--t-pill-btn-color, var(--t-gray-3, #262626)));--comp-active-btn-color:var(--comp-btn-background);--comp-active-btn-background:var(--tct-pill-active-btn-background, var(--t-pill-active-btn-background, var(--t-gray-7, #666666)));--comp-active-btn-border-color:var(--tct-pill-active-btn-border-color, var(--t-pill-active-btn-border-color, var(--t-gray-7, #666666)));--comp-hover-active-btn-background:var(--tct-pill-active-btn-background, var(--t-pill-active-btn-background, var(--t-gray-6, #4d4d4d)));--comp-hover-active-btn-border-color:var(--tct-pill-active-btn-background, var(--t-pill-active-btn-background, var(--t-gray-6, #4d4d4d)));position:relative}:host(:not(:empty)) .btn-wrapper,.btn-wrapper.has-icon{--comp-close-size:var(--comp-pill-btn-height)}:host([active]) .btn-wrapper{--comp-btn-color:var(--tct-pill-active-btn-color, var(--t-pill-active-btn-color, var(--t-base, #ffffff)))}:host([theme=primary]) .btn-wrapper{--comp-active-btn-background:var(--tct-pill-primary-active-background, var(--t-primary-l5, #61c4ff));--comp-active-btn-color:var(--tct-pill-primary-active-font-color, var(--t-primary-text, #ffffff));--comp-active-btn-border-color:var(--tct-pill-primary-active-border-color, var(--t-primary-l5, #61c4ff));--comp-hover-active-btn-background:var(--tct-pill-primary-active-hover-background, var(--t-primary-l3, #21acff));--comp-hover-active-btn-border-color:var(--tct-pill-primary-active-hover-border-color, var(--t-primary-l3, #21acff))}:host([theme=secondary]) .btn-wrapper{--comp-active-btn-background:var(--tct-pill-secondary-active-background, var(--t-secondary-l5, #d9e1e6));--comp-active-btn-color:var(--tct-pill-secondary-active-font-color, var(--t-secondary-text, #141414));--comp-active-btn-border-color:var(--tct-pill-secondary-active-border-color, var(--t-secondary-l5, #d9e1e6));--comp-hover-active-btn-background:var(--tct-pill-secondary-active-hover-background, var(--t-secondary-l3, #c9d5db));--comp-hover-active-btn-border-color:var(--tct-pill-secondary-active-hover-border-color, var(--t-secondary-l3, #c9d5db))}:host([theme=tertiary]) .btn-wrapper{--comp-active-btn-background:var(--tct-pill-tertiary-active-background, var(--t-tertiary-l5, #f4fafe));--comp-active-btn-color:var(--tct-pill-tertiary-active-font-color, var(--t-tertiary-text, #141414));--comp-active-btn-border-color:var(--tct-pill-tertiary-active-border-color, var(--t-tertiary-l5, #f4fafe));--comp-hover-active-btn-background:var(--tct-pill-tertiary-active-hover-background, var(--t-tertiary-l3, #eff8fd));--comp-hover-active-btn-border-color:var(--tct-pill-tertiary-active-hover-border-color, var(--t-tertiary-l3, #eff8fd))}.btn-height-wrapper{height:var(--comp-pill-min-height);display:flex;align-items:center;cursor:pointer}.btn-height-wrapper:focus{box-shadow:none}:host([disabled]) .btn-height-wrapper{cursor:not-allowed}.btn-close,.btn-primary{cursor:pointer;height:var(--comp-pill-btn-height);border-style:solid;border-radius:var(--tct-pill-btn-border-radius, var(--t-pill-btn-border-radius, 30px));transition-property:background, color, padding, width, opacity;transition:var(--tct-pill-btn-tween, var(--t-pill-btn-tween, var(--app-tween-1, 0.2s ease)))}:host([disabled]) .btn-close,:host([disabled]) .btn-primary,:host([disabled]) q2-icon{opacity:var(--tct-pill-disabled-opacity, var(--t-pill-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4))));cursor:not-allowed}.btn-primary{background:var(--comp-btn-background);border-width:var(--comp-pill-btn-border-width);border-color:var(--tct-pill-btn-border-color, var(--t-pill-btn-border-color, var(--t-a11y-gray-color-AA, #949494)));padding-inline:var(--comp-btn-padding);padding-right:calc(var(--comp-btn-padding) + var(--comp-close-size));font-size:var(--tct-pill-btn-font-size, var(--t-pill-btn-font-size, var(--app-font-size, 14px)));color:var(--comp-btn-color);display:block;width:100%;text-align:start}.btn-primary:focus,.btn-primary:hover{background:var(--comp-hover-btn-background)}:host(:not(:empty)) .btn-primary,.has-icon .btn-primary{padding-right:calc(var(--tct-pill-icon-gap, var(--t-pill-icon-gap, var(--app-scale-1x, 5px))) + var(--comp-close-size))}.has-options .btn-primary{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:var(--tct-pill-max-width, var(--t-pill-max-width, 200px))}:host([active]) .btn-primary{background:var(--comp-active-btn-background);border-color:var(--comp-active-btn-border-color);color:var(--comp-active-btn-color)}:host([active]) .btn-primary:focus,:host([active]) .btn-primary:hover{background:var(--comp-hover-active-btn-background);border-color:var(--comp-hover-active-btn-border-color)}.btn-close{background:transparent;border-color:transparent;border-width:var(--comp-pill-btn-border-width);width:var(--comp-close-size);height:var(--comp-close-size);padding:0;border:0;display:inline-flex;justify-content:center;align-items:center;position:absolute;right:0;top:50%;transform:translateY(-50%);opacity:0}:host([active]) .btn-close{color:var(--comp-active-btn-color)}:host(:not(:empty)) .btn-close,.has-icon .btn-close{opacity:1}q2-icon{--t-icon-stroke-primary:currentColor;width:var(--tct-pill-icon-size, var(--t-pill-icon-size, 14px));height:var(--tct-pill-icon-size, var(--t-pill-icon-size, 14px));transition-property:transform;transition:var(--tct-pill-btn-tween, var(--t-pill-btn-tween, var(--app-tween-1, 0.2s ease)))}div.btn-close{pointer-events:none}:host([open]) div.btn-close q2-icon{transform:rotate(180deg)}:host([active]) button.btn-close:focus,:host([active]) button.btn-close:hover{background:var(--tct-pill-hover-close-btn-background, var(--t-pill-hover-close-btn-background, var(--t-top-a1, rgba(13, 13, 13, 0.35))));border-color:var(--tct-pill-hover-close-btn-border-color, var(--t-pill-hover-close-btn-border-color, var(--t-top-a1, rgba(13, 13, 13, 0.35))))}q2-popover{top:calc(var(--comp-pill-min-height) - (var(--comp-pill-min-height) - var(--comp-pill-btn-height)) / 2)}";const d=class{constructor(e){t(this,e);this.change=i(this,"change",7);var o;this.scheduledAfterRender=[];this.syncValueProperties=()=>{const{value:t,selectedOptions:i}=this;if(!!(i===null||i===void 0?void 0:i.length))this.selectedOptionsChanged(i);else if(t)this.valueChanged(t)};this.getOption=async t=>{if(this.optionList){const i=await this.optionList.getOptions();return i.find((i=>i.value===t))}else{return this.hostElement.querySelector(`q2-option[value="${t}"]`)}};this.updateSelectedOptionElements=async()=>{var t;const{selectedOptions:i=[]}=this;const e=i.map((t=>t.value));const o=await((t=this.optionList)===null||t===void 0?void 0:t.getOptions());if(this.optionCount)this.active=!!e.length;this.selectedOptionElements=(o===null||o===void 0?void 0:o.filter((t=>e.includes(t.value))))||[]};this.determineOptionCount=()=>{const t=this.hostElement.querySelectorAll("q2-option").length;this.optionCount=t};this.clearSelectedOptions=()=>{this.selectedOptions=[];this.value=null;this.active=false;this.open=false;this.primaryBtn.focus();this.change.emit({value:null,values:[],active:false});this.scheduledAfterRender.push(r)};this.handleClick=async t=>{t.stopPropagation();if(this.disabled)return;if(this.optionCount){if(c(this)){this.executeActionSheet(t)}else{await this.popoverElement.toggle()}}else{const{value:t,label:i}=this;const e=this.active=!this.active;const o=e?[{value:t,display:i}]:[];this.selectedOptions=o;this.change.emit({value:t,values:o,active:e})}};this.handleKeydown=async t=>{const i=t.metaKey||t.ctrlKey||t.key==="Tab";if(!this.optionCount||this.disabled||i)return;t.preventDefault();if(c(this,t)){this.executeActionSheet(t)}else{this.optionList.handleExternalKeydown(t)}};this.handleButtonFocusout=async t=>{var i;const e=t.relatedTarget;if((i=(e===null||e===void 0?void 0:e.tagName)==="Q2-OPTION")!==null&&i!==void 0?i:false)return;this.open=false};this.handleChange=t=>{t.stopPropagation();if(!this.optionCount)return;this.handleSelectionChanges(t.detail)};this.handleWrapperClick=()=>{this.primaryBtn.focus();this.primaryBtn.click()};this.onClickElsewhere=t=>{const i=t.target;if(i.localName==="click-elsewhere"){t.stopPropagation();const{popoverElement:i}=this;if(!i)return;i.open=false}};this.hoist=!!((o=window.Tecton)===null||o===void 0?void 0:o.useActionSheets);this.disabled=undefined;this.active=undefined;this.open=undefined;this.multiple=undefined;this.maxLength=undefined;this.label=undefined;this.value=undefined;this.theme=undefined;this.selectedOptions=[];this.popoverMinHeight=150;this.popoverDirection=undefined;this.popoverAlignment="right";this.optionListLabel=undefined;this.optionCount=undefined;this.selectedOptionElements=[]}componentWillLoad(){const t=new MutationObserver(this.determineOptionCount);t.observe(this.hostElement,{childList:true,attributes:true});this.mutationObserver=t}componentDidLoad(){n(this.hostElement);this.syncValueProperties()}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}disconnectedCallback(){this.mutationObserver.disconnect();this.mutationObserver=null}get buttonContent(){const{label:t,selectedOptions:i,selectedOptionElements:e,optionCount:o}=this;if(!o||e.length===0)return a(t);else if(e.length===1)return a(e[0].display);return a("tecton.element.pill.activeCount",{count:i.length})}get truncatedButtonContent(){const{maxLength:t,buttonContent:i}=this;if(t)return i.length>t?`${i.substring(0,t)}…`:i;else return i}async executeActionSheet(t){const i=await s(this,t);this.handleSelectionChanges(i)}async handleSelectionChanges(t){const{multiple:i}=this;const{value:e="",values:o=[]}=t;const r=i?!!o.length:!!e;if(!this.hostElement.onchange){if(i){this.selectedOptions=o;this.value=undefined}else{const t=await this.getOption(e);this.selectedOptions=t?[{value:t.value,display:t.display}]:[];this.value=(t===null||t===void 0?void 0:t.value)||undefined}}this.change.emit({value:e,values:o,active:r})}async valueChanged(t){var i,e;const{multiple:o,selectedOptions:r}=this;const n=(e=(i=r===null||r===void 0?void 0:r[0])===null||i===void 0?void 0:i.value)!==null&&e!==void 0?e:null;if(o)return;if(t===n)this.updateSelectedOptionElements();else{const i=await this.getOption(t);const{value:e,display:o}=i||{value:t,display:null};this.selectedOptions=e?[{value:e,display:o}]:[]}}selectedOptionsChanged(t){var i,e;const{multiple:o}=this;const r=(e=(i=t===null||t===void 0?void 0:t[0])===null||i===void 0?void 0:i.value)!==null&&e!==void 0?e:null;if(o){if(this.value)this.value=null;this.updateSelectedOptionElements()}else if(this.value===r){this.updateSelectedOptionElements()}else{this.value=r}}delegateFocus(t){if(!l(t,this.hostElement))return;this.primaryBtn.focus()}popoverStateHandler({detail:{open:t}}){if(this.open!==t)this.open=t;if(t)return;this.optionList.setActiveElement(null)}handleSelectedDisplay(){if(this.multiple)return;this.updateSelectedOptionElements()}generateIcon(){const{optionCount:t,active:i}=this;const o=t&&i;const r=o?"button":"div";const n=o||!t?"close":"chevron-down";return e(r,{class:"btn-close",onClick:o&&this.clearSelectedOptions,disabled:o&&this.disabled,"aria-label":o&&a("tecton.element.pill.clearSelection"),type:o&&"button"},e("q2-icon",{type:n}))}generateHiddenElement(){return e("div",{id:"option-description",class:"sr","aria-hidden":"true"},a("tecton.element.optionList.optionCount",[this.optionCount]))}render(){const{optionCount:t,active:i,open:o}=this;const r=["btn-wrapper"];if(t||i)r.push("has-icon");if(t)r.push("has-options");return e("click-elsewhere",{onChange:this.onClickElsewhere},e("div",{class:r.join(" ")},e("div",{class:"btn-height-wrapper",ref:t=>this.primaryBtnWrapper=t,onClick:this.handleWrapperClick,tabIndex:-1},e("button",{class:"btn-primary","test-id":"btn-control",type:"button",role:"combobox",ref:t=>this.primaryBtn=t,onClick:this.handleClick,onKeyDown:this.handleKeydown,onFocusout:this.handleButtonFocusout,disabled:this.disabled,"aria-roledescription":!t&&"filter","aria-controls":t&&"option-list","aria-expanded":t&&`${!!o}`||undefined,"aria-label":this.maxLength&&this.buttonContent,"aria-describedby":t&&"option-description"||undefined},this.truncatedButtonContent,!t&&i&&e("span",{class:"sr"},"(",a("tecton.element.pill.active"),")"))),this.generateIcon(),this.generateHiddenElement()),this.optionCount>0&&e("q2-popover",{ref:t=>this.popoverElement=t,controlElement:this.primaryBtn,open:this.open,minHeight:this.popoverMinHeight,direction:this.popoverDirection,align:this.popoverAlignment},e("q2-option-list",{type:"listbox",ref:t=>this.optionList=t,id:"option-list",onChange:this.handleChange,multiple:this.multiple,selectedOptions:this.selectedOptions,onReady:()=>this.updateSelectedOptionElements(),label:a("tecton.element.optionList.label",[this.optionListLabel])},e("slot",null))))}get hostElement(){return o(this)}static get watchers(){return{value:["valueChanged"],selectedOptions:["selectedOptionsChanged"]}}};d.style=p;export{d as q2_pill};
-//# sourceMappingURL=p-25bd1b18.entry.js.map

package/dist/q2-tecton-elements/p-25bd1b18.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","Q2Pill","this","scheduledAfterRender","syncValueProperties","value","selectedOptions","length","selectedOptionsChanged","valueChanged","getOption","async","optionList","options","getOptions","find","option","hostElement","querySelector","updateSelectedOptionElements","selectedValues","map","_a","optionCount","active","selectedOptionElements","filter","includes","determineOptionCount","numberOfOptions","querySelectorAll","clearSelectedOptions","open","primaryBtn","focus","change","emit","values","push","resizeIframe","handleClick","event","stopPropagation","disabled","shouldShowActionSheet","executeActionSheet","popoverElement","toggle","label","isActive","display","handleKeydown","isTabMetaOrCtrl","metaKey","ctrlKey","key","preventDefault","handleExternalKeydown","handleButtonFocusout","relatedTarget","tagName","handleChange","handleSelectionChanges","detail","handleWrapperClick","click","onClickElsewhere","target","localName","window","Tecton","useActionSheets","componentWillLoad","observer","MutationObserver","observe","childList","attributes","mutationObserver","componentDidLoad","overrideFocus","componentDidRender","forEach","fn","disconnectedCallback","disconnect","buttonContent","loc","count","truncatedButtonContent","maxLength","substring","result","showActionSheetList","changeDetails","multiple","onchange","undefined","selectedOption","newValue","firstValue","_b","delegateFocus","isEventFromElement","popoverStateHandler","setActiveElement","handleSelectedDisplay","generateIcon","isButton","TagName","iconName","h","class","onClick","type","generateHiddenElement","id","render","wrapperClassNames","onChange","join","ref","el","primaryBtnWrapper","tabIndex","role","onKeyDown","onFocusout","controlElement","minHeight","popoverMinHeight","direction","popoverDirection","align","popoverAlignment","onReady","optionListLabel"],"sources":["./src/components/q2-pill/styles.scss?tag=q2-pill&encapsulation=shadow","./src/components/q2-pill/index.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    display: inline-block;\n    position: relative;\n    line-height: 0;\n}\n\n:host(:not(:last-child)) {\n    margin-inline-end: var-list(var-prefixer(pill-margin), --app-scale-2x, 10px);\n}\n\nq2-popover,\n.btn-wrapper {\n    --comp-pill-min-height: #{var-list(var-prefixer(pill-min-height), 44px)};\n    --comp-pill-btn-height: #{var-list(var-prefixer(pill-btn-height), 30px)};\n}\n\n.btn-wrapper {\n    --comp-pill-btn-border-width: #{var-list(var-prefixer(pill-btn-border-width), 2px)};\n    --comp-close-size: 0px;\n    --comp-btn-background: #{var-list(var-prefixer(pill-btn-background), --t-base, #ffffff)};\n    --comp-hover-btn-background: #{var-list(var-prefixer(pill-hover-btn-background), --t-gray-13, #e6e6e6)};\n    --comp-btn-padding: #{var-list(var-prefixer(pill-btn-padding-inline), --app-scale-3x, 15px)};\n    --comp-btn-color: #{var-list(var-prefixer(pill-btn-color), --t-gray-3, #262626)};\n    --comp-active-btn-color: var(--comp-btn-background);\n    --comp-active-btn-background: #{var-list(var-prefixer(pill-active-btn-background), --t-gray-7, #666666)};\n    --comp-active-btn-border-color: #{var-list(var-prefixer(pill-active-btn-border-color), --t-gray-7, #666666)};\n    --comp-hover-active-btn-background: #{var-list(var-prefixer(pill-active-btn-background), --t-gray-6, #4d4d4d)};\n    --comp-hover-active-btn-border-color: #{var-list(var-prefixer(pill-active-btn-background), --t-gray-6, #4d4d4d)};\n\n    position: relative;\n\n    :host(:not(:empty)) &,\n    &.has-icon {\n        --comp-close-size: var(--comp-pill-btn-height);\n    }\n\n    :host([active]) & {\n        --comp-btn-color: #{var-list(var-prefixer(pill-active-btn-color), --t-base, #ffffff)};\n    }\n\n    :host([theme='primary']) & {\n        --comp-active-btn-background: #{var-list(--tct-pill-primary-active-background, --t-primary-l5, #61c4ff)};\n        --comp-active-btn-color: #{var-list(--tct-pill-primary-active-font-color, --t-primary-text, #ffffff)};\n        --comp-active-btn-border-color: #{var-list(--tct-pill-primary-active-border-color, --t-primary-l5, #61c4ff)};\n        --comp-hover-active-btn-background: #{var-list(\n                --tct-pill-primary-active-hover-background,\n                --t-primary-l3,\n                #21acff\n            )};\n        --comp-hover-active-btn-border-color: #{var-list(\n                --tct-pill-primary-active-hover-border-color,\n                --t-primary-l3,\n                #21acff\n            )};\n    }\n\n    :host([theme='secondary']) & {\n        --comp-active-btn-background: #{var-list(--tct-pill-secondary-active-background, --t-secondary-l5, #d9e1e6)};\n        --comp-active-btn-color: #{var-list(--tct-pill-secondary-active-font-color, --t-secondary-text, #141414)};\n        --comp-active-btn-border-color: #{var-list(--tct-pill-secondary-active-border-color, --t-secondary-l5, #d9e1e6)};\n        --comp-hover-active-btn-background: #{var-list(\n                --tct-pill-secondary-active-hover-background,\n                --t-secondary-l3,\n                #c9d5db\n            )};\n        --comp-hover-active-btn-border-color: #{var-list(\n                --tct-pill-secondary-active-hover-border-color,\n                --t-secondary-l3,\n                #c9d5db\n            )};\n    }\n\n    :host([theme='tertiary']) & {\n        --comp-active-btn-background: #{var-list(--tct-pill-tertiary-active-background, --t-tertiary-l5, #f4fafe)};\n        --comp-active-btn-color: #{var-list(--tct-pill-tertiary-active-font-color, --t-tertiary-text, #141414)};\n        --comp-active-btn-border-color: #{var-list(--tct-pill-tertiary-active-border-color, --t-tertiary-l5, #f4fafe)};\n        --comp-hover-active-btn-background: #{var-list(\n                --tct-pill-tertiary-active-hover-background,\n                --t-tertiary-l3,\n                #eff8fd\n            )};\n        --comp-hover-active-btn-border-color: #{var-list(\n                --tct-pill-tertiary-active-hover-border-color,\n                --t-tertiary-l3,\n                #eff8fd\n            )};\n    }\n}\n\n.btn-height-wrapper {\n    height: var(--comp-pill-min-height);\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    &:focus {\n        box-shadow: none;\n    }\n\n    :host([disabled]) & {\n        cursor: not-allowed;\n    }\n}\n\n.btn-close,\n.btn-primary {\n    cursor: pointer;\n    height: var(--comp-pill-btn-height);\n    border-style: solid;\n    border-radius: var-list(var-prefixer(pill-btn-border-radius), 30px);\n    transition-property: background, color, padding, width, opacity;\n    transition: var-list(var-prefixer(pill-btn-tween), --app-tween-1, unquote('0.2s ease'));\n}\n\n.btn-close,\n.btn-primary,\nq2-icon {\n    :host([disabled]) & {\n        opacity: var-list(var-prefixer(pill-disabled-opacity), --tct-disabled-opacity, --app-disabled-opacity, 0.4);\n        cursor: not-allowed;\n    }\n}\n\n.btn-primary {\n    background: var(--comp-btn-background);\n    border-width: var-list(--comp-pill-btn-border-width);\n    border-color: var-list(var-prefixer(pill-btn-border-color), --t-a11y-gray-color-AA, #949494);\n    padding-inline: var(--comp-btn-padding);\n    padding-right: calc(var(--comp-btn-padding) + var(--comp-close-size));\n    font-size: var-list(var-prefixer(pill-btn-font-size), --app-font-size, 14px);\n    color: var(--comp-btn-color);\n    display: block;\n    width: 100%;\n    text-align: start;\n\n    &:focus,\n    &:hover {\n        background: var(--comp-hover-btn-background);\n    }\n\n    :host(:not(:empty)) &,\n    .has-icon & {\n        padding-right: calc(#{var-list(var-prefixer(pill-icon-gap), --app-scale-1x, 5px)} + var(--comp-close-size));\n    }\n\n    .has-options & {\n        @include line-clamp(1);\n        max-width: var-list(var-prefixer(pill-max-width), 200px);\n    }\n\n    :host([active]) & {\n        background: var(--comp-active-btn-background);\n        border-color: var(--comp-active-btn-border-color);\n        color: var(--comp-active-btn-color);\n\n        &:focus,\n        &:hover {\n            background: var(--comp-hover-active-btn-background);\n            border-color: var(--comp-hover-active-btn-border-color);\n        }\n    }\n}\n\n.btn-close {\n    background: transparent;\n    border-color: transparent;\n    border-width: var(--comp-pill-btn-border-width);\n    width: var(--comp-close-size);\n    height: var(--comp-close-size);\n    padding: 0;\n    border: 0;\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n    position: absolute;\n    right: 0;\n    top: 50%;\n    transform: translateY(-50%);\n    opacity: 0;\n    :host([active]) & {\n        color: var(--comp-active-btn-color);\n    }\n\n    :host(:not(:empty)) &,\n    .has-icon & {\n        opacity: 1;\n    }\n}\n\nq2-icon {\n    --t-icon-stroke-primary: currentColor;\n    width: var-list(var-prefixer(pill-icon-size), 14px);\n    height: var-list(var-prefixer(pill-icon-size), 14px);\n    transition-property: transform;\n    transition: var-list(var-prefixer(pill-btn-tween), --app-tween-1, unquote('0.2s ease'));\n}\n\ndiv.btn-close {\n    pointer-events: none;\n\n    :host([open]) & q2-icon {\n        transform: rotate(180deg);\n    }\n}\n\nbutton.btn-close {\n    :host([active]) & {\n        &:focus,\n        &:hover {\n            background: var-list(var-prefixer(pill-hover-close-btn-background), --t-top-a1, rgba(13, 13, 13, 0.35));\n            border-color: var-list(var-prefixer(pill-hover-close-btn-border-color), --t-top-a1, rgba(13, 13, 13, 0.35));\n        }\n    }\n}\n\nq2-popover {\n    top: calc(var(--comp-pill-min-height) - calc(calc(var(--comp-pill-min-height) - var(--comp-pill-btn-height)) / 2));\n}\n","import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Listen,\n    Watch,\n    Element,\n    EventEmitter,\n    Event,\n} from '@stencil/core';\nimport { isEventFromElement, loc, overrideFocus, resizeIframe } from 'src/utils';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\nimport { IOptionValue } from '../q2-option-list';\n\n@Component({\n    tag: 'q2-pill',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Pill implements ComponentInterface {\n    @Prop() hoist: boolean = !!window.Tecton?.useActionSheets;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true, mutable: true }) active: boolean;\n    @Prop({ reflect: true, mutable: true }) open: boolean;\n    @Prop({ reflect: true }) multiple: boolean;\n    @Prop({ reflect: true }) maxLength: number;\n    @Prop({ reflect: true }) label: string;\n    @Prop({ reflect: true, mutable: true }) value: string;\n    @Prop({ reflect: true }) theme: 'primary' | 'secondary' | 'tertiary';\n    @Prop({ mutable: true }) selectedOptions: IOptionValue[] = [];\n    @Prop() popoverMinHeight: number = 150;\n    @Prop() popoverDirection: 'up' | 'down';\n    @Prop({ mutable: true }) popoverAlignment: 'left' | 'right' = 'right';\n    @Prop() optionListLabel: string;\n\n    @State() optionCount: number;\n    @State() selectedOptionElements: HTMLQ2OptionElement[] = [];\n\n    @Element() hostElement: HTMLElement;\n    @Event() change: EventEmitter<{ value: string; values: IOptionValue[]; active: boolean }>;\n    scheduledAfterRender: (() => void)[] = [];\n    primaryBtn: HTMLButtonElement;\n    primaryBtnWrapper: HTMLElement;\n    optionList: HTMLQ2OptionListElement;\n    mutationObserver: MutationObserver;\n    popoverElement: HTMLQ2PopoverElement;\n\n    /// LifeCycle Hooks ///\n    componentWillLoad() {\n        const observer = new MutationObserver(this.determineOptionCount);\n        observer.observe(this.hostElement, { childList: true, attributes: true });\n        this.mutationObserver = observer;\n    }\n\n    componentDidLoad() {\n        overrideFocus(this.hostElement);\n        this.syncValueProperties();\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    disconnectedCallback() {\n        this.mutationObserver.disconnect();\n        this.mutationObserver = null;\n    }\n\n    /// Getters ///\n    get buttonContent() {\n        const { label, selectedOptions, selectedOptionElements, optionCount } = this;\n\n        if (!optionCount || selectedOptionElements.length === 0) return loc(label);\n        else if (selectedOptionElements.length === 1) return loc(selectedOptionElements[0].display);\n\n        return loc('tecton.element.pill.activeCount', { count: selectedOptions.length });\n    }\n\n    get truncatedButtonContent() {\n        const { maxLength, buttonContent } = this;\n        if (maxLength)\n            return buttonContent.length > maxLength ? `${buttonContent.substring(0, maxLength)}…` : buttonContent;\n        else return buttonContent;\n    }\n\n    /// Helpers ///\n    syncValueProperties = () => {\n        const { value, selectedOptions } = this;\n        if (!!selectedOptions?.length) this.selectedOptionsChanged(selectedOptions);\n        else if (value) this.valueChanged(value);\n    };\n\n    getOption = async (value: string) => {\n        if (this.optionList) {\n            const options = await this.optionList.getOptions();\n            return options.find(option => option.value === value);\n        } else {\n            return this.hostElement.querySelector<HTMLQ2OptionElement>(`q2-option[value=\"${value}\"]`);\n        }\n    };\n\n    updateSelectedOptionElements = async () => {\n        const { selectedOptions = [] } = this;\n        const selectedValues = selectedOptions.map(option => option.value);\n        const options = await this.optionList?.getOptions();\n        if (this.optionCount) this.active = !!selectedValues.length;\n        this.selectedOptionElements = options?.filter(option => selectedValues.includes(option.value)) || [];\n    };\n\n    determineOptionCount = () => {\n        const numberOfOptions = this.hostElement.querySelectorAll('q2-option').length;\n        this.optionCount = numberOfOptions;\n    };\n\n    async executeActionSheet(event: MouseEvent | KeyboardEvent) {\n        const result = await showActionSheetList(this, event);\n        this.handleSelectionChanges(result);\n    }\n\n    async handleSelectionChanges(changeDetails: { value?: string; values?: IOptionValue[] }) {\n        const { multiple } = this;\n        const { value = '', values = [] } = changeDetails;\n        const isActive = multiple ? !!values.length : !!value;\n        if (!this.hostElement.onchange) {\n            if (multiple) {\n                this.selectedOptions = values;\n                this.value = undefined;\n            } else {\n                const selectedOption = await this.getOption(value);\n                this.selectedOptions = selectedOption\n                    ? [{ value: selectedOption.value, display: selectedOption.display }]\n                    : [];\n                this.value = selectedOption?.value || undefined;\n            }\n        }\n\n        this.change.emit({\n            value,\n            values,\n            active: isActive,\n        });\n    }\n\n    clearSelectedOptions = () => {\n        this.selectedOptions = [];\n        this.value = null;\n        this.active = false;\n        this.open = false;\n        this.primaryBtn.focus();\n        this.change.emit({ value: null, values: [], active: false });\n        this.scheduledAfterRender.push(resizeIframe);\n    };\n\n    /// Watchers ///\n    @Watch('value')\n    async valueChanged(newValue) {\n        const { multiple, selectedOptions } = this;\n        const firstValue = selectedOptions?.[0]?.value ?? null;\n        if (multiple) return;\n        if (newValue === firstValue) this.updateSelectedOptionElements();\n        else {\n            const selectedOption = await this.getOption(newValue);\n            const { value, display } = selectedOption || { value: newValue, display: null };\n            this.selectedOptions = value ? [{ value, display }] : [];\n        }\n    }\n\n    @Watch('selectedOptions')\n    selectedOptionsChanged(newValue) {\n        const { multiple } = this;\n        const firstValue = newValue?.[0]?.value ?? null;\n        if (multiple) {\n            if (this.value) this.value = null;\n            this.updateSelectedOptionElements();\n        } else if (this.value === firstValue) {\n            this.updateSelectedOptionElements();\n        } else {\n            this.value = firstValue;\n        }\n    }\n\n    /// Listeners ///\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.primaryBtn.focus();\n    }\n\n    @Listen('popoverStateChanged')\n    popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n        if (this.open !== open) this.open = open;\n        if (open) return;\n        this.optionList.setActiveElement(null);\n    }\n\n    @Listen('displayChanged')\n    handleSelectedDisplay() {\n        if (this.multiple) return;\n        this.updateSelectedOptionElements();\n    }\n    /// Event Handlers ///\n\n    handleClick = async (event: MouseEvent) => {\n        event.stopPropagation();\n        if (this.disabled) return;\n        if (this.optionCount) {\n            if (shouldShowActionSheet(this)) {\n                this.executeActionSheet(event);\n            } else {\n                await this.popoverElement.toggle();\n            }\n        } else {\n            const { value, label } = this;\n            const isActive = (this.active = !this.active);\n            const values = isActive ? [{ value, display: label }] : [];\n            this.selectedOptions = values;\n            this.change.emit({\n                value,\n                values,\n                active: isActive,\n            });\n        }\n    };\n\n    handleKeydown = async (event: KeyboardEvent) => {\n        const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n        if (!this.optionCount || this.disabled || isTabMetaOrCtrl) return;\n\n        event.preventDefault();\n        if (shouldShowActionSheet(this, event)) {\n            this.executeActionSheet(event);\n        } else {\n            this.optionList.handleExternalKeydown(event);\n        }\n    };\n\n    handleButtonFocusout = async (event: FocusEvent) => {\n        const relatedTarget = event.relatedTarget as unknown as HTMLElement;\n        if (relatedTarget?.tagName === 'Q2-OPTION' ?? false) return;\n        this.open = false;\n    };\n\n    handleChange = event => {\n        event.stopPropagation();\n        if (!this.optionCount) return;\n        this.handleSelectionChanges(event.detail);\n    };\n\n    handleWrapperClick = () => {\n        this.primaryBtn.focus();\n        this.primaryBtn.click();\n    };\n\n    onClickElsewhere = (event: CustomEvent) => {\n        const target = event.target as HTMLClickElsewhereElement;\n        if (target.localName === 'click-elsewhere') {\n            event.stopPropagation();\n            const { popoverElement } = this;\n            if (!popoverElement) return;\n            popoverElement.open = false;\n        }\n    };\n\n    /// DOM ///\n    generateIcon() {\n        const { optionCount, active } = this;\n        const isButton = optionCount && active;\n        const TagName = isButton ? 'button' : 'div';\n        const iconName = isButton || !optionCount ? 'close' : 'chevron-down';\n\n        return (\n            <TagName\n                class=\"btn-close\"\n                onClick={isButton && this.clearSelectedOptions}\n                disabled={isButton && this.disabled}\n                aria-label={isButton && loc('tecton.element.pill.clearSelection')}\n                type={isButton && 'button'}\n            >\n                <q2-icon type={iconName}></q2-icon>\n            </TagName>\n        );\n    }\n\n    generateHiddenElement() {\n        return (\n            <div\n                id=\"option-description\"\n                class=\"sr\"\n                aria-hidden=\"true\"\n            >\n                {loc('tecton.element.optionList.optionCount', [this.optionCount])}\n            </div>\n        );\n    }\n\n    render() {\n        const { optionCount, active, open } = this;\n        const wrapperClassNames = ['btn-wrapper'];\n        if (optionCount || active) wrapperClassNames.push('has-icon');\n        if (optionCount) wrapperClassNames.push('has-options');\n\n        return (\n            <click-elsewhere onChange={this.onClickElsewhere}>\n                <div class={wrapperClassNames.join(' ')}>\n                    <div\n                        class=\"btn-height-wrapper\"\n                        ref={el => (this.primaryBtnWrapper = el)}\n                        onClick={this.handleWrapperClick}\n                        tabIndex={-1}\n                    >\n                        <button\n                            class=\"btn-primary\"\n                            test-id=\"btn-control\"\n                            type=\"button\"\n                            role=\"combobox\"\n                            ref={el => (this.primaryBtn = el)}\n                            onClick={this.handleClick}\n                            onKeyDown={this.handleKeydown}\n                            onFocusout={this.handleButtonFocusout}\n                            disabled={this.disabled}\n                            aria-roledescription={!optionCount && 'filter'}\n                            aria-controls={optionCount && 'option-list'}\n                            aria-expanded={(optionCount && `${!!open}`) || undefined}\n                            aria-label={this.maxLength && this.buttonContent}\n                            aria-describedby={(optionCount && 'option-description') || undefined}\n                        >\n                            {this.truncatedButtonContent}\n                            {!optionCount && active && <span class=\"sr\">({loc('tecton.element.pill.active')})</span>}\n                        </button>\n                    </div>\n                    {this.generateIcon()}\n                    {this.generateHiddenElement()}\n                </div>\n                {this.optionCount > 0 && (\n                    <q2-popover\n                        ref={el => (this.popoverElement = el)}\n                        controlElement={this.primaryBtn}\n                        open={this.open}\n                        minHeight={this.popoverMinHeight}\n                        direction={this.popoverDirection}\n                        align={this.popoverAlignment}\n                    >\n                        <q2-option-list\n                            type=\"listbox\"\n                            ref={el => (this.optionList = el)}\n                            id=\"option-list\"\n                            onChange={this.handleChange}\n                            multiple={this.multiple}\n                            selectedOptions={this.selectedOptions}\n                            onReady={() => this.updateSelectedOptionElements()}\n                            label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n                        >\n                            <slot />\n                        </q2-option-list>\n                    </q2-popover>\n                )}\n            </click-elsewhere>\n        );\n    }\n}\n"],"mappings":"wJAAA,MAAMA,EAAY,01O,MCqBLC,EAAM,M,8DAqBfC,KAAAC,qBAAuC,GA+CvCD,KAAAE,oBAAsB,KAClB,MAAMC,MAAEA,EAAKC,gBAAEA,GAAoBJ,KACnC,MAAMI,IAAe,MAAfA,SAAe,SAAfA,EAAiBC,QAAQL,KAAKM,uBAAuBF,QACtD,GAAID,EAAOH,KAAKO,aAAaJ,EAAM,EAG5CH,KAAAQ,UAAYC,MAAON,IACf,GAAIH,KAAKU,WAAY,CACjB,MAAMC,QAAgBX,KAAKU,WAAWE,aACtC,OAAOD,EAAQE,MAAKC,GAAUA,EAAOX,QAAUA,G,KAC5C,CACH,OAAOH,KAAKe,YAAYC,cAAmC,oBAAoBb,M,GAIvFH,KAAAiB,6BAA+BR,U,MAC3B,MAAML,gBAAEA,EAAkB,IAAOJ,KACjC,MAAMkB,EAAiBd,EAAgBe,KAAIL,GAAUA,EAAOX,QAC5D,MAAMQ,SAAgBS,EAAApB,KAAKU,cAAU,MAAAU,SAAA,SAAAA,EAAER,cACvC,GAAIZ,KAAKqB,YAAarB,KAAKsB,SAAWJ,EAAeb,OACrDL,KAAKuB,wBAAyBZ,IAAO,MAAPA,SAAO,SAAPA,EAASa,QAAOV,GAAUI,EAAeO,SAASX,EAAOX,WAAW,EAAE,EAGxGH,KAAA0B,qBAAuB,KACnB,MAAMC,EAAkB3B,KAAKe,YAAYa,iBAAiB,aAAavB,OACvEL,KAAKqB,YAAcM,CAAe,EAgCtC3B,KAAA6B,qBAAuB,KACnB7B,KAAKI,gBAAkB,GACvBJ,KAAKG,MAAQ,KACbH,KAAKsB,OAAS,MACdtB,KAAK8B,KAAO,MACZ9B,KAAK+B,WAAWC,QAChBhC,KAAKiC,OAAOC,KAAK,CAAE/B,MAAO,KAAMgC,OAAQ,GAAIb,OAAQ,QACpDtB,KAAKC,qBAAqBmC,KAAKC,EAAa,EAoDhDrC,KAAAsC,YAAc7B,MAAO8B,IACjBA,EAAMC,kBACN,GAAIxC,KAAKyC,SAAU,OACnB,GAAIzC,KAAKqB,YAAa,CAClB,GAAIqB,EAAsB1C,MAAO,CAC7BA,KAAK2C,mBAAmBJ,E,KACrB,OACGvC,KAAK4C,eAAeC,Q,MAE3B,CACH,MAAM1C,MAAEA,EAAK2C,MAAEA,GAAU9C,KACzB,MAAM+C,EAAY/C,KAAKsB,QAAUtB,KAAKsB,OACtC,MAAMa,EAASY,EAAW,CAAC,CAAE5C,QAAO6C,QAASF,IAAW,GACxD9C,KAAKI,gBAAkB+B,EACvBnC,KAAKiC,OAAOC,KAAK,CACb/B,QACAgC,SACAb,OAAQyB,G,GAKpB/C,KAAAiD,cAAgBxC,MAAO8B,IACnB,MAAMW,EAAkBX,EAAMY,SAAWZ,EAAMa,SAAWb,EAAMc,MAAQ,MACxE,IAAKrD,KAAKqB,aAAerB,KAAKyC,UAAYS,EAAiB,OAE3DX,EAAMe,iBACN,GAAIZ,EAAsB1C,KAAMuC,GAAQ,CACpCvC,KAAK2C,mBAAmBJ,E,KACrB,CACHvC,KAAKU,WAAW6C,sBAAsBhB,E,GAI9CvC,KAAAwD,qBAAuB/C,MAAO8B,I,MAC1B,MAAMkB,EAAgBlB,EAAMkB,cAC5B,IAAIrC,GAAAqC,IAAa,MAAbA,SAAa,SAAbA,EAAeC,WAAY,eAAW,MAAAtC,SAAA,EAAAA,EAAI,MAAO,OACrDpB,KAAK8B,KAAO,KAAK,EAGrB9B,KAAA2D,aAAepB,IACXA,EAAMC,kBACN,IAAKxC,KAAKqB,YAAa,OACvBrB,KAAK4D,uBAAuBrB,EAAMsB,OAAO,EAG7C7D,KAAA8D,mBAAqB,KACjB9D,KAAK+B,WAAWC,QAChBhC,KAAK+B,WAAWgC,OAAO,EAG3B/D,KAAAgE,iBAAoBzB,IAChB,MAAM0B,EAAS1B,EAAM0B,OACrB,GAAIA,EAAOC,YAAc,kBAAmB,CACxC3B,EAAMC,kBACN,MAAMI,eAAEA,GAAmB5C,KAC3B,IAAK4C,EAAgB,OACrBA,EAAed,KAAO,K,kBAhPHV,EAAA+C,OAAOC,UAAM,MAAAhD,SAAA,SAAAA,EAAEiD,iB,uMASiB,G,sBACxB,I,sDAE2B,Q,sFAIL,E,CAYzDC,oBACI,MAAMC,EAAW,IAAIC,iBAAiBxE,KAAK0B,sBAC3C6C,EAASE,QAAQzE,KAAKe,YAAa,CAAE2D,UAAW,KAAMC,WAAY,OAClE3E,KAAK4E,iBAAmBL,C,CAG5BM,mBACIC,EAAc9E,KAAKe,aACnBf,KAAKE,qB,CAGT6E,qBACI/E,KAAKC,qBAAqB+E,SAAQC,GAAMA,MACxCjF,KAAKC,qBAAuB,E,CAGhCiF,uBACIlF,KAAK4E,iBAAiBO,aACtBnF,KAAK4E,iBAAmB,I,CAIxBQ,oBACA,MAAMtC,MAAEA,EAAK1C,gBAAEA,EAAemB,uBAAEA,EAAsBF,YAAEA,GAAgBrB,KAExE,IAAKqB,GAAeE,EAAuBlB,SAAW,EAAG,OAAOgF,EAAIvC,QAC/D,GAAIvB,EAAuBlB,SAAW,EAAG,OAAOgF,EAAI9D,EAAuB,GAAGyB,SAEnF,OAAOqC,EAAI,kCAAmC,CAAEC,MAAOlF,EAAgBC,Q,CAGvEkF,6BACA,MAAMC,UAAEA,EAASJ,cAAEA,GAAkBpF,KACrC,GAAIwF,EACA,OAAOJ,EAAc/E,OAASmF,EAAY,GAAGJ,EAAcK,UAAU,EAAGD,MAAgBJ,OACvF,OAAOA,C,CAgChB3E,yBAAyB8B,GACrB,MAAMmD,QAAeC,EAAoB3F,KAAMuC,GAC/CvC,KAAK4D,uBAAuB8B,E,CAGhCjF,6BAA6BmF,GACzB,MAAMC,SAAEA,GAAa7F,KACrB,MAAMG,MAAEA,EAAQ,GAAEgC,OAAEA,EAAS,IAAOyD,EACpC,MAAM7C,EAAW8C,IAAa1D,EAAO9B,SAAWF,EAChD,IAAKH,KAAKe,YAAY+E,SAAU,CAC5B,GAAID,EAAU,CACV7F,KAAKI,gBAAkB+B,EACvBnC,KAAKG,MAAQ4F,S,KACV,CACH,MAAMC,QAAuBhG,KAAKQ,UAAUL,GAC5CH,KAAKI,gBAAkB4F,EACjB,CAAC,CAAE7F,MAAO6F,EAAe7F,MAAO6C,QAASgD,EAAehD,UACxD,GACNhD,KAAKG,OAAQ6F,IAAc,MAAdA,SAAc,SAAdA,EAAgB7F,QAAS4F,S,EAI9C/F,KAAKiC,OAAOC,KAAK,CACb/B,QACAgC,SACAb,OAAQyB,G,CAgBhBtC,mBAAmBwF,G,QACf,MAAMJ,SAAEA,EAAQzF,gBAAEA,GAAoBJ,KACtC,MAAMkG,GAAaC,GAAA/E,EAAAhB,IAAe,MAAfA,SAAe,SAAfA,EAAkB,MAAE,MAAAgB,SAAA,SAAAA,EAAEjB,SAAK,MAAAgG,SAAA,EAAAA,EAAI,KAClD,GAAIN,EAAU,OACd,GAAII,IAAaC,EAAYlG,KAAKiB,mCAC7B,CACD,MAAM+E,QAAuBhG,KAAKQ,UAAUyF,GAC5C,MAAM9F,MAAEA,EAAK6C,QAAEA,GAAYgD,GAAkB,CAAE7F,MAAO8F,EAAUjD,QAAS,MACzEhD,KAAKI,gBAAkBD,EAAQ,CAAC,CAAEA,QAAO6C,YAAa,E,EAK9D1C,uBAAuB2F,G,QACnB,MAAMJ,SAAEA,GAAa7F,KACrB,MAAMkG,GAAaC,GAAA/E,EAAA6E,IAAQ,MAARA,SAAQ,SAARA,EAAW,MAAE,MAAA7E,SAAA,SAAAA,EAAEjB,SAAK,MAAAgG,SAAA,EAAAA,EAAI,KAC3C,GAAIN,EAAU,CACV,GAAI7F,KAAKG,MAAOH,KAAKG,MAAQ,KAC7BH,KAAKiB,8B,MACF,GAAIjB,KAAKG,QAAU+F,EAAY,CAClClG,KAAKiB,8B,KACF,CACHjB,KAAKG,MAAQ+F,C,EAMrBE,cAAc7D,GACV,IAAK8D,EAAmB9D,EAAOvC,KAAKe,aAAc,OAClDf,KAAK+B,WAAWC,O,CAIpBsE,qBAAsBzC,QAAQ/B,KAAEA,KAC5B,GAAI9B,KAAK8B,OAASA,EAAM9B,KAAK8B,KAAOA,EACpC,GAAIA,EAAM,OACV9B,KAAKU,WAAW6F,iBAAiB,K,CAIrCC,wBACI,GAAIxG,KAAK6F,SAAU,OACnB7F,KAAKiB,8B,CAkETwF,eACI,MAAMpF,YAAEA,EAAWC,OAAEA,GAAWtB,KAChC,MAAM0G,EAAWrF,GAAeC,EAChC,MAAMqF,EAAUD,EAAW,SAAW,MACtC,MAAME,EAAWF,IAAarF,EAAc,QAAU,eAEtD,OACIwF,EAACF,EAAO,CACJG,MAAM,YACNC,QAASL,GAAY1G,KAAK6B,qBAC1BY,SAAUiE,GAAY1G,KAAKyC,SAAQ,aACvBiE,GAAYrB,EAAI,sCAC5B2B,KAAMN,GAAY,UAElBG,EAAA,WAASG,KAAMJ,I,CAK3BK,wBACI,OACIJ,EAAA,OACIK,GAAG,qBACHJ,MAAM,KAAI,cACE,QAEXzB,EAAI,wCAAyC,CAACrF,KAAKqB,c,CAKhE8F,SACI,MAAM9F,YAAEA,EAAWC,OAAEA,EAAMQ,KAAEA,GAAS9B,KACtC,MAAMoH,EAAoB,CAAC,eAC3B,GAAI/F,GAAeC,EAAQ8F,EAAkBhF,KAAK,YAClD,GAAIf,EAAa+F,EAAkBhF,KAAK,eAExC,OACIyE,EAAA,mBAAiBQ,SAAUrH,KAAKgE,kBAC5B6C,EAAA,OAAKC,MAAOM,EAAkBE,KAAK,MAC/BT,EAAA,OACIC,MAAM,qBACNS,IAAKC,GAAOxH,KAAKyH,kBAAoBD,EACrCT,QAAS/G,KAAK8D,mBACd4D,UAAW,GAEXb,EAAA,UACIC,MAAM,cAAa,UACX,cACRE,KAAK,SACLW,KAAK,WACLJ,IAAKC,GAAOxH,KAAK+B,WAAayF,EAC9BT,QAAS/G,KAAKsC,YACdsF,UAAW5H,KAAKiD,cAChB4E,WAAY7H,KAAKwD,qBACjBf,SAAUzC,KAAKyC,SAAQ,wBACApB,GAAe,SAAQ,gBAC/BA,GAAe,cAAa,gBAC3BA,GAAe,KAAKS,KAAWiE,UAAS,aAC5C/F,KAAKwF,WAAaxF,KAAKoF,cAAa,mBAC7B/D,GAAe,sBAAyB0E,WAE1D/F,KAAKuF,wBACJlE,GAAeC,GAAUuF,EAAA,QAAMC,MAAM,MAAI,IAAGzB,EAAI,8BAA6B,OAGtFrF,KAAKyG,eACLzG,KAAKiH,yBAETjH,KAAKqB,YAAc,GAChBwF,EAAA,cACIU,IAAKC,GAAOxH,KAAK4C,eAAiB4E,EAClCM,eAAgB9H,KAAK+B,WACrBD,KAAM9B,KAAK8B,KACXiG,UAAW/H,KAAKgI,iBAChBC,UAAWjI,KAAKkI,iBAChBC,MAAOnI,KAAKoI,kBAEZvB,EAAA,kBACIG,KAAK,UACLO,IAAKC,GAAOxH,KAAKU,WAAa8G,EAC9BN,GAAG,cACHG,SAAUrH,KAAK2D,aACfkC,SAAU7F,KAAK6F,SACfzF,gBAAiBJ,KAAKI,gBACtBiI,QAAS,IAAMrI,KAAKiB,+BACpB6B,MAAOuC,EAAI,kCAAmC,CAACrF,KAAKsI,mBAEpDzB,EAAA,e"}

package/dist/q2-tecton-elements/p-2a975246.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as e,g as s}from"./p-277dc8cd.js";import{l as n,h as a,o as r,i as h,w as d}from"./p-ef856249.js";const l="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;max-width:100%}.q2-editable-field-wrapper:not([hidden]){display:flex}.q2-editable-field-wrapper.editing{align-items:flex-end}:host([block]){display:block;width:100%}:host([block]) .q2-editable-field-wrapper:not([hidden]){display:grid;grid-template-columns:1fr auto auto}q2-input,.text-wrapper{margin:0 var(--tct-scale-2, var(--app-scale-2x, 10px)) 0 0}q2-input{flex:1 1 auto;min-width:170px}.text-wrapper{flex:0 auto;align-self:center;display:inline-block}:host([truncated]) .text-wrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}q2-btn{flex:0 0 44px}dl{margin:var(--tct-scale-0, var(--app-scale-0x, 0))}dt{font-weight:600}dd{margin-left:var(--tct-scale-0, var(--app-scale-0x, 0));display:flex;align-items:center}";const o=class{constructor(e){t(this,e);this.input=i(this,"input",7);this.change=i(this,"change",7);this.scheduledAfterRender=[];this.defaultValue=this.value;this.inputInput=t=>{t.stopPropagation();this.input.emit(t.detail);this.formattedValue=t.detail.formattedValue;this.innerValue=t.detail.value};this.inputChange=t=>{t.stopPropagation()};this.inputKeyDown=t=>{if(t.key==="Escape"||t.key==="Esc"){t.preventDefault();this.cancelClick();return}if(t.key==="Enter"){t.preventDefault();this.saveClick();return}};this.inputClick=t=>{t.stopPropagation()};this.saveClick=t=>{t&&t.stopPropagation();const i=this.hostElement.shadowRoot.querySelector("q2-input").value;this.defaultValue=i;this.change.emit({editing:false,name:"save",value:this.innerValue||i,formattedValue:this.formattedValue||i});setTimeout((()=>{const{errors:t=[]}=this;if(!t.length)return;this.hostElement.focus()}),1)};this.editClick=t=>{t===null||t===void 0?void 0:t.stopPropagation();this.change.emit({editing:true,name:"edit"})};this.cancelClick=t=>{t===null||t===void 0?void 0:t.stopPropagation();this.change.emit({editing:false,name:"cancel"});this.hostElement.shadowRoot.querySelector("q2-input").value=this.defaultValue};this.value="";this.editing=false;this.label="";this.hideLabel=undefined;this.type=undefined;this.formatModifier=undefined;this.truncated=undefined;this.maxlength=undefined;this.persistentLabel=undefined;this.disabled=undefined;this.block=undefined;this.hints=undefined;this.errors=undefined;this.ariaLabel=undefined;this.formattedValue=undefined}get locLabel(){return this.label&&n(this.label)||""}componentWillLoad(){a(this)}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[];this.formattedValue=this.inputElement.formattedValue}componentDidLoad(){r(this.hostElement)}errorsObserver(){var t;const{editing:i,errors:e=[]}=this;const s=this.hostElement.shadowRoot.activeElement;const n=(t=(s===null||s===void 0?void 0:s.tagName)==="Q2-INPUT")!==null&&t!==void 0?t:false;const a=e.length;if(n||!s||!i||!a)return;this.inputElement.focus()}ariaLabelObserver(){a(this)}observesEditing(t,i){if(t===i)return;this.scheduledAfterRender.push(this.hostElement.focus)}get wrapperClass(){return`q2-editable-field-wrapper ${this.editing?"editing":""}`}onHostElementChange(t){if(!h(t,this.hostElement)||this.hostElement.onchange)return;switch(t.detail.name){case"save":this.value=t.detail.value;break;case"cancel":this.inputElement.value=this.value;break}this.editing=t.detail.editing}delegateFocus(t){if(!h(t,this.hostElement))return;this.hostElement.shadowRoot.querySelector(this.editing?"q2-input":"q2-btn.begin-edit").focus()}clickEdit(){var t;if(this.editing)return;(t=this.editBtnElement)===null||t===void 0?void 0:t.click()}clickCancel(){var t;if(!this.editing)return;(t=this.cancelBtnElement)===null||t===void 0?void 0:t.click()}clickSave(){var t;if(!this.editing)return;(t=this.saveBtnElement)===null||t===void 0?void 0:t.click()}async setValue(t,i={clickSave:true}){await this.clickEdit();await d();await this.inputElement.setValue(t);if(i.clickSave){await this.clickSave();await d()}}render(){return e("div",null,this.generateEditStateDOM(),this.generateReadStateDOM())}generateEditStateDOM(){return e("div",{class:this.wrapperClass,hidden:!this.editing},e("q2-input",{ref:t=>this.inputElement=t,label:this.locLabel,hideLabel:this.hideLabel,value:this.value,hints:Array.isArray(this.hints)&&this.hints.map((t=>n(t)))||undefined,errors:Array.isArray(this.errors)&&this.errors.map((t=>n(t)))||undefined,type:this.type,disabled:this.disabled,formatModifier:this.formatModifier,maxlength:this.maxlength,"test-id":"editableInput",onInput:this.inputInput,onChange:this.inputChange,onKeyDown:this.inputKeyDown,onClick:this.inputClick}),e("q2-btn",{ref:t=>this.cancelBtnElement=t,class:"cancel-edit",label:`${n("tecton.element.editableField.cancel")} ${this.locLabel}`,"hide-label":true,"test-id":"cancelButton",onClick:this.cancelClick},e("q2-icon",{type:"close"})),e("q2-btn",{ref:t=>this.saveBtnElement=t,class:"save-edit",label:`${n("tecton.element.editableField.save")} ${this.locLabel}`,"hide-label":true,"test-id":"saveButton",onClick:this.saveClick},e("q2-icon",{type:"checkmark"})))}generateReadStateDOM(){if(this.persistentLabel&&this.locLabel){return e("div",{class:this.wrapperClass,hidden:this.editing},e("dl",null,e("dt",{class:"read-state-label"},this.locLabel),e("dd",null,e("span",{class:"text-wrapper"},this.formattedValue||this.value),this.generateEditBtn())))}return e("div",{class:this.wrapperClass,hidden:this.editing},e("div",{class:"text-wrapper"},this.formattedValue||this.value),this.generateEditBtn())}generateEditBtn(){return e("q2-btn",{ref:t=>this.editBtnElement=t,class:"begin-edit",label:`${n("tecton.element.editableField.edit")} ${this.locLabel}`,"hide-label":true,disabled:this.disabled,"test-id":"editButton",onClick:this.editClick},e("q2-icon",{type:"edit"}))}get hostElement(){return s(this)}static get watchers(){return{errors:["errorsObserver"],ariaLabel:["ariaLabelObserver"],editing:["observesEditing"]}}};o.style=l;export{o as q2_editable_field};
-//# sourceMappingURL=p-2a975246.entry.js.map

package/dist/q2-tecton-elements/p-2a975246.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","Q2EditableField","this","scheduledAfterRender","defaultValue","value","inputInput","event","stopPropagation","input","emit","detail","formattedValue","innerValue","inputChange","e","inputKeyDown","key","preventDefault","cancelClick","saveClick","inputClick","valueFromInputProp","hostElement","shadowRoot","querySelector","change","editing","name","setTimeout","errors","length","focus","editClick","locLabel","label","loc","componentWillLoad","handleAriaLabel","componentDidRender","forEach","fn","inputElement","componentDidLoad","overrideFocus","errorsObserver","focusedElement","activeElement","isInputFocused","_a","tagName","hasErrors","ariaLabelObserver","observesEditing","newValue","oldValue","push","wrapperClass","onHostElementChange","isEventFromElement","onchange","delegateFocus","clickEdit","editBtnElement","click","clickCancel","cancelBtnElement","clickSave","saveBtnElement","async","options","waitForNextPaint","setValue","render","h","generateEditStateDOM","generateReadStateDOM","class","hidden","ref","el","hideLabel","hints","Array","isArray","map","str","undefined","type","disabled","formatModifier","maxlength","onInput","onChange","onKeyDown","onClick","persistentLabel","generateEditBtn"],"sources":["./src/components/q2-editable-field/styles.scss?tag=q2-editable-field&encapsulation=shadow","./src/components/q2-editable-field/index.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n\n:host {\n    display: inline-block;\n    max-width: 100%;\n}\n\n.q2-editable-field-wrapper:not([hidden]) {\n    display: flex;\n}\n\n.q2-editable-field-wrapper.editing {\n    align-items: flex-end;\n}\n\n:host([block]) {\n    display:block;\n    width: 100%;\n    .q2-editable-field-wrapper:not([hidden]) {\n        display: grid;\n        grid-template-columns: 1fr auto auto;\n    }\n}\n\nq2-input,\n.text-wrapper {\n    margin: 0 var(--tct-scale-2, var(--app-scale-2x, 10px)) 0 0;\n}\n\nq2-input {\n    flex: 1 1 auto;\n    min-width: 170px;\n}\n\n.text-wrapper {\n    flex: 0 auto;\n    align-self: center;\n    display: inline-block;\n}\n\n:host([truncated]) .text-wrapper {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\nq2-btn {\n    flex: 0 0 44px;\n}\n\ndl {\n    margin: var(--tct-scale-0, var(--app-scale-0x, 0));\n}\n\ndt {\n    font-weight: 600;\n}\n\ndd {\n    margin-left: var(--tct-scale-0, var(--app-scale-0x, 0));\n    display: flex;\n    align-items: center;\n}\n","import { Component, State, Prop, h, Listen, Element, Event, EventEmitter, Method, Watch } from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent } from 'src/components';\nimport { handleAriaLabel, isEventFromElement, loc, overrideFocus, waitForNextPaint } from 'src/utils';\nimport { Q2Input } from '../q2-input';\nimport { IFormatterValueObject } from '../q2-input/types';\n\ninterface IExtendedQ2InputElement extends HTMLQ2InputElement {\n    formattedValue: IFormatterValueObject['formattedValue'];\n}\n\n@Component({\n    tag: 'q2-editable-field',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2EditableField {\n    @Prop({ reflect: true, mutable: true }) value: string = '';\n    @Prop({ reflect: true, mutable: true }) editing: boolean = false;\n    @Prop({ reflect: true, mutable: true }) label: string = '';\n    @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n    @Prop({ reflect: true }) type: Q2Input['type'];\n    @Prop({ reflect: true }) formatModifier: string;\n    @Prop({ reflect: true }) truncated: boolean;\n    @Prop({ reflect: true }) maxlength: number;\n    @Prop({ reflect: true }) persistentLabel: boolean;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true }) block: boolean;\n    @Prop() hints: string[];\n    @Prop() errors: string[];\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n    scheduledAfterRender: (() => void)[] = [];\n\n    @Element() hostElement: HTMLElement;\n    inputElement: HTMLQ2InputElement;\n    editBtnElement: HTMLQ2BtnElement;\n    cancelBtnElement: HTMLQ2BtnElement;\n    saveBtnElement: HTMLQ2BtnElement;\n\n    @State() formattedValue: string;\n    innerValue: string;\n    defaultValue: string = this.value;\n\n    get locLabel() {\n        return (this.label && loc(this.label)) || '';\n    }\n\n    /////// LIFECYCLE HOOKS ///////\n\n    componentWillLoad() {\n        handleAriaLabel(this);\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n        this.formattedValue = (this.inputElement as IExtendedQ2InputElement).formattedValue;\n    }\n\n    componentDidLoad() {\n        overrideFocus(this.hostElement);\n    }\n\n    //////// OBSERVERS ////////\n\n    @Watch('errors')\n    errorsObserver() {\n        const { editing, errors = [] } = this;\n        const focusedElement = this.hostElement.shadowRoot.activeElement;\n        const isInputFocused = focusedElement?.tagName === 'Q2-INPUT' ?? false;\n        const hasErrors = errors.length;\n        if (isInputFocused || !focusedElement || !editing || !hasErrors) return;\n        this.inputElement.focus();\n    }\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    @Watch('editing')\n    observesEditing(newValue: boolean, oldValue: boolean) {\n        if (newValue === oldValue) return;\n        this.scheduledAfterRender.push(this.hostElement.focus);\n    }\n\n    get wrapperClass() {\n        return `q2-editable-field-wrapper ${this.editing ? 'editing' : ''}`;\n    }\n\n    ///////// HOST ELEMENT EVENTS //////\n\n    @Listen('change')\n    onHostElementChange(event: CustomEvent) {\n        if (!isEventFromElement(event, this.hostElement) || this.hostElement.onchange) return;\n        switch (event.detail.name) {\n            case 'save':\n                this.value = event.detail.value;\n                break;\n\n            case 'cancel':\n                this.inputElement.value = this.value;\n                break;\n        }\n\n        this.editing = event.detail.editing;\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector<HTMLElement>(this.editing ? 'q2-input' : 'q2-btn.begin-edit').focus();\n    }\n\n    ///////// EVENTS /////////\n\n    @Event() input: EventEmitter;\n    @Event() change: EventEmitter;\n\n    /// Methods ///\n    @Method()\n    clickEdit() {\n        if (this.editing) return;\n        this.editBtnElement?.click();\n    }\n\n    @Method()\n    clickCancel() {\n        if (!this.editing) return;\n        this.cancelBtnElement?.click();\n    }\n\n    @Method()\n    clickSave() {\n        if (!this.editing) return;\n        this.saveBtnElement?.click();\n    }\n\n    @Method()\n    async setValue(value: string, options: { clickSave?: boolean } = { clickSave: true }) {\n        await this.clickEdit();\n        await waitForNextPaint();\n\n        await this.inputElement.setValue(value);\n\n        if (options.clickSave) {\n            await this.clickSave();\n            await waitForNextPaint();\n        }\n    }\n\n    //////// ACTIONS /////////\n\n    inputInput = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n        event.stopPropagation();\n        this.input.emit(event.detail);\n        this.formattedValue = event.detail.formattedValue;\n        this.innerValue = event.detail.value;\n    };\n\n    inputChange = (e: CustomEvent) => {\n        e.stopPropagation();\n    };\n\n    inputKeyDown = (e: KeyboardEvent) => {\n        if (e.key === 'Escape' || e.key === 'Esc') {\n            e.preventDefault();\n            this.cancelClick();\n            return;\n        }\n\n        if (e.key === 'Enter') {\n            e.preventDefault();\n            this.saveClick();\n            return;\n        }\n    };\n\n    inputClick = (event: MouseEvent) => {\n        event.stopPropagation();\n    };\n\n    saveClick = (event?: MouseEvent) => {\n        event && event.stopPropagation();\n        const valueFromInputProp = this.hostElement.shadowRoot.querySelector('q2-input').value;\n        this.defaultValue = valueFromInputProp;\n        this.change.emit({\n            editing: false,\n            name: 'save',\n            value: this.innerValue || valueFromInputProp,\n            formattedValue: this.formattedValue || valueFromInputProp,\n        });\n\n        setTimeout(() => {\n            const { errors = [] } = this;\n            if (!errors.length) return;\n            this.hostElement.focus();\n        }, 1);\n    };\n\n    editClick = (event: MouseEvent) => {\n        event?.stopPropagation();\n        this.change.emit({ editing: true, name: 'edit' });\n    };\n\n    cancelClick = (event?: MouseEvent) => {\n        event?.stopPropagation();\n        this.change.emit({ editing: false, name: 'cancel' });\n        this.hostElement.shadowRoot.querySelector('q2-input').value = this.defaultValue;\n    };\n\n    render() {\n        return (\n            <div>\n                {this.generateEditStateDOM()}\n                {this.generateReadStateDOM()}\n            </div>\n        );\n    }\n\n    generateEditStateDOM() {\n        return (\n            <div\n                class={this.wrapperClass}\n                hidden={!this.editing}\n            >\n                <q2-input\n                    ref={el => (this.inputElement = el)}\n                    label={this.locLabel}\n                    hideLabel={this.hideLabel}\n                    value={this.value}\n                    hints={(Array.isArray(this.hints) && this.hints.map(str => loc(str))) || undefined}\n                    errors={(Array.isArray(this.errors) && this.errors.map(str => loc(str))) || undefined}\n                    type={this.type}\n                    disabled={this.disabled}\n                    formatModifier={this.formatModifier}\n                    maxlength={this.maxlength}\n                    test-id=\"editableInput\"\n                    onInput={this.inputInput}\n                    onChange={this.inputChange}\n                    onKeyDown={this.inputKeyDown}\n                    onClick={this.inputClick}\n                />\n                <q2-btn\n                    ref={el => (this.cancelBtnElement = el)}\n                    class=\"cancel-edit\"\n                    label={`${loc('tecton.element.editableField.cancel')} ${this.locLabel}`}\n                    hide-label\n                    test-id=\"cancelButton\"\n                    onClick={this.cancelClick}\n                >\n                    <q2-icon type=\"close\" />\n                </q2-btn>\n                <q2-btn\n                    ref={el => (this.saveBtnElement = el)}\n                    class=\"save-edit\"\n                    label={`${loc('tecton.element.editableField.save')} ${this.locLabel}`}\n                    hide-label\n                    test-id=\"saveButton\"\n                    onClick={this.saveClick}\n                >\n                    <q2-icon type=\"checkmark\" />\n                </q2-btn>\n            </div>\n        );\n    }\n\n    generateReadStateDOM() {\n        if (this.persistentLabel && this.locLabel) {\n            return (\n                <div\n                    class={this.wrapperClass}\n                    hidden={this.editing}\n                >\n                    <dl>\n                        <dt class=\"read-state-label\">{this.locLabel}</dt>\n                        <dd>\n                            <span class=\"text-wrapper\">{this.formattedValue || this.value}</span>\n                            {this.generateEditBtn()}\n                        </dd>\n                    </dl>\n                </div>\n            );\n        }\n        return (\n            <div\n                class={this.wrapperClass}\n                hidden={this.editing}\n            >\n                <div class=\"text-wrapper\">{this.formattedValue || this.value}</div>\n                {this.generateEditBtn()}\n            </div>\n        );\n    }\n\n    generateEditBtn() {\n        return (\n            <q2-btn\n                ref={el => (this.editBtnElement = el)}\n                class=\"begin-edit\"\n                label={`${loc('tecton.element.editableField.edit')} ${this.locLabel}`}\n                hide-label\n                disabled={this.disabled}\n                test-id=\"editButton\"\n                onClick={this.editClick}\n            >\n                <q2-icon type=\"edit\" />\n            </q2-btn>\n        );\n    }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/p-30facf35.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as a,F as e,H as o,g as r}from"./p-277dc8cd.js";import{o as n,i as s,l as c}from"./p-ef856249.js";import{s as l,a as p}from"./p-788adb51.js";const h="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #33b4ff #06C)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;position:relative;line-height:0}:host(:not(:last-child)){margin-inline-end:var(--tct-tag-margin, var(--t-tag-margin, var(--app-scale-2x, 10px)))}.tag-wrapper{--comp-tag-btn-size:var(--tct-tag-btn-size, var(--t-tag-btn-size, var(--app-scale-6x)));--comp-tag-background:var(--tct-tag-background, var(--t-tag-background, var(--t-gray-13, #e6e6e6)));--comp-tag-color:var(--tct-tag-color, var(--t-tag-color, var(--t-gray-3, #262626)));background:var(--comp-tag-background);color:var(--comp-tag-color);border-radius:var(--tct-tag-border-radius, var(--t-tag-border-radius, var(--app-border-radius-1, 3px)));position:relative}:host([theme=primary]) .tag-wrapper{--comp-tag-background:var(--tct-tag-primary-background, var(--t-primary-l5, #61c4ff));--comp-tag-color:var(--tct-tag-primary-font-color, var(--t-primary-text, #ffffff))}:host([theme=secondary]) .tag-wrapper{--comp-tag-background:var(--tct-tag-secondary-background, var(--t-secondary-l5, #d9e1e6));--comp-tag-color:var(--tct-tag-secondary-font-color, var(--t-secondary-text, #000000))}:host([theme=tertiary]) .tag-wrapper{--comp-tag-background:var(--tct-tag-tertiary-background, var(--t-tertiary-l5, #f4fafe));--comp-tag-color:var(--tct-tag-tertiary-font-color, var(--t-tertiary-text, #000000))}.tag{display:flex;width:max-content;height:var(--tct-tag-height, var(--t-tag-height, var(--app-scale-6x, 30px)));line-height:var(--tct-tag-height, var(--t-tag-height, var(--app-scale-6x, 30px)));padding-inline:var(--tct-tag-padding-inline, var(--t-tag-padding-inline, var(--app-scale-3x, 15px)))}.tag.has-options{padding-right:6px}.btn-wrapper{--comp-tag-clickable-size:var(--tct-tag-clickable-size, var(--t-tag-clickable-size, 44px));--comp-tag-btn-offset:calc(calc(calc(var(--comp-tag-clickable-size) - var(--comp-tag-btn-size)) / 2) * -1);--comp-tag-background:var(--tct-tag-background, var(--t-tag-background, var(--t-gray-13, #e6e6e6)));height:var(--comp-tag-clickable-size);display:flex;align-items:center;justify-content:center;position:relative;right:var(--comp-tag-btn-offset);top:var(--comp-tag-btn-offset);cursor:pointer}button{height:var(--comp-tag-btn-size);stroke:var(--comp-tag-color);--tct-icon-stroke-primary:var(--comp-tag-color);cursor:pointer;border:0;background:transparent;display:flex;align-items:center;justify-content:center;padding:0;padding-right:6px;--tct-icon-size:18px}";const d=class{constructor(a){t(this,a);this.click=i(this,"click",7);var e;this.determineOptionCount=()=>{const t=this.hostElement.querySelectorAll("q2-option").length;this.optionCount=t};this.onClickElsewhere=t=>{const i=t.target;if(i.localName==="click-elsewhere"){t.stopPropagation();const{popoverElement:i}=this;if(!i)return;i.open=false}};this.handleChange=t=>{t.stopPropagation();if(!this.optionCount)return;const{value:i}=t.detail;this.click.emit({value:i})};this.handleClick=async t=>{t.stopPropagation();this.popoverElement.controlElement=this.dropdownBtn;if(l(this)){const{value:i}=await p(this,t);this.click.emit({value:i})}else{await this.popoverElement.toggle()}};this.handleKeydown=async t=>{const i=t.metaKey||t.ctrlKey||t.key==="Tab";if(i)return;t.preventDefault();this.popoverElement.controlElement=this.dropdownBtn;if(l(this,t)){const{value:i}=await p(this,t);this.click.emit({value:i})}else{this.optionList.handleExternalKeydown(t)}};this.handleButtonFocusout=async t=>{var i;const a=t.relatedTarget;if((i=(a===null||a===void 0?void 0:a.tagName)==="Q2-OPTION")!==null&&i!==void 0?i:false)return;this.open=false};this.handleWrapperClick=()=>{this.dropdownBtn.focus();this.dropdownBtn.click()};this.hoist=!!((e=window.Tecton)===null||e===void 0?void 0:e.useActionSheets);this.open=undefined;this.label=undefined;this.theme=undefined;this.popoverMinHeight=150;this.popoverDirection=undefined;this.popoverAlignment="right";this.optionListLabel="options";this.optionCount=undefined}componentWillLoad(){const t=new MutationObserver(this.determineOptionCount);t.observe(this.hostElement,{childList:true,attributes:true});this.mutationObserver=t}componentDidLoad(){n(this.hostElement)}disconnectedCallback(){this.mutationObserver.disconnect();this.mutationObserver=null}delegateFocus(t){if(!s(t,this.hostElement))return;if(!this.optionCount)return;this.dropdownBtn.focus()}popoverStateHandler({detail:{open:t}}){if(this.open!==t)this.open=t;if(t)return;this.optionList.setActiveElement(null)}generateHiddenElement(){return a("div",{id:"option-description",class:"sr","aria-hidden":"true"},c("tecton.element.optionList.optionCount",[this.optionCount]))}render(){const{optionCount:t,open:i}=this;const r=["tag"];if(t)r.push("has-options");return a(o,{role:"listitem"},a("click-elsewhere",{onChange:this.onClickElsewhere},this.optionCount?a(e,null,a("div",{class:"btn-wrapper",onClick:this.handleWrapperClick},a("button",{class:"tag-wrapper",ref:t=>this.dropdownBtn=t,"test-id":"btn-control",type:"button",role:"combobox",onClick:this.handleClick,onKeyDown:this.handleKeydown,onFocusout:this.handleButtonFocusout,"aria-controls":"option-list","aria-expanded":i?"true":"false","aria-describedby":"option-description"},a("div",{class:r.join(" ")},this.label),a("q2-icon",{type:"options"}))),this.generateHiddenElement()):a("div",{class:"tag-wrapper",onClick:t=>t.stopPropagation()},a("div",{class:r.join(" ")},this.label)),this.optionCount>0&&a("q2-popover",{ref:t=>this.popoverElement=t,controlElement:this.dropdownBtn,open:this.open,minHeight:this.popoverMinHeight,direction:this.popoverDirection,align:this.popoverAlignment},a("q2-option-list",{id:"option-list",ref:t=>this.optionList=t,onChange:this.handleChange,type:"menu",align:"right",label:c("tecton.element.optionList.label",[this.optionListLabel]),"no-select":true},a("slot",null)))))}get hostElement(){return r(this)}};d.style=h;export{d as q2_tag};
-//# sourceMappingURL=p-30facf35.entry.js.map