scu-web-components 0.0.16 → 0.0.19

package/dist/chunks/{chunk.EGOU5NNX.js → chunk.ME4SPAUY.js}

@@ -1,4 +1,4 @@
-import{b as g}from"./chunk.PXQQTQKT.js";import{a as n}from"./chunk.K3V3AEZG.js";import{a as c}from"./chunk.WCJ4CSRJ.js";import{c as d}from"./chunk.VSIKGAIE.js";import{a as i,b as r,c as l}from"./chunk.NUBCUBHW.js";import{a as t}from"./chunk.ZS4C3T6Z.js";import{g as o}from"./chunk.5YJY6NT6.js";var p=i`
+import{b as d}from"./chunk.PXQQTQKT.js";import{a as n}from"./chunk.K3V3AEZG.js";import{a as g}from"./chunk.27N4OQ6C.js";import{c as l}from"./chunk.OXJR2CBC.js";import{a as i,b as r,c as a}from"./chunk.HCMPRDIX.js";import{a as t}from"./chunk.ZS4C3T6Z.js";import{g as o}from"./chunk.5YJY6NT6.js";var p=i`
 :host .label {
   display: inline-flex;
   justify-content: center;
@@ -237,20 +237,20 @@ import{b as g}from"./chunk.PXQQTQKT.js";import{a as n}from"./chunk.K3V3AEZG.js";
 :host([design=plain]) .scw-link-base {
   outline: none;
   display: inline-block;
-}`;var e=class extends d{constructor(){super();this.iconSide="left";this.design="solid";this._svgInfo="";this.element="link"}static get styles(){return[super.styles,p]}performUpdate(){return c(this.icon,s=>{s===!1?this.warn(`scw-icon could not find ${this.icon}`):(this._svgInfo=s,console.log("found it"))})}parseAndValidateLightDom(){super.parseAndValidateLightDom(),c(this.icon,s=>{s===!1?this.warn(`scw-icon could not find ${this.icon}`):this._svgInfo=s})}validDesigns(){return g}doShowIcon(){return!!(this.icon&&this.design!=="plain"&&this.design!=="text")}renderContent(){let s=this.doShowIcon(),a=`<style>${this.findStyle().cssText}</style>`;return this.design==="plain"?t`
-        ${n(a)}
+}`;var s=class extends l{constructor(){super();this.iconSide="left";this.design="solid";this._svgInfo="";this.element="link"}static get styles(){return[super.styles,p]}parseAndValidateLightDom(){super.parseAndValidateLightDom(),g(this.icon,e=>{e===!1?this.warn(`scw-icon could not find ${this.icon}`):this._svgInfo=e})}validDesigns(){return d}doShowIcon(){return!!(this.icon&&this.design!=="plain"&&this.design!=="text")}renderContent(){let e=this.doShowIcon(),c=`<style>${this.findStyle().cssText}</style>`;return this.design==="plain"?t`
+        ${n(c)}
         <slot></slot>
       `:t`
