@nextcloud/vue 9.0.0-rc.1 → 9.0.0-rc.3

package/dist/chunks/NcChip-BQRPT42V.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcChip-BQRPT42V.mjs","sources":["../../src/components/NcChip/NcChip.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n<docs>\n### Basic usage\n\n```vue\n<template>\n\t<div style=\"display: flex; gap: 8px; flex-wrap: wrap;\">\n\t\t<NcChip text=\"Notes.txt\" />\n\t\t<NcChip text=\"Files\" :icon-path=\"mdiFile\" />\n\t\t<NcChip text=\"Color\" :icon-path=\"mdiPalette\" variant=\"tertiary\" />\n\t\t<NcChip text=\"Current time\" :icon-path=\"mdiClock\" no-close variant=\"primary\" />\n\t</div>\n</template>\n<script>\nimport { mdiClock, mdiFile, mdiPalette } from '@mdi/js'\n\nexport default {\n\tsetup() {\n\t\treturn {\n\t\t\tmdiClock,\n\t\t\tmdiFile,\n\t\t\tmdiPalette,\n\t\t}\n\t}\n}\n</script>\n```\n\n### Advanced usage\n\nIt is also possible to use custom components for the icon by using the `icon` slot.\nIn this example we are using the `NcAvatar` component to render the users avatar as the icon.\n\n*Hint: If you use round icons like avatars you should set their size to `24px` (or use CSS variable `--chip-size`) to make them fully fill and align with the the chip*\n\nAlso it is possible to pass custom actions.\n\n```vue\n<template>\n\t<NcChip>\n\t\t<!-- The icon slot allow to use custom components as the chip icon -->\n\t\t<template #icon>\n\t\t\t<NcAvatar :size=\"24\" user=\"jdoe\" display-name=\"J. Doe\" />\n\t\t</template>\n\t\t<!-- The actions slot allows to add custom actions -->\n\t\t<template #actions>\n\t\t\t<NcActionButton>\n\t\t\t\t<template #icon>\n\t\t\t\t\t<ContactsIcon :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tAdd to contacts\n\t\t\t</NcActionButton>\n\t\t</template>\n\t\t<!-- The default slot can be used for add content, just like the `text` prop -->\n\t\tJ. Doe\n\t</NcChip>\n</template>\n<script>\nimport ContactsIcon from 'vue-material-design-icons/Contacts.vue'\nexport default {\n\tcomponents: {\n\t\tContactsIcon,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"nc-chip\"\n\t\t:class=\"{\n\t\t\t[`nc-chip--${variant}`]: true,\n\t\t\t'nc-chip--no-actions': noClose && !hasActions(),\n\t\t\t'nc-chip--no-icon': !hasIcon(),\n\t\t}\">\n\t\t<span v-if=\"hasIcon()\" class=\"nc-chip__icon\">\n\t\t\t<slot name=\"icon\">\n\t\t\t\t<!-- The default icon wrapper uses a size of 18px to ensure the icon is not clipped by the round chip style -->\n\t\t\t\t<NcIconSvgWrapper v-if=\"iconPath || iconSvg\"\n\t\t\t\t\tinline\n\t\t\t\t\t:path=\"iconPath\"\n\t\t\t\t\t:svg=\"iconPath ? undefined : iconSvg\"\n\t\t\t\t\t:size=\"18\" />\n\t\t\t</slot>\n\t\t</span>\n\t\t<span class=\"nc-chip__text\">\n\t\t\t<slot>{{ text }}</slot>\n\t\t</span>\n\t\t<NcActions v-if=\"canClose || hasActions()\"\n\t\t\tclass=\"nc-chip__actions\"\n\t\t\t:force-menu=\"!canClose\"\n\t\t\tvariant=\"tertiary-no-background\">\n\t\t\t<NcActionButton v-if=\"canClose\"\n\t\t\t\tclose-after-click\n\t\t\t\t@click=\"emit('close')\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiClose\" :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ ariaLabelClose }}\n\t\t\t</NcActionButton>\n\t\t\t<slot name=\"actions\" />\n\t\t</NcActions>\n\t</div>\n</template>\n\n<script setup lang=\"ts\">\nimport type { Slot } from 'vue'\n\nimport { mdiClose } from '@mdi/js'\nimport { computed } from 'vue'\nimport { t } from '../../l10n.js'\nimport NcActions from '../NcActions/NcActions.vue'\nimport NcActionButton from '../NcActionButton/NcActionButton.vue'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/NcIconSvgWrapper.vue'\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * aria label to set on the close button\n\t * @default 'Close'\n\t */\n\tariaLabelClose?: string\n\n\t/**\n\t * Main text of the chip.\n\t */\n\ttext?: string\n\n\t/**\n\t * SVG path of the icon to use, this takes precedence over `iconSVG`.\n\t * For example icon paths from `@mdi/js` can be used.\n\t */\n\ticonPath?: string\n\n\t/**\n\t * Inline SVG to use as the icon\n\t */\n\ticonSvg?: string\n\n\t/**\n\t * Set to true to prevent the close button to be shown\n\t */\n\tnoClose?: boolean\n\n\t/**\n\t * Set the chips design variant-\n\t *\n\t * This sets the background style of the chip, similar to NcButton's `variant`.\n\t * @default 'secondary'\n\t * @since 8.23.0\n\t */\n\tvariant: 'primary' | 'secondary' | 'tertiary'\n}>(), {\n\tariaLabelClose: t('Close'),\n\ticonPath: undefined,\n\ticonSvg: undefined,\n\ttext: '',\n\tvariant: 'secondary',\n})\n\nconst emit = defineEmits<{\n\t/**\n\t * Emitted when the close button is clicked\n\t */\n\tclose: []\n}>()\n\nconst slots = defineSlots<{\n\t/**\n\t * The actions slot can be used to add custom actions (`NcAction*`) to the chips actions.\n\t */\n\tactions?: Slot\n\n\t/**\n\t * The default slot can be used to set the text that is shown.\n\t */\n\tdefault?: Slot\n\n\t/**\n\t * The icon slot can be used to set the chip icon.\n\t * Make sure that the icon is not exceeding a height of `--chip-size`.\n\t * For round icons a exact size of `var(--chip-size)` is recommended.\n\t */\n\ticon?: Slot\n}>()\n\nconst canClose = computed(() => !props.noClose)\nconst hasActions = () => !!slots.actions\nconst hasIcon = () => Boolean(props.iconPath || props.iconSvg || !!slots.icon)\n</script>\n\n<style scoped lang=\"scss\">\n.nc-chip {\n\t--chip-size: 24px;\n\t--chip-radius: calc(var(--chip-size) / 2);\n\t// Setup size of wrapper\n\theight: var(--chip-size);\n\tmax-width: fit-content;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tborder-radius: var(--chip-radius);\n\tbackground-color: var(--color-background-hover);\n\n\t&--primary {\n\t\tbackground-color: var(--color-primary-element);\n\t\tcolor: var(--color-primary-element-text);\n\t}\n\n\t&--secondary {\n\t\tbackground-color: var(--color-primary-element-light);\n\t\tcolor: var(--color-primary-element-light-text);\n\t}\n\n\t&--no-actions &__text {\n\t\t// If there are no actions we need to add some padding to ensure the text is not cut-off\n\t\tpadding-inline-end: calc(1.5 * var(--default-grid-baseline));\n\t}\n\n\t&--no-icon &__text {\n\t\t// Add some more space to the border\n\t\tpadding-inline-start: calc(1.5 * var(--default-grid-baseline));\n\t}\n\n\t&__text {\n\t\t// Allow to grow the text\n\t\t// this is only used if an app forces a width of the chip\n\t\tflex: 1 auto;\n\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\ttext-wrap: nowrap;\n\t}\n\n\t&__icon {\n\t\t// Do neither grow nor shrink, size is fixed\n\t\tflex: 0 0 var(--chip-size);\n\t\tmargin-inline-end: var(--default-grid-baseline);\n\n\t\tline-height: 1;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\n\t\t// Force size\n\t\toverflow: hidden;\n\t\theight: var(--chip-size);\n\t\twidth: var(--chip-size);\n\t}\n\n\t&__actions {\n\t\t// Do neither grow nor shrink, size is fixed\n\t\tflex: 0 0 var(--chip-size);\n\t\t// Adjust action size to match chip size\n\t\t--default-clickable-area: var(--chip-size);\n\t\t--border-radius-element: var(--chip-radius);\n\t}\n}\n</style>\n"],"names":["_useSlots"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAsHA,UAAM,QAAQ;AA4Cd,UAAM,OAAO;AAOb,UAAM,QAAQA,SAAA;AAmBd,UAAM,WAAW,SAAS,MAAM,CAAC,MAAM,OAAO;AAC9C,UAAM,aAAa,MAAM,CAAC,CAAC,MAAM;AAC3B,UAAA,UAAU,MAAM,QAAQ,MAAM,YAAY,MAAM,WAAW,CAAC,CAAC,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/NcColorPicker-DGwM1Zki.mjs

