@syncfusion/ej2-react-layouts 31.2.2 → 32.1.19

package/dist/ej2-react-layouts.min.js

@@ -1,10 +1 @@
-/*!
-*  filename: ej2-react-layouts.min.js
-*  version : 31.2.2
-*  Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
-*  Use of this code is subject to the terms of our license.
-*  A copy of the current license can be obtained at any time by e-mailing
-*  licensing@syncfusion.com. Any infringement will be prosecuted under
-*  applicable laws. 
-*/
 !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("SyncfusionReactBase"),require("React"),require("SyncfusionLayouts")):"function"==typeof define&&define.amd?define(["SyncfusionReactBase","React","SyncfusionLayouts"],t):"object"==typeof exports?exports.SyncfusionReactLayouts=t(require("SyncfusionReactBase"),require("React"),require("SyncfusionLayouts")):e.SyncfusionReactLayouts=t(e.SyncfusionReactBase,e.React,e.SyncfusionLayouts)}(self,(e,t,n)=>(()=>{"use strict";var o={238:(e,t,n)=>{n.d(t,{nW:()=>l,Ku:()=>s,kR:()=>a});var o,r=n(705),i=(o=function(e,t){return o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])},o(e,t)},function(e,t){function n(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}),s=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return i(t,e),t.moduleName="panel",t.complexTemplate={"panels.header":"panels.header","panels.content":"panels.content"},t}(r.ComplexBase),a=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return i(t,e),t.propertyName="panels",t.moduleName="panels",t}(r.ComplexBase),c=n(24),p=n(40),u=function(){var e=function(t,n){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])},e(t,n)};return function(t,n){function o(){this.constructor=t}e(t,n),t.prototype=null===n?Object.create(n):(o.prototype=n.prototype,new o)}}(),l=function(e){function t(t){var n=e.call(this,t)||this;return n.initRenderCalled=!1,n.checkInjectedModules=!1,n.directivekeys={panels:"panel"},n.statelessTemplateProps=null,n.templateProps=null,n.immediateRender=!1,n.isReactMock=!0,n.portals=[],n}return u(t,e),t.prototype.render=function(){if(this.isReactMock=!1,!(this.element&&!this.initRenderCalled||this.refreshing)||this.isReactForeceUpdate)return c.createElement("div",this.getDefaultAttributes(),[].concat(this.props.children,this.portals));e.prototype.render.call(this),this.initRenderCalled=!0},t}(p.DashboardLayout);(0,r.applyMixins)(l,[r.ComponentBase,c.Component])},607:(e,t,n)=>{n.d(t,{hY:()=>s,MR:()=>a,H4:()=>l});var o,r=n(705),i=(o=function(e,t){return o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])},o(e,t)},function(e,t){function n(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}),s=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return i(t,e),t.moduleName="pane",t}(r.ComplexBase),a=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return i(t,e),t.propertyName="paneSettings",t.moduleName="panes",t}(r.ComplexBase),c=n(24),p=n(40),u=function(){var e=function(t,n){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])},e(t,n)};return function(t,n){function o(){this.constructor=t}e(t,n),t.prototype=null===n?Object.create(n):(o.prototype=n.prototype,new o)}}(),l=function(e){function t(t){var n=e.call(this,t)||this;return n.initRenderCalled=!1,n.checkInjectedModules=!1,n.directivekeys={panes:"pane"},n.statelessTemplateProps=null,n.templateProps=null,n.immediateRender=!1,n.isReactMock=!0,n.portals=[],n}return u(t,e),t.prototype.render=function(){if(this.isReactMock=!1,!(this.element&&!this.initRenderCalled||this.refreshing)||this.isReactForeceUpdate)return c.createElement("div",this.getDefaultAttributes(),[].concat(this.props.children,this.portals));e.prototype.render.call(this),this.initRenderCalled=!0},t}(p.Splitter);(0,r.applyMixins)(l,[r.ComponentBase,c.Component])},508:(e,t,n)=>{n.d(t,{y4:()=>s,xZ:()=>a,zT:()=>l});var o,r=n(705),i=(o=function(e,t){return o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])},o(e,t)},function(e,t){function n(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}),s=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return i(t,e),t.moduleName="item",t}(r.ComplexBase),a=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return i(t,e),t.propertyName="items",t.moduleName="items",t}(r.ComplexBase),c=n(24),p=n(40),u=function(){var e=function(t,n){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])},e(t,n)};return function(t,n){function o(){this.constructor=t}e(t,n),t.prototype=null===n?Object.create(n):(o.prototype=n.prototype,new o)}}(),l=function(e){function t(t){var n=e.call(this,t)||this;return n.initRenderCalled=!1,n.checkInjectedModules=!1,n.directivekeys={items:"item"},n.statelessTemplateProps=null,n.templateProps=null,n.immediateRender=!1,n.isReactMock=!0,n.portals=[],n}return u(t,e),t.prototype.render=function(){if(this.isReactMock=!1,!(this.element&&!this.initRenderCalled||this.refreshing)||this.isReactForeceUpdate)return c.createElement("div",this.getDefaultAttributes(),[].concat(this.props.children,this.portals));e.prototype.render.call(this),this.initRenderCalled=!0},t}(p.Timeline);(0,r.applyMixins)(l,[r.ComponentBase,c.Component])},24:e=>{e.exports=t},40:e=>{e.exports=n},705:t=>{t.exports=e}},r={};function i(e){var t=r[e];if(void 0!==t)return t.exports;var n=r[e]={exports:{}};return o[e](n,n.exports,i),n.exports}i.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return i.d(t,{a:t}),t},i.d=(e,t)=>{for(var n in t)i.o(t,n)&&!i.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return(()=>{i.r(s),i.d(s,{DashboardLayoutComponent:()=>t.nW,ItemDirective:()=>n.y4,ItemsDirective:()=>n.xZ,PaneDirective:()=>e.hY,PanelDirective:()=>t.Ku,PanelsDirective:()=>t.kR,PanesDirective:()=>e.MR,SplitterComponent:()=>e.H4,TimelineComponent:()=>n.zT});var e=i(607),t=i(238),n=i(508),o=i(40),r={};for(const e in o)["default","PaneDirective","PanesDirective","SplitterComponent","DashboardLayoutComponent","PanelDirective","PanelsDirective","ItemDirective","ItemsDirective","TimelineComponent"].indexOf(e)<0&&(r[e]=()=>o[e]);i.d(s,r)})(),s})());