-      ${s&&this.iconSide==="left"?t`
+      ${e&&this.iconSide==="left"?t`
         <div class="icon">
           ${n(this._svgInfo)}
         </div>`:""}
-        ${n(a)}
+        ${n(c)}
         <div class="label">
           ${this.ariaLabel}
         </div>
-      ${s&&this.iconSide==="right"?t`
+      ${e&&this.iconSide==="right"?t`
         <div class="icon">
           ${n(this._svgInfo)}
-        </div>`:""}`}findStyle(){switch(this.design){case"solid":return h;case"outlined":return f;case"text":return w;case"plain":default:return b}}render(){return this.renderLink(this.renderContent())}};o([r({type:String,reflect:!0})],e.prototype,"icon",2),o([r({type:String,reflect:!0,attribute:"icon-side"})],e.prototype,"iconSide",2),o([r({type:String,reflect:!0})],e.prototype,"design",2),o([l()],e.prototype,"_svgInfo",2);export{e as a};
-//# sourceMappingURL=chunk.EGOU5NNX.js.map
+        </div>`:""}`}findStyle(){switch(this.design){case"solid":return h;case"outlined":return f;case"text":return w;case"plain":default:return b}}render(){return this.renderLink(this.renderContent())}};o([r({type:String,reflect:!0})],s.prototype,"icon",2),o([r({type:String,reflect:!0,attribute:"icon-side"})],s.prototype,"iconSide",2),o([r({type:String,reflect:!0})],s.prototype,"design",2),o([a()],s.prototype,"_svgInfo",2);export{s as a};
+//# sourceMappingURL=chunk.ME4SPAUY.js.map

package/dist/chunks/{chunk.MRG6GDNO.js.map → chunk.ME4SPAUY.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["sass-plugin-0:/Users/scottrouse/Workspace/scu-design-system-mono/scu-web-components/src/scw-link/scss/scw-link.scss", "sass-plugin-0:/Users/scottrouse/Workspace/scu-design-system-mono/scu-web-components/src/scw-link/scss/scw-link-text.scss", "sass-plugin-0:/Users/scottrouse/Workspace/scu-design-system-mono/scu-web-components/src/scw-link/scss/scw-link-solid.scss", "sass-plugin-0:/Users/scottrouse/Workspace/scu-design-system-mono/scu-web-components/src/scw-link/scss/scw-link-outlined.scss", "sass-plugin-0:/Users/scottrouse/Workspace/scu-design-system-mono/scu-web-components/src/scw-link/scss/scw-link-plain.scss", "../../src/scw-link/ScwLink.ts"],
-  "sourcesContent": ["import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host .label {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=text]) .scw-link-base {\n  outline: none;\n  display: inline;\n}\n:host([design=text]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n  text-decoration: underline;\n}\n\n:host([design=text]:hover) a.scw-link-base .label,\n:host([design=text][hover]) a.scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-01, var(--scw-color-primary-01));\n}\n\n:host([design=text][aria-disabled=true]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-07);\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=solid]) .scw-link-base {\n  outline: none;\n  user-select: none;\n  background-color: var(--scw-color-03, var(--scw-color-primary-03));\n  border-radius: 10px 10px 10px 10px;\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.5);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.5);\n  display: inline-flex;\n}\n:host([design=solid]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n:host([design=solid]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-10);\n  min-height: 22px;\n}\n:host([design=solid]) .scw-link-base .icon {\n  width: 24px;\n  height: 24px;\n}\n:host([design=solid]) .scw-link-base .icon svg {\n  box-sizing: border-box;\n  vertical-align: top;\n  width: 100%;\n  height: 100%;\n  fill: var(--scw-color-grey-10);\n}\n:host([design=solid]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-grey-10);\n}\n\n:host([design=solid][icon][icon-side=left]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.2);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.4);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.4);\n  display: inline-flex;\n}\n:host([design=solid][icon][icon-side=left]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=solid][icon][icon-side=right]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.2);\n  padding-top: calc(var(--scw-spacing-1) * 0.4);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.4);\n  display: inline-flex;\n}\n:host([design=solid][icon][icon-side=right]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=solid]:hover) a.scw-link-base,\n:host([design=solid][hover]) a.scw-link-base {\n  background-color: var(--scw-color-01, var(--scw-color-primary-01));\n  border-radius: 10px 10px 10px 10px;\n}\n:host([design=solid]:hover) a.scw-link-base .label,\n:host([design=solid][hover]) a.scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-10);\n}\n\n:host([design=solid][aria-disabled=true]) .scw-link-base {\n  background-color: var(--scw-color-grey-095);\n  border-radius: 10px 10px 10px 10px;\n}\n:host([design=solid][aria-disabled=true]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-07);\n}\n:host([design=solid][aria-disabled=true]) .scw-link-base .icon svg {\n  fill: var(--scw-color-grey-07);\n}\n:host([design=solid][aria-disabled=true]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-grey-07);\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=outlined]) .scw-link-base {\n  outline: none;\n  user-select: none;\n  background-color: var(--scw-color-grey-10);\n  border-radius: 10px 10px 10px 10px;\n  border-width: 2px;\n  border-style: solid;\n  border-color: var(--scw-color-04, var(--scw-color-primary-04));\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.3);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.3);\n  display: inline-flex;\n}\n:host([design=outlined]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n:host([design=outlined]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n  min-height: 22px;\n}\n:host([design=outlined]) .scw-link-base .icon {\n  width: 24px;\n  height: 24px;\n}\n:host([design=outlined]) .scw-link-base .icon svg {\n  box-sizing: border-box;\n  vertical-align: top;\n  width: 100%;\n  height: 100%;\n  fill: var(--scw-color-primary-03);\n}\n:host([design=outlined]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-primary-03);\n}\n\n:host([design=outlined][icon][icon-side=left]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.2);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.2);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.2);\n  display: inline-flex;\n}\n:host([design=outlined][icon][icon-side=left]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=outlined][icon][icon-side=right]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.2);\n  padding-top: calc(var(--scw-spacing-1) * 0.2);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.2);\n  display: inline-flex;\n}\n:host([design=outlined][icon][icon-side=right]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=outlined]:hover) a.scw-link-base,\n:host([design=outlined][hover]) a.scw-link-base {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 10px 10px 10px 10px;\n  border-width: 2px;\n  border-style: solid;\n  border-color: var(--scw-color-01, var(--scw-color-primary-01));\n}\n:host([design=outlined]:hover) a.scw-link-base .label,\n:host([design=outlined][hover]) a.scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-01, var(--scw-color-primary-01));\n}\n\n:host([design=outlined][aria-disabled=true]) .scw-link-base {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 10px 10px 10px 10px;\n  border-width: 2px;\n  border-style: solid;\n  border-color: var(--scw-color-grey-09);\n}\n:host([design=outlined][aria-disabled=true]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-07);\n}\n:host([design=outlined][aria-disabled=true]) .scw-link-base .icon svg {\n  fill: var(--scw-color-grey-07);\n}\n:host([design=outlined][aria-disabled=true]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-grey-07);\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=plain]) .scw-link-base {\n  outline: none;\n  display: inline-block;\n}`;\n", "import {html} from 'lit';\nimport {property, state} from 'lit/decorators.js';\nimport {unsafeHTML} from 'lit/directives/unsafe-html.js';\nimport styles from './scss/scw-link.scss';\nimport stylesText from './scss/scw-link-text.scss';\nimport stylesSolid from './scss/scw-link-solid.scss';\nimport stylesOutline from './scss/scw-link-outlined.scss';\nimport stylesPlain from './scss/scw-link-plain.scss';\nimport {\n  ScwLinkSide,\n  ScwLinkDesigns,\n} from './scw-link-enums';\nimport getIconSvg from '../utils/getIconSvg';\nimport {Components} from '../utils/enums/Components';\nimport {ScwMenuItemDesigns} from '../scw-menu-item/scw-menu-item-enums';\nimport ScwLinkBase from '../scw-link-base/ScwLinkBase';\n// import 'lit/experimental-hydrate-support.js';\n\n/**\n * ScwLink\n * @class\n * @tag scw-link\n *\n * @slot [default=\"<a href target />\"]\n    (OPTIONAL) anchor (for SEO) will determine the label, href, and target.\n * @slot [default=\"<... />\"]\n    (OPTIONAL) random content (paired with design=\"plain\") will wrap that\n    content with a link.\n */\nexport default class ScwLink extends ScwLinkBase {\n  /**\n  * styles\n  */\n  static get styles() {\n    return [\n      super.styles,\n      styles,\n    ];\n  }\n\n  // ============== ScwLink ==================================================\n  /**\n  * (ScwLink) Determines the icon to use with the text\n  * @type {string}\n  */\n  @property({type: String, reflect: true})\n    icon: string | undefined;\n\n  /**\n  * (ScwLink) Determines which side the icon should show up on\n  * @type {string}\n  */\n  @property({type: String, reflect: true, attribute: 'icon-side'})\n    iconSide: ScwLinkSide = ScwLinkSide.left;\n\n  /**\n  * (ScwLink) The design style of the link.\n  * @type {string}\n  */\n  @property({type: String, reflect: true})\n    design: ScwLinkDesigns | ScwMenuItemDesigns = ScwLinkDesigns.solid;\n\n  @state() _svgInfo : string = '';\n\n  /**\n  * Constructor\n  */\n  constructor() {\n    super();\n    this.element = Components.link;\n console.log('ICON');\n    getIconSvg(this.icon, (svgInfo: string | false ) => {\n      if (svgInfo === false ) {\n        this.warn(`scw-icon could not find ${this.icon}`);\n      } else {\n        this._svgInfo = svgInfo;\n      }\n    });\n  }\n\n  /** parseAndValidateLightDom, just adding local parsing and validation */\n  parseAndValidateLightDom() {\n    super.parseAndValidateLightDom();\n    getIconSvg(this.icon, (svgInfo: string | false ) => {\n      if (svgInfo === false ) {\n        this.warn(`scw-icon could not find ${this.icon}`);\n      } else {\n        this._svgInfo = svgInfo;\n      }\n    });\n  }\n\n  /**\n  * Way to extend valid design types...\n  * @return {object} object of valid designs relative to this object\n  */\n  validDesigns() : object {\n    return ScwLinkDesigns;\n  }\n\n  /**\n  * Way to extend valid design icon types...\n  * @return {boolean}\n  */\n  doShowIcon() : boolean {\n    if ( this.icon &&\n      this.design !== ScwLinkDesigns.plain &&\n      this.design !== ScwLinkDesigns.text ) {\n      return true;\n    }\n    return false;\n  }\n\n  /**\n  * renderContent\n  * @return {object} component DOM\n  */\n  renderContent(): object {\n    const doShowIcon = this.doShowIcon();\n    // ssr is fighting injecting css this way...\n    const localCss = `<style>${this.findStyle().cssText}</style>`;\n\n    if (this.design === ScwLinkDesigns.plain) {\n      return html`\n        ${unsafeHTML(localCss)}\n        <slot></slot>\n      `;\n    }\n\n    return html`\n      ${doShowIcon && this.iconSide === ScwLinkSide.left ?\n      html`\n        <div class=\"icon\">\n          ${unsafeHTML(this._svgInfo)}\n        </div>` : ''}\n        ${unsafeHTML(localCss)}\n        <div class=\"label\">\n          ${this.ariaLabel}\n        </div>\n      ${doShowIcon && this.iconSide === ScwLinkSide.right ?\n      html`\n        <div class=\"icon\">\n          ${unsafeHTML(this._svgInfo)}\n        </div>` : ''}`;\n  }\n\n  /**\n   * find the style per design\n   * @return {object}\n   */\n  findStyle() {\n    switch (this.design) {\n      case ScwLinkDesigns.solid:\n        return stylesSolid;\n      case ScwLinkDesigns.outlined:\n        return stylesOutline;\n      case ScwLinkDesigns.text:\n        return stylesText;\n      case ScwLinkDesigns.plain:\n      default:\n        return stylesPlain;\n    }\n  }\n\n  /**\n  * render\n  * @return {object} component DOM\n  */\n   render(): object {\n    return this.renderLink(\n      this.renderContent(),\n    );\n  }\n}\n"],
-  "mappings": "sSACA,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;GC4Bf,mBAAqC,EAAY,CAsC/C,aAAc,CACZ,MAAM,EAfN,cAAwB,OAOxB,YAA8C,QAEvC,cAAoB,GAO3B,KAAK,QAAU,OAClB,QAAQ,IAAI,MAAM,EACf,EAAW,KAAK,KAAM,AAAC,GAA6B,CAClD,AAAI,IAAY,GACd,KAAK,KAAK,2BAA2B,KAAK,MAAM,EAEhD,KAAK,SAAW,CAEpB,CAAC,CACH,WA7CW,SAAS,CAClB,MAAO,CACL,MAAM,OACN,CACF,CACF,CA2CA,0BAA2B,CACzB,MAAM,yBAAyB,EAC/B,EAAW,KAAK,KAAM,AAAC,GAA6B,CAClD,AAAI,IAAY,GACd,KAAK,KAAK,2BAA2B,KAAK,MAAM,EAEhD,KAAK,SAAW,CAEpB,CAAC,CACH,CAMA,cAAwB,CACtB,MAAO,EACT,CAMA,YAAuB,CACrB,MAAK,QAAK,MACR,KAAK,SAAW,SAChB,KAAK,SAAW,OAIpB,CAMA,eAAwB,CACtB,GAAM,GAAa,KAAK,WAAW,EAE7B,EAAW,UAAU,KAAK,UAAU,EAAE,kBAE5C,MAAI,MAAK,SAAW,QACX;AAAA,UACH,EAAW,CAAQ;AAAA;AAAA,QAKlB;AAAA,QACH,GAAc,KAAK,WAAa,OAClC;AAAA;AAAA,YAEM,EAAW,KAAK,QAAQ;AAAA,gBAClB;AAAA,UACR,EAAW,CAAQ;AAAA;AAAA,YAEjB,KAAK;AAAA;AAAA,QAET,GAAc,KAAK,WAAa,QAClC;AAAA;AAAA,YAEM,EAAW,KAAK,QAAQ;AAAA,gBAClB,IAChB,CAMA,WAAY,CACV,OAAQ,KAAK,YACN,QACH,MAAO,OACJ,WACH,MAAO,OACJ,OACH,MAAO,OACJ,gBAEH,MAAO,GAEb,CAMC,QAAiB,CAChB,MAAO,MAAK,WACV,KAAK,cAAc,CACrB,CACF,CACF,EA/HI,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,QAAS,EAAI,CAAC,GACrC,AAjBJ,EAiBI,oBAOA,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,QAAS,GAAM,UAAW,WAAW,CAAC,GAC7D,AAxBJ,EAwBI,wBAOA,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,QAAS,EAAI,CAAC,GACrC,AA/BJ,EA+BI,sBAEO,GAAT,AAAC,EAAM,GAAE,AAjCX,EAiCW",
+  "sourcesContent": ["import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host .label {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=text]) .scw-link-base {\n  outline: none;\n  display: inline;\n}\n:host([design=text]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n  text-decoration: underline;\n}\n\n:host([design=text]:hover) a.scw-link-base .label,\n:host([design=text][hover]) a.scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-01, var(--scw-color-primary-01));\n}\n\n:host([design=text][aria-disabled=true]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-07);\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=solid]) .scw-link-base {\n  outline: none;\n  user-select: none;\n  background-color: var(--scw-color-03, var(--scw-color-primary-03));\n  border-radius: 10px 10px 10px 10px;\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.5);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.5);\n  display: inline-flex;\n}\n:host([design=solid]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n:host([design=solid]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-10);\n  min-height: 22px;\n}\n:host([design=solid]) .scw-link-base .icon {\n  width: 24px;\n  height: 24px;\n}\n:host([design=solid]) .scw-link-base .icon svg {\n  box-sizing: border-box;\n  vertical-align: top;\n  width: 100%;\n  height: 100%;\n  fill: var(--scw-color-grey-10);\n}\n:host([design=solid]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-grey-10);\n}\n\n:host([design=solid][icon][icon-side=left]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.2);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.4);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.4);\n  display: inline-flex;\n}\n:host([design=solid][icon][icon-side=left]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=solid][icon][icon-side=right]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.2);\n  padding-top: calc(var(--scw-spacing-1) * 0.4);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.4);\n  display: inline-flex;\n}\n:host([design=solid][icon][icon-side=right]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=solid]:hover) a.scw-link-base,\n:host([design=solid][hover]) a.scw-link-base {\n  background-color: var(--scw-color-01, var(--scw-color-primary-01));\n  border-radius: 10px 10px 10px 10px;\n}\n:host([design=solid]:hover) a.scw-link-base .label,\n:host([design=solid][hover]) a.scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-10);\n}\n\n:host([design=solid][aria-disabled=true]) .scw-link-base {\n  background-color: var(--scw-color-grey-095);\n  border-radius: 10px 10px 10px 10px;\n}\n:host([design=solid][aria-disabled=true]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-07);\n}\n:host([design=solid][aria-disabled=true]) .scw-link-base .icon svg {\n  fill: var(--scw-color-grey-07);\n}\n:host([design=solid][aria-disabled=true]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-grey-07);\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=outlined]) .scw-link-base {\n  outline: none;\n  user-select: none;\n  background-color: var(--scw-color-grey-10);\n  border-radius: 10px 10px 10px 10px;\n  border-width: 2px;\n  border-style: solid;\n  border-color: var(--scw-color-04, var(--scw-color-primary-04));\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.3);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.3);\n  display: inline-flex;\n}\n:host([design=outlined]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n:host([design=outlined]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n  min-height: 22px;\n}\n:host([design=outlined]) .scw-link-base .icon {\n  width: 24px;\n  height: 24px;\n}\n:host([design=outlined]) .scw-link-base .icon svg {\n  box-sizing: border-box;\n  vertical-align: top;\n  width: 100%;\n  height: 100%;\n  fill: var(--scw-color-primary-03);\n}\n:host([design=outlined]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-primary-03);\n}\n\n:host([design=outlined][icon][icon-side=left]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.2);\n  padding-right: calc(var(--scw-spacing-1) * 1.6);\n  padding-top: calc(var(--scw-spacing-1) * 0.2);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.2);\n  display: inline-flex;\n}\n:host([design=outlined][icon][icon-side=left]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=outlined][icon][icon-side=right]) .scw-link-base {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  padding-left: calc(var(--scw-spacing-1) * 1.6);\n  padding-right: calc(var(--scw-spacing-1) * 1.2);\n  padding-top: calc(var(--scw-spacing-1) * 0.2);\n  padding-bottom: calc(var(--scw-spacing-1) * 0.2);\n  display: inline-flex;\n}\n:host([design=outlined][icon][icon-side=right]) .scw-link-base > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n\n:host([design=outlined]:hover) a.scw-link-base,\n:host([design=outlined][hover]) a.scw-link-base {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 10px 10px 10px 10px;\n  border-width: 2px;\n  border-style: solid;\n  border-color: var(--scw-color-01, var(--scw-color-primary-01));\n}\n:host([design=outlined]:hover) a.scw-link-base .label,\n:host([design=outlined][hover]) a.scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-01, var(--scw-color-primary-01));\n}\n\n:host([design=outlined][aria-disabled=true]) .scw-link-base {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 10px 10px 10px 10px;\n  border-width: 2px;\n  border-style: solid;\n  border-color: var(--scw-color-grey-09);\n}\n:host([design=outlined][aria-disabled=true]) .scw-link-base .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-06-font);\n  color: var(--scw-color-grey-07);\n}\n:host([design=outlined][aria-disabled=true]) .scw-link-base .icon svg {\n  fill: var(--scw-color-grey-07);\n}\n:host([design=outlined][aria-disabled=true]) .scw-link-base .icon svg * {\n  fill: var(--scw-color-grey-07);\n}`;\n", "import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=plain]) .scw-link-base {\n  outline: none;\n  display: inline-block;\n}`;\n", "import {html} from 'lit';\nimport {property, state} from 'lit/decorators.js';\nimport {unsafeHTML} from 'lit/directives/unsafe-html.js';\nimport styles from './scss/scw-link.scss';\nimport stylesText from './scss/scw-link-text.scss';\nimport stylesSolid from './scss/scw-link-solid.scss';\nimport stylesOutline from './scss/scw-link-outlined.scss';\nimport stylesPlain from './scss/scw-link-plain.scss';\nimport {\n  ScwLinkSide,\n  ScwLinkDesigns,\n} from './scw-link-enums';\nimport getIconSvg from '../utils/getIconSvg';\nimport {Components} from '../utils/enums/Components';\nimport {ScwMenuItemDesigns} from '../scw-menu-item/scw-menu-item-enums';\nimport ScwLinkBase from '../scw-link-base/ScwLinkBase';\n\n/**\n * ScwLink\n * @class\n * @tag scw-link\n *\n * @slot [default=\"<a href target />\"]\n    (OPTIONAL) anchor (for SEO) will determine the label, href, and target.\n * @slot [default=\"<... />\"]\n    (OPTIONAL) random content (paired with design=\"plain\") will wrap that\n    content with a link.\n */\nexport default class ScwLink extends ScwLinkBase {\n  /**\n  * styles\n  */\n  static get styles() {\n    return [\n      super.styles,\n      styles,\n    ];\n  }\n\n  // ============== ScwLink ==================================================\n  /**\n  * (ScwLink) Determines the icon to use with the text\n  * @type {string}\n  */\n  @property({type: String, reflect: true})\n    icon: string | undefined;\n\n  /**\n  * (ScwLink) Determines which side the icon should show up on\n  * @type {string}\n  */\n  @property({type: String, reflect: true, attribute: 'icon-side'})\n    iconSide: ScwLinkSide = ScwLinkSide.left;\n\n  /**\n  * (ScwLink) The design style of the link.\n  * @type {string}\n  */\n  @property({type: String, reflect: true})\n    design: ScwLinkDesigns | ScwMenuItemDesigns = ScwLinkDesigns.solid;\n\n  @state() _svgInfo : string = '';\n\n  /**\n  * Constructor\n  */\n  constructor() {\n    super();\n    this.element = Components.link;\n  }\n\n  /** parseAndValidateLightDom, just adding local parsing and validation */\n  parseAndValidateLightDom() {\n    super.parseAndValidateLightDom();\n    getIconSvg(this.icon, (svgInfo: string | false ) => {\n      if (svgInfo === false ) {\n        this.warn(`scw-icon could not find ${this.icon}`);\n      } else {\n        this._svgInfo = svgInfo;\n      }\n    });\n  }\n\n  /**\n  * Way to extend valid design types...\n  * @return {object} object of valid designs relative to this object\n  */\n  validDesigns() : object {\n    return ScwLinkDesigns;\n  }\n\n  /**\n  * Way to extend valid design icon types...\n  * @return {boolean}\n  */\n  doShowIcon() : boolean {\n    if ( this.icon &&\n      this.design !== ScwLinkDesigns.plain &&\n      this.design !== ScwLinkDesigns.text ) {\n      return true;\n    }\n    return false;\n  }\n\n  /**\n  * renderContent\n  * @return {object} component DOM\n  */\n  renderContent(): object {\n    const doShowIcon = this.doShowIcon();\n    // ssr is fighting injecting css this way...\n    const localCss = `<style>${this.findStyle().cssText}</style>`;\n\n    if (this.design === ScwLinkDesigns.plain) {\n      return html`\n        ${unsafeHTML(localCss)}\n        <slot></slot>\n      `;\n    }\n\n    return html`\n      ${doShowIcon && this.iconSide === ScwLinkSide.left ?\n      html`\n        <div class=\"icon\">\n          ${unsafeHTML(this._svgInfo)}\n        </div>` : ''}\n        ${unsafeHTML(localCss)}\n        <div class=\"label\">\n          ${this.ariaLabel}\n        </div>\n      ${doShowIcon && this.iconSide === ScwLinkSide.right ?\n      html`\n        <div class=\"icon\">\n          ${unsafeHTML(this._svgInfo)}\n        </div>` : ''}`;\n  }\n\n  /**\n   * find the style per design\n   * @return {object}\n   */\n  findStyle() {\n    switch (this.design) {\n      case ScwLinkDesigns.solid:\n        return stylesSolid;\n      case ScwLinkDesigns.outlined:\n        return stylesOutline;\n      case ScwLinkDesigns.text:\n        return stylesText;\n      case ScwLinkDesigns.plain:\n      default:\n        return stylesPlain;\n    }\n  }\n\n  /**\n  * render\n  * @return {object} component DOM\n  */\n   render(): object {\n    return this.renderLink(\n      this.renderContent(),\n    );\n  }\n}\n"],
+  "mappings": "sSACA,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCAf,GAAO,GAAQ;AAAA;AAAA;AAAA;GC2Bf,mBAAqC,EAAY,CAsC/C,aAAc,CACZ,MAAM,EAfN,cAAwB,OAOxB,YAA8C,QAEvC,cAAoB,GAO3B,KAAK,QAAU,MACjB,WArCW,SAAS,CAClB,MAAO,CACL,MAAM,OACN,CACF,CACF,CAmCA,0BAA2B,CACzB,MAAM,yBAAyB,EAC/B,EAAW,KAAK,KAAM,AAAC,GAA6B,CAClD,AAAI,IAAY,GACd,KAAK,KAAK,2BAA2B,KAAK,MAAM,EAEhD,KAAK,SAAW,CAEpB,CAAC,CACH,CAMA,cAAwB,CACtB,MAAO,EACT,CAMA,YAAuB,CACrB,MAAK,QAAK,MACR,KAAK,SAAW,SAChB,KAAK,SAAW,OAIpB,CAMA,eAAwB,CACtB,GAAM,GAAa,KAAK,WAAW,EAE7B,EAAW,UAAU,KAAK,UAAU,EAAE,kBAE5C,MAAI,MAAK,SAAW,QACX;AAAA,UACH,EAAW,CAAQ;AAAA;AAAA,QAKlB;AAAA,QACH,GAAc,KAAK,WAAa,OAClC;AAAA;AAAA,YAEM,EAAW,KAAK,QAAQ;AAAA,gBAClB;AAAA,UACR,EAAW,CAAQ;AAAA;AAAA,YAEjB,KAAK;AAAA;AAAA,QAET,GAAc,KAAK,WAAa,QAClC;AAAA;AAAA,YAEM,EAAW,KAAK,QAAQ;AAAA,gBAClB,IAChB,CAMA,WAAY,CACV,OAAQ,KAAK,YACN,QACH,MAAO,OACJ,WACH,MAAO,OACJ,OACH,MAAO,OACJ,gBAEH,MAAO,GAEb,CAMC,QAAiB,CAChB,MAAO,MAAK,WACV,KAAK,cAAc,CACrB,CACF,CACF,EAvHI,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,QAAS,EAAI,CAAC,GACrC,AAjBJ,EAiBI,oBAOA,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,QAAS,GAAM,UAAW,WAAW,CAAC,GAC7D,AAxBJ,EAwBI,wBAOA,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,QAAS,EAAI,CAAC,GACrC,AA/BJ,EA+BI,sBAEO,GAAT,AAAC,EAAM,GAAE,AAjCX,EAiCW",
   "names": []
 }

