@esri/calcite-components 2.7.0-next.0 → 2.7.0-next.2

package/dist/cjs/calcite-link.cjs.entry.js

@@ -1,21 +1,21 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.7.0-next.0
+ * v2.7.0-next.2
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-09605837.js');
-const dom = require('./dom-35288c97.js');
-const interactive = require('./interactive-58c8ad9f.js');
-const loadable = require('./loadable-3d7864f3.js');
-const resources = require('./resources-0abc8fc5.js');
-require('./guid-7d605ea0.js');
-require('./browser-5998a98d.js');
+const index = require('./index-40af9578.js');
+const dom = require('./dom-7116db33.js');
+const interactive = require('./interactive-1f555295.js');
+const loadable = require('./loadable-ff9a81a2.js');
+const resources = require('./resources-97969be5.js');
+require('./guid-92f7ac37.js');
+require('./browser-90556b83.js');
 
-const linkCss = ":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline}:host a,:host span{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:0px;border-style:none;font-family:inherit;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;text-decoration:none;line-height:inherit;font-size:inherit;-webkit-appearance:none}:host a:hover,:host span:hover{text-decoration:none}:host a,:host span{outline-color:transparent}:host a:focus,:host span:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite-color-brand)));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}calcite-icon{inline-size:1em;block-size:1em;min-inline-size:unset;min-block-size:unset}.calcite-link--icon{vertical-align:middle;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;margin-block-start:-0.25em}:host .calcite-link--icon.icon-start{margin-inline-end:0.5rem}:host .calcite-link--icon.icon-end{margin-inline-start:0.5rem}:host span,:host a{position:relative;display:inline;border-style:none;background-color:transparent;padding:0px;color:var(--calcite-color-text-link);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;line-height:inherit;white-space:initial;background-image:linear-gradient(currentColor, currentColor), linear-gradient(var(--calcite-color-brand-underline), var(--calcite-color-brand-underline));background-position-x:0%, 100%;background-position-y:min(1.5em, 100%);background-repeat:no-repeat, no-repeat;background-size:0% 1px, 100% 1px}:host span:hover,:host span:focus,:host a:hover,:host a:focus{background-size:100% 1px, 100% 1px}:host span:active,:host a:active{background-size:100% 2px, 100% 2px}:host span.calcite--rtl,:host a.calcite--rtl{background-position:100% 100%, 100% 100%}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";
+const linkCss = ":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline}:host a,:host span{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:0px;border-style:none;font-family:inherit;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;text-decoration:none;line-height:inherit;font-size:inherit;-webkit-appearance:none}:host a:hover,:host span:hover{text-decoration:none}:host a,:host span{outline-color:transparent}:host a:focus,:host span:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite-color-brand)));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}calcite-icon{inline-size:1em;block-size:1em;min-inline-size:unset;min-block-size:unset}.calcite-link--icon{vertical-align:middle;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;margin-block-start:-0.25em}:host .calcite-link--icon.icon-start{margin-inline-end:0.5rem}:host .calcite-link--icon.icon-end{margin-inline-start:0.5rem}:host span,:host a{position:relative;display:inline;border-style:none;background-color:transparent;padding:0px;color:var(--calcite-color-text-link);transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;line-height:inherit;white-space:initial;background-image:linear-gradient(currentColor, currentColor), linear-gradient(var(--calcite-color-brand-underline), var(--calcite-color-brand-underline));background-position-x:0%, 100%;background-position-y:min(1.5em, 100%);background-repeat:no-repeat, no-repeat;background-size:0% 1px, 100% 1px}:host span:hover,:host span:focus,:host a:hover,:host a:focus{background-size:100% 1px, 100% 1px}:host span:active,:host a:active{background-size:100% 2px, 100% 2px}:host span.calcite--rtl,:host a.calcite--rtl{background-position:100% 100%, 100% 100%}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Link = class {
     constructor(hostRef) {

package/dist/cjs/calcite-link.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"calcite-link.entry.cjs.js","mappings":";;;;;;;;;;;;;;;;;AAAA,MAAM,OAAO,GAAG,k4EAAk4E;;MC4Br4E,IAAI;;;QA8JP,wBAAmB,GAAG,CAAC,KAAmB;YAChD,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;;gBAEpB,KAAK,CAAC,eAAe,EAAE,CAAC;aACzB;SACF,CAAC;;;;;;QAQM,gBAAW,GAAG,CAAC,EAAmB;YACxC,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;SACnB,CAAC;wBArKkC,KAAK;wBAOa,KAAK;;;;;;;;;;;;;IA0B3D,iBAAiB;QACfA,8BAAkB,CAAC,IAAI,CAAC,CAAC;KAC1B;IAED,iBAAiB;QACfC,+BAAsB,CAAC,IAAI,CAAC,CAAC;KAC9B;IAED,gBAAgB;QACdC,2BAAkB,CAAC,IAAI,CAAC,CAAC;KAC1B;IAED,kBAAkB;QAChBC,iCAAqB,CAAC,IAAI,CAAC,CAAC;KAC7B;IAED,oBAAoB;QAClBC,iCAAqB,CAAC,IAAI,CAAC,CAAC;KAC7B;IAED,MAAM;QACJ,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAE,GAAG,IAAI,CAAC;QAC9B,MAAM,GAAG,GAAGC,iBAAa,CAAC,EAAE,CAAC,CAAC;QAC9B,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,GAAG,GAAG,GAAG,MAAM,CAAC;QAC7C,MAAM,WAAW,IACfC,0BACE,KAAK,EAAC,+BAA+B,EACrC,OAAO,EAAE,IAAI,CAAC,WAAW,KAAK,OAAO,IAAI,IAAI,CAAC,WAAW,KAAK,MAAM,EACpE,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,KAAK,EAAC,GAAG,GACT,CACH,CAAC;QAEF,MAAM,SAAS,IACbA,0BACE,KAAK,EAAC,6BAA6B,EACnC,OAAO,EAAE,IAAI,CAAC,WAAW,KAAK,KAAK,IAAI,IAAI,CAAC,WAAW,KAAK,MAAM,EAClE,IAAI,EAAE,IAAI,CAAC,OAAO,EAClB,KAAK,EAAC,GAAG,GACT,CACH,CAAC;QAEF,MAAM,GAAG,GAAG,WAAW,CAAC;QACxB,MAAM,IAAI,GAAG,WAAW,KAAK,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;QACpD,MAAM,QAAQ,GAAG,WAAW,KAAK,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC;QAEnD,QACEA,QAACC,UAAI,IAAC,IAAI,EAAC,cAAc,IACvBD,QAACE,gCAAoB,IAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAC3CF,QAAC,GAAG,IACF,KAAK,EAAE,EAAE,CAACG,qBAAW,CAAC,GAAG,GAAG,GAAG,KAAK,KAAK,EAAE;;;;;YAK3C,QAAQ,EAAE,GAAG,KAAK,GAAG,KAAK,QAAQ,KAAK,EAAE,IAAI,QAAQ,CAAC,GAAG,QAAQ,GAAG,IAAI,EACxE,IAAI,EAAE,GAAG,KAAK,GAAG,IAAI,IAAI,CAAC,IAAI,EAC9B,OAAO,EAAE,IAAI,CAAC,mBAAmB,EACjC,GAAG,EAAE,GAAG,KAAK,GAAG,IAAI,IAAI,CAAC,GAAG,EAC5B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,GAAG,KAAK,GAAG,IAAI,IAAI,CAAC,MAAM;;YAElC,GAAG,EAAE,IAAI,CAAC,WAAW,IAEpB,IAAI,CAAC,SAAS,GAAG,WAAW,GAAG,IAAI,EACpCH,qBAAQ,EACP,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,IAAI,CAC5B,CACe,CAClB,EACP;KACH;;;;;;IASD,YAAY,CAAC,KAAmB;QAC9B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;;QAGD,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;YACpB,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SACtB;KACF;;;;;;;IAUD,MAAM,QAAQ;QACZ,MAAMI,2BAAkB,CAAC,IAAI,CAAC,CAAC;QAE/BC,gBAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KAC5B;;;;;;;","names":["connectInteractive","setUpLoadableComponent","setComponentLoaded","updateHostInteraction","disconnectInteractive","getElementDir","h","Host","InteractiveContainer","CSS_UTILITY","componentFocusable","focusElement"],"sources":["src/components/link/link.scss?tag=calcite-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":[":host {\n  display: inline;\n}\n\n// link base\n:host a,\n:host span {\n  @apply font-inherit\n    transition-default\n    relative\n    flex\n    cursor-pointer\n    items-center\n    justify-center\n    rounded-none\n    border-none;\n  text-decoration: none;\n  line-height: inherit;\n  font-size: inherit;\n  -webkit-appearance: none;\n  &:hover {\n    text-decoration: none;\n  }\n}\n\n// focus styles\n:host a,\n:host span {\n  @apply focus-base;\n  &:focus {\n    @apply focus-outset;\n  }\n}\n\ncalcite-icon {\n  inline-size: 1em;\n  block-size: 1em;\n  min-inline-size: unset;\n  min-block-size: unset;\n}\n\n.calcite-link--icon {\n  @apply transition-default align-middle;\n  margin-block-start: -0.25em;\n}\n\n// icon positioning and styles\n:host .calcite-link--icon.icon-start {\n  margin-inline-end: theme(\"margin.2\");\n}\n\n:host .calcite-link--icon.icon-end {\n  margin-inline-start: theme(\"margin.2\");\n}\n\n:host {\n  span,\n  a {\n    @apply text-color-link\n      transition-default\n      relative\n      inline\n      border-none\n      bg-transparent\n      p-0;\n    line-height: inherit;\n    white-space: initial;\n    background-image: linear-gradient(currentColor, currentColor),\n      linear-gradient(var(--calcite-color-brand-underline), var(--calcite-color-brand-underline));\n    background-position-x: 0%, 100%;\n    background-position-y: min(1.5em, 100%);\n    background-repeat: no-repeat, no-repeat;\n    background-size:\n      0% 1px,\n      100% 1px;\n\n    &:hover,\n    &:focus {\n      background-size:\n        100% 1px,\n        100% 1px;\n    }\n    &:active {\n      background-size:\n        100% 2px,\n        100% 2px;\n    }\n    &.calcite--rtl {\n      background-position:\n        100% 100%,\n        100% 100%;\n    }\n  }\n}\n\n@include disabled();\n@include base-component();\n","import { Component, Element, h, Host, Listen, Method, Prop, VNode } from \"@stencil/core\";\nimport { focusElement, getElementDir } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { CSS_UTILITY } from \"../../utils/resources\";\nimport { FlipContext } from \"../interfaces\";\n\n/** Any attributes placed on <calcite-link> component will propagate to the rendered child */\n/** Passing a 'href' will render an anchor link, instead of a span. Role will be set to link, or link, depending on this. */\n/** It is the consumers responsibility to add aria information, rel, target, for links, and any link attributes for form submission */\n\n/** @slot - A slot for adding text. */\n@Component({\n  tag: \"calcite-link\",\n  styleUrl: \"link.scss\",\n  shadow: true,\n})\nexport class Link implements InteractiveComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Prompts the user to save the linked URL instead of navigating to it. Can be used with or without a value:\n   * Without a value, the browser will suggest a filename/extension\n   * See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download.\n   */\n  @Prop({ reflect: true }) download: string | boolean = false;\n\n  /** Specifies the URL of the linked resource, which can be set as an absolute or relative path. */\n  @Prop({ reflect: true }) href: string;\n\n  /** Specifies an icon to display at the end of the component. */\n  @Prop({ reflect: true }) iconEnd: string;\n\n  /** Displays the `iconStart` and/or `iconEnd` as flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl: FlipContext;\n\n  /** Specifies an icon to display at the start of the component. */\n  @Prop({ reflect: true }) iconStart: string;\n\n  /** Specifies the relationship to the linked document defined in `href`. */\n  @Prop() rel: string;\n\n  /** Specifies the frame or window to open the linked document. */\n  @Prop() target: string;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n  }\n\n  render(): VNode {\n    const { download, el } = this;\n    const dir = getElementDir(el);\n    const childElType = this.href ? \"a\" : \"span\";\n    const iconStartEl = (\n      <calcite-icon\n        class=\"calcite-link--icon icon-start\"\n        flipRtl={this.iconFlipRtl === \"start\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconStart}\n        scale=\"s\"\n      />\n    );\n\n    const iconEndEl = (\n      <calcite-icon\n        class=\"calcite-link--icon icon-end\"\n        flipRtl={this.iconFlipRtl === \"end\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconEnd}\n        scale=\"s\"\n      />\n    );\n\n    const Tag = childElType;\n    const role = childElType === \"span\" ? \"link\" : null;\n    const tabIndex = childElType === \"span\" ? 0 : null;\n\n    return (\n      <Host role=\"presentation\">\n        <InteractiveContainer disabled={this.disabled}>\n          <Tag\n            class={{ [CSS_UTILITY.rtl]: dir === \"rtl\" }}\n            /*\n          When the 'download' property of type 'boolean | string' is set to true, the value is \"\".\n          This works around that issue for now.\n          */\n            download={Tag === \"a\" && (download === \"\" || download) ? download : null}\n            href={Tag === \"a\" && this.href}\n            onClick={this.childElClickHandler}\n            rel={Tag === \"a\" && this.rel}\n            role={role}\n            tabIndex={tabIndex}\n            target={Tag === \"a\" && this.target}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={this.storeTagRef}\n          >\n            {this.iconStart ? iconStartEl : null}\n            <slot />\n            {this.iconEnd ? iconEndEl : null}\n          </Tag>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"click\")\n  clickHandler(event: PointerEvent): void {\n    if (this.disabled) {\n      return;\n    }\n\n    // forwards the click() to the internal link for non user-initiated events\n    if (!event.isTrusted) {\n      this.childEl.click();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    focusElement(this.childEl);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteLinkElement;\n\n  /** the rendered child element */\n  private childEl: HTMLAnchorElement | HTMLSpanElement;\n\n  private childElClickHandler = (event: PointerEvent): void => {\n    if (!event.isTrusted) {\n      // click was invoked internally, we stop it here\n      event.stopPropagation();\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private storeTagRef = (el: Link[\"childEl\"]): void => {\n    this.childEl = el;\n  };\n}\n"],"version":3}
+{"file":"calcite-link.entry.cjs.js","mappings":"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","names":["connectInteractive","setUpLoadableComponent","setComponentLoaded","updateHostInteraction","disconnectInteractive","getElementDir","h","Host","InteractiveContainer","CSS_UTILITY","componentFocusable","focusElement"],"sources":["src/components/link/link.scss?tag=calcite-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":[":host {\n  display: inline;\n}\n\n// link base\n:host a,\n:host span {\n  @apply font-inherit\n    transition-default\n    relative\n    flex\n    cursor-pointer\n    items-center\n    justify-center\n    rounded-none\n    border-none;\n  text-decoration: none;\n  line-height: inherit;\n  font-size: inherit;\n  -webkit-appearance: none;\n  &:hover {\n    text-decoration: none;\n  }\n}\n\n// focus styles\n:host a,\n:host span {\n  @apply focus-base;\n  &:focus {\n    @apply focus-outset;\n  }\n}\n\ncalcite-icon {\n  inline-size: 1em;\n  block-size: 1em;\n  min-inline-size: unset;\n  min-block-size: unset;\n}\n\n.calcite-link--icon {\n  @apply transition-default align-middle;\n  margin-block-start: -0.25em;\n}\n\n// icon positioning and styles\n:host .calcite-link--icon.icon-start {\n  margin-inline-end: theme(\"margin.2\");\n}\n\n:host .calcite-link--icon.icon-end {\n  margin-inline-start: theme(\"margin.2\");\n}\n\n:host {\n  span,\n  a {\n    @apply text-color-link\n      transition-default\n      relative\n      inline\n      border-none\n      bg-transparent\n      p-0;\n    line-height: inherit;\n    white-space: initial;\n    background-image: linear-gradient(currentColor, currentColor),\n      linear-gradient(var(--calcite-color-brand-underline), var(--calcite-color-brand-underline));\n    background-position-x: 0%, 100%;\n    background-position-y: min(1.5em, 100%);\n    background-repeat: no-repeat, no-repeat;\n    background-size:\n      0% 1px,\n      100% 1px;\n\n    &:hover,\n    &:focus {\n      background-size:\n        100% 1px,\n        100% 1px;\n    }\n    &:active {\n      background-size:\n        100% 2px,\n        100% 2px;\n    }\n    &.calcite--rtl {\n      background-position:\n        100% 100%,\n        100% 100%;\n    }\n  }\n}\n\n@include disabled();\n@include base-component();\n","import { Component, Element, h, Host, Listen, Method, Prop, VNode } from \"@stencil/core\";\nimport { focusElement, getElementDir } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { CSS_UTILITY } from \"../../utils/resources\";\nimport { FlipContext } from \"../interfaces\";\n\n/** Any attributes placed on <calcite-link> component will propagate to the rendered child */\n/** Passing a 'href' will render an anchor link, instead of a span. Role will be set to link, or link, depending on this. */\n/** It is the consumers responsibility to add aria information, rel, target, for links, and any link attributes for form submission */\n\n/** @slot - A slot for adding text. */\n@Component({\n  tag: \"calcite-link\",\n  styleUrl: \"link.scss\",\n  shadow: true,\n})\nexport class Link implements InteractiveComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Prompts the user to save the linked URL instead of navigating to it. Can be used with or without a value:\n   * Without a value, the browser will suggest a filename/extension\n   * See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download.\n   */\n  @Prop({ reflect: true }) download: string | boolean = false;\n\n  /** Specifies the URL of the linked resource, which can be set as an absolute or relative path. */\n  @Prop({ reflect: true }) href: string;\n\n  /** Specifies an icon to display at the end of the component. */\n  @Prop({ reflect: true }) iconEnd: string;\n\n  /** Displays the `iconStart` and/or `iconEnd` as flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl: FlipContext;\n\n  /** Specifies an icon to display at the start of the component. */\n  @Prop({ reflect: true }) iconStart: string;\n\n  /** Specifies the relationship to the linked document defined in `href`. */\n  @Prop() rel: string;\n\n  /** Specifies the frame or window to open the linked document. */\n  @Prop() target: string;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n  }\n\n  render(): VNode {\n    const { download, el } = this;\n    const dir = getElementDir(el);\n    const childElType = this.href ? \"a\" : \"span\";\n    const iconStartEl = (\n      <calcite-icon\n        class=\"calcite-link--icon icon-start\"\n        flipRtl={this.iconFlipRtl === \"start\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconStart}\n        scale=\"s\"\n      />\n    );\n\n    const iconEndEl = (\n      <calcite-icon\n        class=\"calcite-link--icon icon-end\"\n        flipRtl={this.iconFlipRtl === \"end\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconEnd}\n        scale=\"s\"\n      />\n    );\n\n    const Tag = childElType;\n    const role = childElType === \"span\" ? \"link\" : null;\n    const tabIndex = childElType === \"span\" ? 0 : null;\n\n    return (\n      <Host role=\"presentation\">\n        <InteractiveContainer disabled={this.disabled}>\n          <Tag\n            class={{ [CSS_UTILITY.rtl]: dir === \"rtl\" }}\n            /*\n          When the 'download' property of type 'boolean | string' is set to true, the value is \"\".\n          This works around that issue for now.\n          */\n            download={Tag === \"a\" && (download === \"\" || download) ? download : null}\n            href={Tag === \"a\" && this.href}\n            onClick={this.childElClickHandler}\n            rel={Tag === \"a\" && this.rel}\n            role={role}\n            tabIndex={tabIndex}\n            target={Tag === \"a\" && this.target}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={this.storeTagRef}\n          >\n            {this.iconStart ? iconStartEl : null}\n            <slot />\n            {this.iconEnd ? iconEndEl : null}\n          </Tag>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"click\")\n  clickHandler(event: PointerEvent): void {\n    if (this.disabled) {\n      return;\n    }\n\n    // forwards the click() to the internal link for non user-initiated events\n    if (!event.isTrusted) {\n      this.childEl.click();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    focusElement(this.childEl);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteLinkElement;\n\n  /** the rendered child element */\n  private childEl: HTMLAnchorElement | HTMLSpanElement;\n\n  private childElClickHandler = (event: PointerEvent): void => {\n    if (!event.isTrusted) {\n      // click was invoked internally, we stop it here\n      event.stopPropagation();\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private storeTagRef = (el: Link[\"childEl\"]): void => {\n    this.childEl = el;\n  };\n}\n"],"version":3}

package/dist/cjs/calcite-list_3.cjs.entry.js

@@ -1,26 +1,26 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.7.0-next.0
+ * v2.7.0-next.2
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-09605837.js');
-const dom = require('./dom-35288c97.js');
-const interactive = require('./interactive-58c8ad9f.js');
-const observers = require('./observers-3b82bdb7.js');
-const sortableComponent = require('./sortableComponent-35944ad1.js');
-const resources = require('./resources-5fac1fb9.js');
-const loadable = require('./loadable-3d7864f3.js');
-const t9n = require('./t9n-3a5c089d.js');
-const locale = require('./locale-6eea49ff.js');
-const debounce = require('./debounce-d43d39cf.js');
-require('./guid-7d605ea0.js');
-require('./resources-0abc8fc5.js');
-require('./browser-5998a98d.js');
-require('./key-f16a166e.js');
+const index = require('./index-40af9578.js');
+const dom = require('./dom-7116db33.js');
+const interactive = require('./interactive-1f555295.js');
+const observers = require('./observers-289850d7.js');
+const sortableComponent = require('./sortableComponent-96084bb9.js');
+const resources = require('./resources-b3216542.js');
+const loadable = require('./loadable-ff9a81a2.js');
+const t9n = require('./t9n-ecca2d85.js');
+const locale = require('./locale-3f323ce3.js');
+const debounce = require('./debounce-74883b3f.js');
+require('./guid-92f7ac37.js');
+require('./resources-97969be5.js');
+require('./browser-90556b83.js');
+require('./key-106796ae.js');
 
 const CSS$2 = {
     container: "container",