text: define(["exports", "require", "../../../@polymer/polymer/polymer-element.js", "../../../@polymer/polymer/lib/utils/render-status.js", "../../simple-colors/simple-colors.js", "./hax-shared-styles.js"], function (_exports, _require, _polymerElement, _renderStatus, _simpleColors, _haxSharedStyles) {
    "use strict";
  
    Object.defineProperty(_exports, "__esModule", {
      value: true
    });
    _exports.HaxPreferencesDialog = void 0;
    _require = babelHelpers.interopRequireWildcard(_require);
  
    function _templateObject_df7a23c0e53211e9a0cfefb808989d41() {
      var data = babelHelpers.taggedTemplateLiteral(["\n      <style include=\"simple-colors-shared-styles hax-shared-styles\">\n        :host {\n          display: block;\n        }\n        iron-icon:not(:defined),\n        paper-button:not(:defined),\n        app-drawer:not(:defined) {\n          display: none;\n        }\n        #dialog {\n          z-index: 1000;\n          margin-top: 56px;\n        }\n        #closedialog {\n          float: right;\n          top: 124px;\n          right: 0;\n          position: absolute;\n          padding: 8px;\n          margin: 0;\n          background-color: var(--hax-color-menu-heading-bg, #eeeeee);\n          color: var(--hax-color-menu-heading-color, black);\n          width: 40px;\n          height: 40px;\n          min-width: unset;\n        }\n        .title {\n          position: relative;\n          padding: 16px;\n          outline: 0;\n          font-weight: 600;\n          text-align: left;\n          margin: 0;\n          background-color: var(--hax-color-menu-heading-bg, #eeeeee);\n          color: var(--hax-color-menu-heading-color, black);\n          font-size: 18px;\n          line-height: 18px;\n          font-family: \"Noto Serif\", serif;\n        }\n        app-drawer {\n          --app-drawer-content-container: {\n            background-color: #ffffff;\n          }\n          --app-drawer-width: 320px;\n        }\n        eco-json-schema-object {\n          color: white;\n          --eco-json-schema-object-form : {\n            -ms-flex: unset;\n            -webkit-flex: unset;\n            flex: unset;\n            -webkit-flex-basis: unset;\n            flex-basis: unset;\n          }\n          --paper-checkbox-size: 16px;\n          --paper-checkbox-checked-ink-color: --hax-color-accent1;\n          --paper-checkbox-label: {\n            font-size: 16px;\n            line-height: 16px;\n          }\n        }\n        .pref-container {\n          text-align: left;\n          padding: 16px;\n        }\n      </style>\n      <app-drawer id=\"dialog\" align=\"right\" transition-duration=\"300\">\n        <h3 class=\"title\">[[title]]</h3>\n        <div style=\"height: 100%; overflow: auto;\" class=\"pref-container\">\n          <eco-json-schema-object\n            schema=\"[[schema]]\"\n            value=\"{{preferences}}\"\n          ></eco-json-schema-object>\n        </div>\n        <paper-button id=\"closedialog\" on-click=\"close\">\n          <iron-icon icon=\"icons:cancel\" title=\"Close dialog\"></iron-icon>\n        </paper-button>\n      </app-drawer>\n    "]);
  
      _templateObject_df7a23c0e53211e9a0cfefb808989d41 = function _templateObject_df7a23c0e53211e9a0cfefb808989d41() {
        return data;
      };
  
      return data;
    }
  
    /**
    `hax-export-dialog`
    Export dialog with all export options and settings provided.
    
    * @demo demo/index.html
    
    @microcopy - the mental model for this element
     -
    */
    var HaxPreferencesDialog =
    /*#__PURE__*/
    function (_PolymerElement) {
      babelHelpers.inherits(HaxPreferencesDialog, _PolymerElement);
  
      function HaxPreferencesDialog() {
        var _this;
  
        babelHelpers.classCallCheck(this, HaxPreferencesDialog);
        _this = babelHelpers.possibleConstructorReturn(this, babelHelpers.getPrototypeOf(HaxPreferencesDialog).call(this));
        new Promise(function (res, rej) {
          return _require.default(["../../../@polymer/iron-icon/iron-icon.js"], res, rej);
        });
        new Promise(function (res, rej) {
          return _require.default(["../../../@polymer/iron-icons/iron-icons.js"], res, rej);
        });
        new Promise(function (res, rej) {
          return _require.default(["../../../@polymer/paper-button/paper-button.js"], res, rej);
        });
        new Promise(function (res, rej) {
          return _require.default(["../../eco-json-schema-form/eco-json-schema-form.js"], res, rej);
        });
        new Promise(function (res, rej) {
          return _require.default(["../../eco-json-schema-form/lib/eco-json-schema-object.js"], res, rej);
        });
        new Promise(function (res, rej) {
          return _require.default(["../../../@polymer/app-layout/app-drawer/app-drawer.js"], res, rej);
        }); // add event listener
  
        document.body.addEventListener("hax-store-property-updated", _this._haxStorePropertyUpdated.bind(babelHelpers.assertThisInitialized(_this)));
        return _this;
      }
  
      babelHelpers.createClass(HaxPreferencesDialog, [{
        key: "ready",
        value: function ready() {
          babelHelpers.get(babelHelpers.getPrototypeOf(HaxPreferencesDialog.prototype), "ready", this).call(this); // JSON schema object needs delayed to ensure page repaints the form
  
          var schema = {
            $schema: "http://json-schema.org/schema#",
            title: "HAX preferences",
            type: "object",
            properties: {
              haxShowExportButton: {
                title: "View source button",
                type: "boolean",
                value: true
              },
              haxRayMode: {
                title: "X-Ray vision",
                type: "boolean",
                value: false
              },
              haxDeveloperMode: {
                title: "Developer mode",
                type: "boolean",
                value: false
              },
              haxVoiceCommands: {
                title: "Voice commands",
                type: "boolean",
                value: false
              },
              haxGithubReport: {
                title: "Report issue",
                type: "string",
                value: false,
                component: {
                  name: "a",
                  properties: {
                    rel: "noopener",
                    style: "color: #81a3a9;font-size: 18px;top: 100vh;position: fixed;right: 0;padding: 16px;font-style: italic;",
                    id: "reportghissue",
                    href: "https://github.com/elmsln/lrnwebcomponents/issues/new?body=URL%20base:%20" + window.location.pathname + "&title=[hax] Bug%20report%20from%20preference%20panel",
                    target: "_blank"
                  },
                  slot: "Report an issue with HAX"
                }
              }
            }
          };
          this.set("schema", {});
          this.set("schema", schema); // register this with hax as the preference pane
  
          this.dispatchEvent(new CustomEvent("hax-register-preferences", {
            bubbles: true,
            cancelable: true,
            composed: true,
            detail: this
          }));
          (0, _renderStatus.afterNextRender)(this, function () {
            // force color values to apply
            this.updateStyles();
          });
        }
        /**
         * Store updated, sync.
         */
  
      }, {
        key: "_haxStorePropertyUpdated",
        value: function _haxStorePropertyUpdated(e) {
          if (e.detail && babelHelpers.typeof(e.detail.value) !== (typeof undefined === "undefined" ? "undefined" : babelHelpers.typeof(undefined)) && e.detail.property && e.detail.property === "globalPreferences" && e.detail.owner !== this) {
            if (babelHelpers.typeof(e.detail.value) === "object") {
              this.set("preferences", {});
            }
  
            this.set("preferences", e.detail.value);
            this.notifyPath("preferences.*");
          }
        }
        /**
         * Notice preferences have changed.
         */
  
      }, {
        key: "_preferencesChanged",
        value: function _preferencesChanged(details) {
          if (this.schema && this.schema.properties && window.HaxStore.ready) {
            window.HaxStore.write("globalPreferences", details.base, this);
          }
        }
        /**
         * Toggle state.
         */
  
      }, {
        key: "toggleDialog",
        value: function toggleDialog() {
          if (this.shadowRoot.querySelector("#dialog").opened) {
            this.close();
          } else {
            window.HaxStore.instance.closeAllDrawers(this);
            var schema = this.schema; // enforce property values to be the schema value
  
            for (var key in this.preferences) {
              this.schema.properties[key].value = this.preferences[key];
            } // force the form to rebuild
  
  
            this.set("schema", {});
            this.set("schema", schema);
          }
        }
        /**
         * open the dialog
         */
  
      }, {
        key: "open",
        value: function open() {
          this.shadowRoot.querySelector("#dialog").open();
        }
        /**
         * close the dialog
         */
  
      }, {
        key: "close",
        value: function close() {
          this.shadowRoot.querySelector("#dialog").close();
        }
      }], [{
        key: "template",
        get: function get() {
          return (0, _polymerElement.html)(_templateObject_df7a23c0e53211e9a0cfefb808989d41());
        }
      }, {
        key: "tag",
        get: function get() {
          return "hax-preferences-dialog";
        }
      }, {
        key: "properties",
        get: function get() {
          return {
            /**
             * Title when open.
             */
            title: {
              type: String,
              value: "Preferences"
            },
  
            /**
             * Schema that has all of inputs / manages state
             */
            schema: {
              type: Object
            },
  
            /**
             * Preferences managed for everything global about HAX.
             */
            preferences: {
              type: Object,
              notify: true
            }
          };
        }
      }, {
        key: "observers",
        get: function get() {
          return ["_preferencesChanged(preferences.*)"];
        }
      }]);
      return HaxPreferencesDialog;
    }(_polymerElement.PolymerElement);
  
    _exports.HaxPreferencesDialog = HaxPreferencesDialog;
    window.customElements.define(HaxPreferencesDialog.tag, HaxPreferencesDialog);
  });