package/dist/chunks/chunk.MFJYDKRZ.js

@@ -0,0 +1,4 @@
+import{a as u}from"./chunk.SYPART54.js";import{b as n,c as r,e as f}from"./chunk.6ITKITRF.js";import{a as o}from"./chunk.ZS4C3T6Z.js";import{g as a}from"./chunk.5YJY6NT6.js";var c=(e=>(e.text="text",e.boolean="boolean",e.submit="submit",e))(c||{}),h=(i=>(i.submit="submit",i.cancel="cancel",i))(h||{}),t=class extends f{constructor(){super(...arguments);this.formType="text";this.value="";this.placeholder="";this.selected=!1;this.readOnly=!1;this.required=!1;this.requiredLabel=" *";this.focused=!1;this.invalid=!1}connectedCallback(){super.connectedCallback(),this.required&&this.createAndAddValidationRule("required",this.requiredFeedback)}decorateValues(i){if(!this.name){this.warn(`${this.element} didn't find a name`);return}this.formType==="boolean"?i[this.name]=this.selected:i[this.name]=this.value}findIfRequired(){let i=this.findValidationRules();return i?i.isRequired():!1}findValidationRules(){return Array.from(this.children).find(l=>l.nodeName.indexOf("SCW-VALIDATION")===0)}validate(){let i=this.findValidationRules(),e=[];return i&&(e=i.validate(this.value)),this.invalid=e.length>0,this.invalid?this.feedback=e[0].feedback:this.feedback="",e}createValidateRule(){return document.createElement(`scw-${"validate"}${u()}`)}addValidationRule(i){let e=this.findValidationRules();e||(e=document.createElement(`scw-${"validation"}${u()}`),this.prepend(e)),Array.from(e.children).find(s=>s.getAttribute("type")===i.type)||e.appendChild(i)}createAndAddValidationRule(i,e){let l=this.createValidateRule();l.setAttribute("type",i),e&&l.setAttribute("feedback",e),this.addValidationRule(l)}removeValidationRule(i){let e=this.findValidationRules();if(!e)return;let d=Array.from(e.children).find(s=>s.type===i);d&&d.parentNode&&d.parentNode.removeChild(d)}render(){return o`
+      scw-form-component
+    `}};a([n({type:c,reflect:!0,attribute:"form-type"})],t.prototype,"formType",2),a([n({type:String})],t.prototype,"name",2),a([n({type:String})],t.prototype,"value",2),a([n({type:String})],t.prototype,"placeholder",2),a([n({type:String})],t.prototype,"selected",2),a([n({type:Boolean,attribute:"read-only"})],t.prototype,"readOnly",2),a([n({type:Boolean})],t.prototype,"required",2),a([n({type:String,attribute:"required-label"})],t.prototype,"requiredLabel",2),a([n({type:String,attribute:"required-feedback"})],t.prototype,"requiredFeedback",2),a([r()],t.prototype,"feedback",2),a([r()],t.prototype,"focused",2),a([r()],t.prototype,"invalid",2);export{c as a,h as b,t as c};
+//# sourceMappingURL=chunk.MFJYDKRZ.js.map

