@progress/kendo-themes-html 7.1.0-dev.0 → 7.1.0-dev.2

package/dist/esm/multiselecttree/multiselecttree.spec.js

@@ -5733,8 +5733,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/templates/multiselecttree-adaptive.js

@@ -5733,8 +5733,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/templates/multiselecttree-arrow-button.js

@@ -5733,8 +5733,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/templates/multiselecttree-filtering.js

@@ -5840,8 +5840,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx58(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx58(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx58(Fragment19, { children: tags }) }),
-          /* @__PURE__ */ jsx58("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx58("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs19("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx58(ChipList, { size, children: /* @__PURE__ */ jsx58(Fragment19, { children: tags }) }),
+            /* @__PURE__ */ jsx58(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx58(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/templates/multiselecttree-normal.js

@@ -5733,8 +5733,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/templates/multiselecttree-popup.js

@@ -5733,8 +5733,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/templates/multiselecttree-value.js

@@ -5763,8 +5763,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/tests/multiselecttree-adaptive.js

@@ -5733,8 +5733,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/tests/multiselecttree-flat.js

@@ -5763,8 +5763,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/tests/multiselecttree-opened.js

@@ -5763,8 +5763,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/tests/multiselecttree-outline.js

@@ -5763,8 +5763,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/tests/multiselecttree-size-rounded.js

@@ -5763,8 +5763,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/multiselecttree/tests/multiselecttree-solid.js

@@ -5763,8 +5763,10 @@ var MultiSelectTree = (props) => {
         className: classNames(props.className, MULTISELECTTREE_CLASSNAME),
         children: [
           /* @__PURE__ */ jsx54(InputPrefix, { children: prefix }),
-          /* @__PURE__ */ jsx54(ChipList, { size, className: "k-input-values", children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
-          /* @__PURE__ */ jsx54("span", { className: "k-input-inner", children: /* @__PURE__ */ jsx54("span", { className: "k-input-value-text", children: placeholder }) }),
+          /* @__PURE__ */ jsxs16("div", { className: "k-input-values", children: [
+            /* @__PURE__ */ jsx54(ChipList, { size, children: /* @__PURE__ */ jsx54(Fragment17, { children: tags }) }),
+            /* @__PURE__ */ jsx54(InputInnerInput, { placeholder })
+          ] }),
           /* @__PURE__ */ jsx54(
             InputValidationIcon,
             {

package/dist/esm/notification/tests/{notification-jquery-colors.js → notification-colors.js}

@@ -4404,7 +4404,7 @@ AnimationContainer.options = options5;
 AnimationContainer.className = ANIMATION_CONTAINER_CLASSNAME;
 AnimationContainer.defaultProps = defaultProps5;
 
-// src/notification/tests/notification-jquery-colors.tsx
+// src/notification/tests/notification-colors.tsx
 import { Fragment as Fragment5, jsx as jsx11, jsxs as jsxs2 } from "react/jsx-runtime";
 var styles = `
     #test-area {
@@ -4416,10 +4416,10 @@ var styles = `
         overflow: visible;
     }
 `;
-var notification_jquery_colors_default = () => /* @__PURE__ */ jsxs2(Fragment5, { children: [
+var notification_colors_default = () => /* @__PURE__ */ jsxs2(Fragment5, { children: [
   /* @__PURE__ */ jsx11("style", { children: styles }),
   /* @__PURE__ */ jsx11("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: Notification.options.themeColor.map((color) => /* @__PURE__ */ jsx11("div", { children: /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(NotificationClosable, { themeColor: color, text: `${color} notification` }) }) })) })
 ] });
 export {
-  notification_jquery_colors_default as default
+  notification_colors_default as default
 };

package/dist/esm/notification/tests/{notification-angular.js → notification-group.js}

@@ -4393,32 +4393,68 @@ var NotificationNormal = (props) => /* @__PURE__ */ jsx9(
   }
 );
 
-// src/notification/tests/notification-angular.tsx
-import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs2 } from "react/jsx-runtime";
-var styles = `
-    #test-area {
-        justify-items: start;
+// src/animation-container/animation-container.spec.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var ANIMATION_CONTAINER_CLASSNAME = `k-animation-container`;
+var states5 = [];
+var options5 = {};
+var defaultProps5 = {
+  positionMode: "absolute"
+};
+var AnimationContainer = (props) => {
+  const {
+    positionMode,
+    animationStyle,
+    offset,
+    ...other
+  } = props;
+  return /* @__PURE__ */ jsx10(
+    "div",
+    {
+      ...other,
+      style: { ...offset, ...props.style },
+      className: classNames(
+        ANIMATION_CONTAINER_CLASSNAME,
+        "k-animation-container-shown",
+        {
+          ["k-animation-container-fixed"]: positionMode === "fixed"
+        }
+      ),
+      children: /* @__PURE__ */ jsx10("div", { className: "k-child-animation-container", style: animationStyle, children: props.children })
     }
+  );
+};
+AnimationContainer.states = states5;
+AnimationContainer.options = options5;
+AnimationContainer.className = ANIMATION_CONTAINER_CLASSNAME;
+AnimationContainer.defaultProps = defaultProps5;
 
-    .k-notification-container {
-        margin: 0;
+// src/notification/tests/notification-group.tsx
+import { Fragment as Fragment5, jsx as jsx11, jsxs as jsxs2 } from "react/jsx-runtime";
+var styles = `
+    .k-notification-group, .k-animation-container {
+        position: static;
     }
 `;
-var notification_angular_default = () => /* @__PURE__ */ jsxs2(Fragment5, { children: [
-  /* @__PURE__ */ jsx10("style", { children: styles }),
-  /* @__PURE__ */ jsxs2("div", { id: "test-area", className: "k-d-grid k-grid-cols-4", children: [
-    /* @__PURE__ */ jsx10("span", { className: "k-colspan-all k-col-span-full", children: "LTR" }),
-    /* @__PURE__ */ jsx10("div", { children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(NotificationNormal, { text: "Default notification" }) }) }),
-    /* @__PURE__ */ jsx10("div", { children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(IconNotification, { text: "Icon notification" }) }) }),
-    /* @__PURE__ */ jsx10("div", { children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(NotificationClosable, { text: "Closable notification" }) }) }),
-    /* @__PURE__ */ jsx10("div", { children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(IconNotificationClosable, { text: "Closable notification with icon" }) }) }),
-    /* @__PURE__ */ jsx10("span", { className: "k-colspan-all k-col-span-full", children: "RTL" }),
-    /* @__PURE__ */ jsx10("div", { dir: "rtl", children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(NotificationNormal, { text: "Default notification" }) }) }),
-    /* @__PURE__ */ jsx10("div", { dir: "rtl", children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(IconNotification, { text: "Icon notification" }) }) }),
-    /* @__PURE__ */ jsx10("div", { dir: "rtl", children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(NotificationClosable, { text: "Closable notification" }) }) }),
-    /* @__PURE__ */ jsx10("div", { dir: "rtl", children: /* @__PURE__ */ jsx10("div", { className: "k-notification-container", children: /* @__PURE__ */ jsx10(IconNotificationClosable, { text: "Closable notification with icon" }) }) })
+var notification_group_default = () => /* @__PURE__ */ jsxs2(Fragment5, { children: [
+  /* @__PURE__ */ jsx11("style", { children: styles }),
+  /* @__PURE__ */ jsxs2("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: [
+    /* @__PURE__ */ jsx11("span", { className: "k-col-span-1", children: "LTR" }),
+    /* @__PURE__ */ jsx11("span", { className: "k-col-span-1", children: "RTL" }),
+    /* @__PURE__ */ jsxs2("div", { className: "k-notification-group", children: [
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(NotificationNormal, { text: "Default notification" }) }),
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(IconNotification, { text: "Icon notification" }) }),
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(NotificationClosable, { text: "Closable notification" }) }),
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(IconNotificationClosable, { text: "Closable notification with icon" }) })
+    ] }),
+    /* @__PURE__ */ jsxs2("div", { className: "k-notification-group k-rtl", children: [
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(NotificationNormal, { text: "Default notification" }) }),
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(IconNotification, { text: "Icon notification" }) }),
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(NotificationClosable, { text: "Closable notification" }) }),
+      /* @__PURE__ */ jsx11(AnimationContainer, { children: /* @__PURE__ */ jsx11(IconNotificationClosable, { text: "Closable notification with icon" }) })
+    ] })
   ] })
 ] });
 export {
-  notification_angular_default as default
+  notification_group_default as default
 };

