@retailcrm/embed-ui-v1-components 0.4.1-alpha.1 → 0.4.1-alpha.11

package/dist/host.cjs

@@ -4,6 +4,14 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const vue = require("vue");
+const isURL = (href) => {
+  try {
+    new URL(href);
+    return true;
+  } catch {
+    return false;
+  }
+};
 const SHAPE_FLAG_ARRAY_CHILDREN = 16;
 const SHAPE_FLAG_TEXT = 8;
 const inlines = ["b", "i", "span", "strong"];
@@ -39,20 +47,20 @@ var APPEARANCE$2 = /* @__PURE__ */ ((APPEARANCE2) => {
   APPEARANCE2["TERTIARY"] = "tertiary";
   return APPEARANCE2;
 })(APPEARANCE$2 || {});
-var SIZE$3 = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$4 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["LG"] = "lg";
   SIZE2["MD"] = "md";
   SIZE2["SM"] = "sm";
   SIZE2["XS"] = "xs";
   return SIZE2;
-})(SIZE$3 || {});
+})(SIZE$4 || {});
 var VARIANT = /* @__PURE__ */ ((VARIANT2) => {
   VARIANT2["DEFAULT"] = "default";
   VARIANT2["SUCCESS"] = "success";
   VARIANT2["DANGER"] = "danger";
   return VARIANT2;
 })(VARIANT || {});