package/dist/chunks/chunk.MFJYDKRZ.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/scw-form-component/scw-form-component.ts"],
+  "sourcesContent": ["import {html} from 'lit';\nimport {property, state} from 'lit/decorators.js';\nimport ScwComponent from '../scw-component/ScwComponent';\nimport {Components} from '../utils/enums/Components';\nimport ScwValidate from '../scw-validate/scw-validate';\nimport ScwValidation from '../scw-validation/scw-validation';\nimport {ValidationResult, ValidationTypes}\n  from '../scw-validate/validationTypes';\nimport getSuffix from '../utils/suffix';\n\nexport enum ScwFormComponentTypes {\n  text = 'text',\n  boolean = 'boolean',\n  submit = 'submit'\n}\n\nexport enum ScwFormComponentSubmitTypes {\n  submit = 'submit',\n  cancel = 'cancel'\n}\n\n/**\n * ScwFormComponent\n * @class\n * @tag scw-form-component\n */\nexport default class ScwFormComponent extends ScwComponent {\n  // ============== ScwFormComponent ===========================================\n  /** (ScwFormComponent) the usage in a form (& scw-form a query target) */\n  @property({\n    type: ScwFormComponentTypes,\n    reflect: true,\n    attribute: 'form-type',\n  })\n    formType: ScwFormComponentTypes = ScwFormComponentTypes.text;\n\n  /** (ScwFormComponent) name to identify form element and attach data */\n  @property({type: String})\n    name: string | undefined;\n\n  /** (ScwFormComponent) name to identify form element and attach data */\n  @property({type: String})\n    value: string = '';\n\n  /** (ScwFormComponent) text showing when there is no value */\n  @property({type: String})\n    placeholder: string = '';\n\n  /** (ScwFormComponent) name to identify form element and attach data */\n  @property({type: String})\n    selected: boolean = false;\n\n  /** (ScwFormComponent) read-only state management */\n  @property({type: Boolean, attribute: 'read-only'})\n    readOnly: boolean = false;\n\n  /** (ScwFormComponent) required state management */\n  @property({type: Boolean})\n    required: boolean = false;\n\n  /** (ScwFormComponent) label indicator for required */\n  @property({type: String, attribute: 'required-label'})\n    requiredLabel: string = ' *';\n\n  /** (ScwFormComponent) label indicator for required */\n  @property({type: String, attribute: 'required-feedback'})\n    requiredFeedback?: string;\n\n  // ===== STATE ===============================================================\n  /** the text to use for feedback */\n  @state() feedback: string | undefined;\n\n  /** determines whether the input is focused or not */\n  @state() focused : boolean = false;\n\n  /** whether this form element is valid, passed validation */\n  @state() invalid: boolean = false;\n\n  /** connectedCallback */\n  connectedCallback(): void {\n    super.connectedCallback();\n    if (this.required) {\n      this.createAndAddValidationRule(\n        ValidationTypes.required,\n        this.requiredFeedback,\n      );\n    }\n  }\n\n  /** (ScwFormComponent) each form element to decorates the final data object\n  * @param {Object} formData\n  */\n  decorateValues(formData: {}): void {\n    if (!this.name) {\n      this.warn(`${this.element} didn't find a name`);\n      return;\n    }\n    if (this.formType === ScwFormComponentTypes.boolean) {\n      formData[this.name] = this.selected;// ? 'true' : 'false';\n    } else {\n      formData[this.name] = this.value;\n    }\n  }\n\n  /**\n  * Check to see if form element is required w/o knowing if there is validation\n  * @return {boolean}\n  */\n  findIfRequired() : boolean {\n    const rules = this.findValidationRules();\n    if (rules) {\n      return rules.isRequired();\n    }\n    return false;\n  }\n\n  /**\n  * Find validation child if there...\n  * @return {ScwValidation | undefined}\n  */\n  findValidationRules() : ScwValidation | undefined {\n    const childrenArr = Array.from(this.children);\n    const validation = childrenArr.find((child: any) => {\n      // component may not be initialized yet...\n      return child.nodeName.indexOf('SCW-VALIDATION') === 0;\n      // return child.element === Components.validation;\n    });\n    return validation as unknown as ScwValidation;\n  }\n\n  /**\n  *  run the validation rules if there...\n  * @param {string} value\n  * @return {ValidationResult[]}\n  */\n  validate() : ValidationResult[] {\n    const validation = this.findValidationRules();\n    let results : ValidationResult[] = [];\n    if (validation) {\n      results = validation.validate(this.value);\n    }\n    this.invalid = ( results.length > 0);\n    if (this.invalid ) {\n      this.feedback = results[0].feedback;\n    } else {\n      this.feedback = '';\n    }\n    return results;\n  }\n\n\n  /**\n  * create a validation rule from scratch\n  * @return {ScwValidate}\n  */\n  createValidateRule() : ScwValidate {\n    return document.createElement(\n      `scw-${Components.validate}${getSuffix()}`,\n    ) as unknown as ScwValidate;\n  }\n\n  /**\n  * add validation to to child validation (create if not there)\n  * @param {ScwValidate} rule\n  */\n  addValidationRule(rule: ScwValidate ) {\n    let validationRules = this.findValidationRules();\n    if (!validationRules) {\n      validationRules = document.createElement(\n        `scw-${Components.validation}${getSuffix()}`,\n      ) as unknown as ScwValidation;\n      this.prepend( validationRules );\n    }\n    // Check for dups?\n    const children = Array.from(validationRules.children);\n    const existingRule = children.find((child : any) => {\n      return child.getAttribute('type') === rule.type;\n    });\n    if ( !existingRule ) {\n      validationRules.appendChild(rule);\n    }\n  }\n\n  /**\n  * create a validation of a certain type...\n  * @param {ValidationTypes} type\n  * @param {string} feedbackOverride\n  */\n  createAndAddValidationRule(\n    type: ValidationTypes,\n    feedbackOverride?: string,\n  ) {\n    const rule = this.createValidateRule();\n    rule.setAttribute('type', type );// .type = type;\n    if (feedbackOverride) {\n      rule.setAttribute('feedback', feedbackOverride );\n    }\n    this.addValidationRule( rule );\n  }\n\n  /**\n  *\n  * @param {ValidationTypes} type\n  */\n  removeValidationRule(\n    type: ValidationTypes,\n  ) {\n    const validationRules = this.findValidationRules();\n    if (!validationRules) return;\n    const children = Array.from(validationRules.children);\n    const child = children.find(\n      (child : any) => child.type === type,\n    ) as unknown as HTMLElement;\n    if ( child && child.parentNode ) child.parentNode.removeChild(child);\n  }\n\n  /**\n  * render\n  * @return {object} component DOM\n  */\n  render(): object {\n    return html`\n      scw-form-component\n    `;\n  }\n}\n"],
+  "mappings": "8KAUO,GAAK,GAAL,CAAK,GACV,QAAO,OACP,UAAU,UACV,SAAS,SAHC,WAMA,EAAL,CAAK,GACV,UAAS,SACT,SAAS,SAFC,WAUZ,eAA8C,EAAa,CAA3D,kCAQI,cAAkC,OAQlC,WAAgB,GAIhB,iBAAsB,GAItB,cAAoB,GAIpB,cAAoB,GAIpB,cAAoB,GAIpB,mBAAwB,KAWjB,aAAoB,GAGpB,aAAmB,GAG5B,mBAA0B,CACxB,MAAM,kBAAkB,EACpB,KAAK,UACP,KAAK,2BACH,WACA,KAAK,gBACP,CAEJ,CAKA,eAAe,EAAoB,CACjC,GAAI,CAAC,KAAK,KAAM,CACd,KAAK,KAAK,GAAG,KAAK,4BAA4B,EAC9C,MACF,CACA,AAAI,KAAK,WAAa,UACpB,EAAS,KAAK,MAAQ,KAAK,SAE3B,EAAS,KAAK,MAAQ,KAAK,KAE/B,CAMA,gBAA2B,CACzB,GAAM,GAAQ,KAAK,oBAAoB,EACvC,MAAI,GACK,EAAM,WAAW,EAEnB,EACT,CAMA,qBAAkD,CAOhD,MALmB,AADC,OAAM,KAAK,KAAK,QAAQ,EACb,KAAK,AAAC,GAE5B,EAAM,SAAS,QAAQ,gBAAgB,IAAM,CAErD,CAEH,CAOA,UAAgC,CAC9B,GAAM,GAAa,KAAK,oBAAoB,EACxC,EAA+B,CAAC,EACpC,MAAI,IACF,GAAU,EAAW,SAAS,KAAK,KAAK,GAE1C,KAAK,QAAY,EAAQ,OAAS,EAClC,AAAI,KAAK,QACP,KAAK,SAAW,EAAQ,GAAG,SAE3B,KAAK,SAAW,GAEX,CACT,CAOA,oBAAmC,CACjC,MAAO,UAAS,cACd,OAAO,aAAsB,EAAU,GACzC,CACF,CAMA,kBAAkB,EAAoB,CACpC,GAAI,GAAkB,KAAK,oBAAoB,EAC/C,AAAK,GACH,GAAkB,SAAS,cACzB,OAAO,eAAwB,EAAU,GAC3C,EACA,KAAK,QAAS,CAAgB,GAO1B,AAHe,AADJ,MAAM,KAAK,EAAgB,QAAQ,EACtB,KAAK,AAAC,GAC3B,EAAM,aAAa,MAAM,IAAM,EAAK,IAC5C,GAEC,EAAgB,YAAY,CAAI,CAEpC,CAOA,2BACE,EACA,EACA,CACA,GAAM,GAAO,KAAK,mBAAmB,EACrC,EAAK,aAAa,OAAQ,CAAK,EAC3B,GACF,EAAK,aAAa,WAAY,CAAiB,EAEjD,KAAK,kBAAmB,CAAK,CAC/B,CAMA,qBACE,EACA,CACA,GAAM,GAAkB,KAAK,oBAAoB,EACjD,GAAI,CAAC,EAAiB,OAEtB,GAAM,GAAQ,AADG,MAAM,KAAK,EAAgB,QAAQ,EAC7B,KACrB,AAAC,GAAgB,EAAM,OAAS,CAClC,EACA,AAAK,GAAS,EAAM,YAAa,EAAM,WAAW,YAAY,CAAK,CACrE,CAMA,QAAiB,CACf,MAAO;AAAA;AAAA,KAGT,CACF,EA/LI,GALF,AAAC,EAAS,CACR,KAAM,EACN,QAAS,GACT,UAAW,WACb,CAAC,GACC,AARJ,EAQI,wBAIA,GADF,AAAC,EAAS,CAAC,KAAM,MAAM,CAAC,GACtB,AAZJ,EAYI,oBAIA,GADF,AAAC,EAAS,CAAC,KAAM,MAAM,CAAC,GACtB,AAhBJ,EAgBI,qBAIA,GADF,AAAC,EAAS,CAAC,KAAM,MAAM,CAAC,GACtB,AApBJ,EAoBI,2BAIA,GADF,AAAC,EAAS,CAAC,KAAM,MAAM,CAAC,GACtB,AAxBJ,EAwBI,wBAIA,GADF,AAAC,EAAS,CAAC,KAAM,QAAS,UAAW,WAAW,CAAC,GAC/C,AA5BJ,EA4BI,wBAIA,GADF,AAAC,EAAS,CAAC,KAAM,OAAO,CAAC,GACvB,AAhCJ,EAgCI,wBAIA,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,UAAW,gBAAgB,CAAC,GACnD,AApCJ,EAoCI,6BAIA,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,UAAW,mBAAmB,CAAC,GACtD,AAxCJ,EAwCI,gCAIO,GAAT,AAAC,EAAM,GAAE,AA5CX,EA4CW,wBAGA,GAAT,AAAC,EAAM,GAAE,AA/CX,EA+CW,uBAGA,GAAT,AAAC,EAAM,GAAE,AAlDX,EAkDW",
+  "names": []
+}

