@reown/appkit-cdn 1.8.15-viem-upgrade.0 → 1.8.15-viem-upgrade-2.0

package/dist/index-B6tCHS_j.js

@@ -0,0 +1,120 @@
+import { m as css, r as resetStyles, n as elementStyles, o as i, x } from "./appkit-8yrMZRW-.js";
+import { n } from "./class-map-k3nlzPqR.js";
+import { c as customElement } from "./index-CNivx0yI.js";
+const styles = css`
+  button {
+    border: none;
+    background: transparent;
+    height: 20px;
+    padding: ${({ spacing }) => spacing[2]};
+    column-gap: ${({ spacing }) => spacing[1]};
+    border-radius: ${({ borderRadius }) => borderRadius[1]};
+    padding: 0 ${({ spacing }) => spacing[1]};
+    border-radius: ${({ spacing }) => spacing[1]};
+  }
+
+  /* -- Variants --------------------------------------------------------- */
+  button[data-variant='accent'] {
+    color: ${({ tokens }) => tokens.core.textAccentPrimary};
+  }
+
+  button[data-variant='secondary'] {
+    color: ${({ tokens }) => tokens.theme.textSecondary};
+  }
+
+  /* -- Focus states --------------------------------------------------- */
+  button:focus-visible:enabled {
+    box-shadow: 0px 0px 0px 4px rgba(9, 136, 240, 0.2);
+  }
+
+  button[data-variant='accent']:focus-visible:enabled {
+    background-color: ${({ tokens }) => tokens.core.foregroundAccent010};
+  }
+
+  button[data-variant='secondary']:focus-visible:enabled {
+    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};
+  }
+
+  /* -- Hover & Active states ----------------------------------------------------------- */
+  button[data-variant='accent']:hover:enabled {
+    background-color: ${({ tokens }) => tokens.core.foregroundAccent010};
+  }
+
+  button[data-variant='secondary']:hover:enabled {
+    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};
+  }
+
+  button[data-variant='accent']:focus-visible {
+    background-color: ${({ tokens }) => tokens.core.foregroundAccent010};
+  }
+
+  button[data-variant='secondary']:focus-visible {
+    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};
+    box-shadow: 0px 0px 0px 4px rgba(9, 136, 240, 0.2);
+  }
+
+  button[disabled] {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+`;
+var __decorate = function(decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i2 = decorators.length - 1; i2 >= 0; i2--) if (d = decorators[i2]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const TEXT_VARIANT_BY_SIZE = {
+  sm: "sm-medium",
+  md: "md-medium"
+};
+const TEXT_COLOR_BY_VARIANT = {
+  accent: "accent-primary",
+  secondary: "secondary"
+};
+let WuiLink = class WuiLink2 extends i {
+  constructor() {
+    super(...arguments);
+    this.size = "md";
+    this.disabled = false;
+    this.variant = "accent";
+    this.icon = void 0;
+  }
+  render() {
+    return x`
+      <button ?disabled=${this.disabled} data-variant=${this.variant}>
+        <slot name="iconLeft"></slot>
+        <wui-text
+          color=${TEXT_COLOR_BY_VARIANT[this.variant]}
+          variant=${TEXT_VARIANT_BY_SIZE[this.size]}
+        >
+          <slot></slot>
+        </wui-text>
+        ${this.iconTemplate()}
+      </button>
+    `;
+  }
+  iconTemplate() {
+    if (!this.icon) {
+      return null;
+    }
+    return x`<wui-icon name=${this.icon} size="sm"></wui-icon>`;
+  }
+};
+WuiLink.styles = [resetStyles, elementStyles, styles];
+__decorate([
+  n()
+], WuiLink.prototype, "size", void 0);
+__decorate([
+  n({ type: Boolean })
+], WuiLink.prototype, "disabled", void 0);
+__decorate([
+  n()
+], WuiLink.prototype, "variant", void 0);
+__decorate([
+  n()
+], WuiLink.prototype, "icon", void 0);
+WuiLink = __decorate([
+  customElement("wui-link")
+], WuiLink);
+//# sourceMappingURL=index-B6tCHS_j.js.map

package/dist/index-B6tCHS_j.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-B6tCHS_j.js","sources":["../../ui/dist/esm/src/composites/wui-link/styles.js","../../ui/dist/esm/src/composites/wui-link/index.js"],"sourcesContent":["import { css } from '../../utils/ThemeHelperUtil.js';\nexport default css `\n  button {\n    border: none;\n    background: transparent;\n    height: 20px;\n    padding: ${({ spacing }) => spacing[2]};\n    column-gap: ${({ spacing }) => spacing[1]};\n    border-radius: ${({ borderRadius }) => borderRadius[1]};\n    padding: 0 ${({ spacing }) => spacing[1]};\n    border-radius: ${({ spacing }) => spacing[1]};\n  }\n\n  /* -- Variants --------------------------------------------------------- */\n  button[data-variant='accent'] {\n    color: ${({ tokens }) => tokens.core.textAccentPrimary};\n  }\n\n  button[data-variant='secondary'] {\n    color: ${({ tokens }) => tokens.theme.textSecondary};\n  }\n\n  /* -- Focus states --------------------------------------------------- */\n  button:focus-visible:enabled {\n    box-shadow: 0px 0px 0px 4px rgba(9, 136, 240, 0.2);\n  }\n\n  button[data-variant='accent']:focus-visible:enabled {\n    background-color: ${({ tokens }) => tokens.core.foregroundAccent010};\n  }\n\n  button[data-variant='secondary']:focus-visible:enabled {\n    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};\n  }\n\n  /* -- Hover & Active states ----------------------------------------------------------- */\n  button[data-variant='accent']:hover:enabled {\n    background-color: ${({ tokens }) => tokens.core.foregroundAccent010};\n  }\n\n  button[data-variant='secondary']:hover:enabled {\n    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};\n  }\n\n  button[data-variant='accent']:focus-visible {\n    background-color: ${({ tokens }) => tokens.core.foregroundAccent010};\n  }\n\n  button[data-variant='secondary']:focus-visible {\n    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};\n    box-shadow: 0px 0px 0px 4px rgba(9, 136, 240, 0.2);\n  }\n\n  button[disabled] {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n`;\n//# sourceMappingURL=styles.js.map","var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n    if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n    return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport '../../components/wui-icon/index.js';\nimport '../../components/wui-text/index.js';\nimport { elementStyles, resetStyles } from '../../utils/ThemeUtil.js';\nimport { customElement } from '../../utils/WebComponentsUtil.js';\nimport styles from './styles.js';\nconst TEXT_VARIANT_BY_SIZE = {\n    sm: 'sm-medium',\n    md: 'md-medium'\n};\nconst TEXT_COLOR_BY_VARIANT = {\n    accent: 'accent-primary',\n    secondary: 'secondary'\n};\nlet WuiLink = class WuiLink extends LitElement {\n    constructor() {\n        super(...arguments);\n        this.size = 'md';\n        this.disabled = false;\n        this.variant = 'accent';\n        this.icon = undefined;\n    }\n    render() {\n        return html `\n      <button ?disabled=${this.disabled} data-variant=${this.variant}>\n        <slot name=\"iconLeft\"></slot>\n        <wui-text\n          color=${TEXT_COLOR_BY_VARIANT[this.variant]}\n          variant=${TEXT_VARIANT_BY_SIZE[this.size]}\n        >\n          <slot></slot>\n        </wui-text>\n        ${this.iconTemplate()}\n      </button>\n    `;\n    }\n    iconTemplate() {\n        if (!this.icon) {\n            return null;\n        }\n        return html `<wui-icon name=${this.icon} size=\"sm\"></wui-icon>`;\n    }\n};\nWuiLink.styles = [resetStyles, elementStyles, styles];\n__decorate([\n    property()\n], WuiLink.prototype, \"size\", void 0);\n__decorate([\n    property({ type: Boolean })\n], WuiLink.prototype, \"disabled\", void 0);\n__decorate([\n    property()\n], WuiLink.prototype, \"variant\", void 0);\n__decorate([\n    property()\n], WuiLink.prototype, \"icon\", void 0);\nWuiLink = __decorate([\n    customElement('wui-link')\n], WuiLink);\nexport { WuiLink };\n//# sourceMappingURL=index.js.map"],"names":["i","WuiLink","LitElement","html","property"],"mappings":"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"}

package/dist/index-B9IUGIqh.js

@@ -0,0 +1,211 @@
+import { m as css, r as resetStyles, n as elementStyles, o as i, x } from "./appkit-8yrMZRW-.js";
+import { n } from "./class-map-k3nlzPqR.js";
+import { c as customElement } from "./index-CNivx0yI.js";
+import "./index-Bowi-aBJ.js";
+import "./index-CZkzO2fh.js";
+const styles = css`
+  button {
+    display: block;
+    display: flex;
+    align-items: center;
+    padding: ${({ spacing }) => spacing[1]};
+    transition: background-color ${({ durations }) => durations["lg"]}
+      ${({ easings }) => easings["ease-out-power-2"]};
+    will-change: background-color;
+    background-color: ${({ tokens }) => tokens.theme.foregroundPrimary};
+    border-radius: ${({ borderRadius }) => borderRadius[32]};
+  }
+
+  wui-image {
+    border-radius: ${({ borderRadius }) => borderRadius[32]};
+  }
+
+  wui-text {
+    padding-left: ${({ spacing }) => spacing[1]};
+    padding-right: ${({ spacing }) => spacing[1]};
+  }
+
+  .left-icon-container {
+    width: 24px;
+    height: 24px;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .left-image-container {
+    position: relative;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .chain-image {
+    position: absolute;
+    border: 1px solid ${({ tokens }) => tokens.theme.foregroundPrimary};
+  }
+
+  /* -- Sizes --------------------------------------------------- */
+  button[data-size='lg'] {
+    height: 32px;
+  }
+
+  button[data-size='md'] {
+    height: 28px;
+  }
+
+  button[data-size='sm'] {
+    height: 24px;
+  }
+
+  button[data-size='lg'] .token-image {
+    width: 24px;
+    height: 24px;
+  }
+
+  button[data-size='md'] .token-image {
+    width: 20px;
+    height: 20px;
+  }
+
+  button[data-size='sm'] .token-image {
+    width: 16px;
+    height: 16px;
+  }
+
+  button[data-size='lg'] .left-icon-container {
+    width: 24px;
+    height: 24px;
+  }
+
+  button[data-size='md'] .left-icon-container {
+    width: 20px;
+    height: 20px;
+  }
+
+  button[data-size='sm'] .left-icon-container {
+    width: 16px;
+    height: 16px;
+  }
+
+  button[data-size='lg'] .chain-image {
+    width: 12px;
+    height: 12px;
+    bottom: 2px;
+    right: -4px;
+  }
+
+  button[data-size='md'] .chain-image {
+    width: 10px;
+    height: 10px;
+    bottom: 2px;
+    right: -4px;
+  }
+
+  button[data-size='sm'] .chain-image {
+    width: 8px;
+    height: 8px;
+    bottom: 2px;
+    right: -3px;
+  }
+
+  /* -- Focus states --------------------------------------------------- */
+  button:focus-visible:enabled {
+    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};
+    box-shadow: 0 0 0 4px ${({ tokens }) => tokens.core.foregroundAccent040};
+  }
+
+  /* -- Hover & Active states ----------------------------------------------------------- */
+  @media (hover: hover) {
+    button:hover:enabled,
+    button:active:enabled {
+      background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};
+    }
+  }
+
+  /* -- Disabled states --------------------------------------------------- */
+  button:disabled {
+    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};
+    opacity: 0.5;
+  }
+`;
+var __decorate = function(decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i2 = decorators.length - 1; i2 >= 0; i2--) if (d = decorators[i2]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const TEXT_VARIANT_BY_SIZE = {
+  lg: "lg-regular",
+  md: "lg-regular",
+  sm: "md-regular"
+};
+const ICON_SIZE_BY_SIZE = {
+  lg: "lg",
+  md: "md",
+  sm: "sm"
+};
+let WuiTokenButton = class WuiTokenButton2 extends i {
+  constructor() {
+    super(...arguments);
+    this.size = "md";
+    this.disabled = false;
+    this.text = "";
+    this.loading = false;
+  }
+  render() {
+    if (this.loading) {
+      return x` <wui-flex alignItems="center" gap="01" padding="01">
+        <wui-shimmer width="20px" height="20px"></wui-shimmer>
+        <wui-shimmer width="32px" height="18px" borderRadius="4xs"></wui-shimmer>
+      </wui-flex>`;
+    }
+    return x`
+      <button ?disabled=${this.disabled} data-size=${this.size}>
+        ${this.imageTemplate()} ${this.textTemplate()}
+      </button>
+    `;
+  }
+  imageTemplate() {
+    if (this.imageSrc && this.chainImageSrc) {
+      return x`<wui-flex class="left-image-container">
+        <wui-image src=${this.imageSrc} class="token-image"></wui-image>
+        <wui-image src=${this.chainImageSrc} class="chain-image"></wui-image>
+      </wui-flex>`;
+    }
+    if (this.imageSrc) {
+      return x`<wui-image src=${this.imageSrc} class="token-image"></wui-image>`;
+    }
+    const iconSize = ICON_SIZE_BY_SIZE[this.size];
+    return x`<wui-flex class="left-icon-container">
+      <wui-icon size=${iconSize} name="networkPlaceholder"></wui-icon>
+    </wui-flex>`;
+  }
+  textTemplate() {
+    const textVariant = TEXT_VARIANT_BY_SIZE[this.size];
+    return x`<wui-text color="primary" variant=${textVariant}
+      >${this.text}</wui-text
+    >`;
+  }
+};
+WuiTokenButton.styles = [resetStyles, elementStyles, styles];
+__decorate([
+  n()
+], WuiTokenButton.prototype, "size", void 0);
+__decorate([
+  n()
+], WuiTokenButton.prototype, "imageSrc", void 0);
+__decorate([
+  n()
+], WuiTokenButton.prototype, "chainImageSrc", void 0);
+__decorate([
+  n({ type: Boolean })
+], WuiTokenButton.prototype, "disabled", void 0);
+__decorate([
+  n()
+], WuiTokenButton.prototype, "text", void 0);
+__decorate([
+  n({ type: Boolean })
+], WuiTokenButton.prototype, "loading", void 0);
+WuiTokenButton = __decorate([
+  customElement("wui-token-button")
+], WuiTokenButton);
+//# sourceMappingURL=index-B9IUGIqh.js.map

package/dist/index-B9IUGIqh.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-B9IUGIqh.js","sources":["../../ui/dist/esm/src/composites/wui-token-button/styles.js","../../ui/dist/esm/src/composites/wui-token-button/index.js"],"sourcesContent":["import { css } from '../../utils/ThemeHelperUtil.js';\nexport default css `\n  button {\n    display: block;\n    display: flex;\n    align-items: center;\n    padding: ${({ spacing }) => spacing[1]};\n    transition: background-color ${({ durations }) => durations['lg']}\n      ${({ easings }) => easings['ease-out-power-2']};\n    will-change: background-color;\n    background-color: ${({ tokens }) => tokens.theme.foregroundPrimary};\n    border-radius: ${({ borderRadius }) => borderRadius[32]};\n  }\n\n  wui-image {\n    border-radius: ${({ borderRadius }) => borderRadius[32]};\n  }\n\n  wui-text {\n    padding-left: ${({ spacing }) => spacing[1]};\n    padding-right: ${({ spacing }) => spacing[1]};\n  }\n\n  .left-icon-container {\n    width: 24px;\n    height: 24px;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .left-image-container {\n    position: relative;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .chain-image {\n    position: absolute;\n    border: 1px solid ${({ tokens }) => tokens.theme.foregroundPrimary};\n  }\n\n  /* -- Sizes --------------------------------------------------- */\n  button[data-size='lg'] {\n    height: 32px;\n  }\n\n  button[data-size='md'] {\n    height: 28px;\n  }\n\n  button[data-size='sm'] {\n    height: 24px;\n  }\n\n  button[data-size='lg'] .token-image {\n    width: 24px;\n    height: 24px;\n  }\n\n  button[data-size='md'] .token-image {\n    width: 20px;\n    height: 20px;\n  }\n\n  button[data-size='sm'] .token-image {\n    width: 16px;\n    height: 16px;\n  }\n\n  button[data-size='lg'] .left-icon-container {\n    width: 24px;\n    height: 24px;\n  }\n\n  button[data-size='md'] .left-icon-container {\n    width: 20px;\n    height: 20px;\n  }\n\n  button[data-size='sm'] .left-icon-container {\n    width: 16px;\n    height: 16px;\n  }\n\n  button[data-size='lg'] .chain-image {\n    width: 12px;\n    height: 12px;\n    bottom: 2px;\n    right: -4px;\n  }\n\n  button[data-size='md'] .chain-image {\n    width: 10px;\n    height: 10px;\n    bottom: 2px;\n    right: -4px;\n  }\n\n  button[data-size='sm'] .chain-image {\n    width: 8px;\n    height: 8px;\n    bottom: 2px;\n    right: -3px;\n  }\n\n  /* -- Focus states --------------------------------------------------- */\n  button:focus-visible:enabled {\n    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};\n    box-shadow: 0 0 0 4px ${({ tokens }) => tokens.core.foregroundAccent040};\n  }\n\n  /* -- Hover & Active states ----------------------------------------------------------- */\n  @media (hover: hover) {\n    button:hover:enabled,\n    button:active:enabled {\n      background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};\n    }\n  }\n\n  /* -- Disabled states --------------------------------------------------- */\n  button:disabled {\n    background-color: ${({ tokens }) => tokens.theme.foregroundSecondary};\n    opacity: 0.5;\n  }\n`;\n//# sourceMappingURL=styles.js.map","var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n    if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\n    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\n    return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport '../../components/wui-icon/index.js';\nimport '../../components/wui-image/index.js';\nimport '../../components/wui-shimmer/index.js';\nimport '../../components/wui-text/index.js';\nimport '../../layout/wui-flex/index.js';\nimport { elementStyles, resetStyles } from '../../utils/ThemeUtil.js';\nimport { customElement } from '../../utils/WebComponentsUtil.js';\nimport styles from './styles.js';\nconst TEXT_VARIANT_BY_SIZE = {\n    lg: 'lg-regular',\n    md: 'lg-regular',\n    sm: 'md-regular'\n};\nconst ICON_SIZE_BY_SIZE = {\n    lg: 'lg',\n    md: 'md',\n    sm: 'sm'\n};\nlet WuiTokenButton = class WuiTokenButton extends LitElement {\n    constructor() {\n        super(...arguments);\n        this.size = 'md';\n        this.disabled = false;\n        this.text = '';\n        this.loading = false;\n    }\n    render() {\n        if (this.loading) {\n            return html ` <wui-flex alignItems=\"center\" gap=\"01\" padding=\"01\">\n        <wui-shimmer width=\"20px\" height=\"20px\"></wui-shimmer>\n        <wui-shimmer width=\"32px\" height=\"18px\" borderRadius=\"4xs\"></wui-shimmer>\n      </wui-flex>`;\n        }\n        return html `\n      <button ?disabled=${this.disabled} data-size=${this.size}>\n        ${this.imageTemplate()} ${this.textTemplate()}\n      </button>\n    `;\n    }\n    imageTemplate() {\n        if (this.imageSrc && this.chainImageSrc) {\n            return html `<wui-flex class=\"left-image-container\">\n        <wui-image src=${this.imageSrc} class=\"token-image\"></wui-image>\n        <wui-image src=${this.chainImageSrc} class=\"chain-image\"></wui-image>\n      </wui-flex>`;\n        }\n        if (this.imageSrc) {\n            return html `<wui-image src=${this.imageSrc} class=\"token-image\"></wui-image>`;\n        }\n        const iconSize = ICON_SIZE_BY_SIZE[this.size];\n        return html `<wui-flex class=\"left-icon-container\">\n      <wui-icon size=${iconSize} name=\"networkPlaceholder\"></wui-icon>\n    </wui-flex>`;\n    }\n    textTemplate() {\n        const textVariant = TEXT_VARIANT_BY_SIZE[this.size];\n        return html `<wui-text color=\"primary\" variant=${textVariant}\n      >${this.text}</wui-text\n    >`;\n    }\n};\nWuiTokenButton.styles = [resetStyles, elementStyles, styles];\n__decorate([\n    property()\n], WuiTokenButton.prototype, \"size\", void 0);\n__decorate([\n    property()\n], WuiTokenButton.prototype, \"imageSrc\", void 0);\n__decorate([\n    property()\n], WuiTokenButton.prototype, \"chainImageSrc\", void 0);\n__decorate([\n    property({ type: Boolean })\n], WuiTokenButton.prototype, \"disabled\", void 0);\n__decorate([\n    property()\n], WuiTokenButton.prototype, \"text\", void 0);\n__decorate([\n    property({ type: Boolean })\n], WuiTokenButton.prototype, \"loading\", void 0);\nWuiTokenButton = __decorate([\n    customElement('wui-token-button')\n], WuiTokenButton);\nexport { WuiTokenButton };\n//# sourceMappingURL=index.js.map"],"names":["i","WuiTokenButton","LitElement","html","property"],"mappings":"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"}