package/dist/ej2-react-layouts.umd.min.js

@@ -1,11 +1,2 @@
-/*!
-*  filename: ej2-react-layouts.umd.min.js
-*  version : 31.2.2
-*  Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
-*  Use of this code is subject to the terms of our license.
-*  A copy of the current license can be obtained at any time by e-mailing
-*  licensing@syncfusion.com. Any infringement will be prosecuted under
-*  applicable laws. 
-*/
 !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@syncfusion/ej2-react-base"),require("react"),require("@syncfusion/ej2-layouts")):"function"==typeof define&&define.amd?define(["exports","@syncfusion/ej2-react-base","react","@syncfusion/ej2-layouts"],t):t((e=e||self).ej={},e.ej2ReactBase,e.React,e.ej2Layouts)}(this,function(t,e,n,o){"use strict";r=function(e,t){return(r=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])}))(e,t)};var r,i,s=function(e,t){function n(){this.constructor=e}r(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},a=(i=e.ComplexBase,s(p,i),p.moduleName="pane",p);function p(){return null!==i&&i.apply(this,arguments)||this}c=e.ComplexBase,s(l,c),l.propertyName="paneSettings",l.moduleName="panes";var c,s=l;function l(){return null!==c&&c.apply(this,arguments)||this}u=function(e,t){return(u=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])}))(e,t)};var u,f,h=function(e,t){function n(){this.constructor=e}u(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},h=(f=o.Splitter,h(y,f),y.prototype.render=function(){if(this.isReactMock=!1,!(this.element&&!this.initRenderCalled||this.refreshing)||this.isReactForeceUpdate)return n.createElement("div",this.getDefaultAttributes(),[].concat(this.props.children,this.portals));f.prototype.render.call(this),this.initRenderCalled=!0},y);function y(e){e=f.call(this,e)||this;return e.initRenderCalled=!1,e.checkInjectedModules=!1,e.directivekeys={panes:"pane"},e.statelessTemplateProps=null,e.templateProps=null,e.immediateRender=!1,e.isReactMock=!0,e.portals=[],e}e.applyMixins(h,[e.ComponentBase,n.Component]);d=function(e,t){return(d=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])}))(e,t)};var d,m,_=function(e,t){function n(){this.constructor=e}d(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},v=(m=e.ComplexBase,_(O,m),O.moduleName="panel",O.complexTemplate={"panels.header":"panels.header","panels.content":"panels.content"},O);function O(){return null!==m&&m.apply(this,arguments)||this}j=e.ComplexBase,_(b,j),b.propertyName="panels",b.moduleName="panels";var j,_=b;function b(){return null!==j&&j.apply(this,arguments)||this}C=function(e,t){return(C=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])}))(e,t)};var C,P,R=function(e,t){function n(){this.constructor=e}C(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},R=(P=o.DashboardLayout,R(k,P),k.prototype.render=function(){if(this.isReactMock=!1,!(this.element&&!this.initRenderCalled||this.refreshing)||this.isReactForeceUpdate)return n.createElement("div",this.getDefaultAttributes(),[].concat(this.props.children,this.portals));P.prototype.render.call(this),this.initRenderCalled=!0},k);function k(e){e=P.call(this,e)||this;return e.initRenderCalled=!1,e.checkInjectedModules=!1,e.directivekeys={panels:"panel"},e.statelessTemplateProps=null,e.templateProps=null,e.immediateRender=!1,e.isReactMock=!0,e.portals=[],e}e.applyMixins(R,[e.ComponentBase,n.Component]);x=function(e,t){return(x=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])}))(e,t)};var x,M,w=function(e,t){function n(){this.constructor=e}x(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},E=(M=e.ComplexBase,w(D,M),D.moduleName="item",D);function D(){return null!==M&&M.apply(this,arguments)||this}B=e.ComplexBase,w(A,B),A.propertyName="items",A.moduleName="items";var B,w=A;function A(){return null!==B&&B.apply(this,arguments)||this}N=function(e,t){return(N=Object.setPrototypeOf||({__proto__:[]}instanceof Array?function(e,t){e.__proto__=t}:function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])}))(e,t)};var N,g,T=function(e,t){function n(){this.constructor=e}N(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},T=(g=o.Timeline,T(I,g),I.prototype.render=function(){if(this.isReactMock=!1,!(this.element&&!this.initRenderCalled||this.refreshing)||this.isReactForeceUpdate)return n.createElement("div",this.getDefaultAttributes(),[].concat(this.props.children,this.portals));g.prototype.render.call(this),this.initRenderCalled=!0},I);function I(e){e=g.call(this,e)||this;return e.initRenderCalled=!1,e.checkInjectedModules=!1,e.directivekeys={items:"item"},e.statelessTemplateProps=null,e.templateProps=null,e.immediateRender=!1,e.isReactMock=!0,e.portals=[],e}e.applyMixins(T,[e.ComponentBase,n.Component]),Object.keys(o).forEach(function(e){"default"!==e&&Object.defineProperty(t,e,{enumerable:!0,get:function(){return o[e]}})}),t.DashboardLayoutComponent=R,t.ItemDirective=E,t.ItemsDirective=w,t.PaneDirective=a,t.PanelDirective=v,t.PanelsDirective=_,t.PanesDirective=s,t.SplitterComponent=h,t.TimelineComponent=T,Object.defineProperty(t,"__esModule",{value:!0})});
 //# sourceMappingURL=ej2-react-layouts.umd.min.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-react-layouts",