package/dist/chunks/chunk.MJWHJW22.js

@@ -0,0 +1,2 @@
+import{a as i,b as u}from"./chunk.TUFC4UAB.js";import{a as n}from"./chunk.2VW3SHYK.js";var s=class{constructor(e){this.tabbablelist=["menu-item","icon","link","button","BUTTON","A"];this.ignorelist=["scw-menu"];this.menu=e,this.handleKeydown=this.handleKeydown.bind(this),this.initKeyboard(),this.documentClickHandler=this.documentClickHandler.bind(this)}initKeyboard(){this.menu.addEventListener("focusin",e=>{e.target===this.menu&&this.focusOnNextTabbableElement(this.menu),this.menu.setAttribute("tabindex","-1"),n("scw-app-mode-on",this.menu),this.menu.isSubMenu()&&document.addEventListener("click",this.documentClickHandler)}),this.menu.addEventListener("focusout",e=>{e.relatedTarget&&this.menu.contains(e.relatedTarget)||(this.menu.setAttribute("tabindex","0"),n("scw-app-mode-off",this.menu))}),this.menu.addEventListener("keydown",e=>{this.handleKeydown(e)}),this.menu.addEventListener("click",e=>{this.clickHandler(e)})}documentClickHandler(e){let t=e.target;this.menu.contains(t)||this.closeMenu()}closeMenu(e=!1){if(this.menu.isSubMenu()&&(document.removeEventListener("click",this.documentClickHandler),this.menu.ariaHidden="true",this.menu.setAttribute("aria-hidden","true"),e)){let t=this.menu.previousElementSibling;t&&t.element==="menu-item"&&t.focus()}}clickHandler(e){let t=e.target;t&&t.element==="menu-item"&&(t.focus(),this.toggleSubMenu())}toggleSubMenu(){let e=this.findSubmenu();return e?(e.ariaHidden==="false"?(e.ariaHidden="true",e.setAttribute("aria-hidden","true")):(e.ariaHidden="false",e.setAttribute("aria-hidden","false"),setTimeout(()=>{e.focus()},0)),!0):!1}focusOnNextTabbableElement(e){i(this.menu,e,"forwards")}focusOnPreviousTabbableElement(e){i(this.menu,e,"backwards")}stopEvent(e){e.stopPropagation(),e.preventDefault()}handleKeydown(e){if(this.menu.isSubMenu()&&e.key==="Tab")if(e.shiftKey){this.focusOnPreviousTabbableElement(),this.stopEvent(e);return}else{this.focusOnNextTabbableElement(),this.stopEvent(e);return}switch(e.key){case"ArrowRight":this.menu.keyboardDirection==="vertical"?this.toggleSubMenu():this.focusOnNextTabbableElement(),this.stopEvent(e);break;case"ArrowDown":this.menu.keyboardDirection==="horizontal"?this.toggleSubMenu():this.focusOnNextTabbableElement(),this.stopEvent(e);break;case"ArrowLeft":this.menu.keyboardDirection==="vertical"?this.toggleSubMenu()||this.closeMenu(!0):this.focusOnPreviousTabbableElement(),this.stopEvent(e);break;case"ArrowUp":this.menu.keyboardDirection==="horizontal"?this.toggleSubMenu()||this.closeMenu(!0):this.focusOnPreviousTabbableElement(),this.stopEvent(e);break;case"Escape":this.closeMenu(!0),this.stopEvent(e);break;case"Home":this.focusOnNextTabbableElement(this.menu),this.stopEvent(e);break;case"End":this.focusOnPreviousTabbableElement(this.menu),this.stopEvent(e);break}}findSubmenu(){let e=u(this.menu);if(e){let t=e.nextElementSibling;if(t&&t.element==="menu")return t}}};export{s as a};
+//# sourceMappingURL=chunk.MJWHJW22.js.map