@@ -1,275 +0,0 @@
-import '../assets/NcColorPicker-Clz7MjCA.css';
-import { Chrome } from "@ckpack/vue-color";
-import { defineComponent, resolveComponent, createBlock, openBlock, withCtx, createElementVNode, normalizeClass, createVNode, createElementBlock, createCommentVNode, Transition, Fragment, renderList, normalizeStyle, createTextVNode, toDisplayString, renderSlot, normalizeProps, guardReactiveProps } from "vue";
-import { d as defaultPalette } from "./colors-AMTxjrbV.mjs";
-import { c as createElementId } from "./createElementId-DhjFt1I9.mjs";
-import { r as register, i as t1, a as t } from "./_l10n-dinIMiE_.mjs";
-import { A as ArrowLeft } from "./ArrowLeft-CanHG70H.mjs";
-import { C as Check } from "./Check-5i4xKnkl.mjs";
-import { D as DotsHorizontal } from "./DotsHorizontal-AMVAlTNH.mjs";
-import { N as NcButton } from "./NcButton-Byg8-ta1.mjs";
-import { N as NcPopover } from "./NcPopover-CzrFCS-2.mjs";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-register(t1);
-const HEX_REGEX = /^#([a-f0-9]{3}|[a-f0-9]{6})$/i;
-const _sfc_main = defineComponent({
-  name: "NcColorPicker",
-  components: {
-    ArrowLeft,
-    Check,
-    Chrome,
-    DotsHorizontal,
-    NcButton,
-    NcPopover
-  },
-  props: {
-    /**
-     * A HEX color that represents the initial value of the picker
-     */
-    modelValue: {
-      type: String,
-      required: true
-    },
-    /**
-     * Set to `true` to enable advanced fields including HEX, RGB, and HSL
-     */
-    advancedFields: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Limit selectable colors to only the provided palette
-     */
-    paletteOnly: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Provide a custom array of colors to show.
-     * Can be either an array of string hexadecimal colors,
-     * or an array of object with a `color` property with hexadecimal color string,
-     * and a `name` property for accessibility.
-     *
-     * @type {string[] | {color: string, name: string}[]}
-     */
-    palette: {
-      type: Array,
-      default: () => [...defaultPalette],
-      validator: (palette) => palette.every(
-        (item) => typeof item === "string" && HEX_REGEX.test(item) || typeof item === "object" && item.color && HEX_REGEX.test(item.color)
-      )
-    },
-    /**
-     * Selector for the popover container
-     */
-    container: {
-      type: [String, Object, Element, Boolean],
-      default: "body"
-    }
-  },
-  emits: [
-    "submit",
-    "close",
-    "update:open",
-    "update:modelValue"
-  ],
-  data() {
-    return {
-      currentColor: this.modelValue,
-      advanced: false,
-      ariaBack: t("Back"),
-      ariaMore: t("More options")
-    };
-  },
-  computed: {
-    normalizedPalette() {
-      return this.palette.map((item) => ({
-        color: typeof item === "object" ? item.color : item,
-        name: typeof item === "object" && item.name ? item.name : t("A color with a HEX value {hex}", { hex: item.color })
-      }));
-    },
-    uid() {
-      return createElementId();
-    },
-    contrastColor() {
-      const black = "#000000";
-      const white = "#FFFFFF";
-      return this.calculateLuma(this.currentColor) > 0.5 ? black : white;
-    }
-  },
-  watch: {
-    modelValue(color) {
-      this.currentColor = color;
-    }
-  },
-  methods: {
-    t,
-    /**
-     * Submit a picked colour and close picker
-     * @param {Function} hideCallback callback to close popover
-     */
-    handleConfirm(hideCallback) {
-      this.$emit("submit", this.currentColor);
-      hideCallback();
-      this.advanced = false;
-    },
-    handleClose() {
-      this.$emit("close");
-      this.$emit("update:open", false);
-    },
-    /**
-     * Inner navigations
-     */
-    handleBack() {
-      this.advanced = false;
-    },
-    handleMoreSettings() {
-      this.advanced = true;
-    },
-    /**
-     * Pick a colour
-     *
-     * @param {string} color the picked color
-     */
-    pickColor(color) {
-      if (typeof color !== "string") {
-        color = this.currentColor.hex;
-      }
-      this.currentColor = color;
-      this.$emit("update:modelValue", color);
-    },
-    /**
-     * Calculate luminance of provided hex color
-     *
-     * @param {string} color the hex color
-     */
-    calculateLuma(color) {
-      const [red, green, blue] = this.hexToRGB(color);
-      return (0.2126 * red + 0.7152 * green + 0.0722 * blue) / 255;
-    },
-    /**
-     * Convert hex color to RGB
-     *
-     * @param {string} hex the hex color
-     */
-    hexToRGB(hex) {
-      const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-      return result ? [parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)] : null;
-    }
-  }
-});
-const _hoisted_1 = ["aria-label"];
-const _hoisted_2 = {
-  key: 0,
-  class: "color-picker__simple"
-};
-const _hoisted_3 = ["aria-label", "name", "checked", "onClick"];
-const _hoisted_4 = {
-  key: 0,
-  class: "color-picker__navigation"
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_Check = resolveComponent("Check");
-  const _component_Chrome = resolveComponent("Chrome");
-  const _component_ArrowLeft = resolveComponent("ArrowLeft");
-  const _component_NcButton = resolveComponent("NcButton");
-  const _component_DotsHorizontal = resolveComponent("DotsHorizontal");
-  const _component_NcPopover = resolveComponent("NcPopover");
-  return openBlock(), createBlock(_component_NcPopover, {
-    "popup-role": "dialog",
-    container: _ctx.container,
-    onApplyHide: _ctx.handleClose
-  }, {
-    trigger: withCtx((slotProps) => [
-      renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps)), void 0, true)
-    ]),
-    default: withCtx((slotProps) => [
-      createElementVNode("div", {
-        role: "dialog",
-        class: normalizeClass(["color-picker", { "color-picker--advanced-fields": _ctx.advanced && _ctx.advancedFields }]),
-        "aria-modal": "true",
-        "aria-label": _ctx.t("Color picker")
-      }, [
-        createVNode(Transition, {
-          name: "slide",
-          mode: "out-in"
-        }, {
-          default: withCtx(() => [
-            !_ctx.advanced ? (openBlock(), createElementBlock("div", _hoisted_2, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.normalizedPalette, ({ color, name }, index) => {
-                return openBlock(), createElementBlock("label", {
-                  key: index,
-                  style: normalizeStyle({ backgroundColor: color }),
-                  class: normalizeClass(["color-picker__simple-color-circle", { "color-picker__simple-color-circle--active": color === _ctx.currentColor }])
-                }, [
-                  color === _ctx.currentColor ? (openBlock(), createBlock(_component_Check, {
-                    key: 0,
-                    size: 20,
-                    "fill-color": _ctx.contrastColor
-                  }, null, 8, ["fill-color"])) : createCommentVNode("", true),
-                  createElementVNode("input", {
-                    type: "radio",
-                    class: "hidden-visually",
-                    "aria-label": name,
-                    name: `color-picker-${_ctx.uid}`,
-                    checked: color === _ctx.currentColor,
-                    onClick: ($event) => _ctx.pickColor(color)
-                  }, null, 8, _hoisted_3)
-                ], 6);
-              }), 128))
-            ])) : (openBlock(), createBlock(_component_Chrome, {
-              key: 1,
-              modelValue: _ctx.currentColor,
-              "onUpdate:modelValue": [
-                _cache[0] || (_cache[0] = ($event) => _ctx.currentColor = $event),
-                _ctx.pickColor
-              ],
-              class: "color-picker__advanced",
-              "disable-alpha": true,
-              "disable-fields": !_ctx.advancedFields
-            }, null, 8, ["modelValue", "disable-fields", "onUpdate:modelValue"]))
-          ]),
-          _: 1
-        }),
-        !_ctx.paletteOnly ? (openBlock(), createElementBlock("div", _hoisted_4, [
-          _ctx.advanced ? (openBlock(), createBlock(_component_NcButton, {
-            key: 0,
-            "aria-label": _ctx.ariaBack,
-            variant: "tertiary",
-            onClick: _ctx.handleBack
-          }, {
-            icon: withCtx(() => [
-              createVNode(_component_ArrowLeft, { size: 20 })
-            ]),
-            _: 1
-          }, 8, ["aria-label", "onClick"])) : (openBlock(), createBlock(_component_NcButton, {
-            key: 1,
-            "aria-label": _ctx.ariaMore,
-            variant: "tertiary",
-            onClick: _ctx.handleMoreSettings
-          }, {
-            icon: withCtx(() => [
-              createVNode(_component_DotsHorizontal, { size: 20 })
-            ]),
-            _: 1
-          }, 8, ["aria-label", "onClick"])),
-          createVNode(_component_NcButton, {
-            variant: "primary",
-            onClick: ($event) => _ctx.handleConfirm(slotProps.hide)
-          }, {
-            default: withCtx(() => [
-              createTextVNode(toDisplayString(_ctx.t("Choose")), 1)
-            ]),
-            _: 2
-          }, 1032, ["onClick"])
-        ])) : createCommentVNode("", true)
-      ], 10, _hoisted_1)
-    ]),
-    _: 3
-  }, 8, ["container", "onApplyHide"]);
-}
-const NcColorPicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-180efb02"]]);
-export {
-  NcColorPicker as N
-};
-//# sourceMappingURL=NcColorPicker-DGwM1Zki.mjs.map

