webpackHotUpdate("main",{

/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/dist/index.js?!./src/pages/create.vue?vue&type=script&lang=js":
/*!********************************************************************************************************************************!*\
  !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/dist??ref--15-0!./src/pages/create.vue?vue&type=script&lang=js ***!
  \********************************************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var framework7_vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! framework7-vue */ \"./node_modules/framework7-vue/esm/framework7-vue.js\");\n/* harmony import */ var framework7__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! framework7 */ \"./node_modules/framework7/esm/framework7.js\");\n/* harmony import */ var _utils_log_text__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils/log-text */ \"./src/utils/log-text.js\");\n/* harmony import */ var _utils_get_log__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils/get-log */ \"./src/utils/get-log.js\");\n/* harmony import */ var _utils_components_list__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils/components-list */ \"./src/utils/components-list.js\");\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }\n\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance\"); }\n\nfunction _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === \"[object Arguments]\") return Array.from(iter); }\n\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }\n\n\n\n\n\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n  data: function data() {\n    return {\n      loading: false,\n      log: [],\n      done: false,\n      error: false,\n      bundlerAdvanced: false,\n      cordovaAdvanced: false,\n      coreComponentsList: ['Statusbar', 'View', 'Navbar', 'Toolbar', 'Subnavbar', 'Touch Ripple', 'Modal', 'Page', 'Link', 'Block', 'List', 'Badge', 'Button', 'Icon'].sort(),\n      componentsList: _toConsumableArray(_utils_components_list__WEBPACK_IMPORTED_MODULE_4__[\"default\"]),\n      iconFile: null,\n      iconPreview: null,\n      cwd: '',\n      name: 'My App',\n      type: [],\n      pkg: 'io.framework7.myapp',\n      cordova: {\n        folder: 'cordova',\n        platforms: ['ios', 'android'],\n        plugins: ['cordova-plugin-statusbar', 'cordova-plugin-keyboard', 'cordova-plugin-splashscreen']\n      },\n      capacitor: {\n        platforms: ['ios', 'android']\n      },\n      framework: 'core',\n      template: 'single-view',\n      bundler: 'vite',\n      cssPreProcessor: false,\n      theming: {\n        customColor: false,\n        color: '#007aff',\n        darkTheme: false,\n        iconFonts: true,\n        fillBars: false\n      },\n      customBuild: false,\n      customBuildConfig: {\n        rtl: false,\n        darkTheme: true,\n        lightTheme: true,\n        themes: ['ios', 'md', 'aurora'],\n        components: _toConsumableArray(_utils_components_list__WEBPACK_IMPORTED_MODULE_4__[\"default\"])\n      }\n    };\n  },\n  computed: {\n    componentsListComputed: function componentsListComputed() {\n      var self = this;\n      var list = self.componentsList.sort().map(function (c) {\n        var name = c.split('-').map(function (word) {\n          return word[0].toUpperCase() + word.substring(1);\n        }).join(' ');\n        return {\n          component: c,\n          name: name\n        };\n      });\n      return list;\n    }\n  },\n  watch: {\n    'theming.fillBars': function themingFillBars(fillBars) {\n      var self = this;\n\n      if (!self.barsStyleEl) {\n        self.barsStyleEl = document.createElement('style');\n        self.barsStyleEl.innerHTML = \"\\n            /* Invert navigation bars to fill style */\\n            :root,\\n            :root.theme-dark,\\n            :root .theme-dark {\\n              --f7-bars-bg-color: var(--f7-theme-color);\\n              --f7-bars-text-color: #fff;\\n              --f7-bars-link-color: #fff;\\n              --f7-navbar-subtitle-text-color: rgba(255,255,255,0.85);\\n              --f7-bars-border-color: transparent;\\n              --f7-tabbar-link-active-color: #fff;\\n              --f7-tabbar-link-inactive-color: rgba(255,255,255,0.54);\\n              --f7-searchbar-bg-color: var(--f7-bars-bg-color);\\n              --f7-searchbar-input-bg-color: #fff;\\n              --f7-searchbar-input-text-color: #000;\\n              --f7-sheet-border-color: transparent;\\n              --f7-tabbar-link-active-border-color: #fff;\\n            }\\n            .appbar,\\n            .navbar,\\n            .toolbar,\\n            .subnavbar,\\n            .calendar-header,\\n            .calendar-footer {\\n              --f7-touch-ripple-color: var(--f7-touch-ripple-white);\\n              --f7-link-highlight-color: var(--f7-link-highlight-white);\\n              --f7-button-text-color: #fff;\\n              --f7-button-pressed-bg-color: rgba(255,255,255,0.1);\\n            }\\n          \";\n      }\n\n      if (fillBars) {\n        framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].$('head').append(self.barsStyleEl);\n      } else {\n        framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].$(self.barsStyleEl).remove();\n      }\n\n      self.setDocumentThemeColor();\n    },\n    'theming.darkTheme': function themingDarkTheme(darkTheme) {\n      var self = this;\n      var html = framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].$('html');\n\n      if (darkTheme) {\n        html.addClass('theme-dark');\n      } else {\n        html.removeClass('theme-dark');\n      }\n\n      self.setDocumentThemeColor();\n    },\n    'theming.customColor': function themingCustomColor(customColor) {\n      var self = this;\n      var color = self.theming.color;\n      var cssVars = framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].utils.colorThemeCSSProperties(color);\n      var html = framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].$('html')[0];\n\n      if (customColor) {\n        Object.keys(cssVars).forEach(function (key) {\n          html.style.setProperty(key, cssVars[key]);\n        });\n      } else {\n        Object.keys(cssVars).forEach(function (key) {\n          html.style.removeProperty(key);\n        });\n      }\n\n      self.setDocumentThemeColor();\n    },\n    'theming.color': function themingColor() {\n      var self = this;\n      var color = self.theming.color;\n      var cssVars = framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].utils.colorThemeCSSProperties(color);\n      var html = framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].$('html')[0];\n      Object.keys(cssVars).forEach(function (key) {\n        html.style.setProperty(key, cssVars[key]);\n      });\n      self.setDocumentThemeColor();\n    },\n    customBuild: function customBuild() {\n      var self = this;\n      self.bundler = 'vite';\n      self.cssPreProcessor = 'less';\n    },\n    log: function log() {\n      var self = this;\n      self.$nextTick(function () {\n        var logEl = self.$refs.logEl;\n        logEl.scrollTop = logEl.scrollHeight - logEl.offsetHeight;\n      });\n    },\n    done: function done() {\n      var self = this;\n\n      if (self.done && self.iconFile) {\n        self.done = false;\n        self.loading = true;\n        self.iconFile = null;\n        self.generatingAssets = true;\n        framework7__WEBPACK_IMPORTED_MODULE_1__[\"request\"].postJSON('/api/assets/generate/', {\n          keepLog: true\n        }).then(function () {\n          self.getLog();\n        });\n      }\n    }\n  },\n  mounted: function mounted() {\n    var self = this;\n    framework7__WEBPACK_IMPORTED_MODULE_1__[\"request\"].json('/api/cwd/').then(function (res) {\n      self.cwd = res.data.cwd;\n    });\n  },\n  methods: {\n    setDocumentThemeColor: function setDocumentThemeColor() {\n      var _this$theming = this.theming,\n          color = _this$theming.color,\n          fillBars = _this$theming.fillBars,\n          darkTheme = _this$theming.darkTheme;\n      var newColor;\n\n      if (fillBars) {\n        newColor = color;\n      } else if (darkTheme) {\n        newColor = '#212121';\n      } else {\n        newColor = '#fff';\n      }\n\n      document.querySelector('meta[name=\"theme-color\"]').setAttribute('content', newColor);\n    },\n    logText: _utils_log_text__WEBPACK_IMPORTED_MODULE_2__[\"default\"],\n    exportSettings: function exportSettings() {\n      var self = this;\n      var options = self.getOptions();\n      delete options.cwd;\n      var data = [JSON.stringify(options, '', 2)];\n      var file;\n      var fileName = \"\".concat(options.name || 'framework7', \".json\");\n      var properties = {\n        type: 'application/json'\n      };\n\n      try {\n        file = new File(data, fileName, properties);\n      } catch (e) {\n        file = new Blob(data, properties);\n      }\n\n      var url = URL.createObjectURL(file);\n      var link = document.createElement('a');\n      link.download = fileName;\n      link.target = '_blank';\n      link.href = url;\n      link.click();\n    },\n    importSettings: function importSettings(data) {\n      var self = this;\n      var bundler = data.bundler,\n          cordova = data.cordova,\n          capacitor = data.capacitor,\n          cssPreProcessor = data.cssPreProcessor,\n          customBuild = data.customBuild,\n          customBuildConfig = data.customBuildConfig,\n          framework = data.framework,\n          name = data.name,\n          pkg = data.pkg,\n          template = data.template,\n          theming = data.theming,\n          type = data.type;\n\n      if (type && type.indexOf('cordova') >= 0) {\n        self.cordovaAdvanced = true;\n      }\n\n      Object.assign(self, {\n        bundler: bundler,\n        cordova: cordova,\n        capacitor: capacitor,\n        cssPreProcessor: cssPreProcessor,\n        customBuild: customBuild,\n        customBuildConfig: customBuildConfig,\n        framework: framework,\n        name: name,\n        pkg: pkg,\n        template: template,\n        theming: theming,\n        type: type\n      });\n    },\n    onImportInputChange: function onImportInputChange(e) {\n      var self = this;\n      var reader = new FileReader();\n\n      reader.onload = function () {\n        var content = JSON.parse(reader.result);\n        self.importSettings(content.framework7 || content);\n      };\n\n      reader.readAsText(e.target.files[0]);\n    },\n    resetIcon: function resetIcon() {\n      this.iconFile = null;\n      this.iconPreview = null;\n      this.$refs.iconInput.value = null;\n    },\n    onIconChange: function onIconChange(e) {\n      var _this = this;\n\n      var file = e.target.files[0];\n      if (!file) return;\n      var reader = new FileReader();\n\n      reader.onload = function () {\n        _this.iconPreview = reader.result;\n      };\n\n      this.iconFile = file;\n      reader.readAsDataURL(file);\n    },\n    toggleComponents: function toggleComponents() {\n      var self = this;\n\n      if (self.customBuildConfig.components.length === self.componentsList.length) {\n        self.customBuildConfig.components = [];\n      } else {\n        self.customBuildConfig.components = _toConsumableArray(self.componentsList);\n      }\n    },\n    toggleArrayValue: function toggleArrayValue(arr, value, remove) {\n      if (remove) {\n        if (arr.indexOf(value) >= 0) {\n          arr.splice(arr.indexOf(value), 1);\n        }\n\n        return;\n      }\n\n      if (arr.indexOf(value) < 0) {\n        arr.push(value);\n      } else {\n        arr.splice(arr.indexOf(value), 1);\n      }\n    },\n    getOptions: function getOptions() {\n      var self = this;\n      var cwd = self.cwd,\n          name = self.name,\n          type = self.type,\n          pkg = self.pkg,\n          framework = self.framework,\n          template = self.template,\n          bundler = self.bundler,\n          cssPreProcessor = self.cssPreProcessor,\n          cordova = self.cordova,\n          capacitor = self.capacitor,\n          theming = self.theming,\n          customBuild = self.customBuild,\n          customBuildConfig = self.customBuildConfig;\n      var options = {\n        cwd: cwd,\n        type: type,\n        name: name,\n        framework: framework,\n        template: template,\n        bundler: bundler,\n        cssPreProcessor: cssPreProcessor,\n        theming: theming,\n        customBuild: customBuild\n      };\n\n      if (options.customBuild) {\n        options.bundler = 'vite';\n        options.cssPreProcessor = 'less';\n        options.customBuildConfig = customBuildConfig;\n      }\n\n      if (options.bundler !== 'vite') {\n        options.cssPreProcessor = false;\n      }\n\n      if (type.indexOf('cordova') >= 0 && cordova.platforms.length) {\n        options.pkg = pkg;\n        options.cordova = cordova;\n\n        if (cordova.platforms.indexOf('ios') < 0 && cordova.platforms.indexOf('android') < 0) {\n          options.cordova.plugins = [];\n        }\n      }\n\n      if (type.indexOf('capacitor') >= 0 && capacitor.platforms.length) {\n        options.pkg = pkg;\n        options.capacitor = capacitor;\n      }\n\n      return options;\n    },\n    showError: function showError(message) {\n      var self = this;\n      framework7_vue__WEBPACK_IMPORTED_MODULE_0__[\"f7\"].dialog.alert(message);\n    },\n    getLog: function getLog() {\n      var self = this;\n\n      Object(_utils_get_log__WEBPACK_IMPORTED_MODULE_3__[\"default\"])(self, self.generatingAssets ? '/api/assets/generate/' : '/api/create/');\n    },\n    createApp: function createApp() {\n      var self = this;\n      if (self.loading) return;\n      var options = self.getOptions();\n\n      if (!options.type.length) {\n        self.showError('You must specify app type (Web app, PWA or Cordova app)');\n        return;\n      }\n\n      if (options.type.indexOf('cordova') >= 0) {\n        if (!options.pkg.trim()) {\n          self.showError('You must specify app package (bundle ID)');\n          return;\n        }\n\n        if (!options.cordova.platforms.length) {\n          self.showError('You must specify target cordova platform');\n          return;\n        }\n      }\n\n      if (options.type.indexOf('capacitor') >= 0) {\n        if (!options.pkg.trim()) {\n          self.showError('You must specify app package (bundle ID)');\n          return;\n        }\n\n        if (!options.capacitor.platforms.length) {\n          self.showError('You must specify target Capacitor platform');\n          return;\n        }\n      }\n\n      if (!options.name) {\n        self.showError('You must specify app name');\n        return;\n      }\n\n      self.loading = true;\n      var data = new FormData();\n      data.set('iconFile', this.iconFile);\n      data.set('options', JSON.stringify(options));\n      framework7__WEBPACK_IMPORTED_MODULE_1__[\"request\"].post('/api/create/', data).then(function () {\n        self.getLog();\n      });\n    }\n  }\n});\n\n//# sourceURL=webpack:///./src/pages/create.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/dist??ref--15-0");

/***/ })

})