package/dist/chunks/chunk.MJWHJW22.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/scw-menu/keyboard/scw-menu-keyboard.ts"],
+  "sourcesContent": ["import ScwMenu from '../ScwMenu';\n// import ScwMenuItem from '../scw-menu-item/scw-menu-item';\n// import {dispatchCustomEvent} from '../../utils/customEvents';\n// import ScwComponent from '../scw-component/scw-component';\nimport {emit, ScwEvents} from '../../utils/events/event';\nimport\n  focusOnTabbableElement,\n  {\n    findActiveMenuElement,\n  } from './keyboardElements';\nimport {ScwMenuDirections} from '../scw-menu-enums';\nimport ScwComponent from '../../scw-component/ScwComponent';\nimport {Components} from '../../utils/enums/Components';\n\n/**\n * ScwMenuKeyboard\n * manages all the keyboard events for ScwMenu\n */\nexport default class ScwMenuKeyboard {\n  /** menu to manage */\n  menu : ScwMenu;\n\n  /** list of elements that are tabbable */\n  tabbablelist = [\n    Components.menuItem,\n    Components.icon,\n    Components.link,\n    Components.button,\n    'BUTTON',\n    'A'\n  ];\n\n  /** list of elements that should be ignored */\n  ignorelist = ['scw-menu'];\n\n  /**\n  * constructor\n  * @param {ScwMenu} menu\n  */\n  constructor( menu: ScwMenu) {\n    this.menu = menu;\n    this.handleKeydown = this.handleKeydown.bind(this);\n    this.initKeyboard();\n    this.documentClickHandler = this.documentClickHandler.bind(this);\n    // TODO: capture all menuItems at beginning.\n  }\n\n  /**\n  * initialize keyboard event handling for ScwMenu\n  */\n  initKeyboard() {\n    this.menu.addEventListener('focusin', (evt) => {\n      if (evt.target === this.menu) {\n        this.focusOnNextTabbableElement(this.menu);\n      }\n      // take menu out of tab index so we can tab out smoothly\n      this.menu.setAttribute('tabindex', '-1');\n      emit(\n        ScwEvents.appModeOn,\n        this.menu,\n      );\n      if (this.menu.isSubMenu()) {\n        document.addEventListener('click', this.documentClickHandler );\n      }\n    });\n\n    this.menu.addEventListener('focusout', (evt) => {\n      if ( // don't matter if it is still within menu\n        evt.relatedTarget &&\n        this.menu.contains( evt.relatedTarget as unknown as HTMLElement)\n      ) {\n        return;\n      }\n      this.menu.setAttribute('tabindex', '0');\n\n      emit(\n        ScwEvents.appModeOff,\n        this.menu,\n      );\n    });\n\n    this.menu.addEventListener('keydown', (evt: KeyboardEvent) => {\n      this.handleKeydown(evt);\n    });\n\n    this.menu.addEventListener('click', (evt: MouseEvent) => {\n      this.clickHandler(evt);\n    })\n  }\n\n  /** close menu if clicked anywhere but menu */\n  documentClickHandler(evt: MouseEvent) {\n    const target = evt.target as unknown as HTMLElement;\n    if (!this.menu.contains(target)) {\n      this.closeMenu();\n    }\n  }\n\n  /** closes menu if it is a submenu */\n  closeMenu(doFocus = false) {\n    if (this.menu.isSubMenu()) {\n      document.removeEventListener('click', this.documentClickHandler );\n      this.menu.ariaHidden = 'true';\n      this.menu.setAttribute('aria-hidden', 'true');\n\n      if (doFocus) {\n        const menuItem =\n          this.menu.previousElementSibling as unknown as ScwComponent;\n        if (\n          menuItem && menuItem.element === Components.menuItem\n        ) {\n          menuItem.focus();\n        }\n      }\n    }\n  }\n\n  /** handle clicks within the menu */\n  clickHandler(evt : MouseEvent) {\n    const target = evt.target as unknown as ScwComponent;\n    if (target && target.element === Components.menuItem) {\n      target.focus();\n      this.toggleSubMenu();\n    }\n  }\n\n  /** opens/closes submenu if there is one */\n  toggleSubMenu() : boolean {\n    const subMenu = this.findSubmenu();\n    if (subMenu) {\n      if (subMenu.ariaHidden === 'false') {\n        subMenu.ariaHidden = 'true';\n        subMenu.setAttribute('aria-hidden', 'true');\n      }else{\n        subMenu.ariaHidden = 'false';\n        subMenu.setAttribute('aria-hidden', 'false');\n        setTimeout(() => {\n          subMenu.focus();\n        },0);\n      }\n      return true;\n    }\n    return false;\n  }\n\n  /**\n  * Focus on the next tabbable element\n  * @param {HTMLElement} ele\n  */\n  focusOnNextTabbableElement(ele?: HTMLElement) {\n    focusOnTabbableElement( this.menu, ele, 'forwards' );\n  }\n\n  /**\n  * Focus on the previous tabbable element\n  * @param {HTMLElement} ele\n  */\n  focusOnPreviousTabbableElement(ele?: HTMLElement) {\n    focusOnTabbableElement( this.menu, ele, 'backwards' );\n  }\n\n  /**\n  * Fully stops event\n  * @param {KeyboardEvent} evt\n  */\n  stopEvent(evt: Event) {\n    evt.stopPropagation();\n    evt.preventDefault();\n  }\n\n  /**\n  * Handle keyboard down events\n  * @param {KeyboardEvent} evt\n  */\n  handleKeydown(evt : KeyboardEvent) {\n    // figure out extents of Tab\n    if (\n      this.menu.isSubMenu() &&\n      evt.key === 'Tab'\n    ) {\n      if (evt.shiftKey) {// backwards....\n        // const prevTabbable = findPrevTabbableEle( this.menu );\n        // if (!prevTabbable) this.closeMenu();\n        this.focusOnPreviousTabbableElement();\n        this.stopEvent(evt);\n        return;\n      } else {\n        // const nextTabbable = findNextTabbableEle( this.menu );\n        // if (!nextTabbable) this.closeMenu();\n        this.focusOnNextTabbableElement();\n        this.stopEvent(evt);\n        return;\n      }\n    }\n\n    // Otherwise look for keys\n    switch (evt.key) {\n      case 'ArrowRight':\n        if (\n          this.menu.keyboardDirection === ScwMenuDirections.vertical\n        ) {\n          this.toggleSubMenu();\n        }else{ // horizontal, either\n          this.focusOnNextTabbableElement();\n        }\n        this.stopEvent(evt);\n        break;\n      case 'ArrowDown':\n        if (\n          this.menu.keyboardDirection === ScwMenuDirections.horizontal\n        ) {\n          this.toggleSubMenu();\n        }else{ // vertical, either\n          this.focusOnNextTabbableElement();\n        }\n        this.stopEvent(evt);\n        break;\n      case 'ArrowLeft':\n        if (\n          this.menu.keyboardDirection === ScwMenuDirections.vertical\n        ) {\n          if ( !this.toggleSubMenu() ) {\n            this.closeMenu(true);\n          }\n        }else{ // horizontal, either\n          this.focusOnPreviousTabbableElement();\n        }\n        this.stopEvent(evt);\n        break;\n      case 'ArrowUp':\n        if (\n          this.menu.keyboardDirection === ScwMenuDirections.horizontal\n        ) {\n          if ( !this.toggleSubMenu() ) {\n            this.closeMenu(true);\n          }\n        }else{ // horizontal, either\n          this.focusOnPreviousTabbableElement();\n        }\n        this.stopEvent(evt);\n        break;\n      case 'Escape':\n        this.closeMenu(true);\n        this.stopEvent(evt);\n        break;\n      case 'Home':\n        this.focusOnNextTabbableElement(this.menu);\n        this.stopEvent(evt);\n        break;\n      case 'End':\n        this.focusOnPreviousTabbableElement(this.menu);\n        this.stopEvent(evt);\n        break;\n    }\n  }\n\n  /**\n  * find the submenu of the focused ScwMenuItem\n  * @return {ScwMenu | undefined}\n  */\n   findSubmenu() : ScwMenu | undefined {\n    const focusedElement = findActiveMenuElement(this.menu);\n    if (focusedElement) {\n      const nextSibling =\n      focusedElement.nextElementSibling;\n      if ( nextSibling && nextSibling['element'] === Components.menu ) {\n        return nextSibling as unknown as ScwMenu;\n      }\n    }\n    return undefined;\n  }\n}\n\n\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/chunks/chunk.MKOFAM43.js

@@ -0,0 +1,2 @@
+import{b as f}from"./chunk.HI65WFA7.js";function t(i="-"){return f&&f.suffix?`${i}${f.suffix}`:""}export{t as a};
+//# sourceMappingURL=chunk.MKOFAM43.js.map

package/dist/chunks/chunk.MKOFAM43.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/utils/suffix.ts"],
+  "sourcesContent": ["import {config} from '../scw';\n\n/**\n * Pulls suffix from global design system config with some formatting options\n * @param {string} connector\n * @return {string}\n */\nexport default function getSuffix(connector: string = '-') {\n  return config ? config.suffix ? `${connector}${config.suffix}` : '' : '';\n}\n\n"],
+  "mappings": "wCAOe,WAAmB,EAAoB,IAAK,CACzD,MAAO,IAAS,EAAO,OAAS,GAAG,IAAY,EAAO,SAAgB,EACxE",
+  "names": []
+}

