{"file":"vds-add-to-press-binder.entry.js","mappings":"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","names":[],"sources":["src/components/vds-add-to-press-binder/vds-add-to-press-binder.scss?tag=vds-add-to-press-binder&encapsulation=shadow","src/components/vds-add-to-press-binder/vds-add-to-press-binder.tsx"],"sourcesContent":[":host {\r\n  display: inherit;\r\n}\r\n","import { Component, Host, h, ComponentInterface, Prop, State, Element, EventEmitter, Event, Listen } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'vds-add-to-press-binder',\r\n  styleUrl: 'vds-add-to-press-binder.scss',\r\n  shadow: true,\r\n})\r\nexport class VdsAddToPressBinder implements ComponentInterface {\r\n\r\n  @Element() el!: HTMLVdsAddToPressBinderElement;\r\n\r\n  /**\r\n   * The nodes' GUID that is used to create the press-binder store\r\n   */\r\n  @Prop() nodeguid: string;\r\n\r\n  /**\r\n   * Path to Lottie file\r\n   */\r\n  @Prop() animation: string;\r\n\r\n  /**\r\n   * Displayed text\r\n   */\r\n  @Prop() label: string;\r\n\r\n  /**\r\n   * Is true when store contains nodeguid\r\n   */\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * Local store of nodeguids in session-storage\r\n   */\r\n  @State() store: string[];\r\n\r\n  /**\r\n   * Button that triggers the add event\r\n   */\r\n  @State() buttonElement?: HTMLButtonElement;\r\n\r\n  /**\r\n   * Emitted Event when the nodeguid was added to the store\r\n   */\r\n  @Event() added!: EventEmitter<void>;\r\n\r\n  @Listen('pressbinder.change', { target: 'window' })\r\n  onChange(_event: CustomEvent): void {\r\n    this.store = this.getStoredEntries();\r\n  }\r\n\r\n  constructor() {\r\n    this.store = this.getStoredEntries();\r\n  }\r\n\r\n  componentWillRender(): void {\r\n    this.disabled = this.store.includes(this.nodeguid);\r\n  }\r\n\r\n  render() {\r\n    const { animation, disabled, buttonElement, nodeguid, label } = this;\r\n\r\n    return (\r\n      <Host>\r\n        <button class=\"flex items-center gap-2 py-1\"\r\n                ref={nativeElement => this.buttonElement = nativeElement}\r\n                onClick={() => this.add(nodeguid)}\r\n                disabled={this.disabled}>\r\n\r\n          <div class=\"h-[35px] w-[35px] overflow-visible\">\r\n            { this.renderAnimatedFolder(disabled, animation, buttonElement) }\r\n          </div>\r\n\r\n          {label && (\r\n            <span class={{\r\n              \"inline-block text-[18px] font-normal leading-[30px] hover:underline\": true,\r\n              \"text-grey\": !this.disabled,\r\n              \"text-grey-lighter\": this.disabled\r\n            }}>\r\n              { label }\r\n            </span>\r\n          )}\r\n\r\n        </button>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  private renderAnimatedFolder(disabled: boolean, animation: string, interactionElement: HTMLElement): string {\r\n    if (disabled) {\r\n      return (\r\n        <span class=\"text-grey-lighter relative top-[5px] left-[5px]\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\"\r\n              data-name=\"2px_Line_Icons\"\r\n              viewBox=\"43.99 45 40.01 38.01\"\r\n              width=\"26\"\r\n              height=\"26\">\r\n                <path d=\"M49,52V46H60l3,6H83V79a3.16,3.16,0,0,1-5.23,2.23A2.87,2.87,0,0,1,77,79V57H45V79a2.83,2.83,0,0,0,.77,2.23A2.91,2.91,0,0,0,48,82c.84,0,24,0,24,0\"\r\n                      fill=\"none\"\r\n                      stroke=\"currentColor\"\r\n                      stroke-linecap=\"round\"\r\n                      stroke-linejoin=\"round\"\r\n                      stroke-width=\"2\"></path>\r\n          </svg>\r\n        </span>\r\n      );\r\n    }\r\n    else {\r\n      return (\r\n        <vds-animated-icon\r\n            src={animation}\r\n            width=\"65px\"\r\n            height=\"65px\"\r\n            interactionElement={interactionElement}\r\n            initialSegment={0}\r\n            playSegmentStart={50}\r\n            playSegmentEnd={100}\r\n            clickSegmentStart={215}\r\n            clickSegmentEnd={300}\r\n            transform=\"translate3d(-12px, -14px, 0px)\"\r\n            hover={true}>\r\n        </vds-animated-icon>\r\n      );\r\n    }\r\n  }\r\n\r\n  private getStoredEntries(): string[] {\r\n    const data = sessionStorage.getItem('pressBinder');\r\n    return JSON.parse(data) ?? [];\r\n  }\r\n\r\n  private add(nodeguid: string): void {\r\n    setTimeout(() => {\r\n      const store = [...this.store, nodeguid];\r\n      sessionStorage.setItem('pressBinder', JSON.stringify(store));\r\n      this.store = store;\r\n      this.notifyPressBinder(nodeguid);\r\n    }, 1000)\r\n  }\r\n\r\n  private notifyPressBinder(nodeguid: string): void {\r\n    const ngPressBinder = document.querySelector('vdx-search-press-binder');\r\n    if (ngPressBinder) {\r\n      const event = new CustomEvent('add', { detail: nodeguid })\r\n      ngPressBinder.dispatchEvent(event);\r\n    }\r\n  }\r\n\r\n}\r\n"],"version":3}