-  "version": "31.2.2",
+  "version": "32.1.19",
   "description": "A package of Essential JS 2 layout pure CSS components such as card and avatar. The card is used as small container to show content in specific structure, whereas the avatars are icons, initials or figures representing particular person. for React",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
@@ -22,9 +22,9 @@
   "es2015": "dist/es6/ej2-react-layouts.es2015.js",
   "readme": "ReadMe.md",
   "dependencies": {
-    "@syncfusion/ej2-base": "~31.2.2",
-    "@syncfusion/ej2-react-base": "~31.2.2",
-    "@syncfusion/ej2-layouts": "31.2.2"
+    "@syncfusion/ej2-base": "~32.1.19",
+    "@syncfusion/ej2-react-base": "~32.1.19",
+    "@syncfusion/ej2-layouts": "32.1.19"
   },
   "devDependencies": {},
   "sideEffects": false,

package/styles/avatar/bds.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/bds.scss';
+@use 'ej2-layouts/styles/avatar/bds' as *;

package/styles/avatar/bootstrap-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/bootstrap-dark.scss';
+@use 'ej2-layouts/styles/avatar/bootstrap-dark' as *;

package/styles/avatar/bootstrap.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/bootstrap.scss';
+@use 'ej2-layouts/styles/avatar/bootstrap' as *;

package/styles/avatar/bootstrap4.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/bootstrap4.scss';
+@use 'ej2-layouts/styles/avatar/bootstrap4' as *;

package/styles/avatar/bootstrap5-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/bootstrap5-dark.scss';
+@use 'ej2-layouts/styles/avatar/bootstrap5-dark' as *;

package/styles/avatar/bootstrap5.3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/bootstrap5.3.scss';
+@use 'ej2-layouts/styles/avatar/bootstrap5.3' as *;

package/styles/avatar/bootstrap5.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/bootstrap5.scss';
+@use 'ej2-layouts/styles/avatar/bootstrap5' as *;

package/styles/avatar/fabric-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/fabric-dark.scss';
+@use 'ej2-layouts/styles/avatar/fabric-dark' as *;

package/styles/avatar/fabric.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/fabric.scss';
+@use 'ej2-layouts/styles/avatar/fabric' as *;

package/styles/avatar/fluent-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/fluent-dark.scss';
+@use 'ej2-layouts/styles/avatar/fluent-dark' as *;

package/styles/avatar/fluent.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/fluent.scss';
+@use 'ej2-layouts/styles/avatar/fluent' as *;

package/styles/avatar/fluent2.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/fluent2.scss';
+@use 'ej2-layouts/styles/avatar/fluent2' as *;

package/styles/avatar/highcontrast-light.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/highcontrast-light.scss';
+@use 'ej2-layouts/styles/avatar/highcontrast-light' as *;

package/styles/avatar/highcontrast.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/highcontrast.scss';
+@use 'ej2-layouts/styles/avatar/highcontrast' as *;

package/styles/avatar/material-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/material-dark.scss';
+@use 'ej2-layouts/styles/avatar/material-dark' as *;

package/styles/avatar/material.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/material.scss';
+@use 'ej2-layouts/styles/avatar/material' as *;

package/styles/avatar/material3-dark.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/avatar/material3-dark.scss';
+@use 'ej2-layouts/styles/avatar/material3-dark' as *;

package/styles/avatar/material3.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/avatar/material3.scss';
+@use 'ej2-layouts/styles/avatar/material3' as *;

package/styles/avatar/tailwind-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/tailwind-dark.scss';
+@use 'ej2-layouts/styles/avatar/tailwind-dark' as *;

package/styles/avatar/tailwind.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/tailwind.scss';
+@use 'ej2-layouts/styles/avatar/tailwind' as *;

package/styles/avatar/tailwind3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/avatar/tailwind3.scss';
+@use 'ej2-layouts/styles/avatar/tailwind3' as *;

package/styles/bds-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/bds-lite.scss';
+@use 'ej2-layouts/bds-lite' as *;

package/styles/bds.scss