package/dist/chunks/NcColorPicker-DGwM1Zki.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcColorPicker-DGwM1Zki.mjs","sources":["../../src/components/NcColorPicker/NcColorPicker.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component allows the user to choose a color. It consists of 2\nactual pickers:\n\n- One simple picker with a predefined palette of colors;\n- One more advanced picker that provides the full color spectrum;\n\n### Usage\n\n* Using v-model and passing in an HTML element that will be treated as a trigger:\n\n```vue\n<template>\n\t<div class=\"container0\">\n\t\t<NcColorPicker v-model=\"color\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcColorPicker>\n\t\t<NcColorPicker v-model=\"color\" :palette=\"customPalette\">\n\t\t\t<NcButton> Click Me for a custom palette </NcButton>\n\t\t</NcColorPicker>\n\t\t<div :style=\"{'background-color': color}\" class=\"color0\" />\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tcolor: '#0082c9',\n\t\t\tcustomPalette: [\n\t\t\t\t'#E40303',\n\t\t\t\t'#FF8C00',\n\t\t\t\t'#FFED00',\n\t\t\t\t'#008026',\n\t\t\t\t'#24408E',\n\t\t\t\t'#732982',\n\t\t\t\t'#5BCEFA',\n\t\t\t\t'#F5A9B8',\n\t\t\t\t'#FFFFFF',\n\t\t\t\t'#F5A9B8',\n\t\t\t\t'#5BCEFA',\n\t\t\t],\n\t\t}\n\t}\n}\n</script>\n<style>\n.container0 {\n\tdisplay: flex;\n\tgap: 20px;\n}\n\n.color0 {\n\twidth: 100px;\n\theight: 34px;\n\tborder-radius: 6px;\n}\n</style>\n```\n\n* Using v-model for both color and open state and emitting an event that updates the color\n\n```vue\n<template>\n\t<div class=\"container1\">\n\t\t<NcButton @click=\"open = !open\"> Click Me </NcButton>\n\t\t<NcColorPicker v-model=\"color\" v-model:shown=\"open\" v-slot=\"{ attrs }\">\n\t\t\t<div v-bind=\"attrs\" :style=\"{'background-color': color}\" class=\"color1\" />\n\t\t</NcColorPicker>\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tcolor: '#0082c9',\n\t\t\topen: false\n\t\t}\n\t}\n}\n</script>\n<style>\n.container1 {\n\tdisplay: flex;\n\tgap: 20px;\n}\n\n.color1 {\n\twidth: 100px;\n\theight: 34px;\n\tborder-radius: 6px;\n}\n</style>\n```\n\n* Using advanced fields including HEX, RGB, and HSL:\n\n```vue\n<template>\n\t<div class=\"container0\">\n\t\t<NcColorPicker v-model=\"color\"\n\t\t\t:advanced-fields=\"true\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcColorPicker>\n\t\t<div :style=\"{'background-color': color}\" class=\"color0\" />\n\t</div>\n</template>\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tcolor: '#0082c9'\n\t\t}\n\t}\n}\n</script>\n<style>\n.container0 {\n\tdisplay: flex;\n\tgap: 20px;\n}\n\n.color0 {\n\twidth: 100px;\n\theight: 34px;\n\tborder-radius: 6px;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<NcPopover popup-role=\"dialog\"\n\t\t:container=\"container\"\n\t\t@apply-hide=\"handleClose\">\n\t\t<template #trigger=\"slotProps\">\n\t\t\t<slot v-bind=\"slotProps\" />\n\t\t</template>\n\t\t<template #default=\"slotProps\">\n\t\t\t<div role=\"dialog\"\n\t\t\t\tclass=\"color-picker\"\n\t\t\t\taria-modal=\"true\"\n\t\t\t\t:aria-label=\"t('Color picker')\"\n\t\t\t\t:class=\"{ 'color-picker--advanced-fields': advanced && advancedFields }\">\n\t\t\t\t<Transition name=\"slide\" mode=\"out-in\">\n\t\t\t\t\t<div v-if=\"!advanced\" class=\"color-picker__simple\">\n\t\t\t\t\t\t<label v-for=\"({ color, name }, index) in normalizedPalette\"\n\t\t\t\t\t\t\t:key=\"index\"\n\t\t\t\t\t\t\t:style=\"{ backgroundColor: color }\"\n\t\t\t\t\t\t\tclass=\"color-picker__simple-color-circle\"\n\t\t\t\t\t\t\t:class=\"{ 'color-picker__simple-color-circle--active' : color === currentColor }\">\n\t\t\t\t\t\t\t<Check v-if=\"color === currentColor\" :size=\"20\" :fill-color=\"contrastColor\" />\n\t\t\t\t\t\t\t<input type=\"radio\"\n\t\t\t\t\t\t\t\tclass=\"hidden-visually\"\n\t\t\t\t\t\t\t\t:aria-label=\"name\"\n\t\t\t\t\t\t\t\t:name=\"`color-picker-${uid}`\"\n\t\t\t\t\t\t\t\t:checked=\"color === currentColor\"\n\t\t\t\t\t\t\t\t@click=\"pickColor(color)\">\n\t\t\t\t\t\t</label>\n\t\t\t\t\t</div>\n\t\t\t\t\t<Chrome v-else\n\t\t\t\t\t\tv-model=\"currentColor\"\n\t\t\t\t\t\tclass=\"color-picker__advanced\"\n\t\t\t\t\t\t:disable-alpha=\"true\"\n\t\t\t\t\t\t:disable-fields=\"!advancedFields\"\n\t\t\t\t\t\t@update:model-value=\"pickColor\" />\n\t\t\t\t</Transition>\n\t\t\t\t<div v-if=\"!paletteOnly\" class=\"color-picker__navigation\">\n\t\t\t\t\t<NcButton v-if=\"advanced\"\n\t\t\t\t\t\t:aria-label=\"ariaBack\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t@click=\"handleBack\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<ArrowLeft :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcButton>\n\t\t\t\t\t<NcButton v-else\n\t\t\t\t\t\t:aria-label=\"ariaMore\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t@click=\"handleMoreSettings\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<DotsHorizontal :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcButton>\n\t\t\t\t\t<NcButton variant=\"primary\"\n\t\t\t\t\t\t@click=\"handleConfirm(slotProps.hide)\">\n\t\t\t\t\t\t{{ t('Choose') }}\n\t\t\t\t\t</NcButton>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</template>\n\t</NcPopover>\n</template>\n\n<script>\nimport { Chrome } from '@ckpack/vue-color'\nimport { defineComponent } from 'vue'\nimport { defaultPalette } from '../../utils/colors.ts'\nimport { createElementId } from '../../utils/createElementId.ts'\nimport { t } from '../../l10n.js'\n\nimport ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'\nimport Check from 'vue-material-design-icons/Check.vue'\nimport DotsHorizontal from 'vue-material-design-icons/DotsHorizontal.vue'\nimport NcButton from '../NcButton/index.ts'\nimport NcPopover from '../NcPopover/index.js'\n\nconst HEX_REGEX = /^#([a-f0-9]{3}|[a-f0-9]{6})$/i\n\nexport default defineComponent({\n\tname: 'NcColorPicker',\n\n\tcomponents: {\n\t\tArrowLeft,\n\t\tCheck,\n\t\tChrome,\n\t\tDotsHorizontal,\n\t\tNcButton,\n\t\tNcPopover,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * A HEX color that represents the initial value of the picker\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Set to `true` to enable advanced fields including HEX, RGB, and HSL\n\t\t */\n\t\tadvancedFields: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Limit selectable colors to only the provided palette\n\t\t */\n\t\tpaletteOnly: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Provide a custom array of colors to show.\n\t\t * Can be either an array of string hexadecimal colors,\n\t\t * or an array of object with a `color` property with hexadecimal color string,\n\t\t * and a `name` property for accessibility.\n\t\t *\n\t\t * @type {string[] | {color: string, name: string}[]}\n\t\t */\n\t\tpalette: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [...defaultPalette],\n\t\t\tvalidator: (palette) => palette.every(item =>\n\t\t\t\t(typeof item === 'string' && HEX_REGEX.test(item))\n\t\t\t\t|| (typeof item === 'object' && item.color && HEX_REGEX.test(item.color)),\n\t\t\t),\n\t\t},\n\n\t\t/**\n\t\t * Selector for the popover container\n\t\t */\n\t\tcontainer: {\n\t\t\ttype: [String, Object, Element, Boolean],\n\t\t\tdefault: 'body',\n\t\t},\n\t},\n\n\temits: [\n\t\t'submit',\n\t\t'close',\n\t\t'update:open',\n\t\t'update:modelValue',\n\t],\n\n\tdata() {\n\t\treturn {\n\t\t\tcurrentColor: this.modelValue,\n\t\t\tadvanced: false,\n\t\t\tariaBack: t('Back'),\n\t\t\tariaMore: t('More options'),\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tnormalizedPalette() {\n\t\t\treturn this.palette.map((item) => ({\n\t\t\t\tcolor: typeof item === 'object' ? item.color : item,\n\t\t\t\tname: typeof item === 'object' && item.name\n\t\t\t\t\t? item.name\n\t\t\t\t\t: t('A color with a HEX value {hex}', { hex: item.color }),\n\t\t\t}))\n\t\t},\n\n\t\tuid() {\n\t\t\treturn createElementId()\n\t\t},\n\t\tcontrastColor() {\n\t\t\tconst black = '#000000'\n\t\t\tconst white = '#FFFFFF'\n\t\t\treturn (this.calculateLuma(this.currentColor) > 0.5) ? black : white\n\t\t},\n\t},\n\n\twatch: {\n\t\tmodelValue(color) {\n\t\t\tthis.currentColor = color\n\t\t},\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\t/**\n\t\t * Submit a picked colour and close picker\n\t\t * @param {Function} hideCallback callback to close popover\n\t\t */\n\t\thandleConfirm(hideCallback) {\n\t\t\t/**\n\t\t\t * Emits a hexadecimal string e.g. '#ffffff'\n\t\t\t */\n\t\t\tthis.$emit('submit', this.currentColor)\n\t\t\thideCallback()\n\n\t\t\tthis.advanced = false\n\t\t},\n\t\thandleClose() {\n\t\t\t/**\n\t\t\t * Emitted after picker close\n\t\t\t */\n\t\t\tthis.$emit('close')\n\t\t\tthis.$emit('update:open', false)\n\t\t},\n\n\t\t/**\n\t\t * Inner navigations\n\t\t */\n\t\thandleBack() {\n\t\t\tthis.advanced = false\n\t\t},\n\t\thandleMoreSettings() {\n\t\t\tthis.advanced = true\n\t\t},\n\n\t\t/**\n\t\t * Pick a colour\n\t\t *\n\t\t * @param {string} color the picked color\n\t\t */\n\t\tpickColor(color) {\n\t\t\tif (typeof color !== 'string') {\n\t\t\t\tcolor = this.currentColor.hex\n\t\t\t}\n\t\t\tthis.currentColor = color\n\n\t\t\t/**\n\t\t\t * Emits a hexadecimal string e.g. '#ffffff'\n\t\t\t */\n\t\t\tthis.$emit('update:modelValue', color)\n\n\t\t},\n\n\t\t/**\n\t\t * Calculate luminance of provided hex color\n\t\t *\n\t\t * @param {string} color the hex color\n\t\t */\n\t\t calculateLuma(color) {\n\t\t\tconst [red, green, blue] = this.hexToRGB(color)\n\t\t\treturn (0.2126 * red + 0.7152 * green + 0.0722 * blue) / 255\n\t\t},\n\n\t\t/**\n\t\t * Convert hex color to RGB\n\t\t *\n\t\t * @param {string} hex the hex color\n\t\t */\n\t\t hexToRGB(hex) {\n\t\t\tconst result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex)\n\t\t\treturn result\n\t\t\t\t? [parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)]\n\t\t\t\t: null\n\t\t},\n\t},\n})\n\n</script>\n\n<style lang=\"scss\" scoped>\n.color-picker {\n\tdisplay: flex;\n\toverflow: hidden;\n\talign-content: flex-end;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\twidth: 176px;\n\tpadding: 8px;\n\tborder-radius: 3px;\n\n\t&--advanced-fields {\n\t\twidth: 264px;\n\t}\n\n\t&__simple {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: repeat(auto-fit, var(--default-clickable-area));\n\t\tgrid-auto-rows: var(--default-clickable-area);\n\n\t\t&-color-circle {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\twidth: calc(var(--default-clickable-area) - 10px);\n\t\t\theight: calc(var(--default-clickable-area) - 10px);\n\t\t\tmin-height: calc(var(--default-clickable-area) - 10px);\n\t\t\tmargin: auto;\n\t\t\tpadding: 0;\n\t\t\tcolor: white;\n\t\t\tborder: 1px solid rgba(0, 0, 0, 0.25);\n\t\t\tborder-radius: 50%;\n\t\t\tfont-size: 16px;\n\t\t\t&:focus-within {\n\t\t\t\toutline: 2px solid var(--color-main-text);\n\t\t\t}\n\t\t\t&:hover {\n\t\t\t\topacity: .6;\n\t\t\t}\n\t\t\t&--active {\n\t\t\t\twidth: calc(var(--default-clickable-area) - 6px);\n\t\t\t\theight: calc(var(--default-clickable-area) - 6px);\n\t\t\t\tmin-height: calc(var(--default-clickable-area) - 6px);\n\t\t\t\ttransition: all 100ms ease-in-out;\n\t\t\t\topacity: 1 !important;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__advanced {\n\t\tbox-shadow: none !important;\n\t}\n\n\t&__navigation {\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tjustify-content: space-between;\n\t\tmargin-top: 10px;\n\t}\n}\n\n:deep() .vc {\n\t&-chrome {\n\t\twidth: unset;\n\t\tbackground-color: var(--color-main-background);\n\n\t\t&-color-wrap {\n\t\t\twidth: 30px;\n\t\t\theight: 30px;\n\t\t}\n\n\t\t&-active-color {\n\t\t\tborder-radius: 17px;\n\t\t}\n\n\t\t&-body {\n\t\t\tpadding: 14px 0 0 0;\n\t\t\tbackground-color: var(--color-main-background);\n\n\t\t\t.vc-input__input {\n\t\t\t\t--input-border-radius: var(--border-radius-element, var(--border-radius-large));\n\t\t\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\t\t\twidth: 100%;\n\t\t\t\theight: var(--default-clickable-area);\n\t\t\t\tmargin: 0;\n\t\t\t\tpadding-inline: calc(var(--border-radius-large) + var(--input-border-width-offset));\n\t\t\t\tpadding-block: var(--input-border-width-offset);\n\t\t\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\t\t\t\tborder-radius: var(--input-border-radius);\n\t\t\t\tfont-size: var(--default-font-size);\n\t\t\t\tcolor: var(--color-main-text);\n\t\t\t\tbox-shadow: none;\n\n\t\t\t\t&:active:not([disabled]),\n\t\t\t\t&:hover:not([disabled]),\n\t\t\t\t&:focus:not([disabled]) {\n\t\t\t\t\t// Reset padding offset when focused\n\t\t\t\t\t--input-border-width-offset: 0px;\n\t\t\t\t\tborder-color: var(--color-main-text);\n\t\t\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\n\t\t\t\t\t& + .vc-input__label {\n\t\t\t\t\t\tcolor: var(--color-main-text);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t.vc-input__label {\n\t\t\t\tposition: absolute;\n\t\t\t\tinset-inline: var(--border-width-input-focused, 2px);\n\t\t\t\tinset-block-start: calc(-1.5 * var(--font-size-small, 13px) / 2);\n\t\t\t\tmax-width: fit-content;\n\t\t\t\tmargin-inline: calc(var(--border-radius-large) - var(--default-grid-baseline));\n\t\t\t\tmargin-block: 0;\n\t\t\t\tpadding-inline: var(--default-grid-baseline);\n\t\t\t\tfont-family: var(--font-face);\n\t\t\t\tfont-size: var(--font-size-small, 13px);\n\t\t\t\tline-height: 1.5;\n\t\t\t\tfont-weight: 500;\n\t\t\t\tcolor: var(--color-text-maxcontrast);\n\t\t\t\tbackground-color: var(--color-main-background);\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t}\n\n\t\t&-toggle-btn {\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\t\t\twidth: var(--default-clickable-area);\n\t\t\theight: var(--default-clickable-area);\n\t\t\tmargin-inline-start: 6px;\n\t\t\tfilter: var(--background-invert-if-dark);\n\t\t}\n\n\t\t&-toggle-icon {\n\t\t\twidth: 24px;\n\t\t\theight: 24px;\n\t\t\tmargin: 0;\n\t\t}\n\n\t\t&-toggle-icon-highlight {\n\t\t\twidth: var(--default-clickable-area);\n\t\t\theight: var(--default-clickable-area);\n\t\t\tinset: 0;\n\t\t}\n\n\t\t&-saturation {\n\t\t\t&-wrap {\n\t\t\t\tborder-radius: 3px;\n\t\t\t}\n\n\t\t\t&-circle {\n\t\t\t\twidth: 20px;\n\t\t\t\theight: 20px;\n\t\t\t}\n\t\t}\n\t}\n}\n\n.slide {\n\t&-enter-from {\n\t\ttransform: translateX(-50%);\n\t\topacity: 0;\n\t}\n\t&-enter-to {\n\t\ttransform: translateX(0);\n\t\topacity: 1;\n\t}\n\t&-leave-from {\n\t\ttransform: translateX(0);\n\t\topacity: 1;\n\t}\n\t&-leave-to {\n\t\ttransform: translateX(-50%);\n\t\topacity: 0;\n\t}\n\t&-enter-active,\n\t&-leave-active {\n\t\ttransition: all 50ms ease-in-out;\n\t}\n}\n\n</style>\n"],"names":["_createBlock","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps","_createElementVNode","_normalizeClass","_createVNode","_Transition","_openBlock","_createElementBlock","_Fragment","_renderList","_normalizeStyle","_createCommentVNode","_createTextVNode","_toDisplayString"],"mappings":"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"}

