@foxy.io/elements 1.32.0-beta.3 → 1.32.0-beta.5

package/dist/elements/public/QueryBuilder/QueryBuilder.js

@@ -22,10 +22,12 @@ const Base = ConfigurableMixin(ResponsiveMixin(ThemeableMixin(TranslatableMixin(
 class QueryBuilder extends Base {
     constructor() {
         super(...arguments);
-        /** List of operators available in the builder UI. */
-        this.operators = Object.values(Operator);
+        /** If true, doesn't add `zoom` query parameter for complex paths. */
+        this.disableZoom = false;
         /** If true, hides the UI for the "OR" operator in queries. */
         this.disableOr = false;
+        /** List of operators available in the builder UI. */
+        this.operators = Object.values(Operator);
         /** Autocomplete suggestions. */
         this.options = null;
         /** Current value as hAPI filter string. */
@@ -34,6 +36,7 @@ class QueryBuilder extends Base {
     static get properties() {
         return {
             ...super.properties,
+            disableZoom: { type: Boolean, attribute: 'disable-zoom' },
             disableOr: { type: Boolean, attribute: 'disable-or' },
             operators: { type: Array },
             options: { type: Array },
@@ -61,7 +64,7 @@ class QueryBuilder extends Base {
             options: (_c = this.options) !== null && _c !== void 0 ? _c : [],
             t: this.t.bind(this),
             onChange: newValue => {
-                this.value = stringify([...newValue, ...hiddenValues]);
+                this.value = stringify([...newValue, ...hiddenValues], this.disableZoom);
                 this.dispatchEvent(new QueryBuilder.ChangeEvent('change'));
             },
         });

package/dist/elements/public/QueryBuilder/QueryBuilder.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryBuilder.js","sourceRoot":"","sources":["../../../../src/elements/public/QueryBuilder/QueryBuilder.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultArray, LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';\nimport { ParsedValue, Operator, Option, Type } from './types';\n\nimport { Group } from './components/Group';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { parse } from './utils/parse';\nimport { stringify } from './utils/stringify';\nimport { styles } from './styles';\nimport { InferrableMixin } from '../../../mixins/inferrable';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\n\nconst NS = 'query-builder';\nconst Base = ConfigurableMixin(\n  ResponsiveMixin(ThemeableMixin(TranslatableMixin(InferrableMixin(LitElement), NS)))\n);\n\n/**\n * UI component for creating Foxy hAPI filters visually. Compatible with\n * Backend API, Customer API or any other API using the same format as described\n * in our [docs](https://api.foxy.io/docs/cheat-sheet).\n *\n * @element foxy-query-builder\n * @since 1.12.0\n */\nclass QueryBuilder extends Base {\n  /** QueryBuilder dispatches this event on itself when value changes. */\n  static readonly ChangeEvent = class extends CustomEvent<void> {};\n\n  /** Operator dictionary for use in autocomplete options. */\n  static readonly Operator = Operator;\n\n  /** Field type dictionary for use in autocomplete options. */\n  static readonly Type = Type;\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      disableOr: { type: Boolean, attribute: 'disable-or' },\n      operators: { type: Array },\n      options: { type: Array },\n      value: { type: String },\n    };\n  }\n\n  static get styles(): CSSResultArray {\n    return [super.styles, styles];\n  }\n\n  /** List of operators available in the builder UI. */\n  operators: Operator[] = Object.values(Operator);\n\n  /** If true, hides the UI for the \"OR\" operator in queries. */\n  disableOr = false;\n\n  /** Autocomplete suggestions. */\n  options: Option[] | null = null;\n\n  /** Current value as hAPI filter string. */\n  value: string | null = null;\n\n  render(): TemplateResult {\n    const reservedPaths = new Set(['zoom', 'limit', 'offset', 'order', 'fields']);\n    const hiddenValues: (ParsedValue | ParsedValue[])[] = [];\n    const visibleValues: (ParsedValue | ParsedValue[])[] = [];\n\n    parse(this.value ?? '').forEach(value => {\n      const isVisible = Array.isArray(value) || !reservedPaths.has(value.path);\n      isVisible ? visibleValues.push(value) : hiddenValues.push(value);\n    });\n\n    return Group({\n      parsedValues: visibleValues,\n      disableOr: this.disableOr,\n      operators: this.operators ?? [],\n      disabled: this.disabled,\n      readonly: this.readonly,\n      options: this.options ?? [],\n      t: this.t.bind(this),\n      onChange: newValue => {\n        this.value = stringify([...newValue, ...hiddenValues]);\n        this.dispatchEvent(new QueryBuilder.ChangeEvent('change'));\n      },\n    });\n  }\n}\n\nexport { QueryBuilder };\n"]}
+{"version":3,"file":"QueryBuilder.js","sourceRoot":"","sources":["../../../../src/elements/public/QueryBuilder/QueryBuilder.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultArray, LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';\nimport { ParsedValue, Operator, Option, Type } from './types';\n\nimport { Group } from './components/Group';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { parse } from './utils/parse';\nimport { stringify } from './utils/stringify';\nimport { styles } from './styles';\nimport { InferrableMixin } from '../../../mixins/inferrable';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\n\nconst NS = 'query-builder';\nconst Base = ConfigurableMixin(\n  ResponsiveMixin(ThemeableMixin(TranslatableMixin(InferrableMixin(LitElement), NS)))\n);\n\n/**\n * UI component for creating Foxy hAPI filters visually. Compatible with\n * Backend API, Customer API or any other API using the same format as described\n * in our [docs](https://api.foxy.io/docs/cheat-sheet).\n *\n * @element foxy-query-builder\n * @since 1.12.0\n */\nclass QueryBuilder extends Base {\n  /** QueryBuilder dispatches this event on itself when value changes. */\n  static readonly ChangeEvent = class extends CustomEvent<void> {};\n\n  /** Operator dictionary for use in autocomplete options. */\n  static readonly Operator = Operator;\n\n  /** Field type dictionary for use in autocomplete options. */\n  static readonly Type = Type;\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      disableZoom: { type: Boolean, attribute: 'disable-zoom' },\n      disableOr: { type: Boolean, attribute: 'disable-or' },\n      operators: { type: Array },\n      options: { type: Array },\n      value: { type: String },\n    };\n  }\n\n  static get styles(): CSSResultArray {\n    return [super.styles, styles];\n  }\n\n  /** If true, doesn't add `zoom` query parameter for complex paths. */\n  disableZoom = false;\n\n  /** If true, hides the UI for the \"OR\" operator in queries. */\n  disableOr = false;\n\n  /** List of operators available in the builder UI. */\n  operators: Operator[] = Object.values(Operator);\n\n  /** Autocomplete suggestions. */\n  options: Option[] | null = null;\n\n  /** Current value as hAPI filter string. */\n  value: string | null = null;\n\n  render(): TemplateResult {\n    const reservedPaths = new Set(['zoom', 'limit', 'offset', 'order', 'fields']);\n    const hiddenValues: (ParsedValue | ParsedValue[])[] = [];\n    const visibleValues: (ParsedValue | ParsedValue[])[] = [];\n\n    parse(this.value ?? '').forEach(value => {\n      const isVisible = Array.isArray(value) || !reservedPaths.has(value.path);\n      isVisible ? visibleValues.push(value) : hiddenValues.push(value);\n    });\n\n    return Group({\n      parsedValues: visibleValues,\n      disableOr: this.disableOr,\n      operators: this.operators ?? [],\n      disabled: this.disabled,\n      readonly: this.readonly,\n      options: this.options ?? [],\n      t: this.t.bind(this),\n      onChange: newValue => {\n        this.value = stringify([...newValue, ...hiddenValues], this.disableZoom);\n        this.dispatchEvent(new QueryBuilder.ChangeEvent('change'));\n      },\n    });\n  }\n}\n\nexport { QueryBuilder };\n"]}

package/dist/elements/public/QueryBuilder/components/Rule.js

@@ -103,7 +103,7 @@ export function Rule(params) {
         'text-secondary hover-bg-contrast-5 hover-text-error': !disabled,
         'cursor-default text-disabled': disabled,
         'focus-outline-none focus-ring-2 ring-primary-50': true,
-        'opacity-0': !parsedValue.path,
+        'opacity-0 pointer-events-none': !parsedValue.path,
     })}
           ?disabled=${disabled || readonly || !parsedValue.path}
           @click=${onDelete}
@@ -123,9 +123,10 @@ export function Rule(params) {
         'text-success hover-bg-contrast-5': !disabled,
         'cursor-default text-disabled': disabled,
         'focus-outline-none focus-ring-2 ring-primary-50': true,
-        'opacity-0': !parsedValue.path || !!isNested || params.disableOr,
+        'opacity-0 pointer-events-none': !parsedValue.path || !!isNested || params.disableOr,
     })}
-          ?disabled=${disabled || readonly || !parsedValue.path}
+          ?disabled=${disabled || readonly || !parsedValue.path || !!isNested || params.disableOr}
+          ?hidden=${params.disableOr}
           @click=${onConvert}
         >
           <iron-icon

package/dist/elements/public/QueryBuilder/components/Rule.js.map

@@ -1 +1 @@
-{"version":3,"file":"Rule.js","sourceRoot":"","sources":["../../../../../src/elements/public/QueryBuilder/components/Rule.ts"],"names":[],"mappings":"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","sourcesContent":["import * as icons from '../icons/index';\n\nimport { Operator, Option, ParsedValue, Type } from '../types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { BooleanValue } from './BooleanValue';\nimport { I18n } from '../../I18n/I18n';\nimport { IsDefinedValue } from './IsDefinedValue';\nimport { ListValue } from './ListValue';\nimport { Name } from './Name';\nimport { OperatorToggle } from './OperatorToggle';\nimport { Path } from './Path';\nimport { RangeValue } from './RangeValue';\nimport { SingleValue } from './SingleValue';\nimport { classMap } from '../../../../utils/class-map';\n\nexport type RuleParams = {\n  parsedValue: ParsedValue;\n  operators: Operator[];\n  disableOr: boolean;\n  isFullSize?: boolean;\n  isNested?: boolean;\n  disabled: boolean;\n  readonly: boolean;\n  options: Option[];\n  t: I18n['t'];\n  onChange: (newValue: ParsedValue) => void;\n  onDelete?: () => void;\n  onConvert?: () => void;\n};\n\nexport function Rule(params: RuleParams): TemplateResult {\n  const {\n    parsedValue,\n    isFullSize,\n    isNested,\n    readonly,\n    disabled,\n    options,\n    t,\n    onConvert,\n    onDelete,\n    onChange,\n  } = params;\n\n  const option = options.find(o => o.path === parsedValue.path) ?? null;\n  const type = option?.type ?? Type.Any;\n  const operator = parsedValue.operator;\n  const componentParams = {\n    parsedValue: parsedValue,\n    operators: params.operators,\n    disabled,\n    readonly,\n    options,\n    option,\n    t,\n    onChange,\n  };\n\n  const typeToIcon = {\n    [Type.Attribute]: icons.typeAttribute,\n    [Type.Boolean]: icons.typeBoolean,\n    [Type.Number]: icons.typeNumber,\n    [Type.String]: icons.typeString,\n    [Type.Date]: icons.typeDate,\n    [Type.Any]: icons.typeAny,\n  };\n\n  return html`\n    <div class=\"flex items-center space-x-s\" aria-label=${t('query_builder_rule')}>\n      <div\n        class=${classMap({\n          'flex-1 bg-base rounded overflow-hidden border': true,\n          'border-contrast-10': !isNested && !readonly,\n          'border-contrast-50': !!isNested || readonly,\n          'border-dashed': readonly,\n          'border-solid': !readonly,\n        })}\n      >\n        <div class=\"bg-contrast-10\">\n          <div class=\"grid gap-1px grid-vertical sm-grid-horizontal\">\n            <div class=\"bg-base\" title=${t(`type_${type}`)}>\n              <div\n                class=${classMap({\n                  'w-m h-m': true,\n                  'text-tertiary': !readonly && !disabled,\n                  'text-disabled': readonly || disabled,\n                })}\n                aria-hidden=\"true\"\n              >\n                ${option ? typeToIcon[type] : icons.typeAny}\n              </div>\n            </div>\n\n            <div class=\"bg-base\">\n              ${parsedValue.path && (type === Type.Attribute || parsedValue.name)\n                ? html`\n                    <div class=\"bg-contrast-10 grid gap-1px grid-cols-1 sm-grid-cols-2\">\n                      <div class=\"bg-base\">${Path(componentParams)}</div>\n                      <div class=\"bg-base\">${Name(componentParams)}</div>\n                    </div>\n                  `\n                : Path(componentParams)}\n            </div>\n\n            <div class=\"bg-base\">${OperatorToggle(componentParams)}</div>\n\n            <div class=\"bg-base\">\n              ${operator === Operator.In\n                ? ListValue(componentParams)\n                : operator === Operator.IsDefined\n                ? IsDefinedValue(componentParams)\n                : type === Type.Boolean\n                ? BooleanValue(componentParams)\n                : operator === null && [Type.Number, Type.Date].includes(type)\n                ? RangeValue(componentParams)\n                : SingleValue(componentParams)}\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div\n        class=${classMap({\n          '-mr-s self-start flex-col sm-flex-row flex-shrink-0 items-center': true,\n          'border-t border-b border-transparent divide-y divide-transparent': true,\n          'hidden': !!isFullSize || readonly,\n          'flex': !isFullSize,\n        })}\n      >\n        <button\n          aria-label=${t('delete')}\n          class=${classMap({\n            'box-content flex w-m h-m rounded-full transition-colors': true,\n            'text-secondary hover-bg-contrast-5 hover-text-error': !disabled,\n            'cursor-default text-disabled': disabled,\n            'focus-outline-none focus-ring-2 ring-primary-50': true,\n            'opacity-0': !parsedValue.path,\n          })}\n          ?disabled=${disabled || readonly || !parsedValue.path}\n          @click=${onDelete}\n        >\n          <iron-icon\n            aria-hidden=\"true\"\n            class=\"m-auto icon-inline text-xl\"\n            icon=\"icons:remove-circle-outline\"\n          >\n          </iron-icon>\n        </button>\n\n        <button\n          aria-label=${t('add_or_clause')}\n          class=${classMap({\n            'box-content flex w-m h-m rounded-full transition-colors': true,\n            'text-success hover-bg-contrast-5': !disabled,\n            'cursor-default text-disabled': disabled,\n            'focus-outline-none focus-ring-2 ring-primary-50': true,\n            'opacity-0': !parsedValue.path || !!isNested || params.disableOr,\n          })}\n          ?disabled=${disabled || readonly || !parsedValue.path}\n          @click=${onConvert}\n        >\n          <iron-icon\n            aria-hidden=\"true\"\n            class=\"m-auto icon-inline text-xl\"\n            icon=\"icons:add-circle-outline\"\n          >\n          </iron-icon>\n        </button>\n      </div>\n    </div>\n  `;\n}\n"]}
+{"version":3,"file":"Rule.js","sourceRoot":"","sources":["../../../../../src/elements/public/QueryBuilder/components/Rule.ts"],"names":[],"mappings":"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","sourcesContent":["import * as icons from '../icons/index';\n\nimport { Operator, Option, ParsedValue, Type } from '../types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { BooleanValue } from './BooleanValue';\nimport { I18n } from '../../I18n/I18n';\nimport { IsDefinedValue } from './IsDefinedValue';\nimport { ListValue } from './ListValue';\nimport { Name } from './Name';\nimport { OperatorToggle } from './OperatorToggle';\nimport { Path } from './Path';\nimport { RangeValue } from './RangeValue';\nimport { SingleValue } from './SingleValue';\nimport { classMap } from '../../../../utils/class-map';\n\nexport type RuleParams = {\n  parsedValue: ParsedValue;\n  operators: Operator[];\n  disableOr: boolean;\n  isFullSize?: boolean;\n  isNested?: boolean;\n  disabled: boolean;\n  readonly: boolean;\n  options: Option[];\n  t: I18n['t'];\n  onChange: (newValue: ParsedValue) => void;\n  onDelete?: () => void;\n  onConvert?: () => void;\n};\n\nexport function Rule(params: RuleParams): TemplateResult {\n  const {\n    parsedValue,\n    isFullSize,\n    isNested,\n    readonly,\n    disabled,\n    options,\n    t,\n    onConvert,\n    onDelete,\n    onChange,\n  } = params;\n\n  const option = options.find(o => o.path === parsedValue.path) ?? null;\n  const type = option?.type ?? Type.Any;\n  const operator = parsedValue.operator;\n  const componentParams = {\n    parsedValue: parsedValue,\n    operators: params.operators,\n    disabled,\n    readonly,\n    options,\n    option,\n    t,\n    onChange,\n  };\n\n  const typeToIcon = {\n    [Type.Attribute]: icons.typeAttribute,\n    [Type.Boolean]: icons.typeBoolean,\n    [Type.Number]: icons.typeNumber,\n    [Type.String]: icons.typeString,\n    [Type.Date]: icons.typeDate,\n    [Type.Any]: icons.typeAny,\n  };\n\n  return html`\n    <div class=\"flex items-center space-x-s\" aria-label=${t('query_builder_rule')}>\n      <div\n        class=${classMap({\n          'flex-1 bg-base rounded overflow-hidden border': true,\n          'border-contrast-10': !isNested && !readonly,\n          'border-contrast-50': !!isNested || readonly,\n          'border-dashed': readonly,\n          'border-solid': !readonly,\n        })}\n      >\n        <div class=\"bg-contrast-10\">\n          <div class=\"grid gap-1px grid-vertical sm-grid-horizontal\">\n            <div class=\"bg-base\" title=${t(`type_${type}`)}>\n              <div\n                class=${classMap({\n                  'w-m h-m': true,\n                  'text-tertiary': !readonly && !disabled,\n                  'text-disabled': readonly || disabled,\n                })}\n                aria-hidden=\"true\"\n              >\n                ${option ? typeToIcon[type] : icons.typeAny}\n              </div>\n            </div>\n\n            <div class=\"bg-base\">\n              ${parsedValue.path && (type === Type.Attribute || parsedValue.name)\n                ? html`\n                    <div class=\"bg-contrast-10 grid gap-1px grid-cols-1 sm-grid-cols-2\">\n                      <div class=\"bg-base\">${Path(componentParams)}</div>\n                      <div class=\"bg-base\">${Name(componentParams)}</div>\n                    </div>\n                  `\n                : Path(componentParams)}\n            </div>\n\n            <div class=\"bg-base\">${OperatorToggle(componentParams)}</div>\n\n            <div class=\"bg-base\">\n              ${operator === Operator.In\n                ? ListValue(componentParams)\n                : operator === Operator.IsDefined\n                ? IsDefinedValue(componentParams)\n                : type === Type.Boolean\n                ? BooleanValue(componentParams)\n                : operator === null && [Type.Number, Type.Date].includes(type)\n                ? RangeValue(componentParams)\n                : SingleValue(componentParams)}\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div\n        class=${classMap({\n          '-mr-s self-start flex-col sm-flex-row flex-shrink-0 items-center': true,\n          'border-t border-b border-transparent divide-y divide-transparent': true,\n          'hidden': !!isFullSize || readonly,\n          'flex': !isFullSize,\n        })}\n      >\n        <button\n          aria-label=${t('delete')}\n          class=${classMap({\n            'box-content flex w-m h-m rounded-full transition-colors': true,\n            'text-secondary hover-bg-contrast-5 hover-text-error': !disabled,\n            'cursor-default text-disabled': disabled,\n            'focus-outline-none focus-ring-2 ring-primary-50': true,\n            'opacity-0 pointer-events-none': !parsedValue.path,\n          })}\n          ?disabled=${disabled || readonly || !parsedValue.path}\n          @click=${onDelete}\n        >\n          <iron-icon\n            aria-hidden=\"true\"\n            class=\"m-auto icon-inline text-xl\"\n            icon=\"icons:remove-circle-outline\"\n          >\n          </iron-icon>\n        </button>\n\n        <button\n          aria-label=${t('add_or_clause')}\n          class=${classMap({\n            'box-content flex w-m h-m rounded-full transition-colors': true,\n            'text-success hover-bg-contrast-5': !disabled,\n            'cursor-default text-disabled': disabled,\n            'focus-outline-none focus-ring-2 ring-primary-50': true,\n            'opacity-0 pointer-events-none': !parsedValue.path || !!isNested || params.disableOr,\n          })}\n          ?disabled=${disabled || readonly || !parsedValue.path || !!isNested || params.disableOr}\n          ?hidden=${params.disableOr}\n          @click=${onConvert}\n        >\n          <iron-icon\n            aria-hidden=\"true\"\n            class=\"m-auto icon-inline text-xl\"\n            icon=\"icons:add-circle-outline\"\n          >\n          </iron-icon>\n        </button>\n      </div>\n    </div>\n  `;\n}\n"]}

package/dist/elements/public/QueryBuilder/utils/stringify.d.ts

@@ -1,3 +1,3 @@
 import { ParsedValue } from '../types';
-declare function stringify(newValue: (ParsedValue | ParsedValue[])[]): string;
+declare function stringify(newValue: (ParsedValue | ParsedValue[])[], disableZoom?: boolean): string;
 export { stringify };

package/dist/elements/public/QueryBuilder/utils/stringify.js

@@ -7,7 +7,7 @@ function stringifyGroup(parsedValue) {
     result = `${encodeURIComponent(result)}=${encodeURIComponent(parsedValue.value)}`;
     return result === '=' ? '' : result;
 }
-function stringify(newValue) {
+function stringify(newValue, disableZoom = false) {
     const toQuery = (rules, rule) => {
         if (Array.isArray(rule)) {
             let key = rule[0].path;
@@ -19,7 +19,7 @@ function stringify(newValue) {
                 rule[0].value,
                 ...rule.slice(1).map(or => decodeURIComponent(stringifyGroup(or))),
             ];
-            rules.push(`${key}=${encodeURIComponent(alternatives.join('|'))}`);
+            rules.push(`${encodeURIComponent(key)}=${encodeURIComponent(alternatives.join('|'))}`);
         }
         else if (rule.path !== 'zoom') {
             rules.push(stringifyGroup(rule));
@@ -27,9 +27,11 @@ function stringify(newValue) {
         return rules;
     };
     const query = newValue.reduce(toQuery, []);
-    const zoom = getZoomedRels(newValue).join(',');
-    if (zoom)
-        query.push(`zoom=${encodeURIComponent(zoom)}`);
+    if (!disableZoom) {
+        const zoom = getZoomedRels(newValue).join(',');
+        if (zoom)
+            query.push(`zoom=${encodeURIComponent(zoom)}`);
+    }
     return query.join('&');
 }
 function getZoomedRels(value) {

package/dist/elements/public/QueryBuilder/utils/stringify.js.map

@@ -1 +1 @@
-{"version":3,"file":"stringify.js","sourceRoot":"","sources":["../../../../../src/elements/public/QueryBuilder/utils/stringify.ts"],"names":[],"mappings":"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","sourcesContent":["import { ParsedValue } from '../types';\n\nfunction stringifyGroup(parsedValue: ParsedValue): string {\n  let result = parsedValue.path;\n  if (parsedValue.name) result += `:name[${parsedValue.name}]`;\n  if (parsedValue.operator) result += `:${parsedValue.operator}`;\n  result = `${encodeURIComponent(result)}=${encodeURIComponent(parsedValue.value)}`;\n  return result === '=' ? '' : result;\n}\n\nfunction stringify(newValue: (ParsedValue | ParsedValue[])[]): string {\n  const toQuery = (rules: string[], rule: ParsedValue | ParsedValue[]) => {\n    if (Array.isArray(rule)) {\n      let key = rule[0].path;\n      if (rule[0].name) key += `:name[${rule[0].name}]`;\n      if (rule[0].operator) key += `:${rule[0].operator}`;\n\n      const alternatives = [\n        rule[0].value,\n        ...rule.slice(1).map(or => decodeURIComponent(stringifyGroup(or))),\n      ];\n\n      rules.push(`${key}=${encodeURIComponent(alternatives.join('|'))}`);\n    } else if (rule.path !== 'zoom') {\n      rules.push(stringifyGroup(rule));\n    }\n\n    return rules;\n  };\n\n  const query = newValue.reduce(toQuery, [] as string[]);\n  const zoom = getZoomedRels(newValue).join(',');\n\n  if (zoom) query.push(`zoom=${encodeURIComponent(zoom)}`);\n  return query.join('&');\n}\n\nfunction getZoomedRels(value: (ParsedValue | ParsedValue[])[]): string[] {\n  return value\n    .map(rule => {\n      if (Array.isArray(rule)) return getZoomedRels(rule);\n      if (rule.name) return [rule.path];\n\n      const pathMembers = rule.path.split(':');\n      return pathMembers.slice(0, pathMembers.length - 1);\n    })\n    .flat()\n    .sort((rel1, rel2) => rel2.length - rel1.length)\n    .filter((rel, index, rels) => {\n      return rels.every((_rel, _index) => {\n        return (_index >= index || _rel !== rel) && !_rel.startsWith(`${rel}:`);\n      });\n    });\n}\n\nexport { stringify };\n"]}
+{"version":3,"file":"stringify.js","sourceRoot":"","sources":["../../../../../src/elements/public/QueryBuilder/utils/stringify.ts"],"names":[],"mappings":"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","sourcesContent":["import { ParsedValue } from '../types';\n\nfunction stringifyGroup(parsedValue: ParsedValue): string {\n  let result = parsedValue.path;\n  if (parsedValue.name) result += `:name[${parsedValue.name}]`;\n  if (parsedValue.operator) result += `:${parsedValue.operator}`;\n  result = `${encodeURIComponent(result)}=${encodeURIComponent(parsedValue.value)}`;\n  return result === '=' ? '' : result;\n}\n\nfunction stringify(newValue: (ParsedValue | ParsedValue[])[], disableZoom = false): string {\n  const toQuery = (rules: string[], rule: ParsedValue | ParsedValue[]) => {\n    if (Array.isArray(rule)) {\n      let key = rule[0].path;\n      if (rule[0].name) key += `:name[${rule[0].name}]`;\n      if (rule[0].operator) key += `:${rule[0].operator}`;\n\n      const alternatives = [\n        rule[0].value,\n        ...rule.slice(1).map(or => decodeURIComponent(stringifyGroup(or))),\n      ];\n\n      rules.push(`${encodeURIComponent(key)}=${encodeURIComponent(alternatives.join('|'))}`);\n    } else if (rule.path !== 'zoom') {\n      rules.push(stringifyGroup(rule));\n    }\n\n    return rules;\n  };\n\n  const query = newValue.reduce(toQuery, [] as string[]);\n\n  if (!disableZoom) {\n    const zoom = getZoomedRels(newValue).join(',');\n    if (zoom) query.push(`zoom=${encodeURIComponent(zoom)}`);\n  }\n\n  return query.join('&');\n}\n\nfunction getZoomedRels(value: (ParsedValue | ParsedValue[])[]): string[] {\n  return value\n    .map(rule => {\n      if (Array.isArray(rule)) return getZoomedRels(rule);\n      if (rule.name) return [rule.path];\n\n      const pathMembers = rule.path.split(':');\n      return pathMembers.slice(0, pathMembers.length - 1);\n    })\n    .flat()\n    .sort((rel1, rel2) => rel2.length - rel1.length)\n    .filter((rel, index, rels) => {\n      return rels.every((_rel, _index) => {\n        return (_index >= index || _rel !== rel) && !_rel.startsWith(`${rel}:`);\n      });\n    });\n}\n\nexport { stringify };\n"]}

package/dist/elements/public/UserInvitationForm/UserInvitationForm.d.ts

@@ -11,6 +11,8 @@ export declare class UserInvitationForm extends Base<Data> {
     static get properties(): PropertyDeclarations;
     static get styles(): CSSResultArray;
     static get v8n(): NucleonV8N<Data>;
+    /** When provided, displays a link to Store Dashboard in user layout. */
+    getStorePageHref: ((storeHref: string) => string) | null;
     /** Default host domain for stores that don't use a custom domain name, e.g. `foxycart.com`. */
     defaultDomain: string | null;
     /** Admin layout will display user info, user layout (default) will display store info. */

package/dist/elements/public/UserInvitationForm/UserInvitationForm.js

@@ -11,6 +11,8 @@ const Base = TranslatableMixin(InternalForm, NS);
 export class UserInvitationForm extends Base {
     constructor() {
         super(...arguments);
+        /** When provided, displays a link to Store Dashboard in user layout. */
+        this.getStorePageHref = null;
         /** Default host domain for stores that don't use a custom domain name, e.g. `foxycart.com`. */
         this.defaultDomain = null;
         /** Admin layout will display user info, user layout (default) will display store info. */
@@ -25,6 +27,7 @@ export class UserInvitationForm extends Base {
     static get properties() {
         return {
             ...super.properties,
+            getStorePageHref: { attribute: false },
             defaultDomain: { attribute: 'default-domain' },
             layout: {},
         };
@@ -61,19 +64,23 @@ export class UserInvitationForm extends Base {
         return new BooleanSelector(alwaysMatch.join(' ').trim());
     }
     get hiddenSelector() {
-        var _a;
+        var _a, _b;
         const alwaysMatch = ['timestamps', 'submit', 'undo', super.hiddenSelector.toString()];
         const status = (_a = this.data) === null || _a === void 0 ? void 0 : _a.status;
+        const layout = (_b = this.layout) !== null && _b !== void 0 ? _b : 'user';
         if (status !== 'accepted' && status !== 'sent')
             alwaysMatch.unshift('revoke');
-        if (status !== 'rejected')
-            alwaysMatch.unshift('delete');
         if (status !== 'accepted')
             alwaysMatch.unshift('leave');
-        if (status !== 'revoked')
-            alwaysMatch.unshift('invite-again');
         if (status !== 'sent')
-            alwaysMatch.unshift('resend', 'accept', 'reject');
+            alwaysMatch.unshift('accept', 'reject');
+        if ((status !== 'rejected' || layout !== 'user') &&
+            (status !== 'expired' || layout !== 'admin')) {
+            alwaysMatch.unshift('delete');
+        }
+        if (status !== 'sent' && status !== 'revoked' && (status !== 'expired' || layout !== 'admin')) {
+            alwaysMatch.unshift('resend');
+        }
         return new BooleanSelector(alwaysMatch.join(' ').trim());
     }
     renderBody() {
@@ -142,15 +149,16 @@ export class UserInvitationForm extends Base {
     `;
     }
     __renderAdminSnapshotState({ first_name, last_name }) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        var _a, _b, _c, _d, _e, _f, _g;
         const hasName = (first_name === null || first_name === void 0 ? void 0 : first_name.trim()) || (last_name === null || last_name === void 0 ? void 0 : last_name.trim());
         const nameOptions = { first_name, last_name, context: hasName ? '' : 'empty' };
+        const status = (_a = this.data) === null || _a === void 0 ? void 0 : _a.status;
         const hidden = this.hiddenSelector;
         return html `
       <div style="padding-top: 3.5rem">
         <div class="relative">
           <div class="inner-curve bg-contrast-5 absolute inset-0"></div>
-          ${asyncReplace(this.__getGravatar((_a = this.data) === null || _a === void 0 ? void 0 : _a.email))}
+          ${asyncReplace(this.__getGravatar((_b = this.data) === null || _b === void 0 ? void 0 : _b.email))}
 
           <div
             class="relative pb-m px-m leading-xs grid gap-m"
@@ -164,34 +172,32 @@ export class UserInvitationForm extends Base {
                 .options=${nameOptions}
               >
               </foxy-i18n>
-              <div class="text-m text-center text-secondary">${(_b = this.data) === null || _b === void 0 ? void 0 : _b.email}</div>
+              <div class="text-m text-center text-secondary">${(_c = this.data) === null || _c === void 0 ? void 0 : _c.email}</div>
             </div>
 
             <div
               style="padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)"
               class=${classMap({
             'border rounded': true,
-            'border-contrast text-contrast': ((_c = this.data) === null || _c === void 0 ? void 0 : _c.status) === 'revoked',
-            'border-success text-success': ((_d = this.data) === null || _d === void 0 ? void 0 : _d.status) === 'accepted',
-            'border-primary text-primary': ((_e = this.data) === null || _e === void 0 ? void 0 : _e.status) === 'sent',
-            'border-error text-error': ((_f = this.data) === null || _f === void 0 ? void 0 : _f.status) === 'rejected',
+            'border-contrast text-contrast': status === 'revoked' || status === 'expired',
+            'border-success text-success': status === 'accepted',
+            'border-primary text-primary': status === 'sent',
+            'border-error text-error': status === 'rejected',
         })}
             >
               <p class="font-medium flex items-center gap-s">
-                ${((_g = this.data) === null || _g === void 0 ? void 0 : _g.status) === 'revoked'
+                ${status === 'revoked'
             ? svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" style="width: 1.25em; height: 1.25em"><path fill-rule="evenodd" d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm3 10.5a.75.75 0 0 0 0-1.5H9a.75.75 0 0 0 0 1.5h6Z" clip-rule="evenodd" /></svg>`
-            : ((_h = this.data) === null || _h === void 0 ? void 0 : _h.status) === 'sent'
+            : status === 'sent'
                 ? svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" style="width: 1.25em; height: 1.25em"><path fill-rule="evenodd" d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25ZM12.75 6a.75.75 0 0 0-1.5 0v6c0 .414.336.75.75.75h4.5a.75.75 0 0 0 0-1.5h-3.75V6Z" clip-rule="evenodd" /></svg>`
-                : ((_j = this.data) === null || _j === void 0 ? void 0 : _j.status) === 'rejected'
+                : status === 'rejected'
                     ? svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" style="width: 1.25em; height: 1.25em"><path fill-rule="evenodd" d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm-1.72 6.97a.75.75 0 1 0-1.06 1.06L10.94 12l-1.72 1.72a.75.75 0 1 0 1.06 1.06L12 13.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L13.06 12l1.72-1.72a.75.75 0 1 0-1.06-1.06L12 10.94l-1.72-1.72Z" clip-rule="evenodd" /></svg>`
-                    : ((_k = this.data) === null || _k === void 0 ? void 0 : _k.status) === 'accepted'
+                    : status === 'accepted'
                         ? svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" style="width: 1.25em; height: 1.25em"><path fill-rule="evenodd" d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z" clip-rule="evenodd" /></svg>`
-                        : ''}
-                <foxy-i18n
-                  infer=""
-                  key="admin_status_title"
-                  .options=${{ context: (_l = this.data) === null || _l === void 0 ? void 0 : _l.status }}
-                >
+                        : status === 'expired'
+                            ? svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" style="width: 1.25em; height: 1.25em"><path d="M3.375 3C2.339 3 1.5 3.84 1.5 4.875v.75c0 1.036.84 1.875 1.875 1.875h17.25c1.035 0 1.875-.84 1.875-1.875v-.75C22.5 3.839 21.66 3 20.625 3H3.375Z" /><path fill-rule="evenodd" d="m3.087 9 .54 9.176A3 3 0 0 0 6.62 21h10.757a3 3 0 0 0 2.995-2.824L20.913 9H3.087Zm6.133 2.845a.75.75 0 0 1 1.06 0l1.72 1.72 1.72-1.72a.75.75 0 1 1 1.06 1.06l-1.72 1.72 1.72 1.72a.75.75 0 1 1-1.06 1.06L12 15.685l-1.72 1.72a.75.75 0 1 1-1.06-1.06l1.72-1.72-1.72-1.72a.75.75 0 0 1 0-1.06Z" clip-rule="evenodd" /></svg>`
+                            : ''}
+                <foxy-i18n infer="" key="admin_status_title" .options=${{ context: status }}>
                 </foxy-i18n>
               </p>
 
@@ -199,36 +205,34 @@ export class UserInvitationForm extends Base {
                 class="text-body"
                 style="padding-left: calc((1.25 * var(--lumo-font-size-m)) + var(--lumo-space-s))"
               >
-                <foxy-i18n
-                  infer=""
-                  key="admin_status_text"
-                  .options=${{ context: (_m = this.data) === null || _m === void 0 ? void 0 : _m.status }}
-                >
+                <foxy-i18n infer="" key="admin_status_text" .options=${{ context: status }}>
                 </foxy-i18n>
               </p>
             </div>
 
-            <foxy-internal-user-invitation-form-sync-action status="sent" infer="invite-again">
-            </foxy-internal-user-invitation-form-sync-action>
-
             <div
               class="flex gap-m"
-              ?hidden=${hidden.matches('revoke', true) && hidden.matches('resend', true)}
+              ?hidden=${hidden.matches('revoke', true) &&
+            hidden.matches('resend', true) &&
+            hidden.matches('delete', true)}
             >
-              <foxy-internal-user-invitation-form-sync-action
-                status="revoked"
+              <foxy-internal-user-invitation-form-async-action
+                infer="revoke"
                 class="flex-1"
                 theme="error"
-                infer="revoke"
+                href=${ifDefined((_e = (_d = this.data) === null || _d === void 0 ? void 0 : _d._links['fx:revoke']) === null || _e === void 0 ? void 0 : _e.href)}
               >
-              </foxy-internal-user-invitation-form-sync-action>
+              </foxy-internal-user-invitation-form-async-action>
 
               <foxy-internal-user-invitation-form-async-action
                 infer="resend"
                 class="flex-1"
-                href=${ifDefined((_o = this.data) === null || _o === void 0 ? void 0 : _o._links['fx:resend'].href)}
+                href=${ifDefined((_g = (_f = this.data) === null || _f === void 0 ? void 0 : _f._links['fx:resend']) === null || _g === void 0 ? void 0 : _g.href)}
               >
               </foxy-internal-user-invitation-form-async-action>
+
+              <foxy-internal-delete-control infer="delete" class="flex-1">
+              </foxy-internal-delete-control>
             </div>
           </div>
         </div>
@@ -236,12 +240,12 @@ export class UserInvitationForm extends Base {
     `;
     }
     __renderUserSnapshotState({ status, store_name }) {
+        var _a, _b, _c, _d, _e, _f;
         const hidden = this.hiddenSelector;
         const textColorMap = {
             'text-primary': status === 'sent',
             'text-success': status === 'accepted',
             'text-error': status === 'rejected',
-            'text-body': status === 'revoked',
         };
         return html `
       <div class=${classMap({ 'flex items-center gap-m': true, ...textColorMap })}>
@@ -269,6 +273,18 @@ export class UserInvitationForm extends Base {
         </foxy-internal-text-control>
         <foxy-internal-text-control layout="summary-item" infer="store-email">
         </foxy-internal-text-control>
+        ${status === 'accepted' && this.getStorePageHref && this.data
+            ? html `
+              <div ?hidden=${status !== 'accepted' || !this.getStorePageHref}>
+                <a
+                  class="text-primary font-medium cursor-pointer rounded transition-opacity hover-opacity-80 focus-outline-none focus-ring-2 focus-ring-primary-50"
+                  href=${this.getStorePageHref(this.data._links['fx:store'].href)}
+                >
+                  <foxy-i18n infer="" key="store_link"></foxy-i18n>
+                </a>
+              </div>
+            `
+            : ''}
       </foxy-internal-summary-control>
 
       <foxy-i18n
@@ -279,31 +295,31 @@ export class UserInvitationForm extends Base {
       >
       </foxy-i18n>
 
-      <foxy-internal-user-invitation-form-sync-action
-        status="revoked"
+      <foxy-internal-user-invitation-form-async-action
         theme="error"
         class="flex-1"
         infer="leave"
+        href=${ifDefined((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a._links['fx:revoke']) === null || _b === void 0 ? void 0 : _b.href)}
       >
-      </foxy-internal-user-invitation-form-sync-action>
+      </foxy-internal-user-invitation-form-async-action>
 
       <div
         class="grid grid-cols-2 gap-m"
         ?hidden=${hidden.matches('reject', true) && hidden.matches('accept', true)}
       >
-        <foxy-internal-user-invitation-form-sync-action
-          status="rejected"
+        <foxy-internal-user-invitation-form-async-action
           theme="error primary"
           infer="reject"
+          href=${ifDefined((_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c._links['fx:reject']) === null || _d === void 0 ? void 0 : _d.href)}
         >
-        </foxy-internal-user-invitation-form-sync-action>
+        </foxy-internal-user-invitation-form-async-action>
 
-        <foxy-internal-user-invitation-form-sync-action
-          status="accepted"
+        <foxy-internal-user-invitation-form-async-action
           theme="success primary"
           infer="accept"
+          href=${ifDefined((_f = (_e = this.data) === null || _e === void 0 ? void 0 : _e._links['fx:accept']) === null || _f === void 0 ? void 0 : _f.href)}
         >
-        </foxy-internal-user-invitation-form-sync-action>
+        </foxy-internal-user-invitation-form-async-action>
       </div>
 
       <foxy-internal-delete-control infer="delete"></foxy-internal-delete-control>

package/dist/elements/public/UserInvitationForm/UserInvitationForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserInvitationForm.js","sourceRoot":"","sources":["../../../../src/elements/public/UserInvitationForm/UserInvitationForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { CSSResultArray, PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { getGravatarUrl } from '../../../utils/get-gravatar-url';\nimport { html, svg, css } from 'lit-element';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { asyncReplace } from 'lit-html/directives/async-replace';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'user-invitation-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\nexport class UserInvitationForm extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      defaultDomain: { attribute: 'default-domain' },\n      layout: {},\n    };\n  }\n\n  static get styles(): CSSResultArray {\n    return [\n      ...super.styles,\n      css`\n        .inner-curve {\n          --r: var(--lumo-border-radius-l); /* control the rounded part */\n          --s: 3rem; /* control the size of the cut */\n          --a: 12deg; /* control the depth of the curvature */\n          --m: 0 / calc(2 * var(--r)) var(--r) no-repeat\n            radial-gradient(50% 100% at bottom, #000 calc(100% - 1px), #0000);\n          --d: (var(--s) + var(--r)) * cos(var(--a));\n\n          border-radius: var(--r);\n          width: 100%;\n          mask: calc(50% + var(--d)) var(--m), calc(50% - var(--d)) var(--m),\n            radial-gradient(\n                var(--s) at 50% calc(-1 * sin(var(--a)) * var(--s)),\n                #0000 100%,\n                #000 calc(100% + 1px)\n              )\n              0 calc(var(--r) * (1 - sin(var(--a)))) no-repeat,\n            linear-gradient(90deg, #000 calc(50% - var(--d)), #0000 0 calc(50% + var(--d)), #000 0);\n        }\n      `,\n    ];\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [({ email: v }) => !!v || 'email:v8n_required'];\n  }\n\n  /** Default host domain for stores that don't use a custom domain name, e.g. `foxycart.com`. */\n  defaultDomain: string | null = null;\n\n  /** Admin layout will display user info, user layout (default) will display store info. */\n  layout: 'admin' | 'user' | null = null;\n\n  private readonly __storeDomainGetValue = () => {\n    const defaultD = this.defaultDomain;\n    const domain = this.data?.store_domain;\n    return domain?.includes('.') || !defaultD ? domain : `${domain}.${defaultD}`;\n  };\n\n  get readonlySelector(): BooleanSelector {\n    const alwaysMatch = ['store', super.readonlySelector.toString()];\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = ['timestamps', 'submit', 'undo', super.hiddenSelector.toString()];\n    const status = this.data?.status;\n\n    if (status !== 'accepted' && status !== 'sent') alwaysMatch.unshift('revoke');\n    if (status !== 'rejected') alwaysMatch.unshift('delete');\n    if (status !== 'accepted') alwaysMatch.unshift('leave');\n    if (status !== 'revoked') alwaysMatch.unshift('invite-again');\n    if (status !== 'sent') alwaysMatch.unshift('resend', 'accept', 'reject');\n\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  renderBody(): TemplateResult {\n    const { layout, data } = this;\n\n    if (layout === 'admin') {\n      return data ? this.__renderAdminSnapshotState(data) : this.__renderAdminTemplateState();\n    } else {\n      return data ? this.__renderUserSnapshotState(data) : this.__renderUserTemplateState();\n    }\n  }\n\n  protected async _fetch<TResult = Data>(...args: Parameters<Window['fetch']>): Promise<TResult> {\n    try {\n      return await super._fetch(...args);\n    } catch (err) {\n      let message;\n\n      try {\n        message = (await (err as Response).json())._embedded['fx:errors'][0].message;\n      } catch {\n        throw err;\n      }\n\n      if (message.includes('already been created for this email and store')) {\n        throw ['error:invitation_exists'];\n      } else if (message.includes('already has access to this store')) {\n        throw ['error:already_has_access'];\n      } else {\n        throw err;\n      }\n    }\n  }\n\n  private async *__getGravatar(email?: string) {\n    yield html`\n      <div\n        style=\"height: 5rem; width: 5rem; left: calc(50% - 2.5rem); top: -2.8rem\"\n        class=\"rounded-full absolute top-0 bg-contrast-5\"\n      ></div>\n    `;\n\n    if (email) {\n      yield html`\n        <img\n          data-testid=\"gravatar\"\n          style=\"height: 5rem; width: 5rem; left: calc(50% - 2.5rem); top: -2.8rem\"\n          class=\"rounded-full absolute top-0 bg-contrast-5 shadow-xs\"\n          src=${await getGravatarUrl(email)}\n          alt=\"\"\n        />\n      `;\n    }\n  }\n\n  private __renderAdminTemplateState() {\n    return html`\n      ${this.renderHeader()}\n      <foxy-internal-text-control infer=\"email\"></foxy-internal-text-control>\n      ${super.renderBody()}\n    `;\n  }\n\n  private __renderUserTemplateState() {\n    return html`\n      <div class=\"p-xl flex items-center justify-center\">\n        <foxy-spinner layout=\"vertical\" infer=\"unavailable\" state=\"empty\"></foxy-spinner>\n      </div>\n    `;\n  }\n\n  private __renderAdminSnapshotState({ first_name, last_name }: Data) {\n    const hasName = first_name?.trim() || last_name?.trim();\n    const nameOptions = { first_name, last_name, context: hasName ? '' : 'empty' };\n    const hidden = this.hiddenSelector;\n\n    return html`\n      <div style=\"padding-top: 3.5rem\">\n        <div class=\"relative\">\n          <div class=\"inner-curve bg-contrast-5 absolute inset-0\"></div>\n          ${asyncReplace(this.__getGravatar(this.data?.email))}\n\n          <div\n            class=\"relative pb-m px-m leading-xs grid gap-m\"\n            style=\"padding-top: calc(2.5rem + var(--lumo-space-m))\"\n          >\n            <div>\n              <foxy-i18n\n                class=\"block text-xl font-medium text-center\"\n                infer=\"\"\n                key=\"full_name\"\n                .options=${nameOptions}\n              >\n              </foxy-i18n>\n              <div class=\"text-m text-center text-secondary\">${this.data?.email}</div>\n            </div>\n\n            <div\n              style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n              class=${classMap({\n                'border rounded': true,\n                'border-contrast text-contrast': this.data?.status === 'revoked',\n                'border-success text-success': this.data?.status === 'accepted',\n                'border-primary text-primary': this.data?.status === 'sent',\n                'border-error text-error': this.data?.status === 'rejected',\n              })}\n            >\n              <p class=\"font-medium flex items-center gap-s\">\n                ${this.data?.status === 'revoked'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm3 10.5a.75.75 0 0 0 0-1.5H9a.75.75 0 0 0 0 1.5h6Z\" clip-rule=\"evenodd\" /></svg>`\n                  : this.data?.status === 'sent'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25ZM12.75 6a.75.75 0 0 0-1.5 0v6c0 .414.336.75.75.75h4.5a.75.75 0 0 0 0-1.5h-3.75V6Z\" clip-rule=\"evenodd\" /></svg>`\n                  : this.data?.status === 'rejected'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm-1.72 6.97a.75.75 0 1 0-1.06 1.06L10.94 12l-1.72 1.72a.75.75 0 1 0 1.06 1.06L12 13.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L13.06 12l1.72-1.72a.75.75 0 1 0-1.06-1.06L12 10.94l-1.72-1.72Z\" clip-rule=\"evenodd\" /></svg>`\n                  : this.data?.status === 'accepted'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z\" clip-rule=\"evenodd\" /></svg>`\n                  : ''}\n                <foxy-i18n\n                  infer=\"\"\n                  key=\"admin_status_title\"\n                  .options=${{ context: this.data?.status }}\n                >\n                </foxy-i18n>\n              </p>\n\n              <p\n                class=\"text-body\"\n                style=\"padding-left: calc((1.25 * var(--lumo-font-size-m)) + var(--lumo-space-s))\"\n              >\n                <foxy-i18n\n                  infer=\"\"\n                  key=\"admin_status_text\"\n                  .options=${{ context: this.data?.status }}\n                >\n                </foxy-i18n>\n              </p>\n            </div>\n\n            <foxy-internal-user-invitation-form-sync-action status=\"sent\" infer=\"invite-again\">\n            </foxy-internal-user-invitation-form-sync-action>\n\n            <div\n              class=\"flex gap-m\"\n              ?hidden=${hidden.matches('revoke', true) && hidden.matches('resend', true)}\n            >\n              <foxy-internal-user-invitation-form-sync-action\n                status=\"revoked\"\n                class=\"flex-1\"\n                theme=\"error\"\n                infer=\"revoke\"\n              >\n              </foxy-internal-user-invitation-form-sync-action>\n\n              <foxy-internal-user-invitation-form-async-action\n                infer=\"resend\"\n                class=\"flex-1\"\n                href=${ifDefined(this.data?._links['fx:resend'].href)}\n              >\n              </foxy-internal-user-invitation-form-async-action>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private __renderUserSnapshotState({ status, store_name }: Data) {\n    const hidden = this.hiddenSelector;\n    const textColorMap = {\n      'text-primary': status === 'sent',\n      'text-success': status === 'accepted',\n      'text-error': status === 'rejected',\n      'text-body': status === 'revoked',\n    };\n\n    return html`\n      <div class=${classMap({ 'flex items-center gap-m': true, ...textColorMap })}>\n        <div class=\"border-t flex-1\"></div>\n        ${svg`<svg style=\"height: 5rem; width: 5rem\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 256 256\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M128 250c67.38 0 122-54.62 122-122S195.38 6 128 6 6 60.62 6 128s54.62 122 122 122Zm0 6c70.7 0 128-57.3 128-128S198.7 0 128 0 0 57.3 0 128s57.3 128 128 128Z\" clip-rule=\"evenodd\"/><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M128.5 218a89.5 89.5 0 1 0 0-179 89.5 89.5 0 0 0 0 179Zm23.8-46.25-5.13-3.08-54.48-32.91a3.6 3.6 0 0 1-1.69-3.12V78l5.07 3.02c1.06.6 1.78 1.8 1.78 3.15v46.4l52.75 31.87a3.63 3.63 0 0 1 1.72 3.17l-.01 6.14ZM166 180l-5.17-3.11a3.62 3.62 0 0 1-1.7-3.1v-46.47l-47.64-28.8v25.92l-.02 6.14-5.09-3.09a3.5 3.5 0 0 1-1.71-3.05V92.38a3.6 3.6 0 0 1 1.71-3.09 3.3 3.3 0 0 1 3.44.01l54.47 32.9a3.62 3.62 0 0 1 1.7 3.11v48.47L166 180Zm-46.1-44.34c.53.34 5.2 3.17 5.2 3.17s.04-4.24.04-6.22v-15.57c0-1.32-.68-2.48-1.7-3.1-.5-.31-5.14-3.06-5.14-3.06v21.73c0 1.29.64 2.41 1.6 3.05Zm18.86 11.42-5.17-3.14a3.62 3.62 0 0 1-1.66-3.08v-21.77l5.1 3.07a3.62 3.62 0 0 1 1.75 3.13v15.57l-.02 6.22Zm8.46 5.1 5.15 3.12v-21.78a3.6 3.6 0 0 0-1.8-3.16c-.48-.28-5.06-3.08-5.06-3.08v21.8c0 1.33.7 2.48 1.71 3.1Z\" clip-rule=\"evenodd\"/><path fill=\"currentColor\" d=\"M132.57 222a2.96 2.96 0 0 1 2.96 2.96v15.86a3 3 0 0 1-3 3h-9.95a2.39 2.39 0 1 1 0-4.78h5.15a1.88 1.88 0 0 0 0-3.75h-4.22a2.39 2.39 0 1 1 0-4.77h3.1a3 3 0 0 0 3-3v-2.56a2.96 2.96 0 0 1 2.96-2.96Zm-37.07 6.3c.5-2.37 1.39-4.28 2.66-5.71a9.51 9.51 0 0 1 4.52-2.9c1.75-.5 3.59-.55 5.52-.14a11.1 11.1 0 0 1 5 2.38 9.6 9.6 0 0 1 2.95 4.5c.57 1.83.6 3.93.1 6.29a12.33 12.33 0 0 1-2.65 5.7 9.44 9.44 0 0 1-4.52 2.91c-1.75.51-3.6.56-5.54.14a11.2 11.2 0 0 1-4.98-2.37 9.42 9.42 0 0 1-2.96-4.5 12.25 12.25 0 0 1-.1-6.3Zm5.95 1.27a9.13 9.13 0 0 0-.17 3.34c.14.95.5 1.73 1.06 2.32.56.6 1.31 1 2.27 1.2.96.2 1.82.15 2.58-.17a4.27 4.27 0 0 0 1.91-1.69 9.2 9.2 0 0 0 1.19-3.12c.27-1.28.33-2.4.19-3.35a4.33 4.33 0 0 0-1.07-2.31 4.28 4.28 0 0 0-2.28-1.2 4.24 4.24 0 0 0-2.56.17c-.76.31-1.4.88-1.92 1.68a9.23 9.23 0 0 0-1.2 3.13Zm-15.5 6.41a2.84 2.84 0 0 1-1.67-2.33l-.52-5.52c0-.05-.04-.1-.09-.12a.14.14 0 0 0-.15.02l-4.5 3.3a2.82 2.82 0 1 1-3.29-4.57l4.84-3.4a3 3 0 0 0 1.24-2.87l-.8-5.83a2.85 2.85 0 1 1 5.65-.68l.58 5.7c0 .05.04.1.09.12.05.02.1.01.14-.02l4.63-3.38a2.85 2.85 0 1 1 3.29 4.64l-4.87 3.34a3 3 0 0 0-1.28 2.83l.69 5.84a2.84 2.84 0 0 1-3.98 2.93Zm-16.33-12.59a2.87 2.87 0 1 1-5.67-.91l1.42-7.81a.14.14 0 0 0-.2-.15l-6.99 3.77a2.87 2.87 0 1 1-2.61-5.11l10.27-4.98a3 3 0 0 0 1.12-.94l1.86-2.56a2.94 2.94 0 1 1 4.76 3.46l-1.86 2.56a3 3 0 0 0-.55 1.36l-1.55 11.3Zm-11.39-33.1a2.93 2.93 0 0 1-.22 4.21c-.6.55-1.3.8-2.12.75a2.93 2.93 0 0 1-2.06-1 2.89 2.89 0 0 1-.74-2.11 2.8 2.8 0 0 1 2.35-2.76 3.2 3.2 0 0 1 1.52.09c.5.16.92.43 1.27.82ZM34.2 187.3a2.39 2.39 0 1 1-4.14 2.39l-4.37-7.57a2.39 2.39 0 1 1 4.13-2.38l4.37 7.56Zm14.75-8.52a2.39 2.39 0 0 1-4.13 2.38l-4.37-7.56a2.39 2.39 0 1 1 4.13-2.39l4.37 7.57Zm-21.08 7.13a2.96 2.96 0 0 1 1.09-4.05l13.76-7.95a2.96 2.96 0 0 1 2.96 5.13L31.92 187a2.96 2.96 0 0 1-4.05-1.09Zm-2.9-36.06c2.3-.75 4.4-.94 6.28-.56a9.51 9.51 0 0 1 4.78 2.47 11.27 11.27 0 0 1 2.88 4.71c.61 1.9.76 3.74.44 5.53a9.6 9.6 0 0 1-2.43 4.8c-1.3 1.4-3.1 2.48-5.4 3.23-2.3.75-4.4.94-6.26.56a9.44 9.44 0 0 1-4.78-2.46 11.24 11.24 0 0 1-2.9-4.73 11.2 11.2 0 0 1-.43-5.5 9.42 9.42 0 0 1 2.42-4.81 12.26 12.26 0 0 1 5.4-3.24Zm1.88 5.8c-1.24.4-2.23.9-2.98 1.5a4.2 4.2 0 0 0-1.47 2.09 4.2 4.2 0 0 0 .1 2.57c.3.93.77 1.64 1.43 2.14.64.5 1.45.77 2.41.82.96.05 2.06-.13 3.3-.54 1.25-.4 2.24-.9 3-1.5a4.34 4.34 0 0 0 1.47-2.09 4.3 4.3 0 0 0-.1-2.57 4.24 4.24 0 0 0-1.43-2.14 4.24 4.24 0 0 0-2.42-.82 9.24 9.24 0 0 0-3.3.53Zm3.91-38.41a4.55 4.55 0 0 1-.87 2.28 4.9 4.9 0 0 1-1.87 1.52c-.75.34-1.55.46-2.4.37a4.52 4.52 0 0 1-2.28-.87 4.81 4.81 0 0 1-1.9-4.28 4.72 4.72 0 0 1 5.15-4.17 4.8 4.8 0 0 1 3.8 2.74c.34.75.46 1.55.37 2.41ZM44.58 84.8a2.96 2.96 0 0 1-4.05 1.09L26.8 77.96a3 3 0 0 1-1.1-4.1l4.98-8.62a2.39 2.39 0 1 1 4.13 2.39l-2.58 4.46a1.88 1.88 0 0 0 3.25 1.88l2.1-3.66a2.39 2.39 0 1 1 4.14 2.39l-1.54 2.68a3 3 0 0 0 1.1 4.1l2.21 1.28a2.96 2.96 0 0 1 1.09 4.04Zm13.07-35.26a12.31 12.31 0 0 1 3.62 5.17c.6 1.81.69 3.6.25 5.37a11.27 11.27 0 0 1-2.64 4.85 11.24 11.24 0 0 1-4.56 3.14c-1.72.6-3.5.7-5.37.3a12.34 12.34 0 0 1-5.5-3.06 12.33 12.33 0 0 1-3.62-5.15 9.46 9.46 0 0 1-.25-5.36c.43-1.77 1.31-3.4 2.64-4.87a11.2 11.2 0 0 1 4.56-3.13 9.4 9.4 0 0 1 5.37-.31c1.86.4 3.7 1.43 5.5 3.05Zm-4.07 4.53a9.15 9.15 0 0 0-2.8-1.82 4.18 4.18 0 0 0-2.55-.24 4.2 4.2 0 0 0-2.17 1.37 4.24 4.24 0 0 0-1.14 2.31c-.1.8.06 1.64.5 2.5a9.33 9.33 0 0 0 2.11 2.6c.97.87 1.9 1.48 2.8 1.83.9.34 1.75.42 2.54.24a4.3 4.3 0 0 0 2.18-1.38 4.24 4.24 0 0 0 1.14-2.3c.1-.82-.06-1.65-.5-2.5a9.24 9.24 0 0 0-2.11-2.61Zm2.2-16.63c.83-.6 1.92-.7 2.85-.28l5.04 2.3a.15.15 0 0 0 .2-.15l-.6-5.55a2.82 2.82 0 1 1 5.6-.56l.53 5.89a3 3 0 0 0 1.86 2.5l5.45 2.23a2.85 2.85 0 1 1-2.24 5.24l-5.22-2.35a.15.15 0 0 0-.2.15l.61 5.7a2.85 2.85 0 1 1-5.66.52l-.46-5.88a3 3 0 0 0-1.8-2.52l-5.42-2.33a2.84 2.84 0 0 1-.54-4.9Zm19.07-7.84a2.87 2.87 0 1 1 3.62-4.47l6.06 5.14a.14.14 0 0 0 .22-.1l.23-7.93a2.87 2.87 0 1 1 5.74.29l-.83 11.38a3 3 0 0 0 .25 1.44l1.29 2.9a2.94 2.94 0 1 1-5.37 2.39l-1.3-2.9a3 3 0 0 0-.9-1.14l-9.01-7Zm34.35 6.68a2.93 2.93 0 0 1-3.53-2.3 2.78 2.78 0 0 1 .41-2.2 2.93 2.93 0 0 1 1.9-1.3 2.9 2.9 0 0 1 2.2.42 2.8 2.8 0 0 1 1.21 3.41c-.18.5-.46.93-.84 1.28-.38.35-.83.58-1.34.7Zm14.61-19.33a2.39 2.39 0 0 1 0-4.77h8.74a2.39 2.39 0 0 1 0 4.77h-8.74Zm0 17.05a2.39 2.39 0 0 1 0-4.77h8.74a2.39 2.39 0 0 1 0 4.77h-8.74Zm4.37-21.82a2.96 2.96 0 0 1 2.97 2.96v15.9a2.96 2.96 0 0 1-5.93 0v-15.9a2.96 2.96 0 0 1 2.96-2.96Zm32.68 15.52a12.24 12.24 0 0 1-2.66 5.71 9.5 9.5 0 0 1-4.53 2.9c-1.74.5-3.58.55-5.52.14a11.24 11.24 0 0 1-5-2.38 9.6 9.6 0 0 1-2.94-4.5 12.4 12.4 0 0 1-.1-6.29c.5-2.37 1.38-4.28 2.65-5.7a9.44 9.44 0 0 1 4.51-2.91c1.75-.51 3.6-.56 5.54-.14 1.94.4 3.6 1.2 4.99 2.37a9.42 9.42 0 0 1 2.95 4.5c.58 1.82.62 3.92.11 6.3Zm-5.96-1.27c.27-1.28.33-2.4.18-3.34a4.18 4.18 0 0 0-1.07-2.32 4.2 4.2 0 0 0-2.27-1.2 4.24 4.24 0 0 0-2.57.17c-.75.31-1.39.88-1.92 1.69a9.2 9.2 0 0 0-1.18 3.12 9.4 9.4 0 0 0-.2 3.35 4.4 4.4 0 0 0 1.07 2.31c.57.6 1.33 1 2.29 1.2.96.2 1.8.15 2.56-.17.75-.31 1.4-.88 1.91-1.68.53-.81.93-1.85 1.2-3.13Zm31.3 22.59a4.54 4.54 0 0 1-1.53-1.9 4.9 4.9 0 0 1-.38-2.38 4.5 4.5 0 0 1 .88-2.27c.5-.7 1.14-1.21 1.89-1.54a4.81 4.81 0 0 1 4.65.5 4.72 4.72 0 0 1 1.04 6.55 4.8 4.8 0 0 1-4.27 1.91 4.51 4.51 0 0 1-2.28-.87Zm21.19 28.18a2.96 2.96 0 0 1 1.08-4.05l13.73-7.93a3 3 0 0 1 4.1 1.1l4.98 8.62a2.39 2.39 0 0 1-4.13 2.39l-2.58-4.47a1.87 1.87 0 1 0-3.25 1.88l2.11 3.65a2.39 2.39 0 1 1-4.13 2.39l-1.55-2.68a3 3 0 0 0-4.1-1.1l-2.22 1.28a2.96 2.96 0 0 1-4.04-1.08Zm24 28.95c-2.31.75-4.4.94-6.29.56a9.5 9.5 0 0 1-4.78-2.47 11.26 11.26 0 0 1-2.87-4.71c-.61-1.9-.76-3.74-.44-5.53a9.6 9.6 0 0 1 2.43-4.8 12.5 12.5 0 0 1 5.39-3.23c2.31-.75 4.4-.94 6.27-.56a9.44 9.44 0 0 1 4.78 2.46 11.23 11.23 0 0 1 2.89 4.73c.6 1.88.75 3.71.43 5.5a9.43 9.43 0 0 1-2.41 4.81 12.26 12.26 0 0 1-5.4 3.24Zm-1.89-5.8c1.25-.4 2.24-.9 2.98-1.5a4.17 4.17 0 0 0 1.48-2.09 4.2 4.2 0 0 0-.1-2.57 4.25 4.25 0 0 0-1.43-2.14 4.27 4.27 0 0 0-2.42-.82 9.32 9.32 0 0 0-3.3.54c-1.24.4-2.24.9-2.99 1.5a4.34 4.34 0 0 0-1.47 2.09 4.3 4.3 0 0 0 .1 2.57c.3.93.78 1.65 1.43 2.14.65.5 1.46.77 2.41.82.97.05 2.07-.13 3.31-.53Zm13.3 10.23a2.84 2.84 0 0 1-1.18 2.61l-4.52 3.21a.15.15 0 0 0-.06.14c.01.05.04.1.1.12l5.1 2.24a2.82 2.82 0 1 1-2.31 5.14l-5.37-2.48a3 3 0 0 0-3.1.35l-4.65 3.61a2.85 2.85 0 1 1-3.41-4.56l4.64-3.35a.15.15 0 0 0 .06-.13c0-.06-.04-.1-.08-.12l-5.25-2.31a2.84 2.84 0 1 1 2.38-5.17l5.32 2.54a3 3 0 0 0 3.1-.3l4.71-3.52a2.84 2.84 0 0 1 4.52 1.98Zm-2.74 20.44a2.87 2.87 0 1 1 2.06 5.36l-7.48 2.68a.13.13 0 0 0-.1.11c0 .06.03.1.07.13l6.76 4.17a2.87 2.87 0 1 1-3.12 4.83l-9.45-6.42a3 3 0 0 0-1.37-.5l-3.15-.33a2.94 2.94 0 0 1 .62-5.85l3.14.33a3 3 0 0 0 1.45-.2l10.57-4.31Zm-22.96 26.41a2.93 2.93 0 0 1 3.75-1.92 2.8 2.8 0 0 1 1.71 1.47c.37.74.42 1.5.17 2.28-.24.74-.73 1.3-1.46 1.7a2.8 2.8 0 0 1-3.56-.66c-.34-.4-.57-.85-.7-1.36-.1-.5-.08-1.01.09-1.51Zm9.43 22.32a2.39 2.39 0 1 1 4.13 2.38l-4.37 7.57a2.39 2.39 0 1 1-4.13-2.39l4.37-7.56Zm-14.77-8.53a2.39 2.39 0 1 1 4.14 2.39l-4.37 7.56a2.39 2.39 0 0 1-4.13-2.38l4.36-7.57Zm16.72 14.7a2.96 2.96 0 0 1-4.05 1.08l-13.76-7.95a2.96 2.96 0 1 1 2.96-5.13l13.76 7.95a2.96 2.96 0 0 1 1.09 4.04Zm-29.78 20.54a12.3 12.3 0 0 1-3.62-5.17 9.5 9.5 0 0 1-.25-5.37 11.27 11.27 0 0 1 2.64-4.85 11.25 11.25 0 0 1 4.57-3.14 9.6 9.6 0 0 1 5.37-.3c1.87.43 3.7 1.44 5.5 3.06a12.33 12.33 0 0 1 3.61 5.15c.61 1.82.7 3.6.26 5.36a11.24 11.24 0 0 1-2.65 4.87 11.2 11.2 0 0 1-4.55 3.13 9.4 9.4 0 0 1-5.37.31 12.26 12.26 0 0 1-5.5-3.05Zm4.08-4.53c.97.88 1.9 1.48 2.8 1.82.9.35 1.75.43 2.54.24a4.2 4.2 0 0 0 2.18-1.37 4.24 4.24 0 0 0 1.14-2.31c.1-.8-.07-1.64-.5-2.5a9.33 9.33 0 0 0-2.12-2.6 9.4 9.4 0 0 0-2.8-1.83 4.34 4.34 0 0 0-2.54-.24c-.8.2-1.52.66-2.17 1.39a4.24 4.24 0 0 0-1.14 2.3c-.1.81.06 1.64.5 2.5a9.21 9.21 0 0 0 2.11 2.6Zm-35.21 15.81a4.54 4.54 0 0 1 2.4-.38c.83.1 1.58.39 2.25.86a4.55 4.55 0 0 1 1.54 1.9c.35.79.48 1.6.38 2.4a4.81 4.81 0 0 1-2.76 3.79 4.73 4.73 0 0 1-6.19-2.38 4.81 4.81 0 0 1 .48-4.66 4.51 4.51 0 0 1 1.9-1.53Z\"/></svg>`}\n        <div class=\"border-t flex-1\"></div>\n      </div>\n\n      <foxy-i18n\n        infer=\"\"\n        class=${classMap({ 'block text-center text-xl font-medium': true, ...textColorMap })}\n        key=\"user_status_title\"\n        .options=${{ context: status, store_name }}\n      >\n      </foxy-i18n>\n\n      <foxy-internal-summary-control infer=\"store\">\n        <foxy-internal-text-control\n          layout=\"summary-item\"\n          infer=\"store-domain\"\n          .getValue=${this.__storeDomainGetValue}\n        >\n        </foxy-internal-text-control>\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"store-url\">\n        </foxy-internal-text-control>\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"store-email\">\n        </foxy-internal-text-control>\n      </foxy-internal-summary-control>\n\n      <foxy-i18n\n        class=\"block text-secondary text-center\"\n        infer=\"\"\n        key=\"user_status_text\"\n        .options=${{ context: status, store_name }}\n      >\n      </foxy-i18n>\n\n      <foxy-internal-user-invitation-form-sync-action\n        status=\"revoked\"\n        theme=\"error\"\n        class=\"flex-1\"\n        infer=\"leave\"\n      >\n      </foxy-internal-user-invitation-form-sync-action>\n\n      <div\n        class=\"grid grid-cols-2 gap-m\"\n        ?hidden=${hidden.matches('reject', true) && hidden.matches('accept', true)}\n      >\n        <foxy-internal-user-invitation-form-sync-action\n          status=\"rejected\"\n          theme=\"error primary\"\n          infer=\"reject\"\n        >\n        </foxy-internal-user-invitation-form-sync-action>\n\n        <foxy-internal-user-invitation-form-sync-action\n          status=\"accepted\"\n          theme=\"success primary\"\n          infer=\"accept\"\n        >\n        </foxy-internal-user-invitation-form-sync-action>\n      </div>\n\n      <foxy-internal-delete-control infer=\"delete\"></foxy-internal-delete-control>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"UserInvitationForm.js","sourceRoot":"","sources":["../../../../src/elements/public/UserInvitationForm/UserInvitationForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { CSSResultArray, PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { getGravatarUrl } from '../../../utils/get-gravatar-url';\nimport { html, svg, css } from 'lit-element';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { asyncReplace } from 'lit-html/directives/async-replace';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'user-invitation-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\nexport class UserInvitationForm extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      getStorePageHref: { attribute: false },\n      defaultDomain: { attribute: 'default-domain' },\n      layout: {},\n    };\n  }\n\n  static get styles(): CSSResultArray {\n    return [\n      ...super.styles,\n      css`\n        .inner-curve {\n          --r: var(--lumo-border-radius-l); /* control the rounded part */\n          --s: 3rem; /* control the size of the cut */\n          --a: 12deg; /* control the depth of the curvature */\n          --m: 0 / calc(2 * var(--r)) var(--r) no-repeat\n            radial-gradient(50% 100% at bottom, #000 calc(100% - 1px), #0000);\n          --d: (var(--s) + var(--r)) * cos(var(--a));\n\n          border-radius: var(--r);\n          width: 100%;\n          mask: calc(50% + var(--d)) var(--m), calc(50% - var(--d)) var(--m),\n            radial-gradient(\n                var(--s) at 50% calc(-1 * sin(var(--a)) * var(--s)),\n                #0000 100%,\n                #000 calc(100% + 1px)\n              )\n              0 calc(var(--r) * (1 - sin(var(--a)))) no-repeat,\n            linear-gradient(90deg, #000 calc(50% - var(--d)), #0000 0 calc(50% + var(--d)), #000 0);\n        }\n      `,\n    ];\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [({ email: v }) => !!v || 'email:v8n_required'];\n  }\n\n  /** When provided, displays a link to Store Dashboard in user layout. */\n  getStorePageHref: ((storeHref: string) => string) | null = null;\n\n  /** Default host domain for stores that don't use a custom domain name, e.g. `foxycart.com`. */\n  defaultDomain: string | null = null;\n\n  /** Admin layout will display user info, user layout (default) will display store info. */\n  layout: 'admin' | 'user' | null = null;\n\n  private readonly __storeDomainGetValue = () => {\n    const defaultD = this.defaultDomain;\n    const domain = this.data?.store_domain;\n    return domain?.includes('.') || !defaultD ? domain : `${domain}.${defaultD}`;\n  };\n\n  get readonlySelector(): BooleanSelector {\n    const alwaysMatch = ['store', super.readonlySelector.toString()];\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = ['timestamps', 'submit', 'undo', super.hiddenSelector.toString()];\n    const status = this.data?.status;\n    const layout = this.layout ?? 'user';\n\n    if (status !== 'accepted' && status !== 'sent') alwaysMatch.unshift('revoke');\n    if (status !== 'accepted') alwaysMatch.unshift('leave');\n    if (status !== 'sent') alwaysMatch.unshift('accept', 'reject');\n\n    if (\n      (status !== 'rejected' || layout !== 'user') &&\n      (status !== 'expired' || layout !== 'admin')\n    ) {\n      alwaysMatch.unshift('delete');\n    }\n\n    if (status !== 'sent' && status !== 'revoked' && (status !== 'expired' || layout !== 'admin')) {\n      alwaysMatch.unshift('resend');\n    }\n\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  renderBody(): TemplateResult {\n    const { layout, data } = this;\n\n    if (layout === 'admin') {\n      return data ? this.__renderAdminSnapshotState(data) : this.__renderAdminTemplateState();\n    } else {\n      return data ? this.__renderUserSnapshotState(data) : this.__renderUserTemplateState();\n    }\n  }\n\n  protected async _fetch<TResult = Data>(...args: Parameters<Window['fetch']>): Promise<TResult> {\n    try {\n      return await super._fetch(...args);\n    } catch (err) {\n      let message;\n\n      try {\n        message = (await (err as Response).json())._embedded['fx:errors'][0].message;\n      } catch {\n        throw err;\n      }\n\n      if (message.includes('already been created for this email and store')) {\n        throw ['error:invitation_exists'];\n      } else if (message.includes('already has access to this store')) {\n        throw ['error:already_has_access'];\n      } else {\n        throw err;\n      }\n    }\n  }\n\n  private async *__getGravatar(email?: string) {\n    yield html`\n      <div\n        style=\"height: 5rem; width: 5rem; left: calc(50% - 2.5rem); top: -2.8rem\"\n        class=\"rounded-full absolute top-0 bg-contrast-5\"\n      ></div>\n    `;\n\n    if (email) {\n      yield html`\n        <img\n          data-testid=\"gravatar\"\n          style=\"height: 5rem; width: 5rem; left: calc(50% - 2.5rem); top: -2.8rem\"\n          class=\"rounded-full absolute top-0 bg-contrast-5 shadow-xs\"\n          src=${await getGravatarUrl(email)}\n          alt=\"\"\n        />\n      `;\n    }\n  }\n\n  private __renderAdminTemplateState() {\n    return html`\n      ${this.renderHeader()}\n      <foxy-internal-text-control infer=\"email\"></foxy-internal-text-control>\n      ${super.renderBody()}\n    `;\n  }\n\n  private __renderUserTemplateState() {\n    return html`\n      <div class=\"p-xl flex items-center justify-center\">\n        <foxy-spinner layout=\"vertical\" infer=\"unavailable\" state=\"empty\"></foxy-spinner>\n      </div>\n    `;\n  }\n\n  private __renderAdminSnapshotState({ first_name, last_name }: Data) {\n    const hasName = first_name?.trim() || last_name?.trim();\n    const nameOptions = { first_name, last_name, context: hasName ? '' : 'empty' };\n    const status = this.data?.status;\n    const hidden = this.hiddenSelector;\n\n    return html`\n      <div style=\"padding-top: 3.5rem\">\n        <div class=\"relative\">\n          <div class=\"inner-curve bg-contrast-5 absolute inset-0\"></div>\n          ${asyncReplace(this.__getGravatar(this.data?.email))}\n\n          <div\n            class=\"relative pb-m px-m leading-xs grid gap-m\"\n            style=\"padding-top: calc(2.5rem + var(--lumo-space-m))\"\n          >\n            <div>\n              <foxy-i18n\n                class=\"block text-xl font-medium text-center\"\n                infer=\"\"\n                key=\"full_name\"\n                .options=${nameOptions}\n              >\n              </foxy-i18n>\n              <div class=\"text-m text-center text-secondary\">${this.data?.email}</div>\n            </div>\n\n            <div\n              style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n              class=${classMap({\n                'border rounded': true,\n                'border-contrast text-contrast': status === 'revoked' || status === 'expired',\n                'border-success text-success': status === 'accepted',\n                'border-primary text-primary': status === 'sent',\n                'border-error text-error': status === 'rejected',\n              })}\n            >\n              <p class=\"font-medium flex items-center gap-s\">\n                ${status === 'revoked'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm3 10.5a.75.75 0 0 0 0-1.5H9a.75.75 0 0 0 0 1.5h6Z\" clip-rule=\"evenodd\" /></svg>`\n                  : status === 'sent'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25ZM12.75 6a.75.75 0 0 0-1.5 0v6c0 .414.336.75.75.75h4.5a.75.75 0 0 0 0-1.5h-3.75V6Z\" clip-rule=\"evenodd\" /></svg>`\n                  : status === 'rejected'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm-1.72 6.97a.75.75 0 1 0-1.06 1.06L10.94 12l-1.72 1.72a.75.75 0 1 0 1.06 1.06L12 13.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L13.06 12l1.72-1.72a.75.75 0 1 0-1.06-1.06L12 10.94l-1.72-1.72Z\" clip-rule=\"evenodd\" /></svg>`\n                  : status === 'accepted'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path fill-rule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z\" clip-rule=\"evenodd\" /></svg>`\n                  : status === 'expired'\n                  ? svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" style=\"width: 1.25em; height: 1.25em\"><path d=\"M3.375 3C2.339 3 1.5 3.84 1.5 4.875v.75c0 1.036.84 1.875 1.875 1.875h17.25c1.035 0 1.875-.84 1.875-1.875v-.75C22.5 3.839 21.66 3 20.625 3H3.375Z\" /><path fill-rule=\"evenodd\" d=\"m3.087 9 .54 9.176A3 3 0 0 0 6.62 21h10.757a3 3 0 0 0 2.995-2.824L20.913 9H3.087Zm6.133 2.845a.75.75 0 0 1 1.06 0l1.72 1.72 1.72-1.72a.75.75 0 1 1 1.06 1.06l-1.72 1.72 1.72 1.72a.75.75 0 1 1-1.06 1.06L12 15.685l-1.72 1.72a.75.75 0 1 1-1.06-1.06l1.72-1.72-1.72-1.72a.75.75 0 0 1 0-1.06Z\" clip-rule=\"evenodd\" /></svg>`\n                  : ''}\n                <foxy-i18n infer=\"\" key=\"admin_status_title\" .options=${{ context: status }}>\n                </foxy-i18n>\n              </p>\n\n              <p\n                class=\"text-body\"\n                style=\"padding-left: calc((1.25 * var(--lumo-font-size-m)) + var(--lumo-space-s))\"\n              >\n                <foxy-i18n infer=\"\" key=\"admin_status_text\" .options=${{ context: status }}>\n                </foxy-i18n>\n              </p>\n            </div>\n\n            <div\n              class=\"flex gap-m\"\n              ?hidden=${hidden.matches('revoke', true) &&\n              hidden.matches('resend', true) &&\n              hidden.matches('delete', true)}\n            >\n              <foxy-internal-user-invitation-form-async-action\n                infer=\"revoke\"\n                class=\"flex-1\"\n                theme=\"error\"\n                href=${ifDefined(this.data?._links['fx:revoke']?.href)}\n              >\n              </foxy-internal-user-invitation-form-async-action>\n\n              <foxy-internal-user-invitation-form-async-action\n                infer=\"resend\"\n                class=\"flex-1\"\n                href=${ifDefined(this.data?._links['fx:resend']?.href)}\n              >\n              </foxy-internal-user-invitation-form-async-action>\n\n              <foxy-internal-delete-control infer=\"delete\" class=\"flex-1\">\n              </foxy-internal-delete-control>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private __renderUserSnapshotState({ status, store_name }: Data) {\n    const hidden = this.hiddenSelector;\n    const textColorMap = {\n      'text-primary': status === 'sent',\n      'text-success': status === 'accepted',\n      'text-error': status === 'rejected',\n    };\n\n    return html`\n      <div class=${classMap({ 'flex items-center gap-m': true, ...textColorMap })}>\n        <div class=\"border-t flex-1\"></div>\n        ${svg`<svg style=\"height: 5rem; width: 5rem\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 256 256\"><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M128 250c67.38 0 122-54.62 122-122S195.38 6 128 6 6 60.62 6 128s54.62 122 122 122Zm0 6c70.7 0 128-57.3 128-128S198.7 0 128 0 0 57.3 0 128s57.3 128 128 128Z\" clip-rule=\"evenodd\"/><path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M128.5 218a89.5 89.5 0 1 0 0-179 89.5 89.5 0 0 0 0 179Zm23.8-46.25-5.13-3.08-54.48-32.91a3.6 3.6 0 0 1-1.69-3.12V78l5.07 3.02c1.06.6 1.78 1.8 1.78 3.15v46.4l52.75 31.87a3.63 3.63 0 0 1 1.72 3.17l-.01 6.14ZM166 180l-5.17-3.11a3.62 3.62 0 0 1-1.7-3.1v-46.47l-47.64-28.8v25.92l-.02 6.14-5.09-3.09a3.5 3.5 0 0 1-1.71-3.05V92.38a3.6 3.6 0 0 1 1.71-3.09 3.3 3.3 0 0 1 3.44.01l54.47 32.9a3.62 3.62 0 0 1 1.7 3.11v48.47L166 180Zm-46.1-44.34c.53.34 5.2 3.17 5.2 3.17s.04-4.24.04-6.22v-15.57c0-1.32-.68-2.48-1.7-3.1-.5-.31-5.14-3.06-5.14-3.06v21.73c0 1.29.64 2.41 1.6 3.05Zm18.86 11.42-5.17-3.14a3.62 3.62 0 0 1-1.66-3.08v-21.77l5.1 3.07a3.62 3.62 0 0 1 1.75 3.13v15.57l-.02 6.22Zm8.46 5.1 5.15 3.12v-21.78a3.6 3.6 0 0 0-1.8-3.16c-.48-.28-5.06-3.08-5.06-3.08v21.8c0 1.33.7 2.48 1.71 3.1Z\" clip-rule=\"evenodd\"/><path fill=\"currentColor\" d=\"M132.57 222a2.96 2.96 0 0 1 2.96 2.96v15.86a3 3 0 0 1-3 3h-9.95a2.39 2.39 0 1 1 0-4.78h5.15a1.88 1.88 0 0 0 0-3.75h-4.22a2.39 2.39 0 1 1 0-4.77h3.1a3 3 0 0 0 3-3v-2.56a2.96 2.96 0 0 1 2.96-2.96Zm-37.07 6.3c.5-2.37 1.39-4.28 2.66-5.71a9.51 9.51 0 0 1 4.52-2.9c1.75-.5 3.59-.55 5.52-.14a11.1 11.1 0 0 1 5 2.38 9.6 9.6 0 0 1 2.95 4.5c.57 1.83.6 3.93.1 6.29a12.33 12.33 0 0 1-2.65 5.7 9.44 9.44 0 0 1-4.52 2.91c-1.75.51-3.6.56-5.54.14a11.2 11.2 0 0 1-4.98-2.37 9.42 9.42 0 0 1-2.96-4.5 12.25 12.25 0 0 1-.1-6.3Zm5.95 1.27a9.13 9.13 0 0 0-.17 3.34c.14.95.5 1.73 1.06 2.32.56.6 1.31 1 2.27 1.2.96.2 1.82.15 2.58-.17a4.27 4.27 0 0 0 1.91-1.69 9.2 9.2 0 0 0 1.19-3.12c.27-1.28.33-2.4.19-3.35a4.33 4.33 0 0 0-1.07-2.31 4.28 4.28 0 0 0-2.28-1.2 4.24 4.24 0 0 0-2.56.17c-.76.31-1.4.88-1.92 1.68a9.23 9.23 0 0 0-1.2 3.13Zm-15.5 6.41a2.84 2.84 0 0 1-1.67-2.33l-.52-5.52c0-.05-.04-.1-.09-.12a.14.14 0 0 0-.15.02l-4.5 3.3a2.82 2.82 0 1 1-3.29-4.57l4.84-3.4a3 3 0 0 0 1.24-2.87l-.8-5.83a2.85 2.85 0 1 1 5.65-.68l.58 5.7c0 .05.04.1.09.12.05.02.1.01.14-.02l4.63-3.38a2.85 2.85 0 1 1 3.29 4.64l-4.87 3.34a3 3 0 0 0-1.28 2.83l.69 5.84a2.84 2.84 0 0 1-3.98 2.93Zm-16.33-12.59a2.87 2.87 0 1 1-5.67-.91l1.42-7.81a.14.14 0 0 0-.2-.15l-6.99 3.77a2.87 2.87 0 1 1-2.61-5.11l10.27-4.98a3 3 0 0 0 1.12-.94l1.86-2.56a2.94 2.94 0 1 1 4.76 3.46l-1.86 2.56a3 3 0 0 0-.55 1.36l-1.55 11.3Zm-11.39-33.1a2.93 2.93 0 0 1-.22 4.21c-.6.55-1.3.8-2.12.75a2.93 2.93 0 0 1-2.06-1 2.89 2.89 0 0 1-.74-2.11 2.8 2.8 0 0 1 2.35-2.76 3.2 3.2 0 0 1 1.52.09c.5.16.92.43 1.27.82ZM34.2 187.3a2.39 2.39 0 1 1-4.14 2.39l-4.37-7.57a2.39 2.39 0 1 1 4.13-2.38l4.37 7.56Zm14.75-8.52a2.39 2.39 0 0 1-4.13 2.38l-4.37-7.56a2.39 2.39 0 1 1 4.13-2.39l4.37 7.57Zm-21.08 7.13a2.96 2.96 0 0 1 1.09-4.05l13.76-7.95a2.96 2.96 0 0 1 2.96 5.13L31.92 187a2.96 2.96 0 0 1-4.05-1.09Zm-2.9-36.06c2.3-.75 4.4-.94 6.28-.56a9.51 9.51 0 0 1 4.78 2.47 11.27 11.27 0 0 1 2.88 4.71c.61 1.9.76 3.74.44 5.53a9.6 9.6 0 0 1-2.43 4.8c-1.3 1.4-3.1 2.48-5.4 3.23-2.3.75-4.4.94-6.26.56a9.44 9.44 0 0 1-4.78-2.46 11.24 11.24 0 0 1-2.9-4.73 11.2 11.2 0 0 1-.43-5.5 9.42 9.42 0 0 1 2.42-4.81 12.26 12.26 0 0 1 5.4-3.24Zm1.88 5.8c-1.24.4-2.23.9-2.98 1.5a4.2 4.2 0 0 0-1.47 2.09 4.2 4.2 0 0 0 .1 2.57c.3.93.77 1.64 1.43 2.14.64.5 1.45.77 2.41.82.96.05 2.06-.13 3.3-.54 1.25-.4 2.24-.9 3-1.5a4.34 4.34 0 0 0 1.47-2.09 4.3 4.3 0 0 0-.1-2.57 4.24 4.24 0 0 0-1.43-2.14 4.24 4.24 0 0 0-2.42-.82 9.24 9.24 0 0 0-3.3.53Zm3.91-38.41a4.55 4.55 0 0 1-.87 2.28 4.9 4.9 0 0 1-1.87 1.52c-.75.34-1.55.46-2.4.37a4.52 4.52 0 0 1-2.28-.87 4.81 4.81 0 0 1-1.9-4.28 4.72 4.72 0 0 1 5.15-4.17 4.8 4.8 0 0 1 3.8 2.74c.34.75.46 1.55.37 2.41ZM44.58 84.8a2.96 2.96 0 0 1-4.05 1.09L26.8 77.96a3 3 0 0 1-1.1-4.1l4.98-8.62a2.39 2.39 0 1 1 4.13 2.39l-2.58 4.46a1.88 1.88 0 0 0 3.25 1.88l2.1-3.66a2.39 2.39 0 1 1 4.14 2.39l-1.54 2.68a3 3 0 0 0 1.1 4.1l2.21 1.28a2.96 2.96 0 0 1 1.09 4.04Zm13.07-35.26a12.31 12.31 0 0 1 3.62 5.17c.6 1.81.69 3.6.25 5.37a11.27 11.27 0 0 1-2.64 4.85 11.24 11.24 0 0 1-4.56 3.14c-1.72.6-3.5.7-5.37.3a12.34 12.34 0 0 1-5.5-3.06 12.33 12.33 0 0 1-3.62-5.15 9.46 9.46 0 0 1-.25-5.36c.43-1.77 1.31-3.4 2.64-4.87a11.2 11.2 0 0 1 4.56-3.13 9.4 9.4 0 0 1 5.37-.31c1.86.4 3.7 1.43 5.5 3.05Zm-4.07 4.53a9.15 9.15 0 0 0-2.8-1.82 4.18 4.18 0 0 0-2.55-.24 4.2 4.2 0 0 0-2.17 1.37 4.24 4.24 0 0 0-1.14 2.31c-.1.8.06 1.64.5 2.5a9.33 9.33 0 0 0 2.11 2.6c.97.87 1.9 1.48 2.8 1.83.9.34 1.75.42 2.54.24a4.3 4.3 0 0 0 2.18-1.38 4.24 4.24 0 0 0 1.14-2.3c.1-.82-.06-1.65-.5-2.5a9.24 9.24 0 0 0-2.11-2.61Zm2.2-16.63c.83-.6 1.92-.7 2.85-.28l5.04 2.3a.15.15 0 0 0 .2-.15l-.6-5.55a2.82 2.82 0 1 1 5.6-.56l.53 5.89a3 3 0 0 0 1.86 2.5l5.45 2.23a2.85 2.85 0 1 1-2.24 5.24l-5.22-2.35a.15.15 0 0 0-.2.15l.61 5.7a2.85 2.85 0 1 1-5.66.52l-.46-5.88a3 3 0 0 0-1.8-2.52l-5.42-2.33a2.84 2.84 0 0 1-.54-4.9Zm19.07-7.84a2.87 2.87 0 1 1 3.62-4.47l6.06 5.14a.14.14 0 0 0 .22-.1l.23-7.93a2.87 2.87 0 1 1 5.74.29l-.83 11.38a3 3 0 0 0 .25 1.44l1.29 2.9a2.94 2.94 0 1 1-5.37 2.39l-1.3-2.9a3 3 0 0 0-.9-1.14l-9.01-7Zm34.35 6.68a2.93 2.93 0 0 1-3.53-2.3 2.78 2.78 0 0 1 .41-2.2 2.93 2.93 0 0 1 1.9-1.3 2.9 2.9 0 0 1 2.2.42 2.8 2.8 0 0 1 1.21 3.41c-.18.5-.46.93-.84 1.28-.38.35-.83.58-1.34.7Zm14.61-19.33a2.39 2.39 0 0 1 0-4.77h8.74a2.39 2.39 0 0 1 0 4.77h-8.74Zm0 17.05a2.39 2.39 0 0 1 0-4.77h8.74a2.39 2.39 0 0 1 0 4.77h-8.74Zm4.37-21.82a2.96 2.96 0 0 1 2.97 2.96v15.9a2.96 2.96 0 0 1-5.93 0v-15.9a2.96 2.96 0 0 1 2.96-2.96Zm32.68 15.52a12.24 12.24 0 0 1-2.66 5.71 9.5 9.5 0 0 1-4.53 2.9c-1.74.5-3.58.55-5.52.14a11.24 11.24 0 0 1-5-2.38 9.6 9.6 0 0 1-2.94-4.5 12.4 12.4 0 0 1-.1-6.29c.5-2.37 1.38-4.28 2.65-5.7a9.44 9.44 0 0 1 4.51-2.91c1.75-.51 3.6-.56 5.54-.14 1.94.4 3.6 1.2 4.99 2.37a9.42 9.42 0 0 1 2.95 4.5c.58 1.82.62 3.92.11 6.3Zm-5.96-1.27c.27-1.28.33-2.4.18-3.34a4.18 4.18 0 0 0-1.07-2.32 4.2 4.2 0 0 0-2.27-1.2 4.24 4.24 0 0 0-2.57.17c-.75.31-1.39.88-1.92 1.69a9.2 9.2 0 0 0-1.18 3.12 9.4 9.4 0 0 0-.2 3.35 4.4 4.4 0 0 0 1.07 2.31c.57.6 1.33 1 2.29 1.2.96.2 1.8.15 2.56-.17.75-.31 1.4-.88 1.91-1.68.53-.81.93-1.85 1.2-3.13Zm31.3 22.59a4.54 4.54 0 0 1-1.53-1.9 4.9 4.9 0 0 1-.38-2.38 4.5 4.5 0 0 1 .88-2.27c.5-.7 1.14-1.21 1.89-1.54a4.81 4.81 0 0 1 4.65.5 4.72 4.72 0 0 1 1.04 6.55 4.8 4.8 0 0 1-4.27 1.91 4.51 4.51 0 0 1-2.28-.87Zm21.19 28.18a2.96 2.96 0 0 1 1.08-4.05l13.73-7.93a3 3 0 0 1 4.1 1.1l4.98 8.62a2.39 2.39 0 0 1-4.13 2.39l-2.58-4.47a1.87 1.87 0 1 0-3.25 1.88l2.11 3.65a2.39 2.39 0 1 1-4.13 2.39l-1.55-2.68a3 3 0 0 0-4.1-1.1l-2.22 1.28a2.96 2.96 0 0 1-4.04-1.08Zm24 28.95c-2.31.75-4.4.94-6.29.56a9.5 9.5 0 0 1-4.78-2.47 11.26 11.26 0 0 1-2.87-4.71c-.61-1.9-.76-3.74-.44-5.53a9.6 9.6 0 0 1 2.43-4.8 12.5 12.5 0 0 1 5.39-3.23c2.31-.75 4.4-.94 6.27-.56a9.44 9.44 0 0 1 4.78 2.46 11.23 11.23 0 0 1 2.89 4.73c.6 1.88.75 3.71.43 5.5a9.43 9.43 0 0 1-2.41 4.81 12.26 12.26 0 0 1-5.4 3.24Zm-1.89-5.8c1.25-.4 2.24-.9 2.98-1.5a4.17 4.17 0 0 0 1.48-2.09 4.2 4.2 0 0 0-.1-2.57 4.25 4.25 0 0 0-1.43-2.14 4.27 4.27 0 0 0-2.42-.82 9.32 9.32 0 0 0-3.3.54c-1.24.4-2.24.9-2.99 1.5a4.34 4.34 0 0 0-1.47 2.09 4.3 4.3 0 0 0 .1 2.57c.3.93.78 1.65 1.43 2.14.65.5 1.46.77 2.41.82.97.05 2.07-.13 3.31-.53Zm13.3 10.23a2.84 2.84 0 0 1-1.18 2.61l-4.52 3.21a.15.15 0 0 0-.06.14c.01.05.04.1.1.12l5.1 2.24a2.82 2.82 0 1 1-2.31 5.14l-5.37-2.48a3 3 0 0 0-3.1.35l-4.65 3.61a2.85 2.85 0 1 1-3.41-4.56l4.64-3.35a.15.15 0 0 0 .06-.13c0-.06-.04-.1-.08-.12l-5.25-2.31a2.84 2.84 0 1 1 2.38-5.17l5.32 2.54a3 3 0 0 0 3.1-.3l4.71-3.52a2.84 2.84 0 0 1 4.52 1.98Zm-2.74 20.44a2.87 2.87 0 1 1 2.06 5.36l-7.48 2.68a.13.13 0 0 0-.1.11c0 .06.03.1.07.13l6.76 4.17a2.87 2.87 0 1 1-3.12 4.83l-9.45-6.42a3 3 0 0 0-1.37-.5l-3.15-.33a2.94 2.94 0 0 1 .62-5.85l3.14.33a3 3 0 0 0 1.45-.2l10.57-4.31Zm-22.96 26.41a2.93 2.93 0 0 1 3.75-1.92 2.8 2.8 0 0 1 1.71 1.47c.37.74.42 1.5.17 2.28-.24.74-.73 1.3-1.46 1.7a2.8 2.8 0 0 1-3.56-.66c-.34-.4-.57-.85-.7-1.36-.1-.5-.08-1.01.09-1.51Zm9.43 22.32a2.39 2.39 0 1 1 4.13 2.38l-4.37 7.57a2.39 2.39 0 1 1-4.13-2.39l4.37-7.56Zm-14.77-8.53a2.39 2.39 0 1 1 4.14 2.39l-4.37 7.56a2.39 2.39 0 0 1-4.13-2.38l4.36-7.57Zm16.72 14.7a2.96 2.96 0 0 1-4.05 1.08l-13.76-7.95a2.96 2.96 0 1 1 2.96-5.13l13.76 7.95a2.96 2.96 0 0 1 1.09 4.04Zm-29.78 20.54a12.3 12.3 0 0 1-3.62-5.17 9.5 9.5 0 0 1-.25-5.37 11.27 11.27 0 0 1 2.64-4.85 11.25 11.25 0 0 1 4.57-3.14 9.6 9.6 0 0 1 5.37-.3c1.87.43 3.7 1.44 5.5 3.06a12.33 12.33 0 0 1 3.61 5.15c.61 1.82.7 3.6.26 5.36a11.24 11.24 0 0 1-2.65 4.87 11.2 11.2 0 0 1-4.55 3.13 9.4 9.4 0 0 1-5.37.31 12.26 12.26 0 0 1-5.5-3.05Zm4.08-4.53c.97.88 1.9 1.48 2.8 1.82.9.35 1.75.43 2.54.24a4.2 4.2 0 0 0 2.18-1.37 4.24 4.24 0 0 0 1.14-2.31c.1-.8-.07-1.64-.5-2.5a9.33 9.33 0 0 0-2.12-2.6 9.4 9.4 0 0 0-2.8-1.83 4.34 4.34 0 0 0-2.54-.24c-.8.2-1.52.66-2.17 1.39a4.24 4.24 0 0 0-1.14 2.3c-.1.81.06 1.64.5 2.5a9.21 9.21 0 0 0 2.11 2.6Zm-35.21 15.81a4.54 4.54 0 0 1 2.4-.38c.83.1 1.58.39 2.25.86a4.55 4.55 0 0 1 1.54 1.9c.35.79.48 1.6.38 2.4a4.81 4.81 0 0 1-2.76 3.79 4.73 4.73 0 0 1-6.19-2.38 4.81 4.81 0 0 1 .48-4.66 4.51 4.51 0 0 1 1.9-1.53Z\"/></svg>`}\n        <div class=\"border-t flex-1\"></div>\n      </div>\n\n      <foxy-i18n\n        infer=\"\"\n        class=${classMap({ 'block text-center text-xl font-medium': true, ...textColorMap })}\n        key=\"user_status_title\"\n        .options=${{ context: status, store_name }}\n      >\n      </foxy-i18n>\n\n      <foxy-internal-summary-control infer=\"store\">\n        <foxy-internal-text-control\n          layout=\"summary-item\"\n          infer=\"store-domain\"\n          .getValue=${this.__storeDomainGetValue}\n        >\n        </foxy-internal-text-control>\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"store-url\">\n        </foxy-internal-text-control>\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"store-email\">\n        </foxy-internal-text-control>\n        ${status === 'accepted' && this.getStorePageHref && this.data\n          ? html`\n              <div ?hidden=${status !== 'accepted' || !this.getStorePageHref}>\n                <a\n                  class=\"text-primary font-medium cursor-pointer rounded transition-opacity hover-opacity-80 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n                  href=${this.getStorePageHref(this.data._links['fx:store'].href)}\n                >\n                  <foxy-i18n infer=\"\" key=\"store_link\"></foxy-i18n>\n                </a>\n              </div>\n            `\n          : ''}\n      </foxy-internal-summary-control>\n\n      <foxy-i18n\n        class=\"block text-secondary text-center\"\n        infer=\"\"\n        key=\"user_status_text\"\n        .options=${{ context: status, store_name }}\n      >\n      </foxy-i18n>\n\n      <foxy-internal-user-invitation-form-async-action\n        theme=\"error\"\n        class=\"flex-1\"\n        infer=\"leave\"\n        href=${ifDefined(this.data?._links['fx:revoke']?.href)}\n      >\n      </foxy-internal-user-invitation-form-async-action>\n\n      <div\n        class=\"grid grid-cols-2 gap-m\"\n        ?hidden=${hidden.matches('reject', true) && hidden.matches('accept', true)}\n      >\n        <foxy-internal-user-invitation-form-async-action\n          theme=\"error primary\"\n          infer=\"reject\"\n          href=${ifDefined(this.data?._links['fx:reject']?.href)}\n        >\n        </foxy-internal-user-invitation-form-async-action>\n\n        <foxy-internal-user-invitation-form-async-action\n          theme=\"success primary\"\n          infer=\"accept\"\n          href=${ifDefined(this.data?._links['fx:accept']?.href)}\n        >\n        </foxy-internal-user-invitation-form-async-action>\n      </div>\n\n      <foxy-internal-delete-control infer=\"delete\"></foxy-internal-delete-control>\n    `;\n  }\n}\n"]}

package/dist/elements/public/UserInvitationForm/index.d.ts

@@ -1,7 +1,7 @@
 import '../../internal/InternalSummaryControl/index';
+import '../../internal/InternalDeleteControl/index';
 import '../../internal/InternalTextControl/index';
 import '../../internal/InternalForm/index';
 import './internal/InternalUserInvitationFormAsyncAction/index';
-import './internal/InternalUserInvitationFormSyncAction/index';
 import { UserInvitationForm } from './UserInvitationForm';
 export { UserInvitationForm };