@@ -1,5 +1,5 @@
-@import 'avatar/bds.scss';
-@import 'card/bds.scss';
-@import 'splitter/bds.scss';
-@import 'dashboard-layout/bds.scss';
-@import 'timeline/bds.scss';
+@use 'avatar/bds' as *;
+@use 'card/bds' as *;
+@use 'splitter/bds' as *;
+@use 'dashboard-layout/bds' as *;
+@use 'timeline/bds' as *;

package/styles/bootstrap-dark-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/bootstrap-dark-lite.scss';
+@use 'ej2-layouts/bootstrap-dark-lite' as *;

package/styles/bootstrap-dark.scss

@@ -1,5 +1,5 @@
-@import 'avatar/bootstrap-dark.scss';
-@import 'card/bootstrap-dark.scss';
-@import 'splitter/bootstrap-dark.scss';
-@import 'dashboard-layout/bootstrap-dark.scss';
-@import 'timeline/bootstrap-dark.scss';
+@use 'avatar/bootstrap-dark' as *;
+@use 'card/bootstrap-dark' as *;
+@use 'splitter/bootstrap-dark' as *;
+@use 'dashboard-layout/bootstrap-dark' as *;
+@use 'timeline/bootstrap-dark' as *;

package/styles/bootstrap-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/bootstrap-lite.scss';
+@use 'ej2-layouts/bootstrap-lite' as *;

package/styles/bootstrap.scss

@@ -1,5 +1,5 @@
-@import 'avatar/bootstrap.scss';
-@import 'card/bootstrap.scss';
-@import 'splitter/bootstrap.scss';
-@import 'dashboard-layout/bootstrap.scss';
-@import 'timeline/bootstrap.scss';
+@use 'avatar/bootstrap' as *;
+@use 'card/bootstrap' as *;
+@use 'splitter/bootstrap' as *;
+@use 'dashboard-layout/bootstrap' as *;
+@use 'timeline/bootstrap' as *;

package/styles/bootstrap4-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/bootstrap4-lite.scss';
+@use 'ej2-layouts/bootstrap4-lite' as *;

package/styles/bootstrap4.scss

@@ -1,5 +1,5 @@
-@import 'avatar/bootstrap4.scss';
-@import 'card/bootstrap4.scss';
-@import 'splitter/bootstrap4.scss';
-@import 'dashboard-layout/bootstrap4.scss';
-@import 'timeline/bootstrap4.scss';
+@use 'avatar/bootstrap4' as *;
+@use 'card/bootstrap4' as *;
+@use 'splitter/bootstrap4' as *;
+@use 'dashboard-layout/bootstrap4' as *;
+@use 'timeline/bootstrap4' as *;

package/styles/bootstrap5-dark-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/bootstrap5-dark-lite.scss';
+@use 'ej2-layouts/bootstrap5-dark-lite' as *;

package/styles/bootstrap5-dark.scss

@@ -1,5 +1,5 @@
-@import 'avatar/bootstrap5-dark.scss';
-@import 'card/bootstrap5-dark.scss';
-@import 'splitter/bootstrap5-dark.scss';
-@import 'dashboard-layout/bootstrap5-dark.scss';
-@import 'timeline/bootstrap5-dark.scss';
+@use 'avatar/bootstrap5-dark' as *;
+@use 'card/bootstrap5-dark' as *;
+@use 'splitter/bootstrap5-dark' as *;
+@use 'dashboard-layout/bootstrap5-dark' as *;
+@use 'timeline/bootstrap5-dark' as *;

package/styles/bootstrap5-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/bootstrap5-lite.scss';
+@use 'ej2-layouts/bootstrap5-lite' as *;

package/styles/bootstrap5.3-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/bootstrap5.3-lite.scss';
+@use 'ej2-layouts/bootstrap5.3-lite' as *;

package/styles/bootstrap5.3.scss

@@ -1,5 +1,5 @@
-@import 'avatar/bootstrap5.3.scss';
-@import 'card/bootstrap5.3.scss';
-@import 'splitter/bootstrap5.3.scss';
-@import 'dashboard-layout/bootstrap5.3.scss';
-@import 'timeline/bootstrap5.3.scss';
+@use 'avatar/bootstrap5.3' as *;
+@use 'card/bootstrap5.3' as *;
+@use 'splitter/bootstrap5.3' as *;
+@use 'dashboard-layout/bootstrap5.3' as *;
+@use 'timeline/bootstrap5.3' as *;

package/styles/bootstrap5.scss

@@ -1,5 +1,5 @@
-@import 'avatar/bootstrap5.scss';
-@import 'card/bootstrap5.scss';
-@import 'splitter/bootstrap5.scss';
-@import 'dashboard-layout/bootstrap5.scss';
-@import 'timeline/bootstrap5.scss';
+@use 'avatar/bootstrap5' as *;
+@use 'card/bootstrap5' as *;
+@use 'splitter/bootstrap5' as *;
+@use 'dashboard-layout/bootstrap5' as *;
+@use 'timeline/bootstrap5' as *;

package/styles/card/bds.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/bds.scss';
+@use 'ej2-layouts/styles/card/bds' as *;

package/styles/card/bootstrap-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/bootstrap-dark.scss';
+@use 'ej2-layouts/styles/card/bootstrap-dark' as *;

package/styles/card/bootstrap.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/bootstrap.scss';
+@use 'ej2-layouts/styles/card/bootstrap' as *;

