@progress/kendo-themes-html 7.0.2-dev.4 → 7.0.2

package/dist/esm/window/tests/window-action-buttons.js

@@ -4512,32 +4512,46 @@ Window.options = options6;
 Window.className = WINDOW_CLASSNAME;
 Window.defaultProps = defaultProps6;
 
+// src/window/templates/window-normal.tsx
+import { Fragment as Fragment6, jsx as jsx10 } from "react/jsx-runtime";
+var WindowNormal = (props) => /* @__PURE__ */ jsx10(
+  Window,
+  {
+    title: "Title",
+    actions: ["window-minimize", "window", "x"],
+    children: [
+      /* @__PURE__ */ jsx10(Fragment6, { children: "Content" })
+    ],
+    ...props
+  }
+);
+
 // src/window/tests/window-action-buttons.tsx
-import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
 var style = `
     .k-window {
         position: relative;
         width: 300px;
     }
 `;
-var window_action_buttons_default = () => /* @__PURE__ */ jsxs3(Fragment6, { children: [
-  /* @__PURE__ */ jsx10("style", { children: style }),
+var window_action_buttons_default = () => /* @__PURE__ */ jsxs3(Fragment7, { children: [
+  /* @__PURE__ */ jsx11("style", { children: style }),
   /* @__PURE__ */ jsxs3("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: [
-    /* @__PURE__ */ jsx10(Window, { title: "Title", actions: ["window-minimize", "window", "x"], actionButtonsAlign: "start", actionButtons: /* @__PURE__ */ jsxs3(Fragment6, { children: [
-      /* @__PURE__ */ jsx10(Button, { children: "Cancel" }),
-      /* @__PURE__ */ jsx10(Button, { themeColor: "primary", children: "Update" })
+    /* @__PURE__ */ jsx11(WindowNormal, { actionButtonsAlign: "start", actionButtons: /* @__PURE__ */ jsxs3(Fragment7, { children: [
+      /* @__PURE__ */ jsx11(Button, { children: "Cancel" }),
+      /* @__PURE__ */ jsx11(Button, { themeColor: "primary", children: "Update" })
     ] }), children: "Action Buttons at start position" }),
-    /* @__PURE__ */ jsx10(Window, { title: "Title", actions: ["window-minimize", "window", "x"], actionButtonsAlign: "center", actionButtons: /* @__PURE__ */ jsxs3(Fragment6, { children: [
-      /* @__PURE__ */ jsx10(Button, { children: "Cancel" }),
-      /* @__PURE__ */ jsx10(Button, { themeColor: "primary", children: "Update" })
+    /* @__PURE__ */ jsx11(WindowNormal, { actionButtonsAlign: "center", actionButtons: /* @__PURE__ */ jsxs3(Fragment7, { children: [
+      /* @__PURE__ */ jsx11(Button, { children: "Cancel" }),
+      /* @__PURE__ */ jsx11(Button, { themeColor: "primary", children: "Update" })
     ] }), children: "Action Buttons at center position" }),
-    /* @__PURE__ */ jsx10(Window, { title: "Title", actions: ["window-minimize", "window", "x"], actionButtonsAlign: "end", actionButtons: /* @__PURE__ */ jsxs3(Fragment6, { children: [
-      /* @__PURE__ */ jsx10(Button, { children: "Cancel" }),
-      /* @__PURE__ */ jsx10(Button, { themeColor: "primary", children: "Update" })
+    /* @__PURE__ */ jsx11(WindowNormal, { actionButtonsAlign: "end", actionButtons: /* @__PURE__ */ jsxs3(Fragment7, { children: [
+      /* @__PURE__ */ jsx11(Button, { children: "Cancel" }),
+      /* @__PURE__ */ jsx11(Button, { themeColor: "primary", children: "Update" })
     ] }), children: "Action Buttons at end position" }),
-    /* @__PURE__ */ jsx10(Window, { title: "Title", actions: ["window-minimize", "window", "x"], actionButtonsAlign: "stretched", actionButtons: /* @__PURE__ */ jsxs3(Fragment6, { children: [
-      /* @__PURE__ */ jsx10(Button, { children: "Cancel" }),
-      /* @__PURE__ */ jsx10(Button, { themeColor: "primary", children: "Update" })
+    /* @__PURE__ */ jsx11(WindowNormal, { actionButtonsAlign: "stretched", actionButtons: /* @__PURE__ */ jsxs3(Fragment7, { children: [
+      /* @__PURE__ */ jsx11(Button, { children: "Cancel" }),
+      /* @__PURE__ */ jsx11(Button, { themeColor: "primary", children: "Update" })
     ] }), children: "Action Buttons with stretched position" })
   ] })
 ] });

package/dist/esm/window/tests/window-rtl.js

@@ -4512,21 +4512,35 @@ Window.options = options6;
 Window.className = WINDOW_CLASSNAME;
 Window.defaultProps = defaultProps6;
 
+// src/window/templates/window-normal.tsx
+import { Fragment as Fragment6, jsx as jsx10 } from "react/jsx-runtime";
+var WindowNormal = (props) => /* @__PURE__ */ jsx10(
+  Window,
+  {
+    title: "Title",
+    actions: ["window-minimize", "window", "x"],
+    children: [
+      /* @__PURE__ */ jsx10(Fragment6, { children: "Content" })
+    ],
+    ...props
+  }
+);
+
 // src/window/tests/window-rtl.tsx
-import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
 var style = `
     .k-window {
         position: relative;
     }
 `;
-var window_rtl_default = () => /* @__PURE__ */ jsxs3(Fragment6, { children: [
-  /* @__PURE__ */ jsx10("style", { children: style }),
+var window_rtl_default = () => /* @__PURE__ */ jsxs3(Fragment7, { children: [
+  /* @__PURE__ */ jsx11("style", { children: style }),
   /* @__PURE__ */ jsxs3("div", { id: "test-area", className: "k-d-grid k-grid-cols-2 k-rtl", children: [
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "Window", actions: ["window-minimize", "window", "x"], children: "Window content" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "", actions: ["window-minimize", "window", "x"], children: "Window with no title specified" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "", children: "Window with empty title and no actions" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { children: "Window without a title" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "Window minimized", actions: ["window-minimize", "window", "x"], minimized: true, children: "Window content" }) })
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { children: "Window content" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: "", children: "Window with no title specified" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: "", actions: void 0, children: "Window with empty title and no actions" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: void 0, actions: void 0, children: "Window without a title" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: "Window minimized", minimized: true, children: "Window content" }) })
   ] })
 ] });
 export {

package/dist/esm/window/tests/window-theme-colors.js

@@ -4512,21 +4512,34 @@ Window.options = options6;
 Window.className = WINDOW_CLASSNAME;
 Window.defaultProps = defaultProps6;
 
+// src/window/templates/window-normal.tsx
+import { Fragment as Fragment6, jsx as jsx10 } from "react/jsx-runtime";
+var WindowNormal = (props) => /* @__PURE__ */ jsx10(
+  Window,
+  {
+    title: "Title",
+    actions: ["window-minimize", "window", "x"],
+    children: [
+      /* @__PURE__ */ jsx10(Fragment6, { children: "Content" })
+    ],
+    ...props
+  }
+);
+
 // src/window/tests/window-theme-colors.tsx
-import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
 var style = `
     .k-window {
         position: relative;
     }
 `;
-var window_theme_colors_default = () => /* @__PURE__ */ jsxs3(Fragment6, { children: [
-  /* @__PURE__ */ jsx10("style", { children: style }),
-  /* @__PURE__ */ jsxs3("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: [
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "Window", actions: ["window-minimize", "window", "x"], children: "Window with default theme color" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { themeColor: "primary", title: "Window", actions: ["window-minimize", "window", "x"], children: "Window with primary theme color" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { themeColor: "dark", title: "Window", actions: ["window-minimize", "window", "x"], children: "Window with dark theme color" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { themeColor: "light", title: "Window", actions: ["window-minimize", "window", "x"], children: "Window with light theme color" }) })
-  ] })
+var window_theme_colors_default = () => /* @__PURE__ */ jsxs3(Fragment7, { children: [
+  /* @__PURE__ */ jsx11("style", { children: style }),
+  /* @__PURE__ */ jsx11("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: [void 0, ...Window.options.themeColor].map((color) => /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsxs3(WindowNormal, { themeColor: color, children: [
+    "Window with ",
+    color ? color : "no",
+    " theme color"
+  ] }) })) })
 ] });
 export {
   window_theme_colors_default as default

package/dist/esm/window/tests/window.js

@@ -4512,21 +4512,35 @@ Window.options = options6;
 Window.className = WINDOW_CLASSNAME;
 Window.defaultProps = defaultProps6;
 
+// src/window/templates/window-normal.tsx
+import { Fragment as Fragment6, jsx as jsx10 } from "react/jsx-runtime";
+var WindowNormal = (props) => /* @__PURE__ */ jsx10(
+  Window,
+  {
+    title: "Title",
+    actions: ["window-minimize", "window", "x"],
+    children: [
+      /* @__PURE__ */ jsx10(Fragment6, { children: "Content" })
+    ],
+    ...props
+  }
+);
+
 // src/window/tests/window.tsx
-import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
 var style = `
     .k-window {
         position: relative;
     }
 `;
-var window_default = () => /* @__PURE__ */ jsxs3(Fragment6, { children: [
-  /* @__PURE__ */ jsx10("style", { children: style }),
+var window_default = () => /* @__PURE__ */ jsxs3(Fragment7, { children: [
+  /* @__PURE__ */ jsx11("style", { children: style }),
   /* @__PURE__ */ jsxs3("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: [
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "Window", actions: ["window-minimize", "window", "x"], children: "Window content" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "", actions: ["window-minimize", "window", "x"], children: "Window with no title specified" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "", children: "Window with empty title and no actions" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { children: "Window without a title" }) }),
-    /* @__PURE__ */ jsx10("section", { children: /* @__PURE__ */ jsx10(Window, { title: "Window minimized", actions: ["window-minimize", "window", "x"], minimized: true, children: "Window content" }) })
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { children: "Window content" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: "", children: "Window with no title specified" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: "", actions: void 0, children: "Window with empty title and no actions" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: void 0, actions: void 0, children: "Window without a title" }) }),
+    /* @__PURE__ */ jsx11("section", { children: /* @__PURE__ */ jsx11(WindowNormal, { title: "Window minimized", minimized: true, children: "Window content" }) })
   ] })
 ] });
 export {

package/dist/types/fab/fab-item.d.ts

@@ -7,5 +7,8 @@ export type KendoFloatingActionButtonItemProps = {
 export type KendoFloatingActionButtonItemState = {
     [K in (typeof states)[number]]?: boolean;
 };
-export declare const FloatingActionButtonItem: (props: KendoFloatingActionButtonItemProps & KendoFloatingActionButtonItemState & React.HTMLAttributes<HTMLLIElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const FloatingActionButtonItem: {
+    (props: KendoFloatingActionButtonItemProps & KendoFloatingActionButtonItemState & React.HTMLAttributes<HTMLLIElement>): import("react/jsx-runtime").JSX.Element;
+    states: ("active" | "focus" | "disabled" | "hover")[];
+};
 export {};

package/dist/types/fab/index.d.ts

@@ -1,3 +1,6 @@
 export * from './fab.spec';
 export * from './fab-items';
 export * from './fab-item';
+export * from './templates/text-fab';
+export * from './templates/icon-fab';
+export * from './templates/icon-text-fab';

package/dist/types/fab/templates/icon-fab.d.ts

@@ -0,0 +1 @@
+export declare const IconFloatingActionButton: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/fab/templates/icon-text-fab.d.ts

@@ -0,0 +1 @@
+export declare const IconTextFloatingActionButton: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/fab/templates/text-fab.d.ts

@@ -0,0 +1 @@
+export declare const TextFloatingActionButton: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselecttree/index.d.ts

@@ -1 +1,7 @@
 export * from './multiselecttree.spec';
+export * from './templates/multiselecttree-normal';
+export * from './templates/multiselecttree-arrow-button';
+export * from './templates/multiselecttree-value';
+export * from './templates/multiselecttree-adaptive';
+export * from './templates/multiselecttree-popup';
+export * from './templates/multiselecttree-filtering';

package/dist/types/multiselecttree/multiselecttree.spec.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { KendoActionSheetProps } from '../action-sheet';
 export declare const MULTISELECTTREE_CLASSNAME = "k-multiselecttree";
 declare const states: ("required" | "loading" | "focus" | "invalid" | "disabled" | "readonly" | "hover" | "valid")[];
 declare const options: {
@@ -21,6 +22,8 @@ export type KendoMultiSelectTreeProps = KendoMultiSelectTreeOptions & {
     showArrowButton?: boolean;
     opened?: boolean;
     dir?: 'ltr' | 'rtl';
+    adaptive?: boolean;
+    adaptiveSettings?: KendoActionSheetProps;
 };
 export type KendoMultiSelectTreeState = {
     [K in (typeof states)[number]]?: boolean;

package/dist/types/multiselecttree/templates/multiselecttree-adaptive.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectTreeAdaptive: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselecttree/templates/multiselecttree-arrow-button.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectTreeArrowButton: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselecttree/templates/multiselecttree-filtering.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectTreeFiltering: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselecttree/templates/multiselecttree-normal.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectTreeNormal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselecttree/templates/multiselecttree-popup.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectTreePopup: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselecttree/templates/multiselecttree-value.d.ts

@@ -0,0 +1 @@
+export declare const MultiSelectTreeValue: ({ size, rounded, children, ...other }: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/multiselecttree/tests/multiselecttree-solid.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/types/notification/index.d.ts

@@ -1,2 +1,6 @@
 export * from './notification.spec';
 export * from './notification-action';
+export * from './templates/icon-notification';
+export * from './templates/icon-notification-closable';
+export * from './templates/notification-closable';
+export * from './templates/notification-normal';

package/dist/types/notification/templates/icon-notification-closable.d.ts

@@ -0,0 +1 @@
+export declare const IconNotificationClosable: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/notification/templates/icon-notification.d.ts

@@ -0,0 +1 @@
+export declare const IconNotification: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/notification/templates/notification-closable.d.ts

@@ -0,0 +1 @@
+export declare const NotificationClosable: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/notification/templates/notification-normal.d.ts

@@ -0,0 +1 @@
+export declare const NotificationNormal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/notification/tests/notification-angular-colors.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/types/notification/tests/notification-jquery-colors.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/types/upload/index.d.ts

@@ -3,3 +3,6 @@ export * from './upload-dropzone';
 export * from './upload-file';
 export * from './upload-file-multiple';
 export * from './upload-file-info';
+export * from './templates/upload-chunk';
+export * from './templates/upload-batch';
+export * from './templates/upload-normal';

package/dist/types/upload/templates/upload-batch.d.ts

@@ -0,0 +1 @@
+export declare const UploadBatch: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/upload/templates/upload-chunk.d.ts

@@ -0,0 +1 @@
+export declare const UploadChunk: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/upload/templates/upload-normal.d.ts

@@ -0,0 +1 @@
+export declare const UploadNormal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/upload/tests/upload-states.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/types/window/index.d.ts

@@ -1 +1,2 @@
 export * from './window.spec';
+export * from './templates/window-normal';

package/dist/types/window/templates/window-normal.d.ts

@@ -0,0 +1 @@
+export declare const WindowNormal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-themes-html",
   "description": "A collection of HTML helpers used for developing Kendo UI themes",
-  "version": "7.0.2-dev.4",
+  "version": "7.0.2",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [
@@ -52,5 +52,5 @@
   "devDependencies": {
     "@types/react": "^18.0.2"
   },
-  "gitHead": "6d2e939e23235b80ff5b886fe5e19e3ef2b3f582"
+  "gitHead": "dfc0dd56b57521806d71c44a781e60250caf96fb"
 }

package/src/context-menu/tests/context-menu-in-window.tsx

@@ -1,4 +1,4 @@
-import { Window } from '../../window';
+import { WindowNormal } from '../../window';
 import { MenuItem, MenuList } from '../../menu';
 import { Popup } from '../../popup';
 
@@ -25,9 +25,9 @@ export default () =>(
         <style>{styles}</style>
         <div id="test-area" className="k-d-grid">
             <section>
-                <Window title="Window" actions={[ 'window-minimize', 'window', 'x' ]}>
+                <WindowNormal title="Window">
                     Target
-                </Window>
+                </WindowNormal>
                 <Popup className="k-menu-popup">
                     <MenuList className="k-context-menu">
                         <MenuItem text="Item 1" showArrow></MenuItem>

package/src/dialog/tests/dialog-in-window.tsx

@@ -1,4 +1,4 @@
-import { Window } from '../../window';
+import { WindowNormal } from '../../window';
 import { DialogModal } from '../../dialog';
 
 
@@ -24,12 +24,12 @@ export default () =>(
         <div id="test-area" className="k-d-grid k-grid-cols-1">
             <section>
 
-                <Window title="Window with dialog" actions={[ 'window-minimize', 'window', 'x' ]} className="k-window-wrapper">
+                <WindowNormal title="Window with dialog" className="k-window-wrapper">
                     Window content
                     <DialogModal title="Dialog in window" actions={[ 'x' ]}>
                         Dialog content
                     </DialogModal>
-                </Window>
+                </WindowNormal>
             </section>
         </div>
     </>

package/src/editor/tests/editor-find-replace.tsx

@@ -3,7 +3,7 @@ import { Button } from '../../button';
 import { CheckboxItem, CheckboxWithLabelAfter, CheckboxGroup } from '../../checkbox';
 import { Textbox } from '../../textbox';
 import { EditorNormal, EditorContent, EditorToolbar } from '../../editor';
-import { Window } from '../../window';
+import { WindowNormal } from '../../window';
 import { ButtonGroup } from '../../button-group';
 import { Form, FormField } from '../../form';
 
@@ -34,7 +34,7 @@ export default () =>(
             <span>Replace Window</span>
 
             <section>
-                <Window title="Find and Replace" actions={[ 'x' ]}>
+                <WindowNormal title="Find and Replace" actions={[ 'x' ]}>
                     <div className="k-tabstrip k-tabstrip-top k-editor-find-replace">
                         <div className="k-tabstrip-items-wrapper k-hstack">
                             <ul className="k-tabstrip-items k-reset">
@@ -73,11 +73,11 @@ export default () =>(
                             </Form>
                         </div>
                     </div>
-                </Window>
+                </WindowNormal>
             </section>
 
             <section>
-                <Window className="k-editor-window" title="Find and Replace" actions={[ 'x' ]}>
+                <WindowNormal className="k-editor-window" title="Find and Replace" actions={[ 'x' ]}>
                     <div className="k-tabstrip k-tabstrip-top k-editor-find-replace">
                         <div className="k-tabstrip-items-wrapper k-hstack">
                             <ul className="k-tabstrip-items k-reset">
@@ -123,7 +123,7 @@ export default () =>(
                             </Form>
                         </div>
                     </div>
-                </Window>
+                </WindowNormal>
             </section>
 
 

package/src/editor/tests/editor-image-editor.tsx

@@ -1,6 +1,6 @@
 import { Button } from '../../button';
 import { Textbox } from '../../textbox';
-import { Window } from '../../window';
+import { WindowNormal } from '../../window';
 import { Form, FormField } from '../../form';
 
 
@@ -20,7 +20,7 @@ export default () =>(
             <span></span>
 
             <section>
-                <Window title="Insert Image" actions={[ 'x' ]} actionButtonsAlign="start" actionButtons={
+                <WindowNormal title="Insert Image" actions={[ 'x' ]} actionButtonsAlign="start" actionButtons={
                     <>
                         <Button themeColor="primary">Insert</Button>
                         <Button>Cancel</Button>
@@ -32,7 +32,7 @@ export default () =>(
                         <FormField label="Width:" editor={ <Textbox showClearButton={false} /> } />
                         <FormField label="Height:" editor={ <Textbox showClearButton={false} /> } />
                     </Form>
-                </Window>
+                </WindowNormal>
             </section>
 
         </div>

package/src/editor/tests/editor-table-wizard.tsx

@@ -7,7 +7,7 @@ import { Icon } from '../../icon';
 import { NumericTextbox } from '../../numerictextbox';
 import { Textarea } from '../../textarea';
 import { Textbox } from '../../textbox';
-import { Window } from '../../window';
+import { WindowNormal } from '../../window';
 
 
 const styles = `
@@ -22,7 +22,7 @@ export default () =>(
         <style>{styles}</style>
         <div id="test-area" className="k-d-grid k-grid-cols-2">
             <section>
-                <Window className="k-editor-window k-editor-table-wizard-window" title="Table properties" actions={[ 'minimize', 'maximize', 'close' ]} actionButtonsAlign="start" actionButtons={
+                <WindowNormal actions={[ 'x' ]} className="k-editor-window k-editor-table-wizard-window" title="Table properties" actionButtonsAlign="start" actionButtons={
                     <>
                         <Button themeColor="primary">Save</Button>
                         <Button>Cancel</Button>
@@ -119,10 +119,10 @@ export default () =>(
                             </Form>
                         </div>
                     </div>
-                </Window>
+                </WindowNormal>
             </section>
             <section>
-                <Window className="k-editor-window k-editor-table-wizard-window" title="Table properties" actions={[ 'minimize', 'maximize', 'close' ]} actionButtonsAlign="start" actionButtons={
+                <WindowNormal actions={[ 'x' ]} className="k-editor-window k-editor-table-wizard-window" title="Table properties" actionButtonsAlign="start" actionButtons={
                     <>
                         <Button themeColor="primary">Save</Button>
                         <Button>Cancel</Button>
@@ -176,11 +176,11 @@ export default () =>(
                             </Form>
                         </div>
                     </div>
-                </Window>
+                </WindowNormal>
             </section>
 
             <section>
-                <Window className="k-editor-window k-editor-table-wizard-window" title="Cell properties" actions={[ 'minimize', 'maximize', 'close' ]} actionButtonsAlign="start" actionButtons={
+                <WindowNormal actions={[ 'x' ]} className="k-editor-window k-editor-table-wizard-window" title="Cell properties" actionButtonsAlign="start" actionButtons={
                     <>
                         <Button themeColor="primary">Save</Button>
                         <Button>Cancel</Button>
@@ -266,7 +266,7 @@ export default () =>(
                             editor={ <Textbox /> }
                         />
                     </Form>
-                </Window>
+                </WindowNormal>
             </section>
         </div>
     </>

package/src/editor/tests/editor-view-source.tsx

@@ -1,4 +1,4 @@
-import { Window } from '../../window';
+import { WindowNormal } from '../../window';
 import { Textarea } from '../../textarea';
 import { Button } from '../../button';
 
@@ -20,14 +20,14 @@ export default () =>(
         <style>{styles}</style>
         <div id="test-area" className="k-d-grid k-grid-cols-1">
             <section>
-                <Window className="k-editor-window" title="View HTML" actions={[ 'x' ]} actionButtonsAlign="start" actionButtons={
+                <WindowNormal className="k-editor-window" title="View HTML" actions={[ 'x' ]} actionButtonsAlign="start" actionButtons={
                     <>
                         <Button themeColor="primary">Update</Button>
                         <Button>Cancel</Button>
                     </>
                 }>
                     <Textarea className="k-editor-textarea"></Textarea>
-                </Window>
+                </WindowNormal>
             </section>
         </div>
     </>

package/src/fab/fab-item.tsx

@@ -56,3 +56,5 @@ export const FloatingActionButtonItem = (
         </li>
     );
 };
+
+FloatingActionButtonItem.states = states;

package/src/fab/index.ts

@@ -1,3 +1,6 @@
 export * from './fab.spec';
 export * from './fab-items';
 export * from './fab-item';
+export * from './templates/text-fab';
+export * from './templates/icon-fab';
+export * from './templates/icon-text-fab';

package/src/fab/templates/icon-fab.tsx

@@ -0,0 +1,7 @@
+import { FloatingActionButton } from "../fab.spec";
+
+export const IconFloatingActionButton = (props) =>
+    <FloatingActionButton
+        icon="plus"
+        {...props}
+    />;

package/src/fab/templates/icon-text-fab.tsx

@@ -0,0 +1,8 @@
+import { FloatingActionButton } from "../fab.spec";
+
+export const IconTextFloatingActionButton = (props) =>
+    <FloatingActionButton
+        icon="plus"
+        text="Create"
+        {...props}
+    />;

package/src/fab/templates/text-fab.tsx

@@ -0,0 +1,7 @@
+import { FloatingActionButton } from "../fab.spec";
+
+export const TextFloatingActionButton = (props) =>
+    <FloatingActionButton
+        text="Create"
+        {...props}
+    />;