package/dist/chunks/NcCounterBubble-6B_JNUUS.mjs

@@ -1,78 +0,0 @@
-import '../assets/NcCounterBubble-DWgyYB0d.css';
-import { getCanonicalLocale } from "@nextcloud/l10n";
-import { createElementBlock, openBlock, normalizeClass, toDisplayString } from "vue";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
-const _sfc_main = {
-  name: "NcCounterBubble",
-  props: {
-    type: {
-      type: String,
-      default: "",
-      validator(value) {
-        return ["highlighted", "outlined", ""].includes(value);
-      }
-    },
-    /**
-     * Specifies whether the component is used within a component that is
-     * active and therefore has a primary background. Inverts the color of
-     * this component when that is the case.
-     */
-    active: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * The count to display in the counter bubble.
-     */
-    count: {
-      type: Number,
-      required: true
-    },
-    /**
-     * Disables humanization to display count as it is.
-     */
-    raw: {
-      type: Boolean,
-      required: false,
-      default: false
-    }
-  },
-  computed: {
-    counterClassObject() {
-      return {
-        "counter-bubble__counter--highlighted": this.type === "highlighted",
-        "counter-bubble__counter--outlined": this.type === "outlined",
-        active: this.active
-      };
-    },
-    humanizedCount() {
-      if (this.raw) {
-        return this.count.toString();
-      }
-      const formatter = new Intl.NumberFormat(getCanonicalLocale(), {
-        notation: "compact",
-        compactDisplay: "short"
-      });
-      return formatter.format(this.count);
-    },
-    originalCountAsTitleIfNeeded() {
-      const countAsString = this.count.toString();
-      if (this.raw || countAsString === this.humanizedCount) {
-        return void 0;
-      }
-      return countAsString;
-    }
-  }
-};
-const _hoisted_1 = ["title"];
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", {
-    class: normalizeClass(["counter-bubble__counter", $options.counterClassObject]),
-    title: $options.originalCountAsTitleIfNeeded
-  }, toDisplayString($options.humanizedCount), 11, _hoisted_1);
-}
-const NcCounterBubble = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-f328a941"]]);
-export {
-  NcCounterBubble as N
-};
-//# sourceMappingURL=NcCounterBubble-6B_JNUUS.mjs.map