package/styles/card/bootstrap4.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/bootstrap4.scss';
+@use 'ej2-layouts/styles/card/bootstrap4' as *;

package/styles/card/bootstrap5-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/bootstrap5-dark.scss';
+@use 'ej2-layouts/styles/card/bootstrap5-dark' as *;

package/styles/card/bootstrap5.3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/bootstrap5.3.scss';
+@use 'ej2-layouts/styles/card/bootstrap5.3' as *;

package/styles/card/bootstrap5.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/bootstrap5.scss';
+@use 'ej2-layouts/styles/card/bootstrap5' as *;

package/styles/card/fabric-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/fabric-dark.scss';
+@use 'ej2-layouts/styles/card/fabric-dark' as *;

package/styles/card/fabric.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/fabric.scss';
+@use 'ej2-layouts/styles/card/fabric' as *;

package/styles/card/fluent-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/fluent-dark.scss';
+@use 'ej2-layouts/styles/card/fluent-dark' as *;

package/styles/card/fluent.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/fluent.scss';
+@use 'ej2-layouts/styles/card/fluent' as *;

package/styles/card/fluent2.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/fluent2.scss';
+@use 'ej2-layouts/styles/card/fluent2' as *;

package/styles/card/highcontrast-light.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/highcontrast-light.scss';
+@use 'ej2-layouts/styles/card/highcontrast-light' as *;

package/styles/card/highcontrast.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/highcontrast.scss';
+@use 'ej2-layouts/styles/card/highcontrast' as *;

package/styles/card/material-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/material-dark.scss';
+@use 'ej2-layouts/styles/card/material-dark' as *;

package/styles/card/material.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/material.scss';
+@use 'ej2-layouts/styles/card/material' as *;

package/styles/card/material3-dark.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/card/material3-dark.scss';
+@use 'ej2-layouts/styles/card/material3-dark' as *;

package/styles/card/material3.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/card/material3.scss';
+@use 'ej2-layouts/styles/card/material3' as *;

package/styles/card/tailwind-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/tailwind-dark.scss';
+@use 'ej2-layouts/styles/card/tailwind-dark' as *;

package/styles/card/tailwind.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/tailwind.scss';
+@use 'ej2-layouts/styles/card/tailwind' as *;

package/styles/card/tailwind3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/card/tailwind3.scss';
+@use 'ej2-layouts/styles/card/tailwind3' as *;

package/styles/dashboard-layout/bds.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/bds.scss';
+@use 'ej2-layouts/styles/dashboard-layout/bds' as *;

package/styles/dashboard-layout/bootstrap-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/bootstrap-dark.scss';
+@use 'ej2-layouts/styles/dashboard-layout/bootstrap-dark' as *;

package/styles/dashboard-layout/bootstrap.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/bootstrap.scss';
+@use 'ej2-layouts/styles/dashboard-layout/bootstrap' as *;

package/styles/dashboard-layout/bootstrap4.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/bootstrap4.scss';
+@use 'ej2-layouts/styles/dashboard-layout/bootstrap4' as *;

package/styles/dashboard-layout/bootstrap5-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/bootstrap5-dark.scss';
+@use 'ej2-layouts/styles/dashboard-layout/bootstrap5-dark' as *;

package/styles/dashboard-layout/bootstrap5.3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/bootstrap5.3.scss';
+@use 'ej2-layouts/styles/dashboard-layout/bootstrap5.3' as *;

package/styles/dashboard-layout/bootstrap5.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/bootstrap5.scss';
+@use 'ej2-layouts/styles/dashboard-layout/bootstrap5' as *;

package/styles/dashboard-layout/fabric-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/fabric-dark.scss';
+@use 'ej2-layouts/styles/dashboard-layout/fabric-dark' as *;

package/styles/dashboard-layout/fabric.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/fabric.scss';
+@use 'ej2-layouts/styles/dashboard-layout/fabric' as *;

package/styles/dashboard-layout/fluent-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/fluent-dark.scss';
+@use 'ej2-layouts/styles/dashboard-layout/fluent-dark' as *;

package/styles/dashboard-layout/fluent.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/fluent.scss';
+@use 'ej2-layouts/styles/dashboard-layout/fluent' as *;

package/styles/dashboard-layout/fluent2.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/fluent2.scss';
+@use 'ej2-layouts/styles/dashboard-layout/fluent2' as *;

package/styles/dashboard-layout/highcontrast-light.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/highcontrast-light.scss';
+@use 'ej2-layouts/styles/dashboard-layout/highcontrast-light' as *;

package/styles/dashboard-layout/highcontrast.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/highcontrast.scss';
+@use 'ej2-layouts/styles/dashboard-layout/highcontrast' as *;

package/styles/dashboard-layout/material-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/material-dark.scss';
+@use 'ej2-layouts/styles/dashboard-layout/material-dark' as *;

package/styles/dashboard-layout/material.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/material.scss';
+@use 'ej2-layouts/styles/dashboard-layout/material' as *;

package/styles/dashboard-layout/material3-dark.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/dashboard-layout/material3-dark.scss';
+@use 'ej2-layouts/styles/dashboard-layout/material3-dark' as *;

package/styles/dashboard-layout/material3.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/dashboard-layout/material3.scss';
+@use 'ej2-layouts/styles/dashboard-layout/material3' as *;