-const _sfc_main$9 = vue.defineComponent({
+const _sfc_main$c = vue.defineComponent({
   props: {
     /** Устанавливает тип кнопки */
     type: {
@@ -62,7 +70,7 @@ const _sfc_main$9 = vue.defineComponent({
     /** Устанавливает атрибут href якоря */
     href: {
       type: null,
-      validator: (href) => typeof href === "string" || href === null,
+      validator: (href) => typeof href === "string" && isURL(href) || href === null,
       default: null
     },
     /** Регулирует внешний вид кнопки: primary, secondary, tertiary or outlined */
@@ -78,7 +86,7 @@ const _sfc_main$9 = vue.defineComponent({
     /** Размер */
     size: {
       type: String,
-      default: SIZE$3.SM
+      default: SIZE$4.SM
     },
     /** Если кнопка активна */
     active: {
@@ -153,7 +161,7 @@ var ALIGN = /* @__PURE__ */ ((ALIGN2) => {
   ALIGN2["RIGHT"] = "right";
   return ALIGN2;
 })(ALIGN || {});
-const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
   __name: "UiError",
   props: {
     /** Тест, разметка ошибки */
@@ -213,7 +221,7 @@ var APPEARANCE$1 = /* @__PURE__ */ ((APPEARANCE2) => {
   APPEARANCE2["TITLE"] = "title";
   return APPEARANCE2;
 })(APPEARANCE$1 || {});
-var SIZE$2 = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$3 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["ARTICLE"] = "article";
   SIZE2["BODY"] = "body";
   SIZE2["PARAGRAPH"] = "paragraph";
@@ -222,7 +230,7 @@ var SIZE$2 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["TITLE01"] = "title-01";
   SIZE2["TITLE02"] = "title-02";
   return SIZE2;
-})(SIZE$2 || {});
+})(SIZE$3 || {});
 const _hoisted_1$5 = ["href", "target"];
 const _hoisted_2$2 = {
   key: 0,
@@ -232,12 +240,13 @@ const _hoisted_3$2 = {
   key: 2,
   class: "ui-v1-link__icon"
 };
-const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
   __name: "UiLink",
   props: {
     /** Атрибут ссылки */
     href: {
       type: String,
+      validator: (href) => typeof href === "string" && isURL(href),
       default: "javascript:void(0);"
     },
     /**
@@ -257,8 +266,8 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
     /** Размер текста */
     size: {
       type: String,
-      validator: (size) => Object.values(SIZE$2).includes(size),
-      default: SIZE$2.BODY
+      validator: (size) => Object.values(SIZE$3).includes(size),
+      default: SIZE$3.BODY
     },
     /** Инвертированный цвет ссылок для тёмного фона */
     light: {
@@ -309,7 +318,7 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
   __name: "UiTransition",
   props: {
     /** Наименование анимации перехода */
@@ -337,7 +346,7 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
   __name: "UiLoader",
   props: {
     /** Диаметр (размер) окружности индикатора */
@@ -369,7 +378,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(__props.transition ? _sfc_main$6 : "div"), vue.normalizeProps(vue.guardReactiveProps(__props.transition ? {
+      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(__props.transition ? _sfc_main$9 : "div"), vue.normalizeProps(vue.guardReactiveProps(__props.transition ? {
         appear: true,
         class: "ui-v1-loader-wrapper",
         name: __props.transition
@@ -1521,7 +1530,7 @@ var PerfectScrollbar$1 = {
     );
   }
 };
-const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
   __name: "UiScrollBox",
   props: {
     /** Наименование тэга-обёртки для нативного скролла */
@@ -1728,12 +1737,12 @@ var SCROLLING$1 = /* @__PURE__ */ ((SCROLLING2) => {
   SCROLLING2["NONE"] = "none";
   return SCROLLING2;
 })(SCROLLING$1 || {});
-var SIZE$1 = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$2 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["LG"] = "lg";
   SIZE2["SM"] = "sm";
   return SIZE2;
-})(SIZE$1 || {});
-const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+})(SIZE$2 || {});
+const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
   __name: "UiModalSidebar",
   props: {
     /** Атрибут id корневого элемента. Должен быть уникальным на странице */
@@ -1776,7 +1785,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     /** Размер панели */
     size: {
       type: String,
-      default: SIZE$1.SM
+      default: SIZE$2.SM
     }
   },
   emits: [
@@ -1963,7 +1972,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
         }))
       ]);
     };
-    const renderBody = () => props.scrolling === SCROLLING$1.NONE ? vue.h("div", { class: "ui-v1-modal-sidebar__body-fixed" }, renderSlot("default")) : vue.h(_sfc_main$4, {
+    const renderBody = () => props.scrolling === SCROLLING$1.NONE ? vue.h("div", { class: "ui-v1-modal-sidebar__body-fixed" }, renderSlot("default")) : vue.h(_sfc_main$7, {
       class: "ui-v1-modal-sidebar__body",
       native: props.scrolling === SCROLLING$1.NATIVE,
       showOnMac: true,
@@ -1976,7 +1985,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
       const direction = props.direction;
       const size = props.size;
       const setVisibility = (visibility2) => () => visibilityOfSidebar.value = visibility2;
-      return vue.h(_sfc_main$6, {
+      return vue.h(_sfc_main$9, {
         name: `slide-${direction}`,
         onBeforeEnter: setVisibility("showing"),
         onAfterEnter: setVisibility("shown"),
@@ -1989,8 +1998,8 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
             class: {
               "ui-v1-modal-sidebar": true,
               "ui-v1-modal-sidebar_left": direction === DIRECTION.LEFT,
-              "ui-v1-modal-sidebar_size_sm": size === SIZE$1.SM,
-              "ui-v1-modal-sidebar_size_lg": size === SIZE$1.LG
+              "ui-v1-modal-sidebar_size_sm": size === SIZE$2.SM,
+              "ui-v1-modal-sidebar_size_lg": size === SIZE$2.LG
             }
           }, [
             renderHeader(),
@@ -2004,7 +2013,7 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
       const setVisibility = (visibility2) => () => visibilityOfOverlay.value = visibility2;
       return !state.attached ? void 0 : vue.h(vue.Teleport, {
         to: (globals == null ? void 0 : globals.container) ?? document.body
-      }, vue.h(_sfc_main$6, {
+      }, vue.h(_sfc_main$9, {
         name: "fade-2",
         onBeforeEnter: setVisibility("showing"),
         onAfterEnter: setVisibility("shown"),
@@ -2041,6 +2050,15 @@ const expect = (value) => ({
     return Object.values(variants).includes(value);
   }
 });
+const without = (obj, exclude) => {
+  const newObj = {};
+  Object.entries(obj).forEach(([key, value]) => {
+    if (!exclude.includes(key)) {
+      newObj[key] = value;
+    }
+  });
+  return newObj;
+};
 var APPEARANCE = /* @__PURE__ */ ((APPEARANCE2) => {
   APPEARANCE2["ALERT"] = "alert";
   APPEARANCE2["DIALOG"] = "dialog";
@@ -2053,7 +2071,7 @@ var SCROLLING = /* @__PURE__ */ ((SCROLLING2) => {
   SCROLLING2["NATIVE"] = "native";
   return SCROLLING2;
 })(SCROLLING || {});
-const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
   __name: "UiModalWindowSurface",
   props: {
     /** Атрибут id корневого элемента модального окна. Должен быть уникальным на странице */
@@ -2267,7 +2285,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
     const slots = vue.useSlots();
     const renderBody = () => {
       const appearance = props.appearance;
-      return vue.h(_sfc_main$6, {
+      return vue.h(_sfc_main$9, {
         name: "zoom",
         onBeforeEnter: () => visibilityOfBody.value = "showing",
         onAfterEnter: () => visibilityOfBody.value = "shown",
@@ -2292,7 +2310,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
     };
     const EmbedModalWindowSurface = () => !state.attached ? void 0 : vue.h(vue.Teleport, {
       to: (globals == null ? void 0 : globals.container) ?? document.body
-    }, vue.h(_sfc_main$6, {
+    }, vue.h(_sfc_main$9, {
       name: "fade-2",
       onBeforeEnter: () => visibilityOfOverlay.value = "showing",
       onAfterEnter: () => visibilityOfOverlay.value = "shown",
@@ -2309,7 +2327,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
           "ui-v1-modal_overlapped": state.overlapped
         }],
         onClick: onOverlayClick
-      }, vue.h(_sfc_main$4, {
+      }, vue.h(_sfc_main$7, {
         class: {
           "ui-v1-modal-window-container": true,
           "ui-v1-modal-window-container_fullscreen": props.fullscreen,
@@ -2366,7 +2384,7 @@ const _hoisted_5 = {
   key: 0,
   class: "ui-v1-modal-window__footer-text"
 };
-const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "UiModalWindow",
   props: {
     /** Атрибут id корневого элемента модального окна. Должен быть уникальным на странице */
@@ -2480,7 +2498,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
     });
     vue.watch(() => props.opened, toggle);
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(_sfc_main$2, vue.mergeProps({
+      return vue.openBlock(), vue.createBlock(_sfc_main$5, vue.mergeProps({
         id: __props.id,
         opened: state.opened,
         closable: __props.closable,
@@ -2537,7 +2555,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
               })
             ])) : vue.createCommentVNode("", true)
           ], 2),
-          __props.responsive ? (vue.openBlock(), vue.createBlock(_sfc_main$4, {
+          __props.responsive ? (vue.openBlock(), vue.createBlock(_sfc_main$7, {
             key: 0,
             class: "ui-v1-modal-window__content",
             "show-on-mac": "",
@@ -2584,13 +2602,13 @@ function render(_ctx, _cache) {
   ]));
 }
 const IconPinned = { render };
-var SIZE = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$1 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["LG"] = "lg";
   SIZE2["MD"] = "md";
   SIZE2["SM"] = "sm";
   SIZE2["XS"] = "xs";
   return SIZE2;
-})(SIZE || {});
+})(SIZE$1 || {});
 function deltaTransition(el) {
   const delta = el.scrollWidth - el.clientWidth;
   const animationDuration = `${(el.scrollWidth / el.clientWidth * 2).toFixed(2)}s`;
@@ -2750,13 +2768,13 @@ const _hoisted_1 = {
 };
 const _hoisted_2 = { class: "ui-v1-tag__content-inner" };
 const _hoisted_3 = ["aria-label"];
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
   __name: "UiTag",
   props: {
     /** Рамер */
     size: {
       type: String,
-      default: SIZE.LG
+      default: SIZE$1.LG
     },
     /** Слева выводим иконку закреплённого тега */
     pinned: {
@@ -2843,14 +2861,204 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
+var SIZE = /* @__PURE__ */ ((SIZE2) => {
+  SIZE2["SM"] = "sm";
+  SIZE2["MD"] = "md";
+  return SIZE2;
+})(SIZE || {});
+const ToolbarInjectKeys = {
+  size: Symbol("UiToolbarSize")
+};
+const useToolbarSize = () => vue.inject(ToolbarInjectKeys.size, vue.computed(
+  () => "sm"
+  /* SM */
+));
+const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "UiToolbar",
+  props: {
+    size: {
+      type: String,
+      default: SIZE.SM
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    vue.provide(ToolbarInjectKeys.size, vue.computed(() => props.size));
+    return (_ctx, _cache) => {
+      return vue.renderSlot(_ctx.$slots, "default");
+    };
+  }
+});
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "UiToolbarButton",
+  props: {
+    /** Устанавливает атрибут href якоря */
+    href: {
+      type: null,
+      validator: (href) => typeof href === "string" && isURL(href) || href === null,
+      default: null
+    },
+    /** Регулирует цветовую схему кнопки: default, success or danger */
+    variant: {
+      type: String,
+      default: VARIANT.DEFAULT
+    },
+    /** Если кнопка активна */
+    active: {
+      type: Boolean,
+      default: false
+    },
+    /** Если кнопка отключена */
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /** Если кнопка заблокирована */
+    locked: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props, { expose: __expose }) {
+    const root = vue.ref(null);
+    __expose({
+      click: () => {
+        var _a;
+        return (_a = root.value) == null ? void 0 : _a.click();
+      },
+      focus: () => {
+        var _a;
+        return (_a = root.value) == null ? void 0 : _a.focus();
+      },
+      blur: () => {
+        var _a;
+        return (_a = root.value) == null ? void 0 : _a.blur();
+      }
+    });
+    const toolbarSize = useToolbarSize();
+    const size = vue.computed(() => {
+      if (toolbarSize.value === SIZE.SM) {
+        return SIZE$4.XS;
+      }
+      return SIZE$4.SM;
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(_sfc_main$c, vue.mergeProps({
+        ref_key: "root",
+        ref: root,
+        href: __props.href,
+        variant: __props.variant,
+        size: size.value,
+        active: __props.active,
+        disabled: __props.disabled,
+        locked: __props.locked,
+        appearance: "secondary"
+      }, vue.unref(without)(_ctx.$attrs, [
+        "appearance",
+        "class",
+        "style",
+        "type"
+      ])), {
+        default: vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["href", "variant", "size", "active", "disabled", "locked"]);
+    };
+  }
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "UiToolbarLink",
+  props: {
+    /** Атрибут ссылки */
+    href: {
+      type: String,
+      validator: (href) => typeof href === "string" && isURL(href),
+      default: "javascript:void(0);"
+    },
+    /**
+     * Определяет, нужно ли открывать ссылку в новой вкладке.
+     * Также добавляется иконка внешней ссылки (если компонент UiIcon установлен)
+     */
+    external: {
+      type: Boolean,
+      default: false
+    },
+    /** Тип ссылок */
+    appearance: {
+      type: String,
+      validator: (appearance) => Object.values(APPEARANCE$1).includes(appearance),
+      default: APPEARANCE$1.DEFAULT
+    },
+    /** Инвертированный цвет ссылок для тёмного фона */
+    light: {
+      type: Boolean,
+      default: false
+    },
+    /** Жирное начертание */
+    accent: {
+      type: Boolean,
+      default: false
+    },
+    /** Подчеркивание dotted вместо стандартного поведения */
+    dotted: {
+      type: Boolean,
+      default: false
+    },
+    /** Определяет, будет ли текст ошибок обрезаться через многоточие или переноситься на следующую строку */
+    ellipsis: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(_sfc_main$a, vue.mergeProps({
+        href: __props.href,
+        external: __props.external,
+        appearance: __props.appearance,
+        light: __props.light,
+        accent: __props.accent,
+        dotted: __props.dotted,
+        ellipsis: __props.ellipsis,
+        size: "small"
+      }, vue.unref(without)(_ctx.$attrs, ["class", "style"])), vue.createSlots({
+        default: vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 2
+      }, [
+        _ctx.$slots.icon || __props.external ? {
+          name: "icon",
+          fn: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "icon")
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1040, ["href", "external", "appearance", "light", "accent", "dotted", "ellipsis"]);
+    };
+  }
+});
 exports.ModalPlugin = plugin;
-exports.UiButton = _sfc_main$9;
-exports.UiError = _sfc_main$8;
-exports.UiLink = _sfc_main$7;
-exports.UiLoader = _sfc_main$5;
-exports.UiModalSidebar = _sfc_main$3;
-exports.UiModalWindow = _sfc_main$1;
-exports.UiModalWindowSurface = _sfc_main$2;
-exports.UiScrollBox = _sfc_main$4;
-exports.UiTag = _sfc_main;
-exports.UiTransition = _sfc_main$6;
+exports.UiButton = _sfc_main$c;
+exports.UiError = _sfc_main$b;
+exports.UiLink = _sfc_main$a;
+exports.UiLoader = _sfc_main$8;
+exports.UiModalSidebar = _sfc_main$6;
+exports.UiModalWindow = _sfc_main$4;
+exports.UiModalWindowSurface = _sfc_main$5;
+exports.UiScrollBox = _sfc_main$7;
+exports.UiTag = _sfc_main$3;
+exports.UiToolbar = _sfc_main$2;
+exports.UiToolbarButton = _sfc_main$1;
+exports.UiToolbarLink = _sfc_main;
+exports.UiTransition = _sfc_main$9;

package/dist/host.d.ts

@@ -146,6 +146,20 @@ fullscreen: boolean;
 responsive: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 
+declare const __VLS_component_2: DefineComponent_2<ExtractPropTypes<    {
+size: {
+type: PropType<SIZE_5 | `${SIZE_5}`>;
+default: SIZE_5;
+};
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+size: {
+type: PropType<SIZE_5 | `${SIZE_5}`>;
+default: SIZE_5;
+};
+}>> & Readonly<{}>, {
+size: "md" | "sm" | SIZE_5;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
 declare function __VLS_template(): {
     slots: {
         icon?(_: {
@@ -171,14 +185,30 @@ declare function __VLS_template(): {
     attrs: Partial<{}>;
 };
 
+declare function __VLS_template_2(): {
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    attrs: Partial<{}>;
+};
+
 declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 
+declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
+
 declare type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
 
+declare type __VLS_WithTemplateSlots_2<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
 declare enum ALIGN {
     LEFT = "left",
     RIGHT = "right"
@@ -259,6 +289,11 @@ declare enum SIZE_4 {
     XS = "xs"
 }
 
+declare enum SIZE_5 {
+    SM = "sm",
+    MD = "md"
+}
+
 export declare const UiButton: DefineComponent<
 UiButtonProperties,
 UiButtonMethods
@@ -377,6 +412,19 @@ declare type UiTagProperties = {
     ticker?: boolean;
 };
 
+export declare const UiToolbar: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
+
+export declare const UiToolbarButton: DefineComponent<
+UiToolbarButtonProperties,
+UiButtonMethods
+>;
+
+declare type UiToolbarButtonProperties = Omit<UiButtonProperties, 'appearance' | 'size' | 'type'>;
+
+export declare const UiToolbarLink: DefineComponent<UiToolbarLinkProperties>;
+
+declare type UiToolbarLinkProperties = Omit<UiLinkProperties, 'size'>;
+
 export declare const UiTransition: DefineComponent<UiTransitionProps>;
 
 declare type UiTransitionProps = {

package/dist/host.js

@@ -1,7 +1,15 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { Text, Comment, defineComponent, ref, h, openBlock, createElementBlock, normalizeClass, unref, renderSlot, createTextVNode, toDisplayString, createElementVNode, mergeProps, createVNode, createCommentVNode, createBlock, Transition, withCtx, resolveDynamicComponent, normalizeProps, guardReactiveProps, normalizeStyle, reactive, inject, computed, watch, onMounted, onActivated, onDeactivated, onBeforeUnmount, useAttrs, useSlots, Teleport, withDirectives, vShow, toHandlers, withModifiers } from "vue";
+import { Text, Comment, defineComponent, ref, h, openBlock, createElementBlock, normalizeClass, unref, renderSlot, createTextVNode, toDisplayString, createElementVNode, mergeProps, createVNode, createCommentVNode, createBlock, Transition, withCtx, resolveDynamicComponent, normalizeProps, guardReactiveProps, normalizeStyle, reactive, inject, computed, watch, onMounted, onActivated, onDeactivated, onBeforeUnmount, useAttrs, useSlots, Teleport, withDirectives, vShow, toHandlers, withModifiers, provide, createSlots } from "vue";
+const isURL = (href) => {
+  try {
+    new URL(href);
+    return true;
+  } catch {
+    return false;
+  }
+};
 const SHAPE_FLAG_ARRAY_CHILDREN = 16;
 const SHAPE_FLAG_TEXT = 8;
 const inlines = ["b", "i", "span", "strong"];
@@ -37,20 +45,20 @@ var APPEARANCE$2 = /* @__PURE__ */ ((APPEARANCE2) => {
   APPEARANCE2["TERTIARY"] = "tertiary";
   return APPEARANCE2;
 })(APPEARANCE$2 || {});
-var SIZE$3 = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$4 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["LG"] = "lg";
   SIZE2["MD"] = "md";
   SIZE2["SM"] = "sm";
   SIZE2["XS"] = "xs";
   return SIZE2;
-})(SIZE$3 || {});
+})(SIZE$4 || {});
 var VARIANT = /* @__PURE__ */ ((VARIANT2) => {
   VARIANT2["DEFAULT"] = "default";
   VARIANT2["SUCCESS"] = "success";
   VARIANT2["DANGER"] = "danger";
   return VARIANT2;
 })(VARIANT || {});
-const _sfc_main$9 = defineComponent({
+const _sfc_main$c = defineComponent({
   props: {
     /** Устанавливает тип кнопки */
     type: {
@@ -60,7 +68,7 @@ const _sfc_main$9 = defineComponent({
     /** Устанавливает атрибут href якоря */
     href: {
       type: null,
-      validator: (href) => typeof href === "string" || href === null,
+      validator: (href) => typeof href === "string" && isURL(href) || href === null,
       default: null
     },
     /** Регулирует внешний вид кнопки: primary, secondary, tertiary or outlined */
@@ -76,7 +84,7 @@ const _sfc_main$9 = defineComponent({
     /** Размер */
     size: {
       type: String,
-      default: SIZE$3.SM
+      default: SIZE$4.SM
     },
     /** Если кнопка активна */
     active: {
@@ -151,7 +159,7 @@ var ALIGN = /* @__PURE__ */ ((ALIGN2) => {
   ALIGN2["RIGHT"] = "right";
   return ALIGN2;
 })(ALIGN || {});
-const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+const _sfc_main$b = /* @__PURE__ */ defineComponent({
   __name: "UiError",
   props: {
     /** Тест, разметка ошибки */
@@ -211,7 +219,7 @@ var APPEARANCE$1 = /* @__PURE__ */ ((APPEARANCE2) => {
   APPEARANCE2["TITLE"] = "title";
   return APPEARANCE2;
 })(APPEARANCE$1 || {});
-var SIZE$2 = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$3 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["ARTICLE"] = "article";
   SIZE2["BODY"] = "body";
   SIZE2["PARAGRAPH"] = "paragraph";
@@ -220,7 +228,7 @@ var SIZE$2 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["TITLE01"] = "title-01";
   SIZE2["TITLE02"] = "title-02";
   return SIZE2;
-})(SIZE$2 || {});
+})(SIZE$3 || {});
 const _hoisted_1$5 = ["href", "target"];
 const _hoisted_2$2 = {
   key: 0,
@@ -230,12 +238,13 @@ const _hoisted_3$2 = {
   key: 2,
   class: "ui-v1-link__icon"
 };
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
   __name: "UiLink",
   props: {
     /** Атрибут ссылки */
     href: {
       type: String,
+      validator: (href) => typeof href === "string" && isURL(href),
       default: "javascript:void(0);"
     },
     /**
@@ -255,8 +264,8 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     /** Размер текста */
     size: {
       type: String,
-      validator: (size) => Object.values(SIZE$2).includes(size),
-      default: SIZE$2.BODY
+      validator: (size) => Object.values(SIZE$3).includes(size),
+      default: SIZE$3.BODY
     },
     /** Инвертированный цвет ссылок для тёмного фона */
     light: {
@@ -307,7 +316,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
   __name: "UiTransition",
   props: {
     /** Наименование анимации перехода */
@@ -335,7 +344,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   __name: "UiLoader",
   props: {
     /** Диаметр (размер) окружности индикатора */
@@ -367,7 +376,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(resolveDynamicComponent(__props.transition ? _sfc_main$6 : "div"), normalizeProps(guardReactiveProps(__props.transition ? {
+      return openBlock(), createBlock(resolveDynamicComponent(__props.transition ? _sfc_main$9 : "div"), normalizeProps(guardReactiveProps(__props.transition ? {
         appear: true,
         class: "ui-v1-loader-wrapper",
         name: __props.transition
@@ -1519,7 +1528,7 @@ var PerfectScrollbar$1 = {
     );
   }
 };
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "UiScrollBox",
   props: {
     /** Наименование тэга-обёртки для нативного скролла */
@@ -1726,12 +1735,12 @@ var SCROLLING$1 = /* @__PURE__ */ ((SCROLLING2) => {
   SCROLLING2["NONE"] = "none";
   return SCROLLING2;
 })(SCROLLING$1 || {});
-var SIZE$1 = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$2 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["LG"] = "lg";
   SIZE2["SM"] = "sm";
   return SIZE2;
-})(SIZE$1 || {});
-const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+})(SIZE$2 || {});
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   __name: "UiModalSidebar",
   props: {
     /** Атрибут id корневого элемента. Должен быть уникальным на странице */
@@ -1774,7 +1783,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     /** Размер панели */
     size: {
       type: String,
-      default: SIZE$1.SM
+      default: SIZE$2.SM
     }
   },
   emits: [
@@ -1961,7 +1970,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
         }))
       ]);
     };
-    const renderBody = () => props.scrolling === SCROLLING$1.NONE ? h("div", { class: "ui-v1-modal-sidebar__body-fixed" }, renderSlot2("default")) : h(_sfc_main$4, {
+    const renderBody = () => props.scrolling === SCROLLING$1.NONE ? h("div", { class: "ui-v1-modal-sidebar__body-fixed" }, renderSlot2("default")) : h(_sfc_main$7, {
       class: "ui-v1-modal-sidebar__body",
       native: props.scrolling === SCROLLING$1.NATIVE,
       showOnMac: true,
@@ -1974,7 +1983,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       const direction = props.direction;
       const size = props.size;
       const setVisibility = (visibility2) => () => visibilityOfSidebar.value = visibility2;
-      return h(_sfc_main$6, {
+      return h(_sfc_main$9, {
         name: `slide-${direction}`,
         onBeforeEnter: setVisibility("showing"),
         onAfterEnter: setVisibility("shown"),
@@ -1987,8 +1996,8 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
             class: {
               "ui-v1-modal-sidebar": true,
               "ui-v1-modal-sidebar_left": direction === DIRECTION.LEFT,
-              "ui-v1-modal-sidebar_size_sm": size === SIZE$1.SM,
-              "ui-v1-modal-sidebar_size_lg": size === SIZE$1.LG
+              "ui-v1-modal-sidebar_size_sm": size === SIZE$2.SM,
+              "ui-v1-modal-sidebar_size_lg": size === SIZE$2.LG
             }
           }, [
             renderHeader(),
@@ -2002,7 +2011,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       const setVisibility = (visibility2) => () => visibilityOfOverlay.value = visibility2;
       return !state.attached ? void 0 : h(Teleport, {
         to: (globals == null ? void 0 : globals.container) ?? document.body
-      }, h(_sfc_main$6, {
+      }, h(_sfc_main$9, {
         name: "fade-2",
         onBeforeEnter: setVisibility("showing"),
         onAfterEnter: setVisibility("shown"),
@@ -2039,6 +2048,15 @@ const expect = (value) => ({
     return Object.values(variants).includes(value);
   }
 });
+const without = (obj, exclude) => {
+  const newObj = {};
+  Object.entries(obj).forEach(([key, value]) => {
+    if (!exclude.includes(key)) {
+      newObj[key] = value;
+    }
+  });
+  return newObj;
+};
 var APPEARANCE = /* @__PURE__ */ ((APPEARANCE2) => {
   APPEARANCE2["ALERT"] = "alert";
   APPEARANCE2["DIALOG"] = "dialog";
@@ -2051,7 +2069,7 @@ var SCROLLING = /* @__PURE__ */ ((SCROLLING2) => {
   SCROLLING2["NATIVE"] = "native";
   return SCROLLING2;
 })(SCROLLING || {});
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   __name: "UiModalWindowSurface",
   props: {
     /** Атрибут id корневого элемента модального окна. Должен быть уникальным на странице */
@@ -2265,7 +2283,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     const slots = useSlots();
     const renderBody = () => {
       const appearance = props.appearance;
-      return h(_sfc_main$6, {
+      return h(_sfc_main$9, {
         name: "zoom",
         onBeforeEnter: () => visibilityOfBody.value = "showing",
         onAfterEnter: () => visibilityOfBody.value = "shown",
@@ -2290,7 +2308,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
     const EmbedModalWindowSurface = () => !state.attached ? void 0 : h(Teleport, {
       to: (globals == null ? void 0 : globals.container) ?? document.body
-    }, h(_sfc_main$6, {
+    }, h(_sfc_main$9, {
       name: "fade-2",
       onBeforeEnter: () => visibilityOfOverlay.value = "showing",
       onAfterEnter: () => visibilityOfOverlay.value = "shown",
@@ -2307,7 +2325,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           "ui-v1-modal_overlapped": state.overlapped
         }],
         onClick: onOverlayClick
-      }, h(_sfc_main$4, {
+      }, h(_sfc_main$7, {
         class: {
           "ui-v1-modal-window-container": true,
           "ui-v1-modal-window-container_fullscreen": props.fullscreen,
@@ -2364,7 +2382,7 @@ const _hoisted_5 = {
   key: 0,
   class: "ui-v1-modal-window__footer-text"
 };
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   __name: "UiModalWindow",
   props: {
     /** Атрибут id корневого элемента модального окна. Должен быть уникальным на странице */
@@ -2478,7 +2496,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     });
     watch(() => props.opened, toggle);
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$2, mergeProps({
+      return openBlock(), createBlock(_sfc_main$5, mergeProps({
         id: __props.id,
         opened: state.opened,
         closable: __props.closable,
@@ -2535,7 +2553,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
               })
             ])) : createCommentVNode("", true)
           ], 2),
-          __props.responsive ? (openBlock(), createBlock(_sfc_main$4, {
+          __props.responsive ? (openBlock(), createBlock(_sfc_main$7, {
             key: 0,
             class: "ui-v1-modal-window__content",
             "show-on-mac": "",
@@ -2582,13 +2600,13 @@ function render(_ctx, _cache) {
   ]));
 }
 const IconPinned = { render };
-var SIZE = /* @__PURE__ */ ((SIZE2) => {
+var SIZE$1 = /* @__PURE__ */ ((SIZE2) => {
   SIZE2["LG"] = "lg";
   SIZE2["MD"] = "md";
   SIZE2["SM"] = "sm";
   SIZE2["XS"] = "xs";
   return SIZE2;
-})(SIZE || {});
+})(SIZE$1 || {});
 function deltaTransition(el) {
   const delta = el.scrollWidth - el.clientWidth;
   const animationDuration = `${(el.scrollWidth / el.clientWidth * 2).toFixed(2)}s`;
@@ -2748,13 +2766,13 @@ const _hoisted_1 = {
 };
 const _hoisted_2 = { class: "ui-v1-tag__content-inner" };
 const _hoisted_3 = ["aria-label"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "UiTag",
   props: {
     /** Рамер */
     size: {
       type: String,
-      default: SIZE.LG
+      default: SIZE$1.LG
     },
     /** Слева выводим иконку закреплённого тега */
     pinned: {
@@ -2841,16 +2859,206 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
+var SIZE = /* @__PURE__ */ ((SIZE2) => {
+  SIZE2["SM"] = "sm";
+  SIZE2["MD"] = "md";
+  return SIZE2;
+})(SIZE || {});
+const ToolbarInjectKeys = {
+  size: Symbol("UiToolbarSize")
+};
+const useToolbarSize = () => inject(ToolbarInjectKeys.size, computed(
+  () => "sm"
+  /* SM */
+));
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "UiToolbar",
+  props: {
+    size: {
+      type: String,
+      default: SIZE.SM
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    provide(ToolbarInjectKeys.size, computed(() => props.size));
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default");
+    };
+  }
+});
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "UiToolbarButton",
+  props: {
+    /** Устанавливает атрибут href якоря */
+    href: {
+      type: null,
+      validator: (href) => typeof href === "string" && isURL(href) || href === null,
+      default: null
+    },
+    /** Регулирует цветовую схему кнопки: default, success or danger */
+    variant: {
+      type: String,
+      default: VARIANT.DEFAULT
+    },
+    /** Если кнопка активна */
+    active: {
+      type: Boolean,
+      default: false
+    },
+    /** Если кнопка отключена */
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /** Если кнопка заблокирована */
+    locked: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props, { expose: __expose }) {
+    const root = ref(null);
+    __expose({
+      click: () => {
+        var _a;
+        return (_a = root.value) == null ? void 0 : _a.click();
+      },
+      focus: () => {
+        var _a;
+        return (_a = root.value) == null ? void 0 : _a.focus();
+      },
+      blur: () => {
+        var _a;
+        return (_a = root.value) == null ? void 0 : _a.blur();
+      }
+    });
+    const toolbarSize = useToolbarSize();
+    const size = computed(() => {
+      if (toolbarSize.value === SIZE.SM) {
+        return SIZE$4.XS;
+      }
+      return SIZE$4.SM;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$c, mergeProps({
+        ref_key: "root",
+        ref: root,
+        href: __props.href,
+        variant: __props.variant,
+        size: size.value,
+        active: __props.active,
+        disabled: __props.disabled,
+        locked: __props.locked,
+        appearance: "secondary"
+      }, unref(without)(_ctx.$attrs, [
+        "appearance",
+        "class",
+        "style",
+        "type"
+      ])), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["href", "variant", "size", "active", "disabled", "locked"]);
+    };
+  }
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "UiToolbarLink",
+  props: {
+    /** Атрибут ссылки */
+    href: {
+      type: String,
+      validator: (href) => typeof href === "string" && isURL(href),
+      default: "javascript:void(0);"
+    },
+    /**
+     * Определяет, нужно ли открывать ссылку в новой вкладке.
+     * Также добавляется иконка внешней ссылки (если компонент UiIcon установлен)
+     */
+    external: {
+      type: Boolean,
+      default: false
+    },
+    /** Тип ссылок */
+    appearance: {
+      type: String,
+      validator: (appearance) => Object.values(APPEARANCE$1).includes(appearance),
+      default: APPEARANCE$1.DEFAULT
+    },
+    /** Инвертированный цвет ссылок для тёмного фона */
+    light: {
+      type: Boolean,
+      default: false
+    },
+    /** Жирное начертание */
+    accent: {
+      type: Boolean,
+      default: false
+    },
+    /** Подчеркивание dotted вместо стандартного поведения */
+    dotted: {
+      type: Boolean,
+      default: false
+    },
+    /** Определяет, будет ли текст ошибок обрезаться через многоточие или переноситься на следующую строку */
+    ellipsis: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$a, mergeProps({
+        href: __props.href,
+        external: __props.external,
+        appearance: __props.appearance,
+        light: __props.light,
+        accent: __props.accent,
+        dotted: __props.dotted,
+        ellipsis: __props.ellipsis,
+        size: "small"
+      }, unref(without)(_ctx.$attrs, ["class", "style"])), createSlots({
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 2
+      }, [
+        _ctx.$slots.icon || __props.external ? {
+          name: "icon",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "icon")
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1040, ["href", "external", "appearance", "light", "accent", "dotted", "ellipsis"]);
+    };
+  }
+});
 export {
   plugin as ModalPlugin,
-  _sfc_main$9 as UiButton,
-  _sfc_main$8 as UiError,
-  _sfc_main$7 as UiLink,
-  _sfc_main$5 as UiLoader,
-  _sfc_main$3 as UiModalSidebar,
-  _sfc_main$1 as UiModalWindow,
-  _sfc_main$2 as UiModalWindowSurface,
-  _sfc_main$4 as UiScrollBox,
-  _sfc_main as UiTag,
-  _sfc_main$6 as UiTransition
+  _sfc_main$c as UiButton,
+  _sfc_main$b as UiError,
+  _sfc_main$a as UiLink,
+  _sfc_main$8 as UiLoader,
+  _sfc_main$6 as UiModalSidebar,
+  _sfc_main$4 as UiModalWindow,
+  _sfc_main$5 as UiModalWindowSurface,
+  _sfc_main$7 as UiScrollBox,
+  _sfc_main$3 as UiTag,
+  _sfc_main$2 as UiToolbar,
+  _sfc_main$1 as UiToolbarButton,
+  _sfc_main as UiToolbarLink,
+  _sfc_main$9 as UiTransition
 };

package/dist/remote.cjs

@@ -99,6 +99,7 @@ const UiModalWindow = defineRemoteComponent(
     "update:opened"
   ],
   [
+    "icon",
     "title",
     "footer"
   ]
@@ -136,6 +137,16 @@ const UiTag = defineRemoteComponent(
   UiTagType,
   ["click", "focus", "blur", "remove"]
 );
+const UiToolbarButtonType = "UiToolbarButton";
+const UiToolbarButton = defineRemoteComponent(
+  UiToolbarButtonType,
+  ["click", "focus", "blur"]
+);
+const UiToolbarLinkType = "UiToolbarLink";
+const UiToolbarLink = defineRemoteComponent(
+  UiToolbarLinkType,
+  ["click", "focus", "blur"]
+);
 const UiTransitionType = "UiTransition";
 const UiTransition = defineRemoteComponent(UiTransitionType);
 exports.UiButton = UiButton;
@@ -156,5 +167,9 @@ exports.UiScrollBox = UiScrollBox;
 exports.UiScrollBoxType = UiScrollBoxType;
 exports.UiTag = UiTag;
 exports.UiTagType = UiTagType;
+exports.UiToolbarButton = UiToolbarButton;
+exports.UiToolbarButtonType = UiToolbarButtonType;
+exports.UiToolbarLink = UiToolbarLink;
+exports.UiToolbarLinkType = UiToolbarLinkType;
 exports.UiTransition = UiTransition;
 exports.UiTransitionType = UiTransitionType;

package/dist/remote.d.ts

@@ -340,6 +340,38 @@ declare type UiTagProperties = {
 
 export declare const UiTagType: SchemaType<"UiTag", RemoteProperties<UiTagProperties>, Record<string, never>>;
 
+export declare const UiToolbarButton: Component<    {
+[x: string]: unknown;
+}, RemoteProperties<UiToolbarButtonProperties>, {
+[x: string]: never;
+}, {
+[x: string]: never;
+}, MethodOptions, {
+click: (event: SerializedEvent) => boolean;
+focus: (event: SerializedFocusEvent) => boolean;
+blur: (event: SerializedEvent) => boolean;
+}>;
+
+declare type UiToolbarButtonProperties = Omit<UiButtonProperties, 'appearance' | 'size' | 'type'>;
+
+export declare const UiToolbarButtonType: SchemaType<"UiToolbarButton", RemoteProperties<UiToolbarButtonProperties>, RemoteCallable<UiButtonMethods>>;
+
+export declare const UiToolbarLink: Component<    {
+[x: string]: unknown;
+}, RemoteProperties<UiToolbarLinkProperties>, {
+[x: string]: never;
+}, {
+[x: string]: never;
+}, MethodOptions, {
+click: (event: SerializedEvent) => boolean;
+focus: (event: SerializedFocusEvent) => boolean;
+blur: (event: SerializedEvent) => boolean;
+}>;
+
+declare type UiToolbarLinkProperties = Omit<UiLinkProperties, 'size'>;
+
+export declare const UiToolbarLinkType: SchemaType<"UiToolbarLink", RemoteProperties<UiToolbarLinkProperties>, Record<string, never>>;
+
 export declare const UiTransition: Component<    {
 [x: string]: unknown;
 }, RemoteProperties<UiTransitionProps>, {

package/dist/remote.js

@@ -97,6 +97,7 @@ const UiModalWindow = defineRemoteComponent(
     "update:opened"
   ],
   [
+    "icon",
     "title",
     "footer"
   ]
@@ -134,6 +135,16 @@ const UiTag = defineRemoteComponent(
   UiTagType,
   ["click", "focus", "blur", "remove"]
 );
+const UiToolbarButtonType = "UiToolbarButton";
+const UiToolbarButton = defineRemoteComponent(
+  UiToolbarButtonType,
+  ["click", "focus", "blur"]
+);
+const UiToolbarLinkType = "UiToolbarLink";
+const UiToolbarLink = defineRemoteComponent(
+  UiToolbarLinkType,
+  ["click", "focus", "blur"]
+);
 const UiTransitionType = "UiTransition";
 const UiTransition = defineRemoteComponent(UiTransitionType);
 export {
@@ -155,6 +166,10 @@ export {
   UiScrollBoxType,
   UiTag,
   UiTagType,
+  UiToolbarButton,
+  UiToolbarButtonType,
+  UiToolbarLink,
+  UiToolbarLinkType,
   UiTransition,
   UiTransitionType
 };

package/index.cjs

@@ -0,0 +1 @@
+module.exports = {}

package/index.mjs

@@ -0,0 +1 @@
+export { }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@retailcrm/embed-ui-v1-components",
   "type": "module",
-  "version": "0.4.1-alpha.1",
+  "version": "0.4.1-alpha.11",
   "license": "MIT",
   "author": "RetailDriverLLC <integration@retailcrm.ru>",
   "repository": "git@github.com:retailcrm/embed-ui.git",
@@ -39,6 +39,8 @@
   "files": [
     "assets",
     "dist",
+    "index.cjs",
+    "index.mjs",
     "README.md"
   ],
   "scripts": {