package/dist/chunks/{chunk.6OM5IIEW.js → chunk.MQTGIDRC.js}

@@ -14,4 +14,4 @@ import{a as f}from"./chunk.5HZ4WTGH.js";import{c as u,e as w,f as d}from"./chunk
  * Copyright 2020 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-//# sourceMappingURL=chunk.6OM5IIEW.js.map
+//# sourceMappingURL=chunk.MQTGIDRC.js.map

package/dist/chunks/chunk.MRNM52B5.js

@@ -0,0 +1,2 @@
+import{a as e}from"./chunk.6HYQUXMC.js";customElements.define("scw-image",e);
+//# sourceMappingURL=chunk.MRNM52B5.js.map

package/dist/chunks/chunk.MRNM52B5.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/scw-image/scw-image.ts"],
+  "sourcesContent": ["import ScwImage from './ScwImage.js';\ncustomElements.define('scw-image', ScwImage );\n"],
+  "mappings": "wCACA,eAAe,OAAO,YAAa,CAAS",
+  "names": []
+}

package/dist/chunks/chunk.MSCFVBTX.js

@@ -0,0 +1,209 @@
+import{a as n}from"./chunk.MOWV5A2M.js";import{a}from"./chunk.VHQITBU3.js";import{a as e,b as s}from"./chunk.6ITKITRF.js";import{a as o}from"./chunk.ZS4C3T6Z.js";import{g as r}from"./chunk.5YJY6NT6.js";var c=e`
+:host([design=main]) {
+  outline: none;
+  background-color: rgba(0, 0, 0, 0);
+  padding-left: var(--scw-spacing-1);
+  padding-right: var(--scw-spacing-1);
+  padding-top: calc(var(--scw-spacing-1) * 0.8);
+  padding-bottom: var(--scw-spacing-1);
+  display: inline-flex;
+}
+:host([design=main]) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-bold-condensed-07-font);
+  color: var(--scw-color-grey-02);
+}
+
+:host([design=main]:focus-visible) {
+  background-color: var(--scw-color-grey-10);
+  border-radius: 4px 4px 4px 4px;
+  box-shadow: var(--scw-effect-focus-shadow);
+  padding-left: var(--scw-spacing-1);
+  padding-right: var(--scw-spacing-1);
+  padding-top: calc(var(--scw-spacing-1) * 0.8);
+  padding-bottom: var(--scw-spacing-1);
+}
+:host([design=main]:focus-visible) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-bold-condensed-07-font);
+  color: var(--scw-color-grey-02);
+}
+
+:host([design=main]:hover) {
+  background-color: rgba(0, 0, 0, 0);
+  padding-left: var(--scw-spacing-1);
+  padding-right: var(--scw-spacing-1);
+  padding-top: calc(var(--scw-spacing-1) * 0.8);
+  padding-bottom: var(--scw-spacing-1);
+  cursor: pointer;
+}
+:host([design=main]:hover) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-bold-condensed-07-font);
+  color: var(--scw-color-03, var(--scw-color-primary-03));
+}
+
+:host([design=main][aria-selected=true]) {
+  background-color: rgba(0, 0, 0, 0);
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: flex-start;
+  align-items: flex-start;
+  padding-left: var(--scw-spacing-1);
+  padding-right: var(--scw-spacing-1);
+  padding-top: calc(var(--scw-spacing-1) * 0.8);
+  padding-bottom: 0px;
+}
+:host([design=main][aria-selected=true]) > *:not(:last-child) {
+  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
+  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
+}
+:host([design=main][aria-selected=true]) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-bold-condensed-07-font);
+  color: var(--scw-color-grey-02);
+  align-self: stretch;
+  flex: 1;
+}
+:host([design=main][aria-selected=true]) .selected {
+  background-color: var(--scw-color-03, var(--scw-color-primary-03));
+  align-self: stretch;
+  height: 2px;
+}
+
+:host([design=main][aria-disabled=true]) {
+  background-color: rgba(0, 0, 0, 0);
+  padding-left: var(--scw-spacing-1);
+  padding-right: var(--scw-spacing-1);
+  padding-top: calc(var(--scw-spacing-1) * 0.8);
+  padding-bottom: var(--scw-spacing-1);
+  cursor: auto;
+  pointer-events: none;
+}
+:host([design=main][aria-disabled=true]) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-bold-condensed-07-font);
+  color: var(--scw-color-grey-08);
+}
+:host([design=main][aria-disabled=true]) .icon svg {
+  fill: var(--scw-color-grey-08);
+}
+:host([design=main][aria-disabled=true]) .icon svg * {
+  fill: var(--scw-color-grey-08);
+}
+
+:host([design=utility]) {
+  outline: none;
+  user-select: none;
+  background-color: rgba(0, 0, 0, 0);
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: flex-start;
+  align-items: center;
+  padding-left: var(--scw-spacing-1);
+  padding-right: var(--scw-spacing-1);
+  padding-top: 0px;
+  padding-bottom: 0px;
+  display: inline-flex;
+}
+:host([design=utility]) > *:not(:last-child) {
+  margin-right: calc(var(--scw-spacing-1) * 0.4);
+  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
+}
+:host([design=utility]) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-font);
+  color: var(--scw-color-grey-02);
+  min-height: 19px;
+}
+:host([design=utility]) .icon {
+  width: 24px;
+  height: 24px;
+}
+:host([design=utility]) .icon svg {
+  box-sizing: border-box;
+  vertical-align: top;
+  width: 100%;
+  height: 100%;
+  fill: var(--scw-color-grey-02);
+}
+:host([design=utility]) .icon svg * {
+  fill: var(--scw-color-grey-02);
+}
+
+:host([design=utility]:focus-visible) {
+  background-color: var(--scw-color-grey-10);
+  border-radius: 4px 4px 4px 4px;
+  box-shadow: var(--scw-effect-focus-shadow);
+}
+:host([design=utility]:focus-visible) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-font);
+  color: var(--scw-color-grey-02);
+}
+:host([design=utility]:focus-visible) .icon svg {
+  fill: var(--scw-color-grey-02);
+}
+:host([design=utility]:focus-visible) .icon svg * {
+  fill: var(--scw-color-grey-02);
+}
+
+:host([design=utility]:hover) {
+  background-color: rgba(0, 0, 0, 0);
+  cursor: pointer;
+}
+:host([design=utility]:hover) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-font);
+  color: var(--scw-color-03, var(--scw-color-primary-03));
+}
+:host([design=utility]:hover) .icon svg {
+  fill: var(--scw-color-primary-03);
+}
+:host([design=utility]:hover) .icon svg * {
+  fill: var(--scw-color-primary-03);
+}
+
+:host([design=utility][aria-selected=true]) {
+  background-color: rgba(0, 0, 0, 0);
+  cursor: pointer;
+}
+:host([design=utility][aria-selected=true]) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-font);
+  color: var(--scw-color-03, var(--scw-color-primary-03));
+}
+:host([design=utility][aria-selected=true]) .icon svg {
+  fill: var(--scw-color-primary-03);
+}
+:host([design=utility][aria-selected=true]) .icon svg * {
+  fill: var(--scw-color-primary-03);
+}
+
+:host([design=utility][aria-disabled=true]) {
+  cursor: auto;
+  pointer-events: none;
+  background-color: rgba(0, 0, 0, 0);
+}
+:host([design=utility][aria-disabled=true]) .label {
+  text-align: LEFT;
+  font: var(--scw-type-text-font);
+  color: var(--scw-color-grey-07);
+}
+:host([design=utility][aria-disabled=true]) .icon svg {
+  fill: var(--scw-color-grey-07);
+}
+:host([design=utility][aria-disabled=true]) .icon svg * {
+  fill: var(--scw-color-grey-07);
+}
+
+:host {
+  white-space: nowrap;
+}
+:host .label {
+  white-space: nowrap;
+}`;var t=class extends a{constructor(){super();this.ariaSelected="false";this.element="menu-item",this.setAttribute("role","menuitem")}static get styles(){return[super.styles,c]}hasPopup(){let i=this.nextElementSibling;return!!(i&&i.nodeName.indexOf("SCW-MENU")===0)}doShowIcon(){return!!(super.doShowIcon()&&this.design!=="main")}validDesigns(){return{...super.validDesigns(),...n}}connectedCallback(){super.connectedCallback(),this.hasPopup()&&this.setAttribute("aria-haspopup","true")}render(){return this.design==="main"&&this.ariaSelected==="true"?(this.setAttribute("aria-current","page"),o`
+          <div>${super.render()}</div>
+          <div class="selected"></div>
+        `):(this.removeAttribute("aria-current"),super.render())}};r([s({type:String,attribute:"aria-selected"})],t.prototype,"ariaSelected",2);export{t as a};
+//# sourceMappingURL=chunk.MSCFVBTX.js.map