package/styles/dashboard-layout/tailwind-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/tailwind-dark.scss';
+@use 'ej2-layouts/styles/dashboard-layout/tailwind-dark' as *;

package/styles/dashboard-layout/tailwind.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/tailwind.scss';
+@use 'ej2-layouts/styles/dashboard-layout/tailwind' as *;

package/styles/dashboard-layout/tailwind3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/dashboard-layout/tailwind3.scss';
+@use 'ej2-layouts/styles/dashboard-layout/tailwind3' as *;

package/styles/fabric-dark-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/fabric-dark-lite.scss';
+@use 'ej2-layouts/fabric-dark-lite' as *;

package/styles/fabric-dark.scss

@@ -1,5 +1,5 @@
-@import 'avatar/fabric-dark.scss';
-@import 'card/fabric-dark.scss';
-@import 'splitter/fabric-dark.scss';
-@import 'dashboard-layout/fabric-dark.scss';
-@import 'timeline/fabric-dark.scss';
+@use 'avatar/fabric-dark' as *;
+@use 'card/fabric-dark' as *;
+@use 'splitter/fabric-dark' as *;
+@use 'dashboard-layout/fabric-dark' as *;
+@use 'timeline/fabric-dark' as *;

package/styles/fabric-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/fabric-lite.scss';
+@use 'ej2-layouts/fabric-lite' as *;

package/styles/fabric.scss

@@ -1,5 +1,5 @@
-@import 'avatar/fabric.scss';
-@import 'card/fabric.scss';
-@import 'splitter/fabric.scss';
-@import 'dashboard-layout/fabric.scss';
-@import 'timeline/fabric.scss';
+@use 'avatar/fabric' as *;
+@use 'card/fabric' as *;
+@use 'splitter/fabric' as *;
+@use 'dashboard-layout/fabric' as *;
+@use 'timeline/fabric' as *;

package/styles/fluent-dark-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/fluent-dark-lite.scss';
+@use 'ej2-layouts/fluent-dark-lite' as *;

package/styles/fluent-dark.scss

@@ -1,5 +1,5 @@
-@import 'avatar/fluent-dark.scss';
-@import 'card/fluent-dark.scss';
-@import 'splitter/fluent-dark.scss';
-@import 'dashboard-layout/fluent-dark.scss';
-@import 'timeline/fluent-dark.scss';
+@use 'avatar/fluent-dark' as *;
+@use 'card/fluent-dark' as *;
+@use 'splitter/fluent-dark' as *;
+@use 'dashboard-layout/fluent-dark' as *;
+@use 'timeline/fluent-dark' as *;

package/styles/fluent-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/fluent-lite.scss';
+@use 'ej2-layouts/fluent-lite' as *;

package/styles/fluent.scss

@@ -1,5 +1,5 @@
-@import 'avatar/fluent.scss';
-@import 'card/fluent.scss';
-@import 'splitter/fluent.scss';
-@import 'dashboard-layout/fluent.scss';
-@import 'timeline/fluent.scss';
+@use 'avatar/fluent' as *;
+@use 'card/fluent' as *;
+@use 'splitter/fluent' as *;
+@use 'dashboard-layout/fluent' as *;
+@use 'timeline/fluent' as *;

package/styles/fluent2-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/fluent2-lite.scss';
+@use 'ej2-layouts/fluent2-lite' as *;

package/styles/fluent2.scss

@@ -1,5 +1,5 @@
-@import 'avatar/fluent2.scss';
-@import 'card/fluent2.scss';
-@import 'splitter/fluent2.scss';
-@import 'dashboard-layout/fluent2.scss';
-@import 'timeline/fluent2.scss';
+@use 'avatar/fluent2' as *;
+@use 'card/fluent2' as *;
+@use 'splitter/fluent2' as *;
+@use 'dashboard-layout/fluent2' as *;
+@use 'timeline/fluent2' as *;

package/styles/highcontrast-light-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/highcontrast-light-lite.scss';
+@use 'ej2-layouts/highcontrast-light-lite' as *;

package/styles/highcontrast-light.scss

@@ -1,5 +1,5 @@
-@import 'avatar/highcontrast-light.scss';
-@import 'card/highcontrast-light.scss';
-@import 'splitter/highcontrast-light.scss';
-@import 'dashboard-layout/highcontrast-light.scss';
-@import 'timeline/highcontrast-light.scss';
+@use 'avatar/highcontrast-light' as *;
+@use 'card/highcontrast-light' as *;
+@use 'splitter/highcontrast-light' as *;
+@use 'dashboard-layout/highcontrast-light' as *;
+@use 'timeline/highcontrast-light' as *;

package/styles/highcontrast-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/highcontrast-lite.scss';
+@use 'ej2-layouts/highcontrast-lite' as *;

package/styles/highcontrast.scss

@@ -1,5 +1,5 @@
-@import 'avatar/highcontrast.scss';
-@import 'card/highcontrast.scss';
-@import 'splitter/highcontrast.scss';
-@import 'dashboard-layout/highcontrast.scss';
-@import 'timeline/highcontrast.scss';
+@use 'avatar/highcontrast' as *;
+@use 'card/highcontrast' as *;
+@use 'splitter/highcontrast' as *;
+@use 'dashboard-layout/highcontrast' as *;
+@use 'timeline/highcontrast' as *;

package/styles/material-dark-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/material-dark-lite.scss';
+@use 'ej2-layouts/material-dark-lite' as *;

