{"version":3,"sources":["webpack:///./node_modules/@rancher/shell/components/form/ColorInput.vue?fc11","webpack:///./node_modules/@rancher/shell/components/form/ColorInput.vue?7270","webpack:///./node_modules/@rancher/shell/dialog/AddCustomBadgeDialog.vue?0664","webpack:///./node_modules/@rancher/shell/dialog/AddCustomBadgeDialog.vue?5d1b","webpack:///./node_modules/@rancher/shell/components/form/ColorInput.vue?3726","webpack:///./node_modules/@rancher/shell/dialog/AddCustomBadgeDialog.vue?ec43","webpack:///./node_modules/@rancher/shell/dialog/AddCustomBadgeDialog.vue","webpack:///node_modules/@rancher/shell/dialog/AddCustomBadgeDialog.vue","webpack:///./node_modules/@rancher/shell/dialog/AddCustomBadgeDialog.vue?70dc","webpack:///./node_modules/@rancher/shell/dialog/AddCustomBadgeDialog.vue?d592","webpack:///./node_modules/@rancher/shell/components/form/ColorInput.vue","webpack:///node_modules/@rancher/shell/components/form/ColorInput.vue","webpack:///./node_modules/@rancher/shell/components/form/ColorInput.vue?90bf","webpack:///./node_modules/@rancher/shell/components/form/ColorInput.vue?7b6d"],"names":["___CSS_LOADER_API_IMPORT___","exports","push","module","i","content","__esModule","default","locals","add","render","_vm","this","_c","_self","staticClass","attrs","slot","_v","_s","t","useCustomBadge","previewCluster","currentCluster","nameDisplay","_e","model","value","callback","$$v","expression","mode","badgeDescription","trim","badgeBgColor","badgeAsIcon","letter","_l","errors","err","key","on","close","canSubmit","apply","staticRenderFns","name","components","Card","AsyncButton","Banner","Checkbox","LabeledInput","ColorInput","ClusterBadge","ClusterProviderIcon","data","fetch","_this$currentCluster$","_this$currentCluster$2","_this$badgeDescriptio","_this$currentCluster$3","_this$currentCluster$4","_this$currentCluster$5","metadata","annotations","CLUSTER_BADGE","TEXT","length","COLOR","ICON_TEXT","substring","computed","_objectSpread","mapGetters","previewColor","textColor","parseColor","isLocal","providerNavLogo","badge","text","color","iconText","toUpperCase","methods","$emit","buttonDone","_this","_asyncToGenerator","_regeneratorRuntime","mark","_callee","norman","wrap","_context","prev","next","$store","dispatch","type","NORMAN","CLUSTER","id","sent","$set","save","t0","exceptionToErrorsArray","stop","component","_class","class","_defineProperty","editMode","componentTestid","labelKey","label","$event","stopPropagation","$refs","input","click","style","inputValue","ref","domProps","target","props","String","defaultValue","validator","_EDIT","_VIEW","includes","viewMode","mounted"],"mappings":"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","file":"js/dialog3.4210ddda.js","sourcesContent":["// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../../../../@vue/cli-service/node_modules/css-loader/dist/runtime/api.js\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\n// Module\nexports.push([module.id, \".color-input[data-v-37115604]{border:1px solid var(--border);border-radius:var(--border-radius);padding:10px}.color-input.disabled[data-v-37115604],.color-input.disabled .selected[data-v-37115604],.color-input[disabled][data-v-37115604],.color-input[disabled][data-v-37115604]:hover{color:var(--input-disabled-text);background-color:var(--input-disabled-bg);outline-width:0;border-color:var(--input-disabled-border);cursor:not-allowed}.color-input.disabled .selected div[data-v-37115604],.color-input.disabled .selected input[data-v-37115604],.color-input.disabled .selected label[data-v-37115604],.color-input.disabled .selected span[data-v-37115604],.color-input.disabled div[data-v-37115604],.color-input.disabled input[data-v-37115604],.color-input.disabled label[data-v-37115604],.color-input.disabled span[data-v-37115604],.color-input[disabled]:hover div[data-v-37115604],.color-input[disabled]:hover input[data-v-37115604],.color-input[disabled]:hover label[data-v-37115604],.color-input[disabled]:hover span[data-v-37115604],.color-input[disabled] div[data-v-37115604],.color-input[disabled] input[data-v-37115604],.color-input[disabled] label[data-v-37115604],.color-input[disabled] span[data-v-37115604]{cursor:not-allowed!important}.color-input.disabled .selected label[data-v-37115604],.color-input.disabled label[data-v-37115604],.color-input[disabled]:hover label[data-v-37115604],.color-input[disabled] label[data-v-37115604]{color:var(--input-disabled-label);display:inline-block;z-index:1}.color-input.disabled .selected[data-v-37115604]::-moz-placeholder,.color-input.disabled[data-v-37115604]::-moz-placeholder,.color-input[disabled][data-v-37115604]::-moz-placeholder,.color-input[disabled][data-v-37115604]:hover::-moz-placeholder{color:var(--input-disabled-placeholder)}.color-input.disabled .selected[data-v-37115604]::placeholder,.color-input.disabled[data-v-37115604]::placeholder,.color-input[disabled][data-v-37115604]::placeholder,.color-input[disabled][data-v-37115604]:hover::placeholder{color:var(--input-disabled-placeholder)}.color-input LABEL[data-v-37115604]{display:block}.color-input .preview-container[data-v-37115604]:hover{cursor:pointer}.color-input .preview-container .color-value[data-v-37115604]{margin-left:4px}.color-input .color-display[data-v-37115604]{border:1px solid var(--border)}.color-input .color-display[data-v-37115604]:focus{outline:none;box-shadow:0 0 0 var(--outline-width) var(--outline);background:var(--input-focus-bg)}.color-input INPUT[data-v-37115604]{border:none;padding:0;width:23px;height:23px;-webkit-appearance:none;opacity:0}.color-input INPUT[data-v-37115604]:hover{cursor:pointer}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!../../../../@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../../../@vue/cli-service/node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../postcss-loader/src/index.js??ref--9-oneOf-1-2!../../../../postcss-loader/src/index.js??ref--9-oneOf-1-3!../../../../sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../../../cache-loader/dist/cjs.js??ref--1-0!../../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./ColorInput.vue?vue&type=style&index=0&id=37115604&prod&lang=scss&scoped=true&\");\nif(content.__esModule) content = content.default;\nif(typeof content === 'string') content = [[module.id, content, '']];\nif(content.locals) module.exports = content.locals;\n// add the styles to the DOM\nvar add = require(\"!../../../../vue-style-loader/lib/addStylesClient.js\").default\nvar update = add(\"a365ee88\", content, true, {\"sourceMap\":false,\"shadowMode\":false});","// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!../../../@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../../@vue/cli-service/node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../postcss-loader/src/index.js??ref--9-oneOf-1-2!../../../postcss-loader/src/index.js??ref--9-oneOf-1-3!../../../sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../../cache-loader/dist/cjs.js??ref--1-0!../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./AddCustomBadgeDialog.vue?vue&type=style&index=0&id=156300b3&prod&lang=scss&scoped=true&\");\nif(content.__esModule) content = content.default;\nif(typeof content === 'string') content = [[module.id, content, '']];\nif(content.locals) module.exports = content.locals;\n// add the styles to the DOM\nvar add = require(\"!../../../vue-style-loader/lib/addStylesClient.js\").default\nvar update = add(\"9fc0ef7e\", content, true, {\"sourceMap\":false,\"shadowMode\":false});","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../../../@vue/cli-service/node_modules/css-loader/dist/runtime/api.js\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\n// Module\nexports.push([module.id, \".prompt-badge[data-v-156300b3]{margin:0}.prompt-badge .cluster-badge-body[data-v-156300b3]{min-height:50px;display:flex;flex-direction:column}.prompt-badge .cluster-badge-body .preview-row[data-v-156300b3]{height:32px}.prompt-badge .cluster-badge-body .preview-row .badge-preview[data-v-156300b3]{align-items:center;display:flex;height:32px;white-space:nowrap}.prompt-badge .cluster-badge-body .preview-row .badge-preview .cluster-name[data-v-156300b3]{margin:0 10px;font-size:16px}.prompt-badge .cluster-badge-body .preview-row .badge-preview .cluster-badge-icon-preview[data-v-156300b3]{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:5px;font-weight:700}.prompt-badge .cluster-badge-body .preview-row .badge-preview .cluster-badge-preview[data-v-156300b3]{cursor:default;border-radius:10px;font-size:12px;padding:2px 10px}.prompt-badge .cluster-badge-body[data-v-156300b3] .badge-icon-text input{text-transform:uppercase}.bottom[data-v-156300b3]{display:flex;flex-direction:column;flex:1}.bottom .banner[data-v-156300b3]{margin-top:0}.bottom .buttons[data-v-156300b3]{display:flex;justify-content:flex-end;width:100%}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","export * from \"-!../../../../vue-style-loader/index.js??ref--9-oneOf-1-0!../../../../@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../../../@vue/cli-service/node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../postcss-loader/src/index.js??ref--9-oneOf-1-2!../../../../postcss-loader/src/index.js??ref--9-oneOf-1-3!../../../../sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../../../cache-loader/dist/cjs.js??ref--1-0!../../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./ColorInput.vue?vue&type=style&index=0&id=37115604&prod&lang=scss&scoped=true&\"","export * from \"-!../../../vue-style-loader/index.js??ref--9-oneOf-1-0!../../../@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../../@vue/cli-service/node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../postcss-loader/src/index.js??ref--9-oneOf-1-2!../../../postcss-loader/src/index.js??ref--9-oneOf-1-3!../../../sass-loader/dist/cjs.js??ref--9-oneOf-1-4!../../../cache-loader/dist/cjs.js??ref--1-0!../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./AddCustomBadgeDialog.vue?vue&type=style&index=0&id=156300b3&prod&lang=scss&scoped=true&\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('Card',{staticClass:\"prompt-badge\",attrs:{\"show-highlight-border\":false}},[_c('h4',{staticClass:\"text-default-text\",attrs:{\"slot\":\"title\"},slot:\"title\"},[_vm._v(\"\\n    \"+_vm._s(_vm.t('clusterBadge.modal.title'))+\"\\n  \")]),_vm._v(\" \"),_c('div',{staticClass:\"pl-10 pr-10 cluster-badge-body\",attrs:{\"slot\":\"body\"},slot:\"body\"},[_c('div',[_vm._v(_vm._s(_vm.t('clusterBadge.modal.previewTitle')))]),_vm._v(\" \"),_c('div',{staticClass:\"mt-10 pl-20 row preview-row\"},[_c('div',{staticClass:\"badge-preview col span-12\"},[(_vm.useCustomBadge)?_c('ClusterProviderIcon',{attrs:{\"cluster\":_vm.previewCluster}}):_c('ClusterProviderIcon',{attrs:{\"cluster\":_vm.currentCluster}}),_vm._v(\" \"),_c('div',{staticClass:\"cluster-name\"},[_vm._v(\"\\n          \"+_vm._s(_vm.currentCluster.nameDisplay)+\"\\n        \")]),_vm._v(\" \"),(_vm.useCustomBadge)?_c('ClusterBadge',{attrs:{\"cluster\":_vm.previewCluster}}):_vm._e()],1)]),_vm._v(\" \"),_c('div',{staticClass:\"row mt-10\"},[_c('div',{staticClass:\"col\"},[_c('Checkbox',{staticClass:\"mt-10\",attrs:{\"label\":_vm.t('clusterBadge.modal.checkbox')},model:{value:(_vm.useCustomBadge),callback:function ($$v) {_vm.useCustomBadge=$$v},expression:\"useCustomBadge\"}})],1)]),_vm._v(\" \"),_c('div',{staticClass:\"options\"},[_c('div',{staticClass:\"row mt-10\"},[_c('div',{staticClass:\"col span-12\"},[_c('LabeledInput',{attrs:{\"mode\":_vm.mode,\"label\":_vm.t('clusterBadge.modal.description'),\"maxlength\":32,\"required\":true},model:{value:(_vm.badgeDescription),callback:function ($$v) {_vm.badgeDescription=(typeof $$v === 'string'? $$v.trim(): $$v)},expression:\"badgeDescription\"}})],1)]),_vm._v(\" \"),_c('div',{staticClass:\"row mt-10\"},[_c('div',{staticClass:\"col span-12\"},[_c('ColorInput',{attrs:{\"mode\":_vm.mode,\"default-value\":_vm.badgeBgColor,\"label\":_vm.t('clusterBadge.modal.badgeBgColor')},model:{value:(_vm.badgeBgColor),callback:function ($$v) {_vm.badgeBgColor=$$v},expression:\"badgeBgColor\"}})],1)]),_vm._v(\" \"),_c('div',{staticClass:\"row mt-10\"},[_c('div',{staticClass:\"col\"},[_c('Checkbox',{staticClass:\"mt-10\",attrs:{\"mode\":_vm.mode,\"label\":_vm.t('clusterBadge.modal.badgeAsIcon'),\"tooltip\":_vm.t('clusterBadge.modal.maxCharsTooltip')},model:{value:(_vm.badgeAsIcon),callback:function ($$v) {_vm.badgeAsIcon=$$v},expression:\"badgeAsIcon\"}})],1)]),_vm._v(\" \"),_c('div',{staticClass:\"row mt-10\"},[_c('div',{staticClass:\"col\"},[_c('LabeledInput',{staticClass:\"badge-icon-text\",attrs:{\"disabled\":!_vm.badgeAsIcon,\"mode\":_vm.mode,\"label\":_vm.t('clusterBadge.modal.iconText'),\"maxlength\":2},model:{value:(_vm.letter),callback:function ($$v) {_vm.letter=(typeof $$v === 'string'? $$v.trim(): $$v)},expression:\"letter\"}})],1)])])]),_vm._v(\" \"),_c('div',{staticClass:\"bottom\",attrs:{\"slot\":\"actions\"},slot:\"actions\"},[_vm._l((_vm.errors),function(err,i){return _c('Banner',{key:i,attrs:{\"color\":\"error\",\"label\":err}})}),_vm._v(\" \"),_c('div',{staticClass:\"buttons\"},[_c('button',{staticClass:\"btn role-secondary mr-10\",on:{\"click\":_vm.close}},[_vm._v(\"\\n        \"+_vm._s(_vm.t('generic.cancel'))+\"\\n      \")]),_vm._v(\" \"),_c('AsyncButton',{attrs:{\"action-label\":_vm.t('clusterBadge.modal.buttonAction'),\"disabled\":!_vm.canSubmit},on:{\"click\":_vm.apply}})],1)],2)])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<script>\nimport { mapGetters } from 'vuex';\nimport { CLUSTER_BADGE } from '@shell/config/labels-annotations';\nimport AsyncButton from '@shell/components/AsyncButton';\nimport { Card } from '@components/Card';\nimport { Banner } from '@components/Banner';\nimport ClusterBadge from '@shell/components/ClusterBadge';\nimport ClusterProviderIcon from '@shell/components/ClusterProviderIcon';\nimport { exceptionToErrorsArray } from '@shell/utils/error';\nimport { Checkbox } from '@components/Form/Checkbox';\nimport { LabeledInput } from '@components/Form/LabeledInput';\nimport ColorInput from '@shell/components/form/ColorInput';\nimport { parseColor, textColor } from '@shell/utils/color';\nimport { NORMAN } from '@shell/config/types';\n\nexport default {\n  name:       'AddCustomBadgeDialog',\n  components: {\n    Card,\n    AsyncButton,\n    Banner,\n    Checkbox,\n    LabeledInput,\n    ColorInput,\n    ClusterBadge,\n    ClusterProviderIcon,\n  },\n\n  data() {\n    return {\n      useCustomBadge:   null,\n      errors:           [],\n      badgeBgColor:     '',\n      badgeDescription: '',\n      badgeAsIcon:      null,\n      letter:           '',\n    };\n  },\n\n  fetch() {\n    if (this.currentCluster.metadata?.annotations) {\n      this.badgeDescription = this.currentCluster.metadata?.annotations[CLUSTER_BADGE.TEXT];\n      this.useCustomBadge = this.badgeDescription?.length > 0;\n      this.badgeDescription = this.badgeDescription || 'Example Text';\n      this.badgeBgColor = this.currentCluster.metadata?.annotations[CLUSTER_BADGE.COLOR] || '#ff0000';\n\n      this.badgeAsIcon = !!this.currentCluster.metadata?.annotations[CLUSTER_BADGE.ICON_TEXT] || false;\n\n      this.letter = this.currentCluster.metadata?.annotations[CLUSTER_BADGE.ICON_TEXT] || this.badgeDescription.substring(0, 2);\n    }\n  },\n\n  computed: {\n    ...mapGetters(['currentCluster']),\n\n    previewColor() {\n      return textColor(parseColor(this.badgeBgColor)) || '#ffffff';\n    },\n    canSubmit() {\n      return this.badgeDescription.length >= 1;\n    },\n    // Fake cluster object for use with badge component\n    previewCluster() {\n      // Make cluster object that is enough for the badge component to work\n      return {\n        isLocal:         this.currentCluster.isLocal,\n        providerNavLogo: this.currentCluster.providerNavLogo,\n        badge:           {\n          text:      this.badgeDescription,\n          color:     this.badgeBgColor,\n          textColor: textColor(parseColor(this.badgeBgColor)),\n          iconText:  this.badgeAsIcon ? this.letter.toUpperCase() : '',\n        }\n      };\n    },\n\n    mode() {\n      return !!this.useCustomBadge ? 'edit' : 'view';\n    },\n  },\n\n  methods: {\n    close() {\n      this.$emit('close');\n    },\n\n    async apply(buttonDone) {\n      try {\n        // Fetch the Norman cluster object\n        const norman = await this.$store.dispatch('rancher/find', { type: NORMAN.CLUSTER, id: this.currentCluster.id });\n\n        delete norman.annotations[CLUSTER_BADGE.TEXT];\n        delete norman.annotations[CLUSTER_BADGE.COLOR];\n        delete norman.annotations[CLUSTER_BADGE.ICON_TEXT];\n\n        if (this.useCustomBadge) {\n          this.$set(norman.annotations, CLUSTER_BADGE.TEXT, this.badgeDescription);\n          this.$set(norman.annotations, CLUSTER_BADGE.COLOR, this.badgeBgColor);\n          if (this.badgeAsIcon) {\n            this.$set(norman.annotations, CLUSTER_BADGE.ICON_TEXT, this.letter.toUpperCase());\n          }\n        }\n\n        await norman.save();\n\n        buttonDone(true);\n        this.close();\n      } catch (err) {\n        this.errors = exceptionToErrorsArray(err);\n        buttonDone(false);\n      }\n    }\n  }\n};\n</script>\n\n<template>\n  <Card\n    class=\"prompt-badge\"\n    :show-highlight-border=\"false\"\n  >\n    <h4\n      slot=\"title\"\n      class=\"text-default-text\"\n    >\n      {{ t('clusterBadge.modal.title') }}\n    </h4>\n\n    <div\n      slot=\"body\"\n      class=\"pl-10 pr-10 cluster-badge-body\"\n    >\n      <div>{{ t('clusterBadge.modal.previewTitle') }}</div>\n\n      <div class=\"mt-10 pl-20 row preview-row\">\n        <div class=\"badge-preview col span-12\">\n          <ClusterProviderIcon\n            v-if=\"useCustomBadge\"\n            :cluster=\"previewCluster\"\n          />\n          <ClusterProviderIcon\n            v-else\n            :cluster=\"currentCluster\"\n          />\n          <div class=\"cluster-name\">\n            {{ currentCluster.nameDisplay }}\n          </div>\n          <ClusterBadge\n            v-if=\"useCustomBadge\"\n            :cluster=\"previewCluster\"\n          />\n        </div>\n      </div>\n\n      <div class=\"row mt-10\">\n        <div class=\"col\">\n          <Checkbox\n            v-model=\"useCustomBadge\"\n            :label=\"t('clusterBadge.modal.checkbox')\"\n            class=\"mt-10\"\n          />\n        </div>\n      </div>\n\n      <div class=\"options\">\n        <div class=\"row mt-10\">\n          <div class=\"col span-12\">\n            <LabeledInput\n              v-model.trim=\"badgeDescription\"\n              :mode=\"mode\"\n              :label=\"t('clusterBadge.modal.description')\"\n              :maxlength=\"32\"\n              :required=\"true\"\n            />\n          </div>\n        </div>\n\n        <div class=\"row mt-10\">\n          <div class=\"col span-12\">\n            <ColorInput\n              v-model=\"badgeBgColor\"\n              :mode=\"mode\"\n              :default-value=\"badgeBgColor\"\n              :label=\"t('clusterBadge.modal.badgeBgColor')\"\n            />\n          </div>\n        </div>\n\n        <div class=\"row mt-10\">\n          <div class=\"col\">\n            <Checkbox\n              v-model=\"badgeAsIcon\"\n              :mode=\"mode\"\n              :label=\"t('clusterBadge.modal.badgeAsIcon')\"\n              class=\"mt-10\"\n              :tooltip=\"t('clusterBadge.modal.maxCharsTooltip')\"\n            />\n          </div>\n        </div>\n        <div class=\"row mt-10\">\n          <div class=\"col\">\n            <LabeledInput\n              v-model.trim=\"letter\"\n              :disabled=\"!badgeAsIcon\"\n              class=\"badge-icon-text\"\n              :mode=\"mode\"\n              :label=\"t('clusterBadge.modal.iconText')\"\n              :maxlength=\"2\"\n            />\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <div\n      slot=\"actions\"\n      class=\"bottom\"\n    >\n      <Banner\n        v-for=\"(err, i) in errors\"\n        :key=\"i\"\n        color=\"error\"\n        :label=\"err\"\n      />\n      <div class=\"buttons\">\n        <button\n          class=\"btn role-secondary mr-10\"\n          @click=\"close\"\n        >\n          {{ t('generic.cancel') }}\n        </button>\n        <AsyncButton\n          :action-label=\"t('clusterBadge.modal.buttonAction')\"\n          :disabled=\"!canSubmit\"\n          @click=\"apply\"\n        />\n      </div>\n    </div>\n  </Card>\n</template>\n<style lang='scss' scoped>\n  .prompt-badge {\n    margin: 0;\n\n    .cluster-badge-body {\n      min-height: 50px;\n      display: flex;\n      flex-direction: column;\n\n      .preview-row {\n        height: 32px;\n\n        .badge-preview {\n          align-items: center;\n          display: flex;\n          height: 32px;\n          white-space: nowrap;\n\n          .cluster-name {\n            margin: 0 10px;\n            font-size: 16px;\n          }\n\n          .cluster-badge-icon-preview {\n            width: 32px;\n            height: 32px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            border-radius: 5px;\n            font-weight: bold;\n          }\n\n          .cluster-badge-preview {\n            cursor: default;\n            border-radius: 10px;\n            font-size: 12px;\n            padding: 2px 10px;\n          }\n        }\n      }\n\n      ::v-deep .badge-icon-text input {\n        text-transform: uppercase;\n      }\n    }\n  }\n\n  .bottom {\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n\n    .banner {\n      margin-top: 0;\n    }\n\n    .buttons {\n      display: flex;\n      justify-content: flex-end;\n      width: 100%;\n    }\n  }\n\n</style>\n","import mod from \"-!../../../cache-loader/dist/cjs.js??ref--16-0!../../../babel-loader/lib/index.js??ref--16-1!../../../cache-loader/dist/cjs.js??ref--1-0!../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./AddCustomBadgeDialog.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../cache-loader/dist/cjs.js??ref--16-0!../../../babel-loader/lib/index.js??ref--16-1!../../../cache-loader/dist/cjs.js??ref--1-0!../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./AddCustomBadgeDialog.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./AddCustomBadgeDialog.vue?vue&type=template&id=156300b3&scoped=true&\"\nimport script from \"./AddCustomBadgeDialog.vue?vue&type=script&lang=js&\"\nexport * from \"./AddCustomBadgeDialog.vue?vue&type=script&lang=js&\"\nimport style0 from \"./AddCustomBadgeDialog.vue?vue&type=style&index=0&id=156300b3&prod&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"156300b3\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"color-input\",class:{[_vm.mode]:_vm.mode, disabled: _vm.mode !== _vm.editMode},attrs:{\"data-testid\":_vm.componentTestid + '-color-input'}},[_c('label',{staticClass:\"text-label\"},[(_vm.labelKey)?_c('t',{attrs:{\"k\":_vm.labelKey,\"raw\":true}}):_vm._e(),_vm._v(_vm._s(_vm.label))],1),_vm._v(\" \"),_c('div',{staticClass:\"preview-container\",on:{\"click\":function($event){$event.stopPropagation();return _vm.$refs.input.click($event)}}},[_c('span',{staticClass:\"color-display\",style:({'background-color': _vm.inputValue})},[_c('input',{ref:\"input\",attrs:{\"type\":\"color\",\"disabled\":_vm.mode !== _vm.editMode},domProps:{\"value\":_vm.inputValue},on:{\"input\":function($event){return _vm.$emit('input', $event.target.value)}}})]),_vm._v(\" \"),_c('span',{staticClass:\"text-muted color-value\"},[_vm._v(_vm._s(_vm.inputValue))])])])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<script>\nimport { _EDIT, _VIEW } from '@shell/config/query-params';\n\nexport default {\n  props: {\n    value: {\n      type:    String,\n      default: ''\n    },\n\n    defaultValue: {\n      type:    String,\n      default: ''\n    },\n\n    label: {\n      type:    String,\n      default: null\n    },\n\n    labelKey: {\n      type:    String,\n      default: null\n    },\n\n    mode: {\n      type: String,\n      validator(value) {\n        return [_EDIT, _VIEW].includes(value);\n      },\n      default: _EDIT,\n    },\n\n    /**\n     * Inherited global identifier prefix for tests\n     * Define a term based on the parent component to avoid conflicts on multiple components\n     */\n    componentTestid: {\n      type:    String,\n      default: 'color-input'\n    }\n  },\n\n  data() {\n    return {\n      viewMode: _VIEW,\n      editMode: _EDIT\n    };\n  },\n\n  computed: {\n    /**\n     * Allow UI to set a default value.\n     */\n    inputValue() {\n      return this.value ? this.value : this.defaultValue;\n    }\n  },\n\n  mounted() {\n    // Ensures that if the default value is used, the model is updated with it\n    this.$emit('input', this.inputValue);\n  }\n};\n</script>\n\n<template>\n  <div\n    class=\"color-input\"\n    :class=\"{[mode]:mode, disabled: mode !== editMode}\"\n    :data-testid=\"componentTestid + '-color-input'\"\n  >\n    <label class=\"text-label\"><t\n      v-if=\"labelKey\"\n      :k=\"labelKey\"\n      :raw=\"true\"\n    />{{ label }}</label>\n    <div\n      class=\"preview-container\"\n      @click.stop=\"$refs.input.click($event)\"\n    >\n      <span\n        :style=\"{'background-color': inputValue}\"\n        class=\"color-display\"\n      >\n        <input\n          ref=\"input\"\n          type=\"color\"\n          :disabled=\"mode !== editMode\"\n          :value=\"inputValue\"\n          @input=\"$emit('input', $event.target.value)\"\n        >\n      </span>\n      <span class=\"text-muted color-value\">{{ inputValue }}</span>\n    </div>\n  </div>\n</template>\n\n<style lang='scss' scoped>\n.color-input {\n  border: 1px solid var(--border);\n  border-radius: var(--border-radius);\n  padding: 10px;\n\n  &.disabled, &.disabled .selected, &[disabled], &[disabled]:hover {\n    color: var(--input-disabled-text);\n    background-color: var(--input-disabled-bg);\n    outline-width: 0;\n    border-color: var(--input-disabled-border);\n    cursor: not-allowed;\n\n    label, span, div, input {\n      cursor: not-allowed !important;\n    }\n\n    label {\n      color: var(--input-disabled-label);\n      display: inline-block;\n      z-index: 1;\n    }\n    &::placeholder {\n        color: var(--input-disabled-placeholder);\n    }\n  }\n\n  LABEL{\n    display: block;\n  }\n\n  .preview-container{\n    &:hover {\n      cursor: pointer;\n    }\n\n    .color-value {\n      margin-left: 4px;\n    }\n  }\n\n  .color-display{\n    border: 1px solid var(--border);\n\n    &:focus {\n      outline: none;\n      box-shadow: 0 0 0 var(--outline-width) var(--outline);\n      background: var(--input-focus-bg);\n    }\n  }\n\n  INPUT{\n    border: none;\n    padding: 0;\n    width: 23px;\n    height: 23px;\n    -webkit-appearance: none;\n    opacity: 0;\n    &:hover {\n      cursor: pointer;\n    }\n  }\n}\n</style>\n","import mod from \"-!../../../../cache-loader/dist/cjs.js??ref--16-0!../../../../babel-loader/lib/index.js??ref--16-1!../../../../cache-loader/dist/cjs.js??ref--1-0!../../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./ColorInput.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../cache-loader/dist/cjs.js??ref--16-0!../../../../babel-loader/lib/index.js??ref--16-1!../../../../cache-loader/dist/cjs.js??ref--1-0!../../../../@vue/cli-service/node_modules/vue-loader/lib/index.js??vue-loader-options!./ColorInput.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./ColorInput.vue?vue&type=template&id=37115604&scoped=true&\"\nimport script from \"./ColorInput.vue?vue&type=script&lang=js&\"\nexport * from \"./ColorInput.vue?vue&type=script&lang=js&\"\nimport style0 from \"./ColorInput.vue?vue&type=style&index=0&id=37115604&prod&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"37115604\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}