package/dist/chunks/chunk.MSCFVBTX.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["sass-plugin-0:/Users/scottrouse/Workspace/scu-design-system-mono/scu-web-components/src/scw-menu-item/scss/scw-menu-item.scss", "../../src/scw-menu-item/ScwMenuItem.ts"],
+  "sourcesContent": ["import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=main]) {\n  outline: none;\n  background-color: rgba(0, 0, 0, 0);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n  display: inline-flex;\n}\n:host([design=main]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-02);\n}\n\n:host([design=main]:focus-visible) {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 4px 4px 4px 4px;\n  box-shadow: var(--scw-effect-focus-shadow);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n}\n:host([design=main]:focus-visible) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-02);\n}\n\n:host([design=main]:hover) {\n  background-color: rgba(0, 0, 0, 0);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n  cursor: pointer;\n}\n:host([design=main]:hover) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n}\n\n:host([design=main][aria-selected=true]) {\n  background-color: rgba(0, 0, 0, 0);\n  display: flex;\n  flex-flow: column nowrap;\n  justify-content: flex-start;\n  align-items: flex-start;\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: 0px;\n}\n:host([design=main][aria-selected=true]) > *:not(:last-child) {\n  margin-bottom: calc(var(--scw-spacing-1) * 0.8);\n  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );\n}\n:host([design=main][aria-selected=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-02);\n  align-self: stretch;\n  flex: 1;\n}\n:host([design=main][aria-selected=true]) .selected {\n  background-color: var(--scw-color-03, var(--scw-color-primary-03));\n  align-self: stretch;\n  height: 2px;\n}\n\n:host([design=main][aria-disabled=true]) {\n  background-color: rgba(0, 0, 0, 0);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n  cursor: auto;\n  pointer-events: none;\n}\n:host([design=main][aria-disabled=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-08);\n}\n:host([design=main][aria-disabled=true]) .icon svg {\n  fill: var(--scw-color-grey-08);\n}\n:host([design=main][aria-disabled=true]) .icon svg * {\n  fill: var(--scw-color-grey-08);\n}\n\n:host([design=utility]) {\n  outline: none;\n  user-select: none;\n  background-color: rgba(0, 0, 0, 0);\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: flex-start;\n  align-items: center;\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: 0px;\n  padding-bottom: 0px;\n  display: inline-flex;\n}\n:host([design=utility]) > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n:host([design=utility]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-02);\n  min-height: 19px;\n}\n:host([design=utility]) .icon {\n  width: 24px;\n  height: 24px;\n}\n:host([design=utility]) .icon svg {\n  box-sizing: border-box;\n  vertical-align: top;\n  width: 100%;\n  height: 100%;\n  fill: var(--scw-color-grey-02);\n}\n:host([design=utility]) .icon svg * {\n  fill: var(--scw-color-grey-02);\n}\n\n:host([design=utility]:focus-visible) {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 4px 4px 4px 4px;\n  box-shadow: var(--scw-effect-focus-shadow);\n}\n:host([design=utility]:focus-visible) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-02);\n}\n:host([design=utility]:focus-visible) .icon svg {\n  fill: var(--scw-color-grey-02);\n}\n:host([design=utility]:focus-visible) .icon svg * {\n  fill: var(--scw-color-grey-02);\n}\n\n:host([design=utility]:hover) {\n  background-color: rgba(0, 0, 0, 0);\n  cursor: pointer;\n}\n:host([design=utility]:hover) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n}\n:host([design=utility]:hover) .icon svg {\n  fill: var(--scw-color-primary-03);\n}\n:host([design=utility]:hover) .icon svg * {\n  fill: var(--scw-color-primary-03);\n}\n\n:host([design=utility][aria-selected=true]) {\n  background-color: rgba(0, 0, 0, 0);\n  cursor: pointer;\n}\n:host([design=utility][aria-selected=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n}\n:host([design=utility][aria-selected=true]) .icon svg {\n  fill: var(--scw-color-primary-03);\n}\n:host([design=utility][aria-selected=true]) .icon svg * {\n  fill: var(--scw-color-primary-03);\n}\n\n:host([design=utility][aria-disabled=true]) {\n  cursor: auto;\n  pointer-events: none;\n  background-color: rgba(0, 0, 0, 0);\n}\n:host([design=utility][aria-disabled=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-07);\n}\n:host([design=utility][aria-disabled=true]) .icon svg {\n  fill: var(--scw-color-grey-07);\n}\n:host([design=utility][aria-disabled=true]) .icon svg * {\n  fill: var(--scw-color-grey-07);\n}\n\n:host {\n  white-space: nowrap;\n}\n:host .label {\n  white-space: nowrap;\n}`;\n", "import {html} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport ScwLink from '../scw-link/ScwLink';\nimport styles from './scss/scw-menu-item.scss';\nimport {ScwMenuItemDesigns} from './scw-menu-item-enums';\nimport {Components} from '../utils/enums/Components';\n\n/**\n * ScwMenuItem\n * @class\n * @tag scw-menu-item\n *\n * @slot [default=\"<a href target />\"]\n    (OPTIONAL) anchor (for SEO) will determine the label, href, and target.\n * @slot [default=\"<... />\"]\n    (OPTIONAL) random content (paired with design=\"plain\") will wrap that\n    content with a link.\n */\nexport default class ScwMenuItem extends ScwLink {\n  // ============== ScwMenuItem ================================================\n  /**\n  * (ScwMenuItem) selected state\n  * @type {Boolean}\n  */\n  @property({type: String, attribute: 'aria-selected'})\n    ariaSelected = 'false';\n\n  /**\n  * extending styles from ScwLink\n  * https://stackoverflow.com/questions/60266303/\n  *  how-to-extend-and-style-existing-litelements\n  */\n   static get styles() {\n     return [\n       super.styles,\n       styles,\n     ];\n   }\n\n  /**\n  * Constructor\n  */\n   constructor() {\n     super();\n     this.element = Components.menuItem;\n     this.setAttribute('role', 'menuitem');\n   }\n\n  /**\n   * determines if this menu item has a sub menu\n   * @return {boolean}\n   */\n  hasPopup() {\n    const next = this.nextElementSibling;\n    // if (next && next['element'] === Components.menu ) {\n    // the component may not be initialized yet...\n    if (next && next.nodeName.indexOf('SCW-MENU') === 0 ) {\n      return true;\n    }\n    return false;\n  }\n\n  /**\n  * Way to extend valid design icon types...\n  * @return {boolean}\n  */\n  doShowIcon() : boolean {\n    const superDoShowIcon = super.doShowIcon();\n    if ( superDoShowIcon &&\n    this.design !== ScwMenuItemDesigns.main\n    ) {\n      return true;\n    }\n    return false;\n  }\n\n  /**\n  * Way to extend valid design types...\n  * @return {object} object of valid designs relative to this object\n  */\n  validDesigns() : object {\n    return {\n      ...super.validDesigns(),\n      ...ScwMenuItemDesigns,\n    };\n  }\n\n  /** connectedCallback */\n  connectedCallback(): void {\n    super.connectedCallback();\n    if (this.hasPopup() ) {\n      this.setAttribute( 'aria-haspopup', 'true' );\n    }\n  }\n\n  /**\n  *\n  * @return {object}\n  */\n  render(): object {\n    if (\n      this.design === ScwMenuItemDesigns.main &&\n      this.ariaSelected === 'true'\n    ) {\n       this.setAttribute( 'aria-current', 'page' );\n       // protect initial flex-v...a link with icons is flex-h\n       return html`\n          <div>${super.render()}</div>\n          <div class=\"selected\"></div>\n        `;\n    } else {\n        this.removeAttribute( 'aria-current' );\n       return super.render();\n    }\n  }\n}\n"],
+  "mappings": "0MACA,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCiBf,mBAAyC,EAAQ,CAwB9C,aAAc,CACZ,MAAM,EAlBP,kBAAe,QAmBd,KAAK,QAAU,YACf,KAAK,aAAa,OAAQ,UAAU,CACtC,WAdW,SAAS,CAClB,MAAO,CACL,MAAM,OACN,CACF,CACF,CAeD,UAAW,CACT,GAAM,GAAO,KAAK,mBAGlB,MAAI,MAAQ,EAAK,SAAS,QAAQ,UAAU,IAAM,EAIpD,CAMA,YAAuB,CAErB,MAAK,GADmB,MAAM,WAAW,GAEzC,KAAK,SAAW,OAKlB,CAMA,cAAwB,CACtB,MAAO,IACF,MAAM,aAAa,KACnB,CACL,CACF,CAGA,mBAA0B,CACxB,MAAM,kBAAkB,EACpB,KAAK,SAAS,GAChB,KAAK,aAAc,gBAAiB,MAAO,CAE/C,CAMA,QAAiB,CACf,MACE,MAAK,SAAW,QAChB,KAAK,eAAiB,OAErB,MAAK,aAAc,eAAgB,MAAO,EAEnC;AAAA,iBACG,MAAM,OAAO;AAAA;AAAA,WAItB,MAAK,gBAAiB,cAAe,EAC/B,MAAM,OAAO,EAEzB,CACF,EA1FI,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,UAAW,eAAe,CAAC,GAClD,AAPJ,EAOI",
+  "names": []
+}