package/styles/material-dark.scss

@@ -1,5 +1,5 @@
-@import 'avatar/material-dark.scss';
-@import 'card/material-dark.scss';
-@import 'splitter/material-dark.scss';
-@import 'dashboard-layout/material-dark.scss';
-@import 'timeline/material-dark.scss';
+@use 'avatar/material-dark' as *;
+@use 'card/material-dark' as *;
+@use 'splitter/material-dark' as *;
+@use 'dashboard-layout/material-dark' as *;
+@use 'timeline/material-dark' as *;

package/styles/material-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/material-lite.scss';
+@use 'ej2-layouts/material-lite' as *;

package/styles/material.scss

@@ -1,5 +1,5 @@
-@import 'avatar/material.scss';
-@import 'card/material.scss';
-@import 'splitter/material.scss';
-@import 'dashboard-layout/material.scss';
-@import 'timeline/material.scss';
+@use 'avatar/material' as *;
+@use 'card/material' as *;
+@use 'splitter/material' as *;
+@use 'dashboard-layout/material' as *;
+@use 'timeline/material' as *;

package/styles/material3-dark-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/material3-dark-lite.scss';
+@use 'ej2-layouts/material3-dark-lite' as *;

package/styles/material3-dark.scss

@@ -1,6 +1,5 @@
-
-@import 'avatar/material3-dark.scss';
-@import 'card/material3-dark.scss';
-@import 'splitter/material3-dark.scss';
-@import 'dashboard-layout/material3-dark.scss';
-@import 'timeline/material3-dark.scss';
+@use 'avatar/material3-dark' as *;
+@use 'card/material3-dark' as *;
+@use 'splitter/material3-dark' as *;
+@use 'dashboard-layout/material3-dark' as *;
+@use 'timeline/material3-dark' as *;

package/styles/material3-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/material3-lite.scss';
+@use 'ej2-layouts/material3-lite' as *;

package/styles/material3.scss

@@ -1,6 +1,5 @@
-
-@import 'avatar/material3.scss';
-@import 'card/material3.scss';
-@import 'splitter/material3.scss';
-@import 'dashboard-layout/material3.scss';
-@import 'timeline/material3.scss';
+@use 'avatar/material3' as *;
+@use 'card/material3' as *;
+@use 'splitter/material3' as *;
+@use 'dashboard-layout/material3' as *;
+@use 'timeline/material3' as *;

package/styles/splitter/bds.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/bds.scss';
+@use 'ej2-layouts/styles/splitter/bds' as *;

package/styles/splitter/bootstrap-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/bootstrap-dark.scss';
+@use 'ej2-layouts/styles/splitter/bootstrap-dark' as *;

package/styles/splitter/bootstrap.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/bootstrap.scss';
+@use 'ej2-layouts/styles/splitter/bootstrap' as *;

package/styles/splitter/bootstrap4.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/bootstrap4.scss';
+@use 'ej2-layouts/styles/splitter/bootstrap4' as *;

package/styles/splitter/bootstrap5-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/bootstrap5-dark.scss';
+@use 'ej2-layouts/styles/splitter/bootstrap5-dark' as *;

package/styles/splitter/bootstrap5.3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/bootstrap5.3.scss';
+@use 'ej2-layouts/styles/splitter/bootstrap5.3' as *;

package/styles/splitter/bootstrap5.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/bootstrap5.scss';
+@use 'ej2-layouts/styles/splitter/bootstrap5' as *;

package/styles/splitter/fabric-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/fabric-dark.scss';
+@use 'ej2-layouts/styles/splitter/fabric-dark' as *;

package/styles/splitter/fabric.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/fabric.scss';
+@use 'ej2-layouts/styles/splitter/fabric' as *;

package/styles/splitter/fluent-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/fluent-dark.scss';
+@use 'ej2-layouts/styles/splitter/fluent-dark' as *;

package/styles/splitter/fluent.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/fluent.scss';
+@use 'ej2-layouts/styles/splitter/fluent' as *;

package/styles/splitter/fluent2.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/fluent2.scss';
+@use 'ej2-layouts/styles/splitter/fluent2' as *;

package/styles/splitter/highcontrast-light.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/highcontrast-light.scss';
+@use 'ej2-layouts/styles/splitter/highcontrast-light' as *;

package/styles/splitter/highcontrast.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/highcontrast.scss';
+@use 'ej2-layouts/styles/splitter/highcontrast' as *;

package/styles/splitter/material-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/material-dark.scss';
+@use 'ej2-layouts/styles/splitter/material-dark' as *;

package/styles/splitter/material.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/material.scss';
+@use 'ej2-layouts/styles/splitter/material' as *;

package/styles/splitter/material3-dark.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/splitter/material3-dark.scss';
+@use 'ej2-layouts/styles/splitter/material3-dark' as *;

package/styles/splitter/material3.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/splitter/material3.scss';
+@use 'ej2-layouts/styles/splitter/material3' as *;

package/styles/splitter/tailwind-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/tailwind-dark.scss';
+@use 'ej2-layouts/styles/splitter/tailwind-dark' as *;

package/styles/splitter/tailwind.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/tailwind.scss';
+@use 'ej2-layouts/styles/splitter/tailwind' as *;

package/styles/splitter/tailwind3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/splitter/tailwind3.scss';
+@use 'ej2-layouts/styles/splitter/tailwind3' as *;