package/dist/esm/notification/tests/{notification-jquery.js → notification.js}

@@ -4429,7 +4429,7 @@ AnimationContainer.options = options5;
 AnimationContainer.className = ANIMATION_CONTAINER_CLASSNAME;
 AnimationContainer.defaultProps = defaultProps5;
 
-// src/notification/tests/notification-jquery.tsx
+// src/notification/tests/notification.tsx
 import { Fragment as Fragment5, jsx as jsx11, jsxs as jsxs2 } from "react/jsx-runtime";
 var styles = `
     #test-area {
@@ -4441,7 +4441,7 @@ var styles = `
         overflow: visible;
     }
 `;
-var notification_jquery_default = () => /* @__PURE__ */ jsxs2(Fragment5, { children: [
+var notification_default = () => /* @__PURE__ */ jsxs2(Fragment5, { children: [
   /* @__PURE__ */ jsx11("style", { children: styles }),
   /* @__PURE__ */ jsxs2("div", { id: "test-area", className: "k-d-grid k-grid-cols-4", children: [
     /* @__PURE__ */ jsx11("span", { className: "k-colspan-all k-col-span-full", children: "LTR" }),
@@ -4457,5 +4457,5 @@ var notification_jquery_default = () => /* @__PURE__ */ jsxs2(Fragment5, { child
   ] })
 ] });
 export {
-  notification_jquery_default as default
+  notification_default as default
 };