package/dist/chunks/NcCounterBubble-6B_JNUUS.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcCounterBubble-6B_JNUUS.mjs","sources":["../../src/components/NcCounterBubble/NcCounterBubble.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### Default usage\n\nNcCounterBubble displays a number from the `count` prop in a bubble.\n\nBy default, the number is **humanized** according to Nextcloud user's locale setting. Humanization can be disabled via `raw` prop.\n\n```vue\n<template>\n\t<table>\n\t\t<tr>\n\t\t\t<th>count</th>\n\t\t\t<th>default</th>\n\t\t\t<th>raw</th>\n\t\t</tr>\n\t\t<tr v-for=\"num in numbers\" :key=\"num\">\n\t\t\t<td>{{ num }}</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"num\" />\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"num\" raw />\n\t\t\t</td>\n\t\t</tr>\n\t</table>\n</template>\n\n<script>\nexport default {\n\tsetup() {\n\t\treturn {\n\t\t\tnumbers: [1, 9, 75, 450, 1042, 1750, 1999, 14567, 14567890, 2000000008],\n\t\t}\n\t},\n}\n</script>\n\n<style scoped>\ntable {\n\tborder-collapse: collapse;\n}\n\nth,\ntd {\n\tborder: 1px solid var(--color-border);\n\tpadding: var(--default-grid-baseline) calc(var(--default-grid-baseline) * 2);\n}\n\nth {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n```\n\n### Styles\n\nUse different styles for different types of counters.\n\n```\n<template>\n\t<table>\n\t\t<tr>\n\t\t\t<th>type</th>\n\t\t\t<th>counter</th>\n\t\t\t<th>Usage example</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>'' (default)</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"3\" />\n\t\t\t</td>\n\t\t\t<td></td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>outlined</td>\n\t\t\t<td><NcCounterBubble :count=\"3\" type=\"outlined\" /></td>\n\t\t\t<td>Team/group mentions</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>highlighted</td>\n\t\t\t<td>\n\t\t\t\t<NcCounterBubble :count=\"3\" type=\"highlighted\" />\n\t\t\t</td>\n\t\t\t<td>Direct mentions</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>outlined active</td>\n\t\t\t<td class=\"active-like\">\n\t\t\t\t<NcCounterBubble :count=\"3\" type=\"outlined\" active />\n\t\t\t</td>\n\t\t\t<td>Same as \"outlined\", but in an \"active\" container</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>highlighted active</td>\n\t\t\t<td class=\"active-like\">\n\t\t\t\t<NcCounterBubble :count=\"3\" type=\"highlighted\" active />\n\t\t\t</td>\n\t\t\t<td>Same as \"highlighted\", but in an \"active\" container</td>\n\t\t</tr>\n\t</table>\n</template>\n\n<style scoped>\ntable {\n\tborder-collapse: collapse;\n}\n\nth,\ntd {\n\tborder: 1px solid var(--color-border);\n\tpadding: var(--default-grid-baseline) calc(var(--default-grid-baseline) * 2);\n\n\t&.active-like {\n\t\tbackground-color: var(--color-primary-element);\n\t}\n}\n\nth {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n```\n\n### Custom content (removed)\n\nIn v8 it was possible to pass any custom content via the default slot. This feature has been removed. Use `count` prop for numbers or [NcChip](#/Components/NcChip) component for a custom content.\n</docs>\n\n<template>\n\t<div class=\"counter-bubble__counter\"\n\t\t:class=\"counterClassObject\"\n\t\t:title=\"originalCountAsTitleIfNeeded\">\n\t\t{{ humanizedCount }}\n\t</div>\n</template>\n\n<script>\nimport { getCanonicalLocale } from '@nextcloud/l10n'\n\nexport default {\n\tname: 'NcCounterBubble',\n\n\tprops: {\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['highlighted', 'outlined', ''].includes(value)\n\t\t\t},\n\t\t},\n\n\t\t/**\n\t\t * Specifies whether the component is used within a component that is\n\t\t * active and therefore has a primary background. Inverts the color of\n\t\t * this component when that is the case.\n\t\t */\n\t\tactive: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * The count to display in the counter bubble.\n\t\t */\n\t\tcount: {\n\t\t\ttype: Number,\n\t\t\trequired: true,\n\t\t},\n\n\t\t/**\n\t\t * Disables humanization to display count as it is.\n\t\t */\n\t\traw: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false,\n\t\t},\n\t},\n\n\tcomputed: {\n\t\tcounterClassObject() {\n\t\t\treturn {\n\t\t\t\t'counter-bubble__counter--highlighted': this.type === 'highlighted',\n\t\t\t\t'counter-bubble__counter--outlined': this.type === 'outlined',\n\t\t\t\tactive: this.active,\n\t\t\t}\n\t\t},\n\n\t\thumanizedCount() {\n\t\t\tif (this.raw) {\n\t\t\t\treturn this.count.toString()\n\t\t\t}\n\n\t\t\tconst formatter = new Intl.NumberFormat(getCanonicalLocale(), {\n\t\t\t\tnotation: 'compact',\n\t\t\t\tcompactDisplay: 'short',\n\t\t\t})\n\n\t\t\treturn formatter.format(this.count)\n\t\t},\n\n\t\toriginalCountAsTitleIfNeeded() {\n\t\t\tconst countAsString = this.count.toString()\n\n\t\t\t// If raw or unchanged - no need for the title\n\t\t\tif (this.raw || countAsString === this.humanizedCount) {\n\t\t\t\treturn undefined\n\t\t\t}\n\n\t\t\treturn countAsString\n\t\t},\n\t},\n}\n\n</script>\n\n<style lang=\"scss\" scoped>\n.counter-bubble__counter {\n\t--counter-bubble-height: 22px; // ~ 1cap + 2 * 1.5 * grid\n\tfont-size: var(--font-size-small, 13px);\n\toverflow: hidden;\n\twidth: fit-content;\n\tmin-width: var(--counter-bubble-height); // Make it not narrower than a circle\n\ttext-align: center;\n\tline-height: var(--counter-bubble-height); // Expand line-height to full height to center text vertically\n\tpadding: 0 calc(1.5 * var(--default-grid-baseline));\n\tborder-radius: var(--border-radius-pill);\n\tbackground-color: var(--color-primary-element-light);\n\tfont-weight: bold;\n\tcolor: var(--color-primary-element-light-text);\n\n\t& .active {\n\t\tcolor: var(--color-main-background);\n\t\tbackground-color: var(--color-primary-element-light);\n\t}\n\n\t&--highlighted {\n\t\tcolor: var(--color-primary-element-text);\n\t\tbackground-color: var(--color-primary-element);\n\t}\n\n\t&--highlighted.active {\n\t\tcolor: var(--color-primary-element);\n\t\tbackground-color: var(--color-main-background);\n\t}\n\n\t&--outlined {\n\t\tcolor: var(--color-primary-element);\n\t\tbackground: transparent;\n\t\tbox-shadow: inset 0 0 0 2px;\n\t}\n\n\t&--outlined.active {\n\t\tcolor: var(--color-main-background);\n\t\tbox-shadow: inset 0 0 0 2px;\n\t}\n}\n</style>\n"],"names":["_createElementBlock","_normalizeClass","_toDisplayString"],"mappings":";;;AAiJA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,OAAO;AAAA,IACN,MAAM;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU,OAAO;AAChB,eAAO,CAAC,eAAe,YAAY,EAAE,EAAE,SAAS,KAAK;AAAA,MACrD;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOD,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAKD,OAAO;AAAA,MACN,MAAM;AAAA,MACN,UAAU;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,KAAK;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,IACT;AAAA,EACD;AAAA,EAED,UAAU;AAAA,IACT,qBAAqB;AACpB,aAAO;AAAA,QACN,wCAAwC,KAAK,SAAS;AAAA,QACtD,qCAAqC,KAAK,SAAS;AAAA,QACnD,QAAQ,KAAK;AAAA,MACd;AAAA,IACA;AAAA,IAED,iBAAiB;AAChB,UAAI,KAAK,KAAK;AACb,eAAO,KAAK,MAAM,SAAQ;AAAA,MAC3B;AAEA,YAAM,YAAY,IAAI,KAAK,aAAa,mBAAkB,GAAI;AAAA,QAC7D,UAAU;AAAA,QACV,gBAAgB;AAAA,MAChB,CAAA;AAED,aAAO,UAAU,OAAO,KAAK,KAAK;AAAA,IAClC;AAAA,IAED,+BAA+B;AAC9B,YAAM,gBAAgB,KAAK,MAAM,SAAQ;AAGzC,UAAI,KAAK,OAAO,kBAAkB,KAAK,gBAAgB;AACtD,eAAO;AAAA,MACR;AAEA,aAAO;AAAA,IACP;AAAA,EACD;AACF;AA1NA,MAAA,aAAA,CAAA,OAAA;;sBAuICA,mBAIM,OAAA;AAAA,IAJD,OAvINC,eAAA,CAuIY,2BACF,SAAkB,kBAAA,CAAA;AAAA,IACzB,OAAO,SAA4B;AAAA,EACjC,GAAAC,gBAAA,SAAA,cAAc,GA1InB,IAAA,UAAA;;;"}