package/styles/tailwind-dark-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/tailwind-dark-lite.scss';
+@use 'ej2-layouts/tailwind-dark-lite' as *;

package/styles/tailwind-dark.scss

@@ -1,5 +1,5 @@
-@import 'avatar/tailwind-dark.scss';
-@import 'card/tailwind-dark.scss';
-@import 'splitter/tailwind-dark.scss';
-@import 'dashboard-layout/tailwind-dark.scss';
-@import 'timeline/tailwind-dark.scss';
+@use 'avatar/tailwind-dark' as *;
+@use 'card/tailwind-dark' as *;
+@use 'splitter/tailwind-dark' as *;
+@use 'dashboard-layout/tailwind-dark' as *;
+@use 'timeline/tailwind-dark' as *;

package/styles/tailwind-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/tailwind-lite.scss';
+@use 'ej2-layouts/tailwind-lite' as *;

package/styles/tailwind.scss

@@ -1,5 +1,5 @@
-@import 'avatar/tailwind.scss';
-@import 'card/tailwind.scss';
-@import 'splitter/tailwind.scss';
-@import 'dashboard-layout/tailwind.scss';
-@import 'timeline/tailwind.scss';
+@use 'avatar/tailwind' as *;
+@use 'card/tailwind' as *;
+@use 'splitter/tailwind' as *;
+@use 'dashboard-layout/tailwind' as *;
+@use 'timeline/tailwind' as *;

package/styles/tailwind3-lite.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/tailwind3-lite.scss';
+@use 'ej2-layouts/tailwind3-lite' as *;

package/styles/tailwind3.scss

@@ -1,5 +1,5 @@
-@import 'avatar/tailwind3.scss';
-@import 'card/tailwind3.scss';
-@import 'splitter/tailwind3.scss';
-@import 'dashboard-layout/tailwind3.scss';
-@import 'timeline/tailwind3.scss';
+@use 'avatar/tailwind3' as *;
+@use 'card/tailwind3' as *;
+@use 'splitter/tailwind3' as *;
+@use 'dashboard-layout/tailwind3' as *;
+@use 'timeline/tailwind3' as *;

package/styles/timeline/bds.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/bds.scss';
+@use 'ej2-layouts/styles/timeline/bds' as *;

package/styles/timeline/bootstrap-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/bootstrap-dark.scss';
+@use 'ej2-layouts/styles/timeline/bootstrap-dark' as *;

package/styles/timeline/bootstrap.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/bootstrap.scss';
+@use 'ej2-layouts/styles/timeline/bootstrap' as *;

package/styles/timeline/bootstrap4.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/bootstrap4.scss';
+@use 'ej2-layouts/styles/timeline/bootstrap4' as *;

package/styles/timeline/bootstrap5-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/bootstrap5-dark.scss';
+@use 'ej2-layouts/styles/timeline/bootstrap5-dark' as *;

package/styles/timeline/bootstrap5.3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/bootstrap5.3.scss';
+@use 'ej2-layouts/styles/timeline/bootstrap5.3' as *;

package/styles/timeline/bootstrap5.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/bootstrap5.scss';
+@use 'ej2-layouts/styles/timeline/bootstrap5' as *;

package/styles/timeline/fabric-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/fabric-dark.scss';
+@use 'ej2-layouts/styles/timeline/fabric-dark' as *;

package/styles/timeline/fabric.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/fabric.scss';
+@use 'ej2-layouts/styles/timeline/fabric' as *;

package/styles/timeline/fluent-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/fluent-dark.scss';
+@use 'ej2-layouts/styles/timeline/fluent-dark' as *;

package/styles/timeline/fluent.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/fluent.scss';
+@use 'ej2-layouts/styles/timeline/fluent' as *;

package/styles/timeline/fluent2.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/fluent2.scss';
+@use 'ej2-layouts/styles/timeline/fluent2' as *;

package/styles/timeline/highcontrast-light.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/highcontrast-light.scss';
+@use 'ej2-layouts/styles/timeline/highcontrast-light' as *;

package/styles/timeline/highcontrast.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/highcontrast.scss';
+@use 'ej2-layouts/styles/timeline/highcontrast' as *;

package/styles/timeline/material-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/material-dark.scss';
+@use 'ej2-layouts/styles/timeline/material-dark' as *;

package/styles/timeline/material.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/material.scss';
+@use 'ej2-layouts/styles/timeline/material' as *;

package/styles/timeline/material3-dark.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/timeline/material3-dark.scss';
+@use 'ej2-layouts/styles/timeline/material3-dark' as *;

package/styles/timeline/material3.scss

@@ -1,2 +1 @@
-
-@import 'ej2-layouts/styles/timeline/material3.scss';
+@use 'ej2-layouts/styles/timeline/material3' as *;

package/styles/timeline/tailwind-dark.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/tailwind-dark.scss';
+@use 'ej2-layouts/styles/timeline/tailwind-dark' as *;

package/styles/timeline/tailwind.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/tailwind.scss';
+@use 'ej2-layouts/styles/timeline/tailwind' as *;

package/styles/timeline/tailwind3.scss

@@ -1 +1 @@
-@import 'ej2-layouts/styles/timeline/tailwind3.scss';
+@use 'ej2-layouts/styles/timeline/tailwind3' as *;