package/dist/chunks/NcDashboardWidgetItem-BsHwLKh3.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcDashboardWidgetItem-BsHwLKh3.mjs","sources":["../../src/components/NcDashboardWidgetItem/NcDashboardWidgetItem.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis component is meant to be used inside a DashboardWidget component.\n\n</docs>\n\n<template>\n\t<div @mouseover=\"hovered = true\" @mouseleave=\"hovered = false\">\n\t\t<component :is=\"targetUrl ? 'a' : 'div'\"\n\t\t\t:href=\"targetUrl || undefined\"\n\t\t\t:target=\"targetUrl ? '_blank' : undefined\"\n\t\t\t:class=\"{ 'item-list__entry': true, 'item-list__entry--has-actions-menu': gotMenu }\"\n\t\t\t@click=\"onLinkClick\">\n\t\t\t<!-- @slot Slot for passing a user avatar. -->\n\t\t\t<slot name=\"avatar\" :avatar-url=\"avatarUrl\" :avatar-username=\"avatarUsername\">\n\t\t\t\t<NcAvatar class=\"item-avatar\"\n\t\t\t\t\t:size=\"44\"\n\t\t\t\t\t:url=\"avatarUrl\"\n\t\t\t\t\t:user=\"avatarUsername\"\n\t\t\t\t\t:is-no-user=\"avatarIsNoUser\"\n\t\t\t\t\t:show-user-status=\"!gotOverlayIcon\" />\n\t\t\t</slot>\n\t\t\t<img v-if=\"overlayIconUrl\"\n\t\t\t\tclass=\"item-icon\"\n\t\t\t\talt=\"\"\n\t\t\t\t:src=\"overlayIconUrl\">\n\t\t\t<div class=\"item__details\">\n\t\t\t\t<h3 :title=\"mainText\">\n\t\t\t\t\t{{ mainText }}\n\t\t\t\t</h3>\n\t\t\t\t<span v-if=\"subText !== ''\" class=\"message\" :title=\"subText\">\n\t\t\t\t\t{{ subText }}\n\t\t\t\t</span>\n\t\t\t</div>\n\t\t\t<NcActions v-if=\"gotMenu\" :force-menu=\"forceMenu\">\n\t\t\t\t<!-- @slot This slot can be used to provide actions for each dashboard widget item. -->\n\t\t\t\t<slot name=\"actions\">\n\t\t\t\t\t<NcActionButton v-for=\"(m, menuItemId) in itemMenu\"\n\t\t\t\t\t\t:key=\"menuItemId\"\n\t\t\t\t\t\t:icon=\"m.icon\"\n\t\t\t\t\t\t:close-after-click=\"true\"\n\t\t\t\t\t\t@click.prevent.stop=\"$emit(menuItemId, item)\">\n\t\t\t\t\t\t{{ m.text }}\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</slot>\n\t\t\t</NcActions>\n\t\t</component>\n\t</div>\n</template>\n\n<script>\nimport NcAvatar from '../NcAvatar/index.js'\nimport NcActions from '../NcActions/index.js'\nimport NcActionButton from '../NcActionButton/index.js'\n\nexport default {\n\tname: 'NcDashboardWidgetItem',\n\tcomponents: {\n\t\tNcAvatar,\n\t\tNcActions,\n\t\tNcActionButton,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The item id (optional)\n\t\t */\n\t\tid: {\n\t\t\ttype: [String, Number],\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * The item element is a link to this URL (optional)\n\t\t */\n\t\ttargetUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Where to get the avatar image. (optional) Used if avatarUsername is not defined.\n\t\t */\n\t\tavatarUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Name to provide to the Avatar. (optional) Used if avatarUrl is not defined.\n\t\t */\n\t\tavatarUsername: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Is the avatarUsername not a user's name? (optional, false by default)\n\t\t */\n\t\tavatarIsNoUser: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Small icon to display on the bottom-right corner of the avatar (optional)\n\t\t */\n\t\toverlayIconUrl: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Item main text (mandatory)\n\t\t */\n\t\tmainText: {\n\t\t\ttype: String,\n\t\t\trequired: true,\n\t\t},\n\t\t/**\n\t\t * Item subline text (optional)\n\t\t */\n\t\tsubText: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\t/**\n\t\t * An object containing context menu entries that will be displayed for each items (optional)\n\t\t */\n\t\titemMenu: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => { return {} },\n\t\t},\n\n\t\t/**\n\t\t * Specify whether the 3 dot menu is forced when only one action is present\n\t\t */\n\t\tforceMenu: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\thovered: false,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\titem() {\n\t\t\treturn {\n\t\t\t\tid: this.id,\n\t\t\t\ttargetUrl: this.targetUrl,\n\t\t\t\tavatarUrl: this.avatarUrl,\n\t\t\t\tavatarUsername: this.avatarUsername,\n\t\t\t\toverlayIconUrl: this.overlayIconUrl,\n\t\t\t\tmainText: this.mainText,\n\t\t\t\tsubText: this.subText,\n\t\t\t}\n\t\t},\n\t\tgotMenu() {\n\t\t\treturn Object.keys(this.itemMenu).length !== 0 || !!this.$slots.actions\n\t\t},\n\t\tgotOverlayIcon() {\n\t\t\treturn this.overlayIconUrl && this.overlayIconUrl !== ''\n\t\t},\n\t},\n\n\tmethods: {\n\t\tonLinkClick(event) {\n\t\t\tif (event.target.closest('.action-item')) {\n\t\t\t\tevent.preventDefault()\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n.item-list__entry {\n\tdisplay: flex;\n\talign-items: center;\n\tposition: relative;\n\tpadding: 8px;\n\n\t&:hover,\n\t&:focus {\n\t\tbackground-color: var(--color-background-hover);\n\t\tborder-radius: var(--border-radius-large);\n\t}\n\t.item-avatar {\n\t\tposition: relative;\n\t\tmargin-top: auto;\n\t\tmargin-bottom: auto;\n\t}\n\t.item__details {\n\t\tpadding-inline-start: 8px;\n\t\tmax-height: fit-content;\n\t\tflex-grow: 1;\n\t\toverflow: hidden;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\tmin-height: var(--default-clickable-area);\n\n\t\th3,\n\t\t.message {\n\t\t\twhite-space: nowrap;\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t}\n\t\t.message span {\n\t\t\twidth: 10px;\n\t\t\tdisplay: inline-block;\n\t\t\tmargin-bottom: -3px;\n\t\t}\n\t\th3 {\n\t\t\tfont-size: 100%;\n\t\t\tmargin: 0;\n\t\t}\n\t\t.message {\n\t\t\twidth: 100%;\n\t\t\tcolor: var(--color-text-maxcontrast);\n\t\t}\n\t}\n\n\t.item-icon {\n\t\tposition: relative;\n\t\twidth: 14px;\n\t\theight: 14px;\n\t\tmargin-top: 25px;\n\t\tmargin-inline: -10px -2px;\n\t}\n\n\tbutton.primary {\n\t\tpadding: 21px;\n\t\tmargin: 0;\n\t}\n}\n/*\n.content-popover {\n\theight: 0px;\n\twidth: 0px;\n\tmargin-inline: auto;\n}\n.popover-container {\n\twidth: 100%;\n\theight: 0px;\n}\n*/\n</style>\n"],"names":["_createElementBlock","_createBlock","_resolveDynamicComponent","_normalizeClass","_withCtx","_renderSlot","_createVNode","_createCommentVNode","_createElementVNode","_toDisplayString","_openBlock","_Fragment","_renderList","_withModifiers","_createTextVNode"],"mappings":";;;;;AA8DA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EACN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA,IAIN,IAAI;AAAA,MACH,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,gBAAgB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,gBAAgB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,gBAAgB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,UAAU;AAAA,MACT,MAAM;AAAA,MACN,UAAU;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAID,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA;AAAA;AAAA;AAAA,IAID,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS,MAAM;AAAE,eAAO;MAAI;AAAA,IAC5B;AAAA;AAAA;AAAA;AAAA,IAKD,WAAW;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACT;AAAA,EACD;AAAA,EAED,OAAO;AACN,WAAO;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACA;AAAA,EAED,UAAU;AAAA,IACT,OAAO;AACN,aAAO;AAAA,QACN,IAAI,KAAK;AAAA,QACT,WAAW,KAAK;AAAA,QAChB,WAAW,KAAK;AAAA,QAChB,gBAAgB,KAAK;AAAA,QACrB,gBAAgB,KAAK;AAAA,QACrB,UAAU,KAAK;AAAA,QACf,SAAS,KAAK;AAAA,MACf;AAAA,IACA;AAAA,IACD,UAAU;AACT,aAAO,OAAO,KAAK,KAAK,QAAQ,EAAE,WAAW,KAAK,CAAC,CAAC,KAAK,OAAO;AAAA,IAChE;AAAA,IACD,iBAAiB;AAChB,aAAO,KAAK,kBAAkB,KAAK,mBAAmB;AAAA,IACtD;AAAA,EACD;AAAA,EAED,SAAS;AAAA,IACR,YAAY,OAAO;AAClB,UAAI,MAAM,OAAO,QAAQ,cAAc,GAAG;AACzC,cAAM,eAAc;AAAA,MACrB;AAAA,IACA;AAAA,EACD;AACF;AAjLA,MAAA,aAAA,CAAA,KAAA;AAiCQ,MAAA,aAAA,EAAA,OAAM,gBAAe;AAjC7B,MAAA,aAAA,CAAA,OAAA;AAAA,MAAA,aAAA,CAAA,OAAA;;;;;sBAcCA,mBAwCM,OAAA;AAAA,IAxCA,mDAAW,MAAO,UAAA;AAAA,IAAU,oDAAY,MAAO,UAAA;AAAA;kBACpDC,YAfFC,wBAekB,OAAS,YAAA,MAAA,KAAA,GAAA;AAAA,MACvB,MAAM,OAAS,aAAI;AAAA,MACnB,QAAQ,OAAS,YAAA,WAAc;AAAA,MAC/B,OAlBJC,iFAkB6E,SAAO,SAAA;AAAA,MAChF,SAAO,SAAW;AAAA;MAnBtB,SAAAC,QAqBG,MAOO;AAAA,QAPPC,WAOO,KAAA,QAAA,UAAA;AAAA,UAPc,WAAY,OAAS;AAAA,UAAG,gBAAiB,OAAc;AAAA,WAA5E,MAOO;AAAA,UANNC,YAKuC,qBAAA;AAAA,YAL7B,OAAM;AAAA,YACd,MAAM;AAAA,YACN,KAAK,OAAS;AAAA,YACd,MAAM,OAAc;AAAA,YACpB,cAAY,OAAc;AAAA,YAC1B,qBAAmB,SAAc;AAAA;;QAEzB,OAAc,+BAAzBN,mBAGuB,OAAA;AAAA,UAhC1B,KAAA;AAAA,UA8BI,OAAM;AAAA,UACN,KAAI;AAAA,UACH,KAAK,OAAc;AAAA,QAhCxB,GAAA,MAAA,GAAA,UAAA,KAAAO,mBAAA,IAAA,IAAA;AAAA,QAiCGC,mBAOM,OAPN,YAOM;AAAA,UANLA,mBAEK,QAFA,OAAO,OAAQ,SAAA,GAAAC,gBAChB,eAAQ,GAnChB,GAAA,UAAA;AAAA,UAqCgB,OAAO,YAAA,mBAAnBT,mBAEO,QAAA;AAAA,YAvCX,KAAA;AAAA,YAqCgC,OAAM;AAAA,YAAW,OAAO,OAAO;AAAA,UACvD,GAAAS,gBAAA,OAAA,OAAO,GAtCf,GAAA,UAAA,KAAAF,mBAAA,IAAA,IAAA;AAAA;QAyCoB,SAAO,wBAAxBN,YAWY,sBAAA;AAAA,UApDf,KAAA;AAAA,UAyC8B,cAAY,OAAS;AAAA;UAzCnD,SAAAG,QA2CI,MAQO;AAAA,YARPC,WAQO,4BARP,MAQO;AAAA,eAPNK,UAAA,IAAA,GAAAV,mBAMiBW,gBAlDtBC,WA4C+C,OAAA,UA5C/C,CA4C6B,GAAG,eAAU;oCAArCX,YAMiB,2BAAA;AAAA,kBALf,KAAK;AAAA,kBACL,MAAM,EAAE;AAAA,kBACR,qBAAmB;AAAA,kBACnB,SAhDPY,cAgD2B,YAAA,KAAA,MAAM,YAAY,SAAI,IAAA,GAAA,CAAA,WAAA,MAAA,CAAA;AAAA;kBAhDjD,SAAAT,QAiDM,MAAY;AAAA,oBAjDlBU,gBAiDSL,gBAAA,EAAE,IAAI,GAAA,CAAA;AAAA;kBAjDf,GAAA;AAAA;;;;UAAA,GAAA;AAAA,iCAAAF,mBAAA,IAAA,IAAA;AAAA;MAAA,GAAA;AAAA;;;;"}