@masterteam/components 0.0.29 → 0.0.31

package/assets/common.css

@@ -1,2 +1,2 @@
 /*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
-@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-yellow-50:oklch(98.7% .026 102.212);--color-yellow-600:oklch(68.1% .162 75.834);--color-yellow-700:oklch(55.4% .135 66.442);--color-green-50:oklch(98.2% .018 155.826);--color-green-600:oklch(62.7% .194 149.214);--color-green-700:oklch(52.7% .154 150.069);--color-blue-50:oklch(97% .014 254.604);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-600:oklch(55.8% .288 302.321);--color-purple-700:oklch(49.6% .265 301.924);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height:calc(1.5/1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--font-weight-medium:500;--font-weight-semibold:600;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--radius-2xl:1rem;--ease-in-out:cubic-bezier(.4,0,.2,1);--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components{label.required:after{content:"*";color:var(--p-red-500);padding-inline-start:2px}.dark label.required:after{color:var(--p-red-600)}}@layer utilities{.\@container{container-type:inline-size}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.static{position:static}.top-1\/2{top:50%}.top-full{top:100%}.right-0{right:calc(var(--spacing)*0)}.right-3{right:calc(var(--spacing)*3)}.z-10{z-index:10}.order-1{order:1}.col-span-6{grid-column:span 6/span 6}.m-0{margin:calc(var(--spacing)*0)}.ms-2{margin-inline-start:calc(var(--spacing)*2)}.mt-2{margin-top:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.table{display:table}.size-full{width:100%;height:100%}.h-full{height:100%}.w-12{width:calc(var(--spacing)*12)}.w-72{width:calc(var(--spacing)*72)}.w-full{width:100%}.min-w-full{min-width:100%}.flex-1{flex:1}.grow{flex-grow:1}.table-fixed{table-layout:fixed}.origin-top-right{transform-origin:100% 0}.-translate-y-1\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.resize{resize:both}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-row-reverse{flex-direction:row-reverse}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-2>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*2)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-x-reverse)))}:where(.space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*4)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-x-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px*var(--tw-divide-y-reverse));border-bottom-width:calc(1px*calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-gray-200>:not(:last-child)){border-color:var(--color-gray-200)}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-b-md{border-bottom-right-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.border,.border-1{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\(--p-content-border-color\){border-color:var(--p-content-border-color)}.border-gray-300{border-color:var(--color-gray-300)}.border-gray-500{border-color:var(--color-gray-500)}.border-primary-400{border-color:var(--p-primary-400)}@supports (color:color-mix(in lab, red, red)){.border-primary-400{border-color:color-mix(in srgb,var(--p-primary-400)calc(100%*1),transparent)}}.border-surface{border-color:var(--p-content-border-color)}.border-surface-200{border-color:var(--p-surface-200)}@supports (color:color-mix(in lab, red, red)){.border-surface-200{border-color:color-mix(in srgb,var(--p-surface-200)calc(100%*1),transparent)}}.border-surface-300{border-color:var(--p-surface-300)}@supports (color:color-mix(in lab, red, red)){.border-surface-300{border-color:color-mix(in srgb,var(--p-surface-300)calc(100%*1),transparent)}}.\!bg-white{background-color:var(--color-white)!important}.bg-content{background-color:var(--p-content-background)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-primary-50{background-color:var(--p-primary-50)}@supports (color:color-mix(in lab, red, red)){.bg-primary-50{background-color:color-mix(in srgb,var(--p-primary-50)calc(100%*1),transparent)}}.bg-surface-50{background-color:var(--p-surface-50)}@supports (color:color-mix(in lab, red, red)){.bg-surface-50{background-color:color-mix(in srgb,var(--p-surface-50)calc(100%*1),transparent)}}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-8{padding:calc(var(--spacing)*8)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-5{padding-inline:calc(var(--spacing)*5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-3{padding-block:calc(var(--spacing)*3)}.py-5{padding-block:calc(var(--spacing)*5)}.text-center{text-align:center}.text-end{text-align:end}.text-right{text-align:right}.text-start{text-align:start}.align-middle{vertical-align:middle}.align-super\!{vertical-align:super!important}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[\.95rem\]{font-size:.95rem}.leading-none{--tw-leading:1;line-height:1}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.text-blue-600{color:var(--color-blue-600)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-900{color:var(--color-gray-900)}.text-green-600{color:var(--color-green-600)}.text-muted-color{color:var(--p-text-muted-color)}.text-primary-400{color:var(--p-primary-400)}@supports (color:color-mix(in lab, red, red)){.text-primary-400{color:color-mix(in srgb,var(--p-primary-400)calc(100%*1),transparent)}}.text-purple-600{color:var(--color-purple-600)}.text-red-600{color:var(--color-red-600)}.text-surface-500{color:var(--p-surface-500)}@supports (color:color-mix(in lab, red, red)){.text-surface-500{color:color-mix(in srgb,var(--p-surface-500)calc(100%*1),transparent)}}.text-yellow-600{color:var(--color-yellow-600)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.opacity-50{opacity:.5}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-black{--tw-ring-color:var(--color-black)}.ring-primary-200{--tw-ring-color:var(--p-primary-200)}@supports (color:color-mix(in lab, red, red)){.ring-primary-200{--tw-ring-color:color-mix(in srgb,var(--p-primary-200)calc(100%*1),transparent)}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}@media (hover:hover){.hover\:border-gray-400:hover{border-color:var(--color-gray-400)}.hover\:bg-blue-50:hover{background-color:var(--color-blue-50)}.hover\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\:bg-green-50:hover{background-color:var(--color-green-50)}.hover\:bg-purple-50:hover{background-color:var(--color-purple-50)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\:bg-yellow-50:hover{background-color:var(--color-yellow-50)}.hover\:text-blue-700:hover{color:var(--color-blue-700)}.hover\:text-gray-600:hover{color:var(--color-gray-600)}.hover\:text-gray-700:hover{color:var(--color-gray-700)}.hover\:text-green-700:hover{color:var(--color-green-700)}.hover\:text-purple-700:hover{color:var(--color-purple-700)}.hover\:text-red-700:hover{color:var(--color-red-700)}.hover\:text-yellow-700:hover{color:var(--color-yellow-700)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}@container (min-width:28rem){.\@md\:col-span-3{grid-column:span 3/span 3}}@container (min-width:42rem){.\@2xl\:col-span-2{grid-column:span 2/span 2}}.dark\:border-surface-500:where(.dark,.dark *){border-color:var(--p-surface-500)}@supports (color:color-mix(in lab, red, red)){.dark\:border-surface-500:where(.dark,.dark *){border-color:color-mix(in srgb,var(--p-surface-500)calc(100%*1),transparent)}}.dark\:bg-primary-800:where(.dark,.dark *){background-color:var(--p-primary-800)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-primary-800:where(.dark,.dark *){background-color:color-mix(in srgb,var(--p-primary-800)calc(100%*1),transparent)}}.dark\:bg-surface-950:where(.dark,.dark *){background-color:var(--p-surface-950)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-surface-950:where(.dark,.dark *){background-color:color-mix(in srgb,var(--p-surface-950)calc(100%*1),transparent)}}.dark\:text-gray-50:where(.dark,.dark *){color:var(--color-gray-50)}.dark\:text-gray-100:where(.dark,.dark *){color:var(--color-gray-100)}.dark\:text-gray-200:where(.dark,.dark *){color:var(--color-gray-200)}@media (hover:hover){.dark\:hover\:bg-gray-800:where(.dark,.dark *):hover{background-color:var(--color-gray-800)}.dark\:hover\:bg-surface-950:where(.dark,.dark *):hover{background-color:var(--p-surface-950)}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-surface-950:where(.dark,.dark *):hover{background-color:color-mix(in srgb,var(--p-surface-950)calc(100%*1),transparent)}}.dark\:hover\:text-gray-100:where(.dark,.dark *):hover{color:var(--color-gray-100)}}}:root{--app-background:var(--p-surface-100)}:root[class=dark]{--app-background:var(--p-surface-950)}body{background-color:var(--app-background)}.mt-dialog .p-dialog-header{background-color:var(--p-surface-100);border-radius:.75rem .75rem 0 0;padding:1rem 1.25rem}.mt-dialog .p-dialog-header .p-dialog-header-actions .p-dialog-close-button{background-color:#fff;border-radius:.3rem;justify-content:center;width:2rem;height:2rem}.mt-dialog .p-dialog-content{border-radius:.8rem;height:100%;overflow-y:hidden}.mt-dialog .p-dialog-content .mt-dialog-content{height:100%;padding-bottom:5rem;overflow:auto}.mt-dialog .p-dialog-content .mt-dialog-footer{background-color:var(--p-surface-100);justify-content:end;gap:10px;padding:.8rem 1.25rem;display:flex;position:sticky;bottom:0}.custom-drawer .p-drawer-header,.custom-drawer .p-drawer-content,.custom-drawer .p-drawer-footer{padding:0}@keyframes enter{0%{opacity:var(--p-enter-opacity,1);transform:translate3d(var(--p-enter-translate-x,0),var(--p-enter-translate-y,0),0)scale3d(var(--p-enter-scale,1),var(--p-enter-scale,1),var(--p-enter-scale,1))rotate(var(--p-enter-rotate,0))}}@keyframes leave{to{opacity:var(--p-leave-opacity,1);transform:translate3d(var(--p-leave-translate-x,0),var(--p-leave-translate-y,0),0)scale3d(var(--p-leave-scale,1),var(--p-leave-scale,1),var(--p-leave-scale,1))rotate(var(--p-leave-rotate,0))}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-yellow-50:oklch(98.7% .026 102.212);--color-yellow-600:oklch(68.1% .162 75.834);--color-yellow-700:oklch(55.4% .135 66.442);--color-green-50:oklch(98.2% .018 155.826);--color-green-600:oklch(62.7% .194 149.214);--color-green-700:oklch(52.7% .154 150.069);--color-blue-50:oklch(97% .014 254.604);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-600:oklch(55.8% .288 302.321);--color-purple-700:oklch(49.6% .265 301.924);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height:calc(1.5/1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--font-weight-medium:500;--font-weight-semibold:600;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--radius-2xl:1rem;--ease-in-out:cubic-bezier(.4,0,.2,1);--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components{label.required:after{content:"*";color:var(--p-red-500);padding-inline-start:2px}.dark label.required:after{color:var(--p-red-600)}}@layer utilities{.\@container{container-type:inline-size}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.static{position:static}.top-1\/2{top:50%}.top-full{top:100%}.right-0{right:calc(var(--spacing)*0)}.right-3{right:calc(var(--spacing)*3)}.z-10{z-index:10}.order-1{order:1}.col-span-6{grid-column:span 6/span 6}.m-0{margin:calc(var(--spacing)*0)}.ms-2{margin-inline-start:calc(var(--spacing)*2)}.mt-2{margin-top:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.table{display:table}.size-full{width:100%;height:100%}.h-full{height:100%}.w-12{width:calc(var(--spacing)*12)}.w-72{width:calc(var(--spacing)*72)}.w-full{width:100%}.min-w-full{min-width:100%}.flex-1{flex:1}.grow{flex-grow:1}.table-fixed{table-layout:fixed}.origin-top-right{transform-origin:100% 0}.-translate-y-1\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.resize{resize:both}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-row-reverse{flex-direction:row-reverse}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-2>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*2)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-x-reverse)))}:where(.space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*4)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-x-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px*var(--tw-divide-y-reverse));border-bottom-width:calc(1px*calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-gray-200>:not(:last-child)){border-color:var(--color-gray-200)}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-b-md{border-bottom-right-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.border,.border-1{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\(--p-content-border-color\){border-color:var(--p-content-border-color)}.border-gray-300{border-color:var(--color-gray-300)}.border-gray-500{border-color:var(--color-gray-500)}.border-primary-400{border-color:var(--p-primary-400)}@supports (color:color-mix(in lab, red, red)){.border-primary-400{border-color:color-mix(in srgb,var(--p-primary-400)calc(100%*1),transparent)}}.border-surface{border-color:var(--p-content-border-color)}.border-surface-200{border-color:var(--p-surface-200)}@supports (color:color-mix(in lab, red, red)){.border-surface-200{border-color:color-mix(in srgb,var(--p-surface-200)calc(100%*1),transparent)}}.border-surface-300{border-color:var(--p-surface-300)}@supports (color:color-mix(in lab, red, red)){.border-surface-300{border-color:color-mix(in srgb,var(--p-surface-300)calc(100%*1),transparent)}}.\!bg-white{background-color:var(--color-white)!important}.bg-content{background-color:var(--p-content-background)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-primary-50{background-color:var(--p-primary-50)}@supports (color:color-mix(in lab, red, red)){.bg-primary-50{background-color:color-mix(in srgb,var(--p-primary-50)calc(100%*1),transparent)}}.bg-surface-50{background-color:var(--p-surface-50)}@supports (color:color-mix(in lab, red, red)){.bg-surface-50{background-color:color-mix(in srgb,var(--p-surface-50)calc(100%*1),transparent)}}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-8{padding:calc(var(--spacing)*8)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-5{padding-inline:calc(var(--spacing)*5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-3{padding-block:calc(var(--spacing)*3)}.py-5{padding-block:calc(var(--spacing)*5)}.text-center{text-align:center}.text-end{text-align:end}.text-right{text-align:right}.text-start{text-align:start}.align-middle{vertical-align:middle}.align-super\!{vertical-align:super!important}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[\.95rem\]{font-size:.95rem}.leading-none{--tw-leading:1;line-height:1}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.text-blue-600{color:var(--color-blue-600)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-900{color:var(--color-gray-900)}.text-green-600{color:var(--color-green-600)}.text-muted-color{color:var(--p-text-muted-color)}.text-primary-400{color:var(--p-primary-400)}@supports (color:color-mix(in lab, red, red)){.text-primary-400{color:color-mix(in srgb,var(--p-primary-400)calc(100%*1),transparent)}}.text-primary-700{color:var(--p-primary-700)}@supports (color:color-mix(in lab, red, red)){.text-primary-700{color:color-mix(in srgb,var(--p-primary-700)calc(100%*1),transparent)}}.text-purple-600{color:var(--color-purple-600)}.text-red-600{color:var(--color-red-600)}.text-surface-500{color:var(--p-surface-500)}@supports (color:color-mix(in lab, red, red)){.text-surface-500{color:color-mix(in srgb,var(--p-surface-500)calc(100%*1),transparent)}}.text-yellow-600{color:var(--color-yellow-600)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.opacity-50{opacity:.5}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-black{--tw-ring-color:var(--color-black)}.ring-primary-200{--tw-ring-color:var(--p-primary-200)}@supports (color:color-mix(in lab, red, red)){.ring-primary-200{--tw-ring-color:color-mix(in srgb,var(--p-primary-200)calc(100%*1),transparent)}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}@media (hover:hover){.hover\:border-gray-400:hover{border-color:var(--color-gray-400)}.hover\:bg-blue-50:hover{background-color:var(--color-blue-50)}.hover\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\:bg-green-50:hover{background-color:var(--color-green-50)}.hover\:bg-purple-50:hover{background-color:var(--color-purple-50)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\:bg-yellow-50:hover{background-color:var(--color-yellow-50)}.hover\:text-blue-700:hover{color:var(--color-blue-700)}.hover\:text-gray-600:hover{color:var(--color-gray-600)}.hover\:text-gray-700:hover{color:var(--color-gray-700)}.hover\:text-green-700:hover{color:var(--color-green-700)}.hover\:text-purple-700:hover{color:var(--color-purple-700)}.hover\:text-red-700:hover{color:var(--color-red-700)}.hover\:text-yellow-700:hover{color:var(--color-yellow-700)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}@container (min-width:28rem){.\@md\:col-span-3{grid-column:span 3/span 3}}@container (min-width:42rem){.\@2xl\:col-span-2{grid-column:span 2/span 2}}.dark\:border-surface-500:where(.dark,.dark *){border-color:var(--p-surface-500)}@supports (color:color-mix(in lab, red, red)){.dark\:border-surface-500:where(.dark,.dark *){border-color:color-mix(in srgb,var(--p-surface-500)calc(100%*1),transparent)}}.dark\:bg-primary-800:where(.dark,.dark *){background-color:var(--p-primary-800)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-primary-800:where(.dark,.dark *){background-color:color-mix(in srgb,var(--p-primary-800)calc(100%*1),transparent)}}.dark\:bg-primary-900\/20:where(.dark,.dark *){background-color:var(--p-primary-900)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-primary-900\/20:where(.dark,.dark *){background-color:color-mix(in oklab,color-mix(in srgb,var(--p-primary-900)calc(100%*1),transparent)20%,transparent)}}.dark\:bg-surface-950:where(.dark,.dark *){background-color:var(--p-surface-950)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-surface-950:where(.dark,.dark *){background-color:color-mix(in srgb,var(--p-surface-950)calc(100%*1),transparent)}}.dark\:text-gray-50:where(.dark,.dark *){color:var(--color-gray-50)}.dark\:text-gray-100:where(.dark,.dark *){color:var(--color-gray-100)}.dark\:text-gray-200:where(.dark,.dark *){color:var(--color-gray-200)}.dark\:text-primary-300:where(.dark,.dark *){color:var(--p-primary-300)}@supports (color:color-mix(in lab, red, red)){.dark\:text-primary-300:where(.dark,.dark *){color:color-mix(in srgb,var(--p-primary-300)calc(100%*1),transparent)}}@media (hover:hover){.dark\:hover\:bg-gray-800:where(.dark,.dark *):hover{background-color:var(--color-gray-800)}.dark\:hover\:bg-surface-950:where(.dark,.dark *):hover{background-color:var(--p-surface-950)}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-surface-950:where(.dark,.dark *):hover{background-color:color-mix(in srgb,var(--p-surface-950)calc(100%*1),transparent)}}.dark\:hover\:text-gray-100:where(.dark,.dark *):hover{color:var(--color-gray-100)}}}:root{--app-background:var(--p-surface-100)}:root[class=dark]{--app-background:var(--p-surface-950)}body{background-color:var(--app-background)}.mt-dialog .p-dialog-header{background-color:var(--p-surface-100);border-radius:.75rem .75rem 0 0;padding:1rem 1.25rem}.mt-dialog .p-dialog-header .p-dialog-header-actions .p-dialog-close-button{background-color:#fff;border-radius:.3rem;justify-content:center;width:2rem;height:2rem}.mt-dialog .p-dialog-content{border-radius:.8rem;height:100%;overflow-y:hidden}.mt-dialog .p-dialog-content .mt-modal-content{height:100%;padding-bottom:5rem;overflow:auto}.mt-dialog .p-dialog-content .mt-modal-footer{background-color:var(--p-surface-100);justify-content:end;gap:10px;padding:.8rem 1.25rem;display:flex;position:sticky;bottom:0}.mt-drawer .p-drawer-content .mt-modal-content{height:calc(100% - 60px);overflow:auto}.mt-drawer .p-drawer-content .mt-modal-footer{border-top:1px solid var(--p-surface-200);justify-content:flex-end;gap:.5rem;height:15rem;padding:.75rem;display:flex}.mt-custom-drawer .p-drawer-header,.mt-custom-drawer .p-drawer-content,.mt-custom-drawer .p-drawer-footer,.mt-drawer .p-drawer-header,.mt-drawer .p-drawer-content,.mt-drawer .p-drawer-footer{padding:0}.mt-drawer .p-drawer-content,body:has(:is(.p-dialog-mask.p-overlay-mask,.p-drawer-mask.p-overlay-mask)){overflow:hidden}@keyframes enter{0%{opacity:var(--p-enter-opacity,1);transform:translate3d(var(--p-enter-translate-x,0),var(--p-enter-translate-y,0),0)scale3d(var(--p-enter-scale,1),var(--p-enter-scale,1),var(--p-enter-scale,1))rotate(var(--p-enter-rotate,0))}}@keyframes leave{to{opacity:var(--p-leave-opacity,1);transform:translate3d(var(--p-leave-translate-x,0),var(--p-leave-translate-y,0),0)scale3d(var(--p-leave-scale,1),var(--p-leave-scale,1),var(--p-leave-scale,1))rotate(var(--p-leave-rotate,0))}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}

package/dialog/index.d.ts

@@ -1,10 +1,8 @@
 import { DialogService as DialogService$1, DynamicDialogRef, DynamicDialogConfig } from 'primeng/dynamicdialog';
-export { DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog';
+export { DynamicDialogConfig, DynamicDialogRef, DynamicDialogRef as ModalRef } from 'primeng/dynamicdialog';
 import * as i0 from '@angular/core';
 
 declare class DialogService extends DialogService$1 {
-    footerClass: string;
-    contentClass: string;
     ref: DynamicDialogRef | undefined;
     open(component: any, config?: DynamicDialogConfig): DynamicDialogRef<any>;
     static ɵfac: i0.ɵɵFactoryDeclaration<DialogService, never>;

package/dynamic-drawer/index.d.ts

@@ -0,0 +1,52 @@
+import * as _angular_core from '@angular/core';
+import { Type, InjectionToken, Injector } from '@angular/core';
+import { DynamicDialogRef } from 'primeng/dynamicdialog';
+
+interface DynamicDrawerConfigInterface {
+    header?: string;
+    position?: string;
+    data?: any;
+    fullScreen?: boolean;
+    modal?: boolean;
+    closable?: boolean;
+    closeOnEscape?: boolean;
+    dismissible?: boolean;
+    appendTo?: any;
+    transitionOptions?: string;
+    styleClass?: string;
+    inputValues?: any;
+}
+declare class DrawerService {
+    private appRef;
+    private env;
+    private rootInjector;
+    private destroyRef;
+    private doc;
+    private hostRef?;
+    defauiltConfig: DynamicDrawerConfigInterface;
+    open<T>(component: Type<any>, config?: DynamicDrawerConfigInterface): DynamicDialogRef<T>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DrawerService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<DrawerService>;
+}
+
+declare const DynamicDrawerConfig: InjectionToken<any>;
+declare class DynamicDrawerHost {
+    visible: _angular_core.ModelSignal<boolean>;
+    cmp: _angular_core.WritableSignal<any>;
+    cfg: _angular_core.WritableSignal<any>;
+    cmpInputs: _angular_core.WritableSignal<Record<string, unknown>>;
+    childInjector: Injector;
+    private ref?;
+    connect(opts: {
+        component: any;
+        config?: any;
+        parent: Injector;
+        ref: DynamicDialogRef;
+    }): void;
+    handleHide(data?: null): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DynamicDrawerHost, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DynamicDrawerHost, "mt-dynamic-drawer-host", never, { "visible": { "alias": "visible"; "required": false; "isSignal": true; }; "connect": { "alias": "connect"; "required": true; }; }, { "visible": "visibleChange"; }, never, never, true, never>;
+}
+
+export { DrawerService, DynamicDrawerConfig, DynamicDrawerHost };
+export type { DynamicDrawerConfigInterface };

package/fesm2022/masterteam-components-dialog.mjs

@@ -1,11 +1,9 @@
 import { DialogService as DialogService$1 } from 'primeng/dynamicdialog';
-export { DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog';
+export { DynamicDialogConfig, DynamicDialogRef, DynamicDialogRef as ModalRef } from 'primeng/dynamicdialog';
 import * as i0 from '@angular/core';
 import { Injectable } from '@angular/core';
 
 class DialogService extends DialogService$1 {
-    footerClass = 'mt-dialog-footer';
-    contentClass = 'mt-dialog-content';
     ref;
     open(component, config) {
         const defaultConfig = {
@@ -20,10 +18,11 @@ class DialogService extends DialogService$1 {
         return this.ref;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DialogService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DialogService });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DialogService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DialogService, decorators: [{
-            type: Injectable
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }] });
 
 /**

package/fesm2022/masterteam-components-dialog.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"masterteam-components-dialog.mjs","sources":["../../../../packages/masterteam/components/dialog/dialog.ts","../../../../packages/masterteam/components/dialog/masterteam-components-dialog.ts"],"sourcesContent":["import {\n  DialogService as PrimeNGDialogService,\n  DynamicDialogConfig,\n  DynamicDialogRef,\n} from 'primeng/dynamicdialog';\nimport { Injectable } from '@angular/core';\nexport { DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog';\n\n@Injectable()\nexport class DialogService extends PrimeNGDialogService {\n  footerClass: string = 'mt-dialog-footer';\n  contentClass: string = 'mt-dialog-content';\n  ref: DynamicDialogRef | undefined;\n\n  override open(component: any, config?: DynamicDialogConfig) {\n    const defaultConfig = {\n      closable: true,\n      modal: true,\n    };\n    this.ref = super.open(component, {\n      ...defaultConfig,\n      ...config,\n      styleClass: 'mt-dialog ' + config?.styleClass,\n    });\n    return this.ref;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["PrimeNGDialogService"],"mappings":";;;;;AASM,MAAO,aAAc,SAAQA,eAAoB,CAAA;IACrD,WAAW,GAAW,kBAAkB;IACxC,YAAY,GAAW,mBAAmB;AAC1C,IAAA,GAAG;IAEM,IAAI,CAAC,SAAc,EAAE,MAA4B,EAAA;AACxD,QAAA,MAAM,aAAa,GAAG;AACpB,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,KAAK,EAAE,IAAI;SACZ;QACD,IAAI,CAAC,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,EAAE;AAC/B,YAAA,GAAG,aAAa;AAChB,YAAA,GAAG,MAAM;AACT,YAAA,UAAU,EAAE,YAAY,GAAG,MAAM,EAAE,UAAU;AAC9C,SAAA,CAAC;QACF,OAAO,IAAI,CAAC,GAAG;IACjB;uGAhBW,aAAa,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;2GAAb,aAAa,EAAA,CAAA;;2FAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBADzB;;;ACRD;;AAEG;;;;"}
+{"version":3,"file":"masterteam-components-dialog.mjs","sources":["../../../../packages/masterteam/components/dialog/dialog.ts","../../../../packages/masterteam/components/dialog/masterteam-components-dialog.ts"],"sourcesContent":["import {\n  DialogService as PrimeNGDialogService,\n  DynamicDialogConfig,\n  DynamicDialogRef,\n} from 'primeng/dynamicdialog';\nimport { Injectable } from '@angular/core';\nexport {\n  DynamicDialogConfig,\n  DynamicDialogRef as ModalRef,\n} from 'primeng/dynamicdialog';\nexport { DynamicDialogRef } from 'primeng/dynamicdialog';\n\n@Injectable({ providedIn: 'root' })\nexport class DialogService extends PrimeNGDialogService {\n  ref: DynamicDialogRef | undefined;\n\n  override open(component: any, config?: DynamicDialogConfig) {\n    const defaultConfig = {\n      closable: true,\n      modal: true,\n    };\n    this.ref = super.open(component, {\n      ...defaultConfig,\n      ...config,\n      styleClass: 'mt-dialog ' + config?.styleClass,\n    });\n    return this.ref;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["PrimeNGDialogService"],"mappings":";;;;;AAaM,MAAO,aAAc,SAAQA,eAAoB,CAAA;AACrD,IAAA,GAAG;IAEM,IAAI,CAAC,SAAc,EAAE,MAA4B,EAAA;AACxD,QAAA,MAAM,aAAa,GAAG;AACpB,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,KAAK,EAAE,IAAI;SACZ;QACD,IAAI,CAAC,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,EAAE;AAC/B,YAAA,GAAG,aAAa;AAChB,YAAA,GAAG,MAAM;AACT,YAAA,UAAU,EAAE,YAAY,GAAG,MAAM,EAAE,UAAU;AAC9C,SAAA,CAAC;QACF,OAAO,IAAI,CAAC,GAAG;IACjB;uGAdW,aAAa,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAb,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,cADA,MAAM,EAAA,CAAA;;2FACnB,aAAa,EAAA,UAAA,EAAA,CAAA;kBADzB,UAAU;mBAAC,EAAE,UAAU,EAAE,MAAM,EAAE;;;ACZlC;;AAEG;;;;"}

package/fesm2022/masterteam-components-drawer.mjs

@@ -35,11 +35,11 @@ class Drawer {
         this.onHide.emit(true);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Drawer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.3", type: Drawer, isStandalone: true, selector: "mt-drawer", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, blockScroll: { classPropertyName: "blockScroll", publicName: "blockScroll", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, transitionOptions: { classPropertyName: "transitionOptions", publicName: "transitionOptions", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", visibleChange: "visibleChange", onShow: "onShow", onHide: "onHide" }, ngImport: i0, template: "<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\n  [closeOnEscape]=\"closeOnEscape()\"\n  [blockScroll]=\"blockScroll()\"\n  [dismissible]=\"dismissible()\"\n  [appendTo]=\"appendTo()\"\n  [transitionOptions]=\"transitionOptions()\"\n  [styleClass]=\"styleClass() + ' custom-drawer'\"\n  (visibleChange)=\"visibleChangeEvent($event)\"\n  (onShow)=\"onShowEvent()\"\n  (onHide)=\"onHideEvent()\"\n>\n  <ng-template #header>\n    <div\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\n    >\n      <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n      <mt-button\n        (onClick)=\"onClose()\"\n        variant=\"outlined\"\n        styleClass=\"!bg-white\"\n        icon=\"general.x-close\"\n        severity=\"secondary\"\n      >\n      </mt-button>\n    </div>\n  </ng-template>\n\n  <ng-content select=\"[content]\"></ng-content>\n\n  <ng-template #footer>\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </ng-template>\n</p-drawer>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i1.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.3", type: Drawer, isStandalone: true, selector: "mt-drawer", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, blockScroll: { classPropertyName: "blockScroll", publicName: "blockScroll", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, transitionOptions: { classPropertyName: "transitionOptions", publicName: "transitionOptions", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", visibleChange: "visibleChange", onShow: "onShow", onHide: "onHide" }, ngImport: i0, template: "<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\n  [closeOnEscape]=\"closeOnEscape()\"\n  [blockScroll]=\"blockScroll()\"\n  [dismissible]=\"dismissible()\"\n  [appendTo]=\"appendTo()\"\n  [transitionOptions]=\"transitionOptions()\"\n  [styleClass]=\"styleClass() + ' mt-custom-drawer'\"\n  (visibleChange)=\"visibleChangeEvent($event)\"\n  (onShow)=\"onShowEvent()\"\n  (onHide)=\"onHideEvent()\"\n>\n  <ng-template #header>\n    <div\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\n    >\n      <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n      <mt-button\n        (onClick)=\"onClose()\"\n        variant=\"outlined\"\n        styleClass=\"!bg-white\"\n        icon=\"general.x-close\"\n        severity=\"secondary\"\n      >\n      </mt-button>\n    </div>\n  </ng-template>\n\n  <ng-content select=\"[content]\"></ng-content>\n\n  <ng-template #footer>\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </ng-template>\n</p-drawer>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i1.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Drawer, decorators: [{
             type: Component,
-            args: [{ selector: 'mt-drawer', standalone: true, imports: [CommonModule, DrawerModule, Button], template: "<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\n  [closeOnEscape]=\"closeOnEscape()\"\n  [blockScroll]=\"blockScroll()\"\n  [dismissible]=\"dismissible()\"\n  [appendTo]=\"appendTo()\"\n  [transitionOptions]=\"transitionOptions()\"\n  [styleClass]=\"styleClass() + ' custom-drawer'\"\n  (visibleChange)=\"visibleChangeEvent($event)\"\n  (onShow)=\"onShowEvent()\"\n  (onHide)=\"onHideEvent()\"\n>\n  <ng-template #header>\n    <div\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\n    >\n      <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n      <mt-button\n        (onClick)=\"onClose()\"\n        variant=\"outlined\"\n        styleClass=\"!bg-white\"\n        icon=\"general.x-close\"\n        severity=\"secondary\"\n      >\n      </mt-button>\n    </div>\n  </ng-template>\n\n  <ng-content select=\"[content]\"></ng-content>\n\n  <ng-template #footer>\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </ng-template>\n</p-drawer>\n" }]
+            args: [{ selector: 'mt-drawer', standalone: true, imports: [CommonModule, DrawerModule, Button], template: "<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\n  [closeOnEscape]=\"closeOnEscape()\"\n  [blockScroll]=\"blockScroll()\"\n  [dismissible]=\"dismissible()\"\n  [appendTo]=\"appendTo()\"\n  [transitionOptions]=\"transitionOptions()\"\n  [styleClass]=\"styleClass() + ' mt-custom-drawer'\"\n  (visibleChange)=\"visibleChangeEvent($event)\"\n  (onShow)=\"onShowEvent()\"\n  (onHide)=\"onHideEvent()\"\n>\n  <ng-template #header>\n    <div\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\n    >\n      <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n      <mt-button\n        (onClick)=\"onClose()\"\n        variant=\"outlined\"\n        styleClass=\"!bg-white\"\n        icon=\"general.x-close\"\n        severity=\"secondary\"\n      >\n      </mt-button>\n    </div>\n  </ng-template>\n\n  <ng-content select=\"[content]\"></ng-content>\n\n  <ng-template #footer>\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </ng-template>\n</p-drawer>\n" }]
         }] });
 
 /**

package/fesm2022/masterteam-components-drawer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"masterteam-components-drawer.mjs","sources":["../../../../packages/masterteam/components/drawer/drawer.ts","../../../../packages/masterteam/components/drawer/drawer.html","../../../../packages/masterteam/components/drawer/masterteam-components-drawer.ts"],"sourcesContent":["import { Button } from '@masterteam/components/button';\nimport { Component, input, output, model } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { DrawerModule } from 'primeng/drawer';\n\n@Component({\n  selector: 'mt-drawer',\n  standalone: true,\n  imports: [CommonModule, DrawerModule, Button],\n  templateUrl: './drawer.html',\n  styleUrls: ['./drawer.scss'],\n})\nexport class Drawer {\n  visible = model<boolean>(false);\n  visibleChange = output<boolean>();\n  onShow = output<boolean>();\n  onHide = output<boolean>();\n  position = input<'left' | 'right' | 'top' | 'bottom'>('right');\n  fullScreen = input<boolean>(false);\n  closeOnEscape = input<boolean>(false);\n  blockScroll = input<boolean>(true);\n  dismissible = input<boolean>(true);\n  title = input<string>('');\n  styleClass = input<string>('');\n  transitionOptions = input<string>('200ms cubic-bezier(0, 0, 1, 1)');\n  appendTo = input<string>('body');\n  modal = input<boolean>(true);\n\n  visibleChangeEvent(event: boolean) {\n    this.visibleChange.emit(event);\n  }\n\n  onClose() {\n    this.visible.set(false);\n    this.visibleChange.emit(false);\n    this.onHide.emit(true);\n  }\n  onShowEvent() {\n    this.onShow.emit(true);\n  }\n  onHideEvent() {\n    this.onHide.emit(true);\n  }\n}\n","<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\n  [closeOnEscape]=\"closeOnEscape()\"\n  [blockScroll]=\"blockScroll()\"\n  [dismissible]=\"dismissible()\"\n  [appendTo]=\"appendTo()\"\n  [transitionOptions]=\"transitionOptions()\"\n  [styleClass]=\"styleClass() + ' custom-drawer'\"\n  (visibleChange)=\"visibleChangeEvent($event)\"\n  (onShow)=\"onShowEvent()\"\n  (onHide)=\"onHideEvent()\"\n>\n  <ng-template #header>\n    <div\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\n    >\n      <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n      <mt-button\n        (onClick)=\"onClose()\"\n        variant=\"outlined\"\n        styleClass=\"!bg-white\"\n        icon=\"general.x-close\"\n        severity=\"secondary\"\n      >\n      </mt-button>\n    </div>\n  </ng-template>\n\n  <ng-content select=\"[content]\"></ng-content>\n\n  <ng-template #footer>\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </ng-template>\n</p-drawer>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAYa,MAAM,CAAA;AACjB,IAAA,OAAO,GAAG,KAAK,CAAU,KAAK,mDAAC;IAC/B,aAAa,GAAG,MAAM,EAAW;IACjC,MAAM,GAAG,MAAM,EAAW;IAC1B,MAAM,GAAG,MAAM,EAAW;AAC1B,IAAA,QAAQ,GAAG,KAAK,CAAsC,OAAO,oDAAC;AAC9D,IAAA,UAAU,GAAG,KAAK,CAAU,KAAK,sDAAC;AAClC,IAAA,aAAa,GAAG,KAAK,CAAU,KAAK,yDAAC;AACrC,IAAA,WAAW,GAAG,KAAK,CAAU,IAAI,uDAAC;AAClC,IAAA,WAAW,GAAG,KAAK,CAAU,IAAI,uDAAC;AAClC,IAAA,KAAK,GAAG,KAAK,CAAS,EAAE,iDAAC;AACzB,IAAA,UAAU,GAAG,KAAK,CAAS,EAAE,sDAAC;AAC9B,IAAA,iBAAiB,GAAG,KAAK,CAAS,gCAAgC,6DAAC;AACnE,IAAA,QAAQ,GAAG,KAAK,CAAS,MAAM,oDAAC;AAChC,IAAA,KAAK,GAAG,KAAK,CAAU,IAAI,iDAAC;AAE5B,IAAA,kBAAkB,CAAC,KAAc,EAAA;AAC/B,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;IAChC;IAEA,OAAO,GAAA;AACL,QAAA,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;AACvB,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;AAC9B,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;IACxB;IACA,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;IACxB;IACA,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;IACxB;uGA9BW,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAN,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAM,0nDCZnB,kqCAwCA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDhCY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,YAAY,kaAAE,MAAM,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,MAAA,EAAA,YAAA,EAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,eAAA,EAAA,MAAA,EAAA,SAAA,EAAA,WAAA,EAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIjC,MAAM,EAAA,UAAA,EAAA,CAAA;kBAPlB,SAAS;+BACE,WAAW,EAAA,UAAA,EACT,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,YAAY,EAAE,MAAM,CAAC,EAAA,QAAA,EAAA,kqCAAA,EAAA;;;AER/C;;AAEG;;;;"}
+{"version":3,"file":"masterteam-components-drawer.mjs","sources":["../../../../packages/masterteam/components/drawer/drawer.ts","../../../../packages/masterteam/components/drawer/drawer.html","../../../../packages/masterteam/components/drawer/masterteam-components-drawer.ts"],"sourcesContent":["import { Button } from '@masterteam/components/button';\nimport { Component, input, output, model } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { DrawerModule } from 'primeng/drawer';\n\n@Component({\n  selector: 'mt-drawer',\n  standalone: true,\n  imports: [CommonModule, DrawerModule, Button],\n  templateUrl: './drawer.html',\n  styleUrls: ['./drawer.scss'],\n})\nexport class Drawer {\n  visible = model<boolean>(false);\n  visibleChange = output<boolean>();\n  onShow = output<boolean>();\n  onHide = output<boolean>();\n  position = input<'left' | 'right' | 'top' | 'bottom'>('right');\n  fullScreen = input<boolean>(false);\n  closeOnEscape = input<boolean>(false);\n  blockScroll = input<boolean>(true);\n  dismissible = input<boolean>(true);\n  title = input<string>('');\n  styleClass = input<string>('');\n  transitionOptions = input<string>('200ms cubic-bezier(0, 0, 1, 1)');\n  appendTo = input<string>('body');\n  modal = input<boolean>(true);\n\n  visibleChangeEvent(event: boolean) {\n    this.visibleChange.emit(event);\n  }\n\n  onClose() {\n    this.visible.set(false);\n    this.visibleChange.emit(false);\n    this.onHide.emit(true);\n  }\n  onShowEvent() {\n    this.onShow.emit(true);\n  }\n  onHideEvent() {\n    this.onHide.emit(true);\n  }\n}\n","<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\n  [closeOnEscape]=\"closeOnEscape()\"\n  [blockScroll]=\"blockScroll()\"\n  [dismissible]=\"dismissible()\"\n  [appendTo]=\"appendTo()\"\n  [transitionOptions]=\"transitionOptions()\"\n  [styleClass]=\"styleClass() + ' mt-custom-drawer'\"\n  (visibleChange)=\"visibleChangeEvent($event)\"\n  (onShow)=\"onShowEvent()\"\n  (onHide)=\"onHideEvent()\"\n>\n  <ng-template #header>\n    <div\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\n    >\n      <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n      <mt-button\n        (onClick)=\"onClose()\"\n        variant=\"outlined\"\n        styleClass=\"!bg-white\"\n        icon=\"general.x-close\"\n        severity=\"secondary\"\n      >\n      </mt-button>\n    </div>\n  </ng-template>\n\n  <ng-content select=\"[content]\"></ng-content>\n\n  <ng-template #footer>\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </ng-template>\n</p-drawer>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAYa,MAAM,CAAA;AACjB,IAAA,OAAO,GAAG,KAAK,CAAU,KAAK,mDAAC;IAC/B,aAAa,GAAG,MAAM,EAAW;IACjC,MAAM,GAAG,MAAM,EAAW;IAC1B,MAAM,GAAG,MAAM,EAAW;AAC1B,IAAA,QAAQ,GAAG,KAAK,CAAsC,OAAO,oDAAC;AAC9D,IAAA,UAAU,GAAG,KAAK,CAAU,KAAK,sDAAC;AAClC,IAAA,aAAa,GAAG,KAAK,CAAU,KAAK,yDAAC;AACrC,IAAA,WAAW,GAAG,KAAK,CAAU,IAAI,uDAAC;AAClC,IAAA,WAAW,GAAG,KAAK,CAAU,IAAI,uDAAC;AAClC,IAAA,KAAK,GAAG,KAAK,CAAS,EAAE,iDAAC;AACzB,IAAA,UAAU,GAAG,KAAK,CAAS,EAAE,sDAAC;AAC9B,IAAA,iBAAiB,GAAG,KAAK,CAAS,gCAAgC,6DAAC;AACnE,IAAA,QAAQ,GAAG,KAAK,CAAS,MAAM,oDAAC;AAChC,IAAA,KAAK,GAAG,KAAK,CAAU,IAAI,iDAAC;AAE5B,IAAA,kBAAkB,CAAC,KAAc,EAAA;AAC/B,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;IAChC;IAEA,OAAO,GAAA;AACL,QAAA,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;AACvB,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;AAC9B,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;IACxB;IACA,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;IACxB;IACA,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;IACxB;uGA9BW,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAN,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAM,0nDCZnB,qqCAwCA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDhCY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,YAAY,kaAAE,MAAM,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,MAAA,EAAA,YAAA,EAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,eAAA,EAAA,MAAA,EAAA,SAAA,EAAA,WAAA,EAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAIjC,MAAM,EAAA,UAAA,EAAA,CAAA;kBAPlB,SAAS;+BACE,WAAW,EAAA,UAAA,EACT,IAAI,EAAA,OAAA,EACP,CAAC,YAAY,EAAE,YAAY,EAAE,MAAM,CAAC,EAAA,QAAA,EAAA,qqCAAA,EAAA;;;AER/C;;AAEG;;;;"}

package/fesm2022/masterteam-components-dynamic-drawer.mjs

@@ -0,0 +1,172 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, model, signal, Injector, Input, Component, inject, ApplicationRef, EnvironmentInjector, DestroyRef, createComponent, Injectable } from '@angular/core';
+import { NgComponentOutlet, DOCUMENT } from '@angular/common';
+import { DynamicDialogRef } from 'primeng/dynamicdialog';
+import * as i1 from 'primeng/drawer';
+import { DrawerModule } from 'primeng/drawer';
+import { Button } from '@masterteam/components/button';
+
+const DynamicDrawerConfig = new InjectionToken('DynamicDrawerConfig');
+class DynamicDrawerHost {
+    visible = model(false, ...(ngDevMode ? [{ debugName: "visible" }] : []));
+    cmp = signal(null, ...(ngDevMode ? [{ debugName: "cmp" }] : []));
+    cfg = signal({}, ...(ngDevMode ? [{ debugName: "cfg" }] : []));
+    cmpInputs = signal({}, ...(ngDevMode ? [{ debugName: "cmpInputs" }] : []));
+    childInjector;
+    ref;
+    connect(opts) {
+        this.cmp.set(opts.component);
+        this.cfg.set(opts.config ?? {});
+        this.cmpInputs.set(opts.config?.inputValues ?? {});
+        this.ref = opts.ref;
+        this.childInjector = Injector.create({
+            parent: opts.parent,
+            providers: [
+                { provide: DynamicDrawerConfig, useValue: opts.config ?? {} },
+                { provide: DynamicDialogRef, useValue: opts.ref },
+            ],
+        });
+        opts.ref.onClose.subscribe(() => {
+            this.visible.set(false);
+        });
+        this.visible.set(true);
+    }
+    handleHide(data = null) {
+        this.visible.set(false);
+        this.ref?.close(data);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DynamicDrawerHost, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.3", type: DynamicDrawerHost, isStandalone: true, selector: "mt-dynamic-drawer-host", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, connect: { classPropertyName: "connect", publicName: "connect", isSignal: false, isRequired: true, transformFunction: null } }, outputs: { visible: "visibleChange" }, ngImport: i0, template: `
+    <p-drawer
+      [(visible)]="visible"
+      [closable]="cfg()?.closable"
+      [position]="cfg()?.position"
+      [fullScreen]="cfg()?.fullScreen"
+      [modal]="cfg()?.modal"
+      [closeOnEscape]="cfg()?.closeOnEscape"
+      [dismissible]="cfg()?.dismissible"
+      [appendTo]="cfg()?.appendTo"
+      [transitionOptions]="cfg()?.transitionOptions"
+      [styleClass]="cfg()?.styleClass + ' mt-drawer'"
+    >
+      <ng-template #header>
+        <div
+          class="flex items-center justify-between px-5 w-full py-3 border-b border-surface"
+        >
+          <h3 class="text-xl font-semibold">{{ cfg()?.header }}</h3>
+          <mt-button
+            (onClick)="handleHide()"
+            variant="outlined"
+            styleClass="!bg-white"
+            icon="general.x-close"
+            severity="secondary"
+          >
+          </mt-button>
+        </div>
+      </ng-template>
+
+      <ng-container
+        *ngComponentOutlet="cmp(); injector: childInjector; inputs: cmpInputs()"
+      >
+      </ng-container>
+    </p-drawer>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i1.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DynamicDrawerHost, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'mt-dynamic-drawer-host',
+                    standalone: true,
+                    imports: [NgComponentOutlet, DrawerModule, Button],
+                    template: `
+    <p-drawer
+      [(visible)]="visible"
+      [closable]="cfg()?.closable"
+      [position]="cfg()?.position"
+      [fullScreen]="cfg()?.fullScreen"
+      [modal]="cfg()?.modal"
+      [closeOnEscape]="cfg()?.closeOnEscape"
+      [dismissible]="cfg()?.dismissible"
+      [appendTo]="cfg()?.appendTo"
+      [transitionOptions]="cfg()?.transitionOptions"
+      [styleClass]="cfg()?.styleClass + ' mt-drawer'"
+    >
+      <ng-template #header>
+        <div
+          class="flex items-center justify-between px-5 w-full py-3 border-b border-surface"
+        >
+          <h3 class="text-xl font-semibold">{{ cfg()?.header }}</h3>
+          <mt-button
+            (onClick)="handleHide()"
+            variant="outlined"
+            styleClass="!bg-white"
+            icon="general.x-close"
+            severity="secondary"
+          >
+          </mt-button>
+        </div>
+      </ng-template>
+
+      <ng-container
+        *ngComponentOutlet="cmp(); injector: childInjector; inputs: cmpInputs()"
+      >
+      </ng-container>
+    </p-drawer>
+  `,
+                }]
+        }], propDecorators: { connect: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+// dynamic-drawer.service.ts
+class DrawerService {
+    appRef = inject(ApplicationRef);
+    env = inject(EnvironmentInjector);
+    rootInjector = inject(Injector);
+    destroyRef = inject(DestroyRef);
+    doc = inject(DOCUMENT);
+    hostRef;
+    defauiltConfig = {
+        position: 'right',
+        modal: true,
+        closable: false,
+        transitionOptions: '200ms cubic-bezier(0, 0, 1, 1)',
+        inputValues: {},
+    };
+    open(component, config = {}) {
+        config = { ...this.defauiltConfig, ...config };
+        this.hostRef = createComponent(DynamicDrawerHost, {
+            environmentInjector: this.env,
+        });
+        this.appRef.attachView(this.hostRef.hostView);
+        this.doc.body.appendChild(this.hostRef.location.nativeElement);
+        // auto-clean if app destroyed (SSR/hot-reload safety)
+        this.destroyRef.onDestroy(() => {
+            this.appRef.detachView(this.hostRef.hostView);
+            this.hostRef.destroy();
+            this.hostRef = undefined;
+        });
+        const ref = new DynamicDialogRef();
+        this.hostRef.instance.connect({
+            component,
+            config,
+            parent: this.rootInjector,
+            ref,
+        });
+        return ref;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DrawerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DrawerService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: DrawerService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { DrawerService, DynamicDrawerConfig, DynamicDrawerHost };
+//# sourceMappingURL=masterteam-components-dynamic-drawer.mjs.map

package/fesm2022/masterteam-components-dynamic-drawer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"masterteam-components-dynamic-drawer.mjs","sources":["../../../../packages/masterteam/components/dynamic-drawer/dynamic-drawer-host.ts","../../../../packages/masterteam/components/dynamic-drawer/dynamic-drawer.ts","../../../../packages/masterteam/components/dynamic-drawer/masterteam-components-dynamic-drawer.ts"],"sourcesContent":["import { DynamicDialogRef } from 'primeng/dynamicdialog';\nimport { DrawerModule } from 'primeng/drawer';\nimport {\n  Component,\n  Injector,\n  Input,\n  signal,\n  InjectionToken,\n  model,\n} from '@angular/core';\nimport { NgComponentOutlet } from '@angular/common';\n\nexport const DynamicDrawerConfig = new InjectionToken<any>(\n  'DynamicDrawerConfig',\n);\nimport { Button } from '@masterteam/components/button';\n\n@Component({\n  selector: 'mt-dynamic-drawer-host',\n  standalone: true,\n  imports: [NgComponentOutlet, DrawerModule, Button],\n  template: `\n    <p-drawer\n      [(visible)]=\"visible\"\n      [closable]=\"cfg()?.closable\"\n      [position]=\"cfg()?.position\"\n      [fullScreen]=\"cfg()?.fullScreen\"\n      [modal]=\"cfg()?.modal\"\n      [closeOnEscape]=\"cfg()?.closeOnEscape\"\n      [dismissible]=\"cfg()?.dismissible\"\n      [appendTo]=\"cfg()?.appendTo\"\n      [transitionOptions]=\"cfg()?.transitionOptions\"\n      [styleClass]=\"cfg()?.styleClass + ' mt-drawer'\"\n    >\n      <ng-template #header>\n        <div\n          class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\n        >\n          <h3 class=\"text-xl font-semibold\">{{ cfg()?.header }}</h3>\n          <mt-button\n            (onClick)=\"handleHide()\"\n            variant=\"outlined\"\n            styleClass=\"!bg-white\"\n            icon=\"general.x-close\"\n            severity=\"secondary\"\n          >\n          </mt-button>\n        </div>\n      </ng-template>\n\n      <ng-container\n        *ngComponentOutlet=\"cmp(); injector: childInjector; inputs: cmpInputs()\"\n      >\n      </ng-container>\n    </p-drawer>\n  `,\n})\nexport class DynamicDrawerHost {\n  public visible = model<boolean>(false);\n  cmp = signal<any>(null);\n  cfg = signal<any>({});\n  cmpInputs = signal<Record<string, unknown>>({});\n  childInjector!: Injector;\n  private ref?: DynamicDialogRef;\n\n  @Input({ required: true })\n  connect(opts: {\n    component: any;\n    config?: any;\n    parent: Injector;\n    ref: DynamicDialogRef;\n  }) {\n    this.cmp.set(opts.component);\n    this.cfg.set(opts.config ?? {});\n    this.cmpInputs.set(opts.config?.inputValues ?? {});\n    this.ref = opts.ref;\n    this.childInjector = Injector.create({\n      parent: opts.parent,\n      providers: [\n        { provide: DynamicDrawerConfig, useValue: opts.config ?? {} },\n        { provide: DynamicDialogRef, useValue: opts.ref },\n      ],\n    });\n    opts.ref.onClose.subscribe(() => {\n      this.visible.set(false);\n    });\n    this.visible.set(true);\n  }\n\n  handleHide(data = null) {\n    this.visible.set(false);\n    this.ref?.close(data);\n  }\n}\n","// dynamic-drawer.service.ts\nimport {\n  Injectable,\n  Type,\n  createComponent,\n  EnvironmentInjector,\n  ApplicationRef,\n  Injector,\n  DestroyRef,\n  inject,\n} from '@angular/core';\nimport { DOCUMENT } from '@angular/common';\nimport { DynamicDrawerHost } from './dynamic-drawer-host';\nimport { DynamicDialogRef } from 'primeng/dynamicdialog';\n\nexport interface DynamicDrawerConfigInterface {\n  header?: string;\n  position?: string;\n  data?: any;\n  fullScreen?: boolean;\n  modal?: boolean;\n  closable?: boolean;\n  closeOnEscape?: boolean;\n  dismissible?: boolean;\n  appendTo?: any;\n  transitionOptions?: string;\n  styleClass?: string;\n  inputValues?: any;\n}\n\n@Injectable({ providedIn: 'root' })\nexport class DrawerService {\n  private appRef = inject(ApplicationRef);\n  private env = inject(EnvironmentInjector);\n  private rootInjector = inject(Injector);\n  private destroyRef = inject(DestroyRef);\n  private doc = inject(DOCUMENT);\n  private hostRef?: ReturnType<typeof createComponent<DynamicDrawerHost>>;\n  defauiltConfig: DynamicDrawerConfigInterface = {\n    position: 'right',\n    modal: true,\n    closable: false,\n    transitionOptions: '200ms cubic-bezier(0, 0, 1, 1)',\n    inputValues: {},\n  };\n  open<T>(\n    component: Type<any>,\n    config: DynamicDrawerConfigInterface = {},\n  ): DynamicDialogRef<T> {\n    config = { ...this.defauiltConfig, ...config };\n    this.hostRef = createComponent(DynamicDrawerHost, {\n      environmentInjector: this.env,\n    });\n\n    this.appRef.attachView(this.hostRef.hostView);\n    this.doc.body.appendChild(this.hostRef.location.nativeElement);\n\n    // auto-clean if app destroyed (SSR/hot-reload safety)\n    this.destroyRef.onDestroy(() => {\n      this.appRef.detachView(this.hostRef!.hostView);\n      this.hostRef!.destroy();\n      this.hostRef = undefined;\n    });\n\n    const ref = new DynamicDialogRef<T>();\n    this.hostRef.instance.connect({\n      component,\n      config,\n      parent: this.rootInjector,\n      ref,\n    });\n\n    return ref;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/masterteam-components-menu.mjs

@@ -1,10 +1,10 @@
 import * as i0 from '@angular/core';
-import { viewChild, contentChild, TemplateRef, input, booleanAttribute, output, computed, Component } from '@angular/core';
+import { viewChild, contentChild, TemplateRef, input, booleanAttribute, model, output, computed, Component } from '@angular/core';
 import { Menu as Menu$1 } from 'primeng/menu';
 import * as i1 from 'primeng/api';
 import { SharedModule } from 'primeng/api';
 import { Icon } from '@masterteam/icons';
-import { NgClass, NgTemplateOutlet } from '@angular/common';
+import { NgTemplateOutlet } from '@angular/common';
 
 class Menu {
     menuRef = viewChild.required('menu', { read: Menu$1 });
@@ -31,25 +31,60 @@ class Menu {
     ariaLabelledBy = input(...(ngDevMode ? [undefined, { debugName: "ariaLabelledBy" }] : []));
     id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : []));
     tabindex = input(0, ...(ngDevMode ? [{ debugName: "tabindex" }] : []));
+    activeItemId = model(...(ngDevMode ? [undefined, { debugName: "activeItemId" }] : []));
     onShow = output();
     onHide = output();
     onBlur = output();
     onFocus = output();
+    onItemSelect = output();
     transformedModel = computed(() => {
-        return this.model().map((item) => this.transformMenuItem(item));
+        return this.model().map((item) => this.transformMenuItem(item, this.activeItemId()));
     }, ...(ngDevMode ? [{ debugName: "transformedModel" }] : []));
-    transformMenuItem(item) {
+    toggle(event) {
+        this.menuRef().toggle(event);
+    }
+    show(event) {
+        this.menuRef().show(event);
+    }
+    hide() {
+        this.menuRef().hide();
+    }
+    getItemIcon(item) {
+        return item?.mtIcon;
+    }
+    transformMenuItem(item, activeId) {
         const transformed = { ...item };
         if (item.icon) {
             transformed.mtIcon = item.icon;
             delete transformed.icon;
         }
-        if (item.severity) {
-            transformed.severityClass = this.getSeverityClass(item.severity);
+        const classes = [];
+        const isActive = activeId && item.id && item.id === activeId;
+        if (isActive) {
+            classes.push('bg-primary-50', 'text-primary-700', 'dark:bg-primary-900/20', 'dark:text-primary-300');
+        }
+        else if (item.severity) {
+            const severityClass = this.getSeverityClass(item.severity);
+            if (severityClass) {
+                classes.push(severityClass);
+            }
+        }
+        if (item.styleClass) {
+            classes.push(item.styleClass);
         }
+        transformed.computedClass = classes.join(' ');
         if (item['items']) {
-            transformed['items'] = item['items'].map((subItem) => this.transformMenuItem(subItem));
+            transformed['items'] = item['items'].map((subItem) => this.transformMenuItem(subItem, activeId));
         }
+        const originalCommand = transformed.command;
+        transformed.command = (event) => {
+            if (item.id) {
+                this.handleItemSelect(item);
+            }
+            if (originalCommand) {
+                originalCommand(event);
+            }
+        };
         return transformed;
     }
     getSeverityClass(severity) {
@@ -64,24 +99,18 @@ class Menu {
         };
         return severityMap[severity] || '';
     }
-    getItemIcon(item) {
-        return item?.mtIcon;
-    }
-    toggle(event) {
-        this.menuRef().toggle(event);
-    }
-    show(event) {
-        this.menuRef().show(event);
-    }
-    hide() {
-        this.menuRef().hide();
+    handleItemSelect(item) {
+        if (item.id) {
+            this.activeItemId.set(item.id);
+        }
+        this.onItemSelect.emit(item);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Menu, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: Menu, isStandalone: true, selector: "mt-menu", inputs: { model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, popup: { classPropertyName: "popup", publicName: "popup", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, autoZIndex: { classPropertyName: "autoZIndex", publicName: "autoZIndex", isSignal: true, isRequired: false, transformFunction: null }, baseZIndex: { classPropertyName: "baseZIndex", publicName: "baseZIndex", isSignal: true, isRequired: false, transformFunction: null }, showTransitionOptions: { classPropertyName: "showTransitionOptions", publicName: "showTransitionOptions", isSignal: true, isRequired: false, transformFunction: null }, hideTransitionOptions: { classPropertyName: "hideTransitionOptions", publicName: "hideTransitionOptions", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onShow: "onShow", onHide: "onHide", onBlur: "onBlur", onFocus: "onFocus" }, queries: [{ propertyName: "startTemplate", first: true, predicate: ["start"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "endTemplate", first: true, predicate: ["end"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "submenuHeaderTemplate", first: true, predicate: ["submenuheader"], descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "menuRef", first: true, predicate: ["menu"], descendants: true, read: Menu$1, isSignal: true }], ngImport: i0, template: "<p-menu\n  #menu\n  [model]=\"transformedModel()\"\n  [popup]=\"popup()\"\n  [appendTo]=\"appendTo()\"\n  [style]=\"style()\"\n  [styleClass]=\"styleClass()\"\n  [autoZIndex]=\"autoZIndex()\"\n  [baseZIndex]=\"baseZIndex()\"\n  [showTransitionOptions]=\"showTransitionOptions()\"\n  [hideTransitionOptions]=\"hideTransitionOptions()\"\n  [ariaLabel]=\"ariaLabel()\"\n  [ariaLabelledBy]=\"ariaLabelledBy()\"\n  [id]=\"id()\"\n  [tabindex]=\"tabindex()\"\n  (onShow)=\"onShow.emit($event)\"\n  (onHide)=\"onHide.emit($event)\"\n  (onBlur)=\"onBlur.emit($event)\"\n  (onFocus)=\"onFocus.emit($event)\"\n>\n  @if (startTemplate()) {\n    <ng-template pTemplate=\"start\">\n      <ng-container *ngTemplateOutlet=\"startTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (endTemplate()) {\n    <ng-template pTemplate=\"end\">\n      <ng-container *ngTemplateOutlet=\"endTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (headerTemplate()) {\n    <ng-template pTemplate=\"header\">\n      <ng-container *ngTemplateOutlet=\"headerTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (submenuHeaderTemplate()) {\n    <ng-template pTemplate=\"submenuheader\" let-item>\n      <ng-container\n        *ngTemplateOutlet=\"\n          submenuHeaderTemplate()!;\n          context: { $implicit: item }\n        \"\n      />\n    </ng-template>\n  }\n\n  <ng-template pTemplate=\"item\" let-item>\n    <div\n      class=\"flex gap-2 align-middle p-2 cursor-pointer rounded transition-colors\"\n      [ngClass]=\"[item.severityClass || '', item.styleClass || '']\"\n    >\n      @if (getItemIcon(item)) {\n        <mt-icon\n          [icon]=\"getItemIcon(item)!\"\n          class=\"p-menu-item-icon\"\n          [style.color]=\"'inherit'\"\n        />\n      }\n      @if (item.label) {\n        <span class=\"p-menu-item-label\">{{ item.label }}</span>\n      }\n      @if (item.badge) {\n        <span class=\"p-menu-item-badge\">{{ item.badge }}</span>\n      }\n    </div>\n  </ng-template>\n</p-menu>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: Menu$1, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: Menu, isStandalone: true, selector: "mt-menu", inputs: { model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, popup: { classPropertyName: "popup", publicName: "popup", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, autoZIndex: { classPropertyName: "autoZIndex", publicName: "autoZIndex", isSignal: true, isRequired: false, transformFunction: null }, baseZIndex: { classPropertyName: "baseZIndex", publicName: "baseZIndex", isSignal: true, isRequired: false, transformFunction: null }, showTransitionOptions: { classPropertyName: "showTransitionOptions", publicName: "showTransitionOptions", isSignal: true, isRequired: false, transformFunction: null }, hideTransitionOptions: { classPropertyName: "hideTransitionOptions", publicName: "hideTransitionOptions", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, activeItemId: { classPropertyName: "activeItemId", publicName: "activeItemId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeItemId: "activeItemIdChange", onShow: "onShow", onHide: "onHide", onBlur: "onBlur", onFocus: "onFocus", onItemSelect: "onItemSelect" }, queries: [{ propertyName: "startTemplate", first: true, predicate: ["start"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "endTemplate", first: true, predicate: ["end"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "submenuHeaderTemplate", first: true, predicate: ["submenuheader"], descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "menuRef", first: true, predicate: ["menu"], descendants: true, read: Menu$1, isSignal: true }], ngImport: i0, template: "<p-menu\n  #menu\n  [model]=\"transformedModel()\"\n  [popup]=\"popup()\"\n  [appendTo]=\"appendTo()\"\n  [style]=\"style()\"\n  [styleClass]=\"styleClass()\"\n  [autoZIndex]=\"autoZIndex()\"\n  [baseZIndex]=\"baseZIndex()\"\n  [showTransitionOptions]=\"showTransitionOptions()\"\n  [hideTransitionOptions]=\"hideTransitionOptions()\"\n  [ariaLabel]=\"ariaLabel()\"\n  [ariaLabelledBy]=\"ariaLabelledBy()\"\n  [id]=\"id()\"\n  [tabindex]=\"tabindex()\"\n  (onShow)=\"onShow.emit($event)\"\n  (onHide)=\"onHide.emit($event)\"\n  (onBlur)=\"onBlur.emit($event)\"\n  (onFocus)=\"onFocus.emit($event)\"\n>\n  @if (startTemplate()) {\n    <ng-template pTemplate=\"start\">\n      <ng-container *ngTemplateOutlet=\"startTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (endTemplate()) {\n    <ng-template pTemplate=\"end\">\n      <ng-container *ngTemplateOutlet=\"endTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (headerTemplate()) {\n    <ng-template pTemplate=\"header\">\n      <ng-container *ngTemplateOutlet=\"headerTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (submenuHeaderTemplate()) {\n    <ng-template pTemplate=\"submenuheader\" let-item>\n      <ng-container\n        *ngTemplateOutlet=\"\n          submenuHeaderTemplate()!;\n          context: { $implicit: item }\n        \"\n      />\n    </ng-template>\n  }\n\n  <ng-template pTemplate=\"item\" let-item>\n    <div\n      class=\"flex gap-2 align-middle p-2 cursor-pointer rounded transition-colors\"\n      [class]=\"item.computedClass\"\n    >\n      @if (getItemIcon(item)) {\n        <mt-icon\n          [icon]=\"getItemIcon(item)!\"\n          class=\"p-menu-item-icon\"\n          [style.color]=\"'inherit'\"\n        />\n      }\n      @if (item.label) {\n        <span class=\"p-menu-item-label\">{{ item.label }}</span>\n      }\n      @if (item.badge) {\n        <span class=\"p-menu-item-badge\">{{ item.badge }}</span>\n      }\n    </div>\n  </ng-template>\n</p-menu>\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: Menu$1, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Menu, decorators: [{
             type: Component,
-            args: [{ selector: 'mt-menu', standalone: true, imports: [Menu$1, Icon, SharedModule, NgClass, NgTemplateOutlet], template: "<p-menu\n  #menu\n  [model]=\"transformedModel()\"\n  [popup]=\"popup()\"\n  [appendTo]=\"appendTo()\"\n  [style]=\"style()\"\n  [styleClass]=\"styleClass()\"\n  [autoZIndex]=\"autoZIndex()\"\n  [baseZIndex]=\"baseZIndex()\"\n  [showTransitionOptions]=\"showTransitionOptions()\"\n  [hideTransitionOptions]=\"hideTransitionOptions()\"\n  [ariaLabel]=\"ariaLabel()\"\n  [ariaLabelledBy]=\"ariaLabelledBy()\"\n  [id]=\"id()\"\n  [tabindex]=\"tabindex()\"\n  (onShow)=\"onShow.emit($event)\"\n  (onHide)=\"onHide.emit($event)\"\n  (onBlur)=\"onBlur.emit($event)\"\n  (onFocus)=\"onFocus.emit($event)\"\n>\n  @if (startTemplate()) {\n    <ng-template pTemplate=\"start\">\n      <ng-container *ngTemplateOutlet=\"startTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (endTemplate()) {\n    <ng-template pTemplate=\"end\">\n      <ng-container *ngTemplateOutlet=\"endTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (headerTemplate()) {\n    <ng-template pTemplate=\"header\">\n      <ng-container *ngTemplateOutlet=\"headerTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (submenuHeaderTemplate()) {\n    <ng-template pTemplate=\"submenuheader\" let-item>\n      <ng-container\n        *ngTemplateOutlet=\"\n          submenuHeaderTemplate()!;\n          context: { $implicit: item }\n        \"\n      />\n    </ng-template>\n  }\n\n  <ng-template pTemplate=\"item\" let-item>\n    <div\n      class=\"flex gap-2 align-middle p-2 cursor-pointer rounded transition-colors\"\n      [ngClass]=\"[item.severityClass || '', item.styleClass || '']\"\n    >\n      @if (getItemIcon(item)) {\n        <mt-icon\n          [icon]=\"getItemIcon(item)!\"\n          class=\"p-menu-item-icon\"\n          [style.color]=\"'inherit'\"\n        />\n      }\n      @if (item.label) {\n        <span class=\"p-menu-item-label\">{{ item.label }}</span>\n      }\n      @if (item.badge) {\n        <span class=\"p-menu-item-badge\">{{ item.badge }}</span>\n      }\n    </div>\n  </ng-template>\n</p-menu>\n", styles: [":host{display:contents}\n"] }]
+            args: [{ selector: 'mt-menu', standalone: true, imports: [Menu$1, Icon, SharedModule, NgTemplateOutlet], template: "<p-menu\n  #menu\n  [model]=\"transformedModel()\"\n  [popup]=\"popup()\"\n  [appendTo]=\"appendTo()\"\n  [style]=\"style()\"\n  [styleClass]=\"styleClass()\"\n  [autoZIndex]=\"autoZIndex()\"\n  [baseZIndex]=\"baseZIndex()\"\n  [showTransitionOptions]=\"showTransitionOptions()\"\n  [hideTransitionOptions]=\"hideTransitionOptions()\"\n  [ariaLabel]=\"ariaLabel()\"\n  [ariaLabelledBy]=\"ariaLabelledBy()\"\n  [id]=\"id()\"\n  [tabindex]=\"tabindex()\"\n  (onShow)=\"onShow.emit($event)\"\n  (onHide)=\"onHide.emit($event)\"\n  (onBlur)=\"onBlur.emit($event)\"\n  (onFocus)=\"onFocus.emit($event)\"\n>\n  @if (startTemplate()) {\n    <ng-template pTemplate=\"start\">\n      <ng-container *ngTemplateOutlet=\"startTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (endTemplate()) {\n    <ng-template pTemplate=\"end\">\n      <ng-container *ngTemplateOutlet=\"endTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (headerTemplate()) {\n    <ng-template pTemplate=\"header\">\n      <ng-container *ngTemplateOutlet=\"headerTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (submenuHeaderTemplate()) {\n    <ng-template pTemplate=\"submenuheader\" let-item>\n      <ng-container\n        *ngTemplateOutlet=\"\n          submenuHeaderTemplate()!;\n          context: { $implicit: item }\n        \"\n      />\n    </ng-template>\n  }\n\n  <ng-template pTemplate=\"item\" let-item>\n    <div\n      class=\"flex gap-2 align-middle p-2 cursor-pointer rounded transition-colors\"\n      [class]=\"item.computedClass\"\n    >\n      @if (getItemIcon(item)) {\n        <mt-icon\n          [icon]=\"getItemIcon(item)!\"\n          class=\"p-menu-item-icon\"\n          [style.color]=\"'inherit'\"\n        />\n      }\n      @if (item.label) {\n        <span class=\"p-menu-item-label\">{{ item.label }}</span>\n      }\n      @if (item.badge) {\n        <span class=\"p-menu-item-badge\">{{ item.badge }}</span>\n      }\n    </div>\n  </ng-template>\n</p-menu>\n", styles: [":host{display:contents}\n"] }]
         }] });
 
 /**

package/fesm2022/masterteam-components-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"masterteam-components-menu.mjs","sources":["../../../../packages/masterteam/components/menu/menu.ts","../../../../packages/masterteam/components/menu/menu.html","../../../../packages/masterteam/components/menu/masterteam-components-menu.ts"],"sourcesContent":["import {\n  Component,\n  input,\n  output,\n  booleanAttribute,\n  computed,\n  viewChild,\n  contentChild,\n  TemplateRef,\n} from '@angular/core';\nimport { Menu as PrimeMenu } from 'primeng/menu';\nimport { MenuItem, SharedModule } from 'primeng/api';\nimport { Icon, MTIcon } from '@masterteam/icons';\nimport { ButtonSeverity } from 'primeng/button';\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\n\nexport interface MTMenuItem extends Omit<MenuItem, 'icon'> {\n  icon?: MTIcon;\n  severity?: ButtonSeverity | 'danger';\n  styleClass?: string;\n}\n\n@Component({\n  selector: 'mt-menu',\n  standalone: true,\n  imports: [PrimeMenu, Icon, SharedModule, NgClass, NgTemplateOutlet],\n  templateUrl: './menu.html',\n  styleUrls: ['./menu.scss'],\n})\nexport class Menu {\n  menuRef = viewChild.required('menu', { read: PrimeMenu });\n\n  readonly startTemplate = contentChild('start', { read: TemplateRef });\n  readonly endTemplate = contentChild('end', { read: TemplateRef });\n  readonly headerTemplate = contentChild('header', { read: TemplateRef });\n  readonly submenuHeaderTemplate = contentChild('submenuheader', {\n    read: TemplateRef,\n  });\n\n  readonly model = input<MTMenuItem[]>([]);\n  readonly popup = input<boolean, unknown>(true, {\n    transform: booleanAttribute,\n  });\n  readonly appendTo = input<any>('body');\n  readonly style = input<{ [klass: string]: any } | null>();\n  readonly styleClass = input<string>();\n  readonly autoZIndex = input<boolean, unknown>(true, {\n    transform: booleanAttribute,\n  });\n  readonly baseZIndex = input<number>(0);\n  readonly showTransitionOptions = input<string>(\n    '0.12s cubic-bezier(0, 0, 0.2, 1)',\n  );\n  readonly hideTransitionOptions = input<string>('0.1s linear');\n  readonly ariaLabel = input<string>();\n  readonly ariaLabelledBy = input<string>();\n  readonly id = input<string>();\n  readonly tabindex = input<number>(0);\n\n  readonly onShow = output<any>();\n  readonly onHide = output<any>();\n  readonly onBlur = output<Event>();\n  readonly onFocus = output<Event>();\n\n  transformedModel = computed(() => {\n    return this.model().map((item) => this.transformMenuItem(item));\n  });\n\n  private transformMenuItem(item: MTMenuItem): any {\n    const transformed: any = { ...item };\n\n    if (item.icon) {\n      transformed.mtIcon = item.icon;\n      delete transformed.icon;\n    }\n\n    if (item.severity) {\n      transformed.severityClass = this.getSeverityClass(item.severity);\n    }\n\n    if (item['items']) {\n      transformed['items'] = item['items'].map((subItem: any) =>\n        this.transformMenuItem(subItem as MTMenuItem),\n      );\n    }\n\n    return transformed;\n  }\n\n  private getSeverityClass(severity: string): string {\n    const severityMap: Record<string, string> = {\n      danger: 'text-red-600 hover:bg-red-50 hover:text-red-700',\n      warn: 'text-yellow-600 hover:bg-yellow-50 hover:text-yellow-700',\n      success: 'text-green-600 hover:bg-green-50 hover:text-green-700',\n      info: 'text-blue-600 hover:bg-blue-50 hover:text-blue-700',\n      help: 'text-purple-600 hover:bg-purple-50 hover:text-purple-700',\n      secondary: 'text-gray-600 hover:bg-gray-50 hover:text-gray-700',\n      contrast: 'text-gray-900 hover:bg-gray-100',\n    };\n\n    return severityMap[severity] || '';\n  }\n\n  getItemIcon(item: any): MTIcon | undefined {\n    return item?.mtIcon;\n  }\n\n  toggle(event: Event): void {\n    this.menuRef().toggle(event);\n  }\n\n  show(event: Event): void {\n    this.menuRef().show(event);\n  }\n\n  hide(): void {\n    this.menuRef().hide();\n  }\n}\n","<p-menu\n  #menu\n  [model]=\"transformedModel()\"\n  [popup]=\"popup()\"\n  [appendTo]=\"appendTo()\"\n  [style]=\"style()\"\n  [styleClass]=\"styleClass()\"\n  [autoZIndex]=\"autoZIndex()\"\n  [baseZIndex]=\"baseZIndex()\"\n  [showTransitionOptions]=\"showTransitionOptions()\"\n  [hideTransitionOptions]=\"hideTransitionOptions()\"\n  [ariaLabel]=\"ariaLabel()\"\n  [ariaLabelledBy]=\"ariaLabelledBy()\"\n  [id]=\"id()\"\n  [tabindex]=\"tabindex()\"\n  (onShow)=\"onShow.emit($event)\"\n  (onHide)=\"onHide.emit($event)\"\n  (onBlur)=\"onBlur.emit($event)\"\n  (onFocus)=\"onFocus.emit($event)\"\n>\n  @if (startTemplate()) {\n    <ng-template pTemplate=\"start\">\n      <ng-container *ngTemplateOutlet=\"startTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (endTemplate()) {\n    <ng-template pTemplate=\"end\">\n      <ng-container *ngTemplateOutlet=\"endTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (headerTemplate()) {\n    <ng-template pTemplate=\"header\">\n      <ng-container *ngTemplateOutlet=\"headerTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (submenuHeaderTemplate()) {\n    <ng-template pTemplate=\"submenuheader\" let-item>\n      <ng-container\n        *ngTemplateOutlet=\"\n          submenuHeaderTemplate()!;\n          context: { $implicit: item }\n        \"\n      />\n    </ng-template>\n  }\n\n  <ng-template pTemplate=\"item\" let-item>\n    <div\n      class=\"flex gap-2 align-middle p-2 cursor-pointer rounded transition-colors\"\n      [ngClass]=\"[item.severityClass || '', item.styleClass || '']\"\n    >\n      @if (getItemIcon(item)) {\n        <mt-icon\n          [icon]=\"getItemIcon(item)!\"\n          class=\"p-menu-item-icon\"\n          [style.color]=\"'inherit'\"\n        />\n      }\n      @if (item.label) {\n        <span class=\"p-menu-item-label\">{{ item.label }}</span>\n      }\n      @if (item.badge) {\n        <span class=\"p-menu-item-badge\">{{ item.badge }}</span>\n      }\n    </div>\n  </ng-template>\n</p-menu>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["PrimeMenu"],"mappings":"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"}
+{"version":3,"file":"masterteam-components-menu.mjs","sources":["../../../../packages/masterteam/components/menu/menu.ts","../../../../packages/masterteam/components/menu/menu.html","../../../../packages/masterteam/components/menu/masterteam-components-menu.ts"],"sourcesContent":["import {\n  Component,\n  input,\n  output,\n  booleanAttribute,\n  computed,\n  viewChild,\n  contentChild,\n  TemplateRef,\n  model,\n} from '@angular/core';\nimport { Menu as PrimeMenu } from 'primeng/menu';\nimport { MenuItem, SharedModule } from 'primeng/api';\nimport { Icon, MTIcon } from '@masterteam/icons';\nimport { ButtonSeverity } from 'primeng/button';\nimport { NgTemplateOutlet } from '@angular/common';\n\nexport interface MTMenuItem extends Omit<MenuItem, 'icon'> {\n  icon?: MTIcon;\n  severity?: ButtonSeverity | 'danger';\n  styleClass?: string;\n  id?: string | number;\n}\n\n@Component({\n  selector: 'mt-menu',\n  standalone: true,\n  imports: [PrimeMenu, Icon, SharedModule, NgTemplateOutlet],\n  templateUrl: './menu.html',\n  styleUrls: ['./menu.scss'],\n})\nexport class Menu {\n  menuRef = viewChild.required('menu', { read: PrimeMenu });\n\n  readonly startTemplate = contentChild('start', { read: TemplateRef });\n  readonly endTemplate = contentChild('end', { read: TemplateRef });\n  readonly headerTemplate = contentChild('header', { read: TemplateRef });\n  readonly submenuHeaderTemplate = contentChild('submenuheader', {\n    read: TemplateRef,\n  });\n\n  readonly model = input<MTMenuItem[]>([]);\n  readonly popup = input<boolean, unknown>(true, {\n    transform: booleanAttribute,\n  });\n  readonly appendTo = input<any>('body');\n  readonly style = input<Record<string, any> | null>();\n  readonly styleClass = input<string>();\n  readonly autoZIndex = input<boolean, unknown>(true, {\n    transform: booleanAttribute,\n  });\n  readonly baseZIndex = input<number>(0);\n  readonly showTransitionOptions = input<string>(\n    '0.12s cubic-bezier(0, 0, 0.2, 1)',\n  );\n  readonly hideTransitionOptions = input<string>('0.1s linear');\n  readonly ariaLabel = input<string>();\n  readonly ariaLabelledBy = input<string>();\n  readonly id = input<string>();\n  readonly tabindex = input<number>(0);\n\n  readonly activeItemId = model<string | number | undefined>();\n\n  readonly onShow = output<any>();\n  readonly onHide = output<any>();\n  readonly onBlur = output<Event>();\n  readonly onFocus = output<Event>();\n  readonly onItemSelect = output<MTMenuItem>();\n\n  transformedModel = computed(() => {\n    return this.model().map((item) =>\n      this.transformMenuItem(item, this.activeItemId()),\n    );\n  });\n\n  toggle(event: Event): void {\n    this.menuRef().toggle(event);\n  }\n\n  show(event: Event): void {\n    this.menuRef().show(event);\n  }\n\n  hide(): void {\n    this.menuRef().hide();\n  }\n\n  protected getItemIcon(item: any): MTIcon | undefined {\n    return item?.mtIcon;\n  }\n\n  private transformMenuItem(item: MTMenuItem, activeId?: string | number): any {\n    const transformed: any = { ...item };\n\n    if (item.icon) {\n      transformed.mtIcon = item.icon;\n      delete transformed.icon;\n    }\n\n    const classes: string[] = [];\n    const isActive = activeId && item.id && item.id === activeId;\n\n    if (isActive) {\n      classes.push(\n        'bg-primary-50',\n        'text-primary-700',\n        'dark:bg-primary-900/20',\n        'dark:text-primary-300',\n      );\n    } else if (item.severity) {\n      const severityClass = this.getSeverityClass(item.severity);\n      if (severityClass) {\n        classes.push(severityClass);\n      }\n    }\n\n    if (item.styleClass) {\n      classes.push(item.styleClass);\n    }\n\n    transformed.computedClass = classes.join(' ');\n\n    if (item['items']) {\n      transformed['items'] = item['items'].map((subItem: any) =>\n        this.transformMenuItem(subItem as MTMenuItem, activeId),\n      );\n    }\n\n    const originalCommand = transformed.command;\n    transformed.command = (event: any) => {\n      if (item.id) {\n        this.handleItemSelect(item);\n      }\n\n      if (originalCommand) {\n        originalCommand(event);\n      }\n    };\n\n    return transformed;\n  }\n\n  private getSeverityClass(severity: string): string {\n    const severityMap: Record<string, string> = {\n      danger: 'text-red-600 hover:bg-red-50 hover:text-red-700',\n      warn: 'text-yellow-600 hover:bg-yellow-50 hover:text-yellow-700',\n      success: 'text-green-600 hover:bg-green-50 hover:text-green-700',\n      info: 'text-blue-600 hover:bg-blue-50 hover:text-blue-700',\n      help: 'text-purple-600 hover:bg-purple-50 hover:text-purple-700',\n      secondary: 'text-gray-600 hover:bg-gray-50 hover:text-gray-700',\n      contrast: 'text-gray-900 hover:bg-gray-100',\n    };\n\n    return severityMap[severity] || '';\n  }\n\n  private handleItemSelect(item: MTMenuItem): void {\n    if (item.id) {\n      this.activeItemId.set(item.id);\n    }\n    this.onItemSelect.emit(item);\n  }\n}\n","<p-menu\n  #menu\n  [model]=\"transformedModel()\"\n  [popup]=\"popup()\"\n  [appendTo]=\"appendTo()\"\n  [style]=\"style()\"\n  [styleClass]=\"styleClass()\"\n  [autoZIndex]=\"autoZIndex()\"\n  [baseZIndex]=\"baseZIndex()\"\n  [showTransitionOptions]=\"showTransitionOptions()\"\n  [hideTransitionOptions]=\"hideTransitionOptions()\"\n  [ariaLabel]=\"ariaLabel()\"\n  [ariaLabelledBy]=\"ariaLabelledBy()\"\n  [id]=\"id()\"\n  [tabindex]=\"tabindex()\"\n  (onShow)=\"onShow.emit($event)\"\n  (onHide)=\"onHide.emit($event)\"\n  (onBlur)=\"onBlur.emit($event)\"\n  (onFocus)=\"onFocus.emit($event)\"\n>\n  @if (startTemplate()) {\n    <ng-template pTemplate=\"start\">\n      <ng-container *ngTemplateOutlet=\"startTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (endTemplate()) {\n    <ng-template pTemplate=\"end\">\n      <ng-container *ngTemplateOutlet=\"endTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (headerTemplate()) {\n    <ng-template pTemplate=\"header\">\n      <ng-container *ngTemplateOutlet=\"headerTemplate()!\" />\n    </ng-template>\n  }\n\n  @if (submenuHeaderTemplate()) {\n    <ng-template pTemplate=\"submenuheader\" let-item>\n      <ng-container\n        *ngTemplateOutlet=\"\n          submenuHeaderTemplate()!;\n          context: { $implicit: item }\n        \"\n      />\n    </ng-template>\n  }\n\n  <ng-template pTemplate=\"item\" let-item>\n    <div\n      class=\"flex gap-2 align-middle p-2 cursor-pointer rounded transition-colors\"\n      [class]=\"item.computedClass\"\n    >\n      @if (getItemIcon(item)) {\n        <mt-icon\n          [icon]=\"getItemIcon(item)!\"\n          class=\"p-menu-item-icon\"\n          [style.color]=\"'inherit'\"\n        />\n      }\n      @if (item.label) {\n        <span class=\"p-menu-item-label\">{{ item.label }}</span>\n      }\n      @if (item.badge) {\n        <span class=\"p-menu-item-badge\">{{ item.badge }}</span>\n      }\n    </div>\n  </ng-template>\n</p-menu>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["PrimeMenu"],"mappings":";;;;;;;;MA+Ba,IAAI,CAAA;AACf,IAAA,OAAO,GAAG,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,EAAE,IAAI,EAAEA,MAAS,EAAE,CAAC;AAEhD,IAAA,aAAa,GAAG,YAAY,CAAC,OAAO,iDAAI,IAAI,EAAE,WAAW,EAAA,CAAA,GAAA,CAAnB,EAAE,IAAI,EAAE,WAAW,EAAE,GAAC;AAC5D,IAAA,WAAW,GAAG,YAAY,CAAC,KAAK,+CAAI,IAAI,EAAE,WAAW,EAAA,CAAA,GAAA,CAAnB,EAAE,IAAI,EAAE,WAAW,EAAE,GAAC;AACxD,IAAA,cAAc,GAAG,YAAY,CAAC,QAAQ,kDAAI,IAAI,EAAE,WAAW,EAAA,CAAA,GAAA,CAAnB,EAAE,IAAI,EAAE,WAAW,EAAE,GAAC;IAC9D,qBAAqB,GAAG,YAAY,CAAC,eAAe,yDAC3D,IAAI,EAAE,WAAW,EAAA,CAAA,GAAA,CAD4C;AAC7D,YAAA,IAAI,EAAE,WAAW;AAClB,SAAA,CAAA,CAAA,CAAC;AAEO,IAAA,KAAK,GAAG,KAAK,CAAe,EAAE,iDAAC;IAC/B,KAAK,GAAG,KAAK,CAAmB,IAAI,yCAC3C,SAAS,EAAE,gBAAgB,EAAA,CAAA,GAAA,CADkB;AAC7C,YAAA,SAAS,EAAE,gBAAgB;AAC5B,SAAA,CAAA,CAAA,CAAC;AACO,IAAA,QAAQ,GAAG,KAAK,CAAM,MAAM,oDAAC;IAC7B,KAAK,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,OAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAA8B;IAC3C,UAAU,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,YAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IAC5B,UAAU,GAAG,KAAK,CAAmB,IAAI,8CAChD,SAAS,EAAE,gBAAgB,EAAA,CAAA,GAAA,CADuB;AAClD,YAAA,SAAS,EAAE,gBAAgB;AAC5B,SAAA,CAAA,CAAA,CAAC;AACO,IAAA,UAAU,GAAG,KAAK,CAAS,CAAC,sDAAC;AAC7B,IAAA,qBAAqB,GAAG,KAAK,CACpC,kCAAkC,iEACnC;AACQ,IAAA,qBAAqB,GAAG,KAAK,CAAS,aAAa,iEAAC;IACpD,SAAS,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,WAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IAC3B,cAAc,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IAChC,EAAE,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,IAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;AACpB,IAAA,QAAQ,GAAG,KAAK,CAAS,CAAC,oDAAC;IAE3B,YAAY,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,cAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAA+B;IAEnD,MAAM,GAAG,MAAM,EAAO;IACtB,MAAM,GAAG,MAAM,EAAO;IACtB,MAAM,GAAG,MAAM,EAAS;IACxB,OAAO,GAAG,MAAM,EAAS;IACzB,YAAY,GAAG,MAAM,EAAc;AAE5C,IAAA,gBAAgB,GAAG,QAAQ,CAAC,MAAK;QAC/B,OAAO,IAAI,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,IAAI,KAC3B,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC,CAClD;AACH,IAAA,CAAC,4DAAC;AAEF,IAAA,MAAM,CAAC,KAAY,EAAA;QACjB,IAAI,CAAC,OAAO,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC;IAC9B;AAEA,IAAA,IAAI,CAAC,KAAY,EAAA;QACf,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC;IAC5B;IAEA,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,EAAE;IACvB;AAEU,IAAA,WAAW,CAAC,IAAS,EAAA;QAC7B,OAAO,IAAI,EAAE,MAAM;IACrB;IAEQ,iBAAiB,CAAC,IAAgB,EAAE,QAA0B,EAAA;AACpE,QAAA,MAAM,WAAW,GAAQ,EAAE,GAAG,IAAI,EAAE;AAEpC,QAAA,IAAI,IAAI,CAAC,IAAI,EAAE;AACb,YAAA,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI;YAC9B,OAAO,WAAW,CAAC,IAAI;QACzB;QAEA,MAAM,OAAO,GAAa,EAAE;AAC5B,QAAA,MAAM,QAAQ,GAAG,QAAQ,IAAI,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,EAAE,KAAK,QAAQ;QAE5D,IAAI,QAAQ,EAAE;YACZ,OAAO,CAAC,IAAI,CACV,eAAe,EACf,kBAAkB,EAClB,wBAAwB,EACxB,uBAAuB,CACxB;QACH;AAAO,aAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACxB,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC;YAC1D,IAAI,aAAa,EAAE;AACjB,gBAAA,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC;YAC7B;QACF;AAEA,QAAA,IAAI,IAAI,CAAC,UAAU,EAAE;AACnB,YAAA,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC;QAC/B;QAEA,WAAW,CAAC,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AAE7C,QAAA,IAAI,IAAI,CAAC,OAAO,CAAC,EAAE;YACjB,WAAW,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,OAAY,KACpD,IAAI,CAAC,iBAAiB,CAAC,OAAqB,EAAE,QAAQ,CAAC,CACxD;QACH;AAEA,QAAA,MAAM,eAAe,GAAG,WAAW,CAAC,OAAO;AAC3C,QAAA,WAAW,CAAC,OAAO,GAAG,CAAC,KAAU,KAAI;AACnC,YAAA,IAAI,IAAI,CAAC,EAAE,EAAE;AACX,gBAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC;YAC7B;YAEA,IAAI,eAAe,EAAE;gBACnB,eAAe,CAAC,KAAK,CAAC;YACxB;AACF,QAAA,CAAC;AAED,QAAA,OAAO,WAAW;IACpB;AAEQ,IAAA,gBAAgB,CAAC,QAAgB,EAAA;AACvC,QAAA,MAAM,WAAW,GAA2B;AAC1C,YAAA,MAAM,EAAE,iDAAiD;AACzD,YAAA,IAAI,EAAE,0DAA0D;AAChE,YAAA,OAAO,EAAE,uDAAuD;AAChE,YAAA,IAAI,EAAE,oDAAoD;AAC1D,YAAA,IAAI,EAAE,0DAA0D;AAChE,YAAA,SAAS,EAAE,oDAAoD;AAC/D,YAAA,QAAQ,EAAE,iCAAiC;SAC5C;AAED,QAAA,OAAO,WAAW,CAAC,QAAQ,CAAC,IAAI,EAAE;IACpC;AAEQ,IAAA,gBAAgB,CAAC,IAAgB,EAAA;AACvC,QAAA,IAAI,IAAI,CAAC,EAAE,EAAE;YACX,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;QAChC;AACA,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IAC9B;uGAlIW,IAAI,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAJ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAI,ypEAGwC,WAAW,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,KAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,IAAA,EACf,WAAW,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,gBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,QAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,IAAA,EACL,WAAW,iIAE5D,WAAW,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,SAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,MAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,IAAA,EAN0BA,MAAS,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EChCxD,u6DAsEA,mFD3CYA,MAAS,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,OAAA,EAAA,YAAA,EAAA,YAAA,EAAA,YAAA,EAAA,uBAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,QAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,IAAI,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,YAAY,sIAAE,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAI9C,IAAI,EAAA,UAAA,EAAA,CAAA;kBAPhB,SAAS;+BACE,SAAS,EAAA,UAAA,EACP,IAAI,EAAA,OAAA,EACP,CAACA,MAAS,EAAE,IAAI,EAAE,YAAY,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,u6DAAA,EAAA,MAAA,EAAA,CAAA,2BAAA,CAAA,EAAA;;;AE3B5D;;AAEG;;;;"}

package/fesm2022/masterteam-components-modal.mjs

@@ -0,0 +1,50 @@
+import { DrawerService } from '@masterteam/components/dynamic-drawer';
+import { DialogService } from '@masterteam/components/dialog';
+import * as i0 from '@angular/core';
+import { inject, Injectable } from '@angular/core';
+import { Directionality } from '@angular/cdk/bidi';
+
+class ModalService {
+    drawerService = inject(DrawerService);
+    dialogService = inject(DialogService);
+    dir = inject(Directionality, { optional: true });
+    footerClass = 'mt-modal-footer';
+    contentClass = 'mt-modal-content';
+    modalConfig;
+    openModal(component, modalType, config) {
+        let ref;
+        if (modalType === 'drawer') {
+            config.position = this.handelStartEndPosition(config.position);
+            console.log('Opening drawer with config:', config);
+            ref = this.drawerService.open(component, config);
+        }
+        else {
+            ref = this.dialogService.open(component, config);
+        }
+        return ref;
+    }
+    handelStartEndPosition(position) {
+        if (position === 'start') {
+            return this.dir?.value === 'rtl' ? 'right' : 'left';
+        }
+        else if (position === 'end') {
+            return this.dir?.value === 'rtl' ? 'left' : 'right';
+        }
+        else {
+            return position || 'left';
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ModalService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ModalService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ModalService };
+//# sourceMappingURL=masterteam-components-modal.mjs.map

package/fesm2022/masterteam-components-modal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"masterteam-components-modal.mjs","sources":["../../../../packages/masterteam/components/modal/modal.ts","../../../../packages/masterteam/components/modal/masterteam-components-modal.ts"],"sourcesContent":["import {\n  DynamicDrawerConfigInterface,\n  DrawerService,\n} from '@masterteam/components/dynamic-drawer';\nimport {\n  DynamicDialogConfig,\n  DialogService,\n} from '@masterteam/components/dialog';\nimport { inject, Injectable } from '@angular/core';\nimport { Directionality } from '@angular/cdk/bidi'; // Import from Angular CDK\n\n@Injectable({ providedIn: 'root' })\nexport class ModalService {\n  readonly drawerService: DrawerService = inject(DrawerService);\n  readonly dialogService: DialogService = inject(DialogService);\n  private dir = inject(Directionality, { optional: true });\n\n  footerClass: string = 'mt-modal-footer';\n  contentClass: string = 'mt-modal-content';\n  modalConfig: any;\n\n  openModal(\n    component: any,\n    modalType: 'drawer' | 'dialog',\n    config: DynamicDialogConfig | DynamicDrawerConfigInterface,\n  ) {\n    let ref: any;\n    if (modalType === 'drawer') {\n      config.position = this.handelStartEndPosition(config.position);\n      console.log('Opening drawer with config:', config);\n      ref = this.drawerService.open(component, config);\n    } else {\n      ref = this.dialogService.open(component, config);\n    }\n\n    return ref;\n  }\n\n  handelStartEndPosition(position: string | undefined) {\n    if (position === 'start') {\n      return this.dir?.value === 'rtl' ? 'right' : 'left';\n    } else if (position === 'end') {\n      return this.dir?.value === 'rtl' ? 'left' : 'right';\n    } else {\n      return position || 'left';\n    }\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MAYa,YAAY,CAAA;AACd,IAAA,aAAa,GAAkB,MAAM,CAAC,aAAa,CAAC;AACpD,IAAA,aAAa,GAAkB,MAAM,CAAC,aAAa,CAAC;IACrD,GAAG,GAAG,MAAM,CAAC,cAAc,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;IAExD,WAAW,GAAW,iBAAiB;IACvC,YAAY,GAAW,kBAAkB;AACzC,IAAA,WAAW;AAEX,IAAA,SAAS,CACP,SAAc,EACd,SAA8B,EAC9B,MAA0D,EAAA;AAE1D,QAAA,IAAI,GAAQ;AACZ,QAAA,IAAI,SAAS,KAAK,QAAQ,EAAE;YAC1B,MAAM,CAAC,QAAQ,GAAG,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,QAAQ,CAAC;AAC9D,YAAA,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,MAAM,CAAC;YAClD,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC;QAClD;aAAO;YACL,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC;QAClD;AAEA,QAAA,OAAO,GAAG;IACZ;AAEA,IAAA,sBAAsB,CAAC,QAA4B,EAAA;AACjD,QAAA,IAAI,QAAQ,KAAK,OAAO,EAAE;AACxB,YAAA,OAAO,IAAI,CAAC,GAAG,EAAE,KAAK,KAAK,KAAK,GAAG,OAAO,GAAG,MAAM;QACrD;AAAO,aAAA,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC7B,YAAA,OAAO,IAAI,CAAC,GAAG,EAAE,KAAK,KAAK,KAAK,GAAG,MAAM,GAAG,OAAO;QACrD;aAAO;YACL,OAAO,QAAQ,IAAI,MAAM;QAC3B;IACF;uGAlCW,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,YAAY,cADC,MAAM,EAAA,CAAA;;2FACnB,YAAY,EAAA,UAAA,EAAA,CAAA;kBADxB,UAAU;mBAAC,EAAE,UAAU,EAAE,MAAM,EAAE;;;ACXlC;;AAEG;;;;"}

package/menu/index.d.ts

@@ -9,6 +9,7 @@ interface MTMenuItem extends Omit<MenuItem, 'icon'> {
     icon?: MTIcon;
     severity?: ButtonSeverity | 'danger';
     styleClass?: string;
+    id?: string | number;
 }
 declare class Menu {
     menuRef: _angular_core.Signal<Menu$1>;
@@ -19,9 +20,7 @@ declare class Menu {
     readonly model: _angular_core.InputSignal<MTMenuItem[]>;
     readonly popup: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly appendTo: _angular_core.InputSignal<any>;
-    readonly style: _angular_core.InputSignal<{
-        [klass: string]: any;
-    } | null | undefined>;
+    readonly style: _angular_core.InputSignal<Record<string, any> | null | undefined>;
     readonly styleClass: _angular_core.InputSignal<string | undefined>;
     readonly autoZIndex: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly baseZIndex: _angular_core.InputSignal<number>;
@@ -31,19 +30,22 @@ declare class Menu {
     readonly ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
     readonly id: _angular_core.InputSignal<string | undefined>;
     readonly tabindex: _angular_core.InputSignal<number>;
+    readonly activeItemId: _angular_core.ModelSignal<string | number | undefined>;
     readonly onShow: _angular_core.OutputEmitterRef<any>;
     readonly onHide: _angular_core.OutputEmitterRef<any>;
     readonly onBlur: _angular_core.OutputEmitterRef<Event>;
     readonly onFocus: _angular_core.OutputEmitterRef<Event>;
+    readonly onItemSelect: _angular_core.OutputEmitterRef<MTMenuItem>;
     transformedModel: _angular_core.Signal<any[]>;
-    private transformMenuItem;
-    private getSeverityClass;
-    getItemIcon(item: any): MTIcon | undefined;
     toggle(event: Event): void;
     show(event: Event): void;
     hide(): void;
+    protected getItemIcon(item: any): MTIcon | undefined;
+    private transformMenuItem;
+    private getSeverityClass;
+    private handleItemSelect;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Menu, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Menu, "mt-menu", never, { "model": { "alias": "model"; "required": false; "isSignal": true; }; "popup": { "alias": "popup"; "required": false; "isSignal": true; }; "appendTo": { "alias": "appendTo"; "required": false; "isSignal": true; }; "style": { "alias": "style"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; "isSignal": true; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; "isSignal": true; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; "isSignal": true; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; }, { "onShow": "onShow"; "onHide": "onHide"; "onBlur": "onBlur"; "onFocus": "onFocus"; }, ["startTemplate", "endTemplate", "headerTemplate", "submenuHeaderTemplate"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Menu, "mt-menu", never, { "model": { "alias": "model"; "required": false; "isSignal": true; }; "popup": { "alias": "popup"; "required": false; "isSignal": true; }; "appendTo": { "alias": "appendTo"; "required": false; "isSignal": true; }; "style": { "alias": "style"; "required": false; "isSignal": true; }; "styleClass": { "alias": "styleClass"; "required": false; "isSignal": true; }; "autoZIndex": { "alias": "autoZIndex"; "required": false; "isSignal": true; }; "baseZIndex": { "alias": "baseZIndex"; "required": false; "isSignal": true; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; "isSignal": true; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "activeItemId": { "alias": "activeItemId"; "required": false; "isSignal": true; }; }, { "activeItemId": "activeItemIdChange"; "onShow": "onShow"; "onHide": "onHide"; "onBlur": "onBlur"; "onFocus": "onFocus"; "onItemSelect": "onItemSelect"; }, ["startTemplate", "endTemplate", "headerTemplate", "submenuHeaderTemplate"], never, true, never>;
 }
 
 export { Menu };

package/modal/index.d.ts

@@ -0,0 +1,18 @@
+import { DrawerService, DynamicDrawerConfigInterface } from '@masterteam/components/dynamic-drawer';
+import { DialogService, DynamicDialogConfig } from '@masterteam/components/dialog';
+import * as i0 from '@angular/core';
+
+declare class ModalService {
+    readonly drawerService: DrawerService;
+    readonly dialogService: DialogService;
+    private dir;
+    footerClass: string;
+    contentClass: string;
+    modalConfig: any;
+    openModal(component: any, modalType: 'drawer' | 'dialog', config: DynamicDialogConfig | DynamicDrawerConfigInterface): any;
+    handelStartEndPosition(position: string | undefined): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ModalService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ModalService>;
+}
+
+export { ModalService };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@masterteam/components",
-  "version": "0.0.29",
+  "version": "0.0.31",
   "publishConfig": {
     "directory": ".",
     "linkDirectory": false,
@@ -39,86 +39,94 @@
       "types": "./index.d.ts",
       "default": "./fesm2022/masterteam-components.mjs"
     },
-    "./avatar": {
-      "types": "./avatar/index.d.ts",
-      "default": "./fesm2022/masterteam-components-avatar.mjs"
-    },
     "./breadcrumb": {
       "types": "./breadcrumb/index.d.ts",
       "default": "./fesm2022/masterteam-components-breadcrumb.mjs"
     },
-    "./avatar-text": {
-      "types": "./avatar-text/index.d.ts",
-      "default": "./fesm2022/masterteam-components-avatar-text.mjs"
+    "./button-group": {
+      "types": "./button-group/index.d.ts",
+      "default": "./fesm2022/masterteam-components-button-group.mjs"
     },
     "./button": {
       "types": "./button/index.d.ts",
       "default": "./fesm2022/masterteam-components-button.mjs"
     },
-    "./button-group": {
-      "types": "./button-group/index.d.ts",
-      "default": "./fesm2022/masterteam-components-button-group.mjs"
-    },
-    "./chip": {
-      "types": "./chip/index.d.ts",
-      "default": "./fesm2022/masterteam-components-chip.mjs"
+    "./avatar": {
+      "types": "./avatar/index.d.ts",
+      "default": "./fesm2022/masterteam-components-avatar.mjs"
     },
     "./card": {
       "types": "./card/index.d.ts",
       "default": "./fesm2022/masterteam-components-card.mjs"
     },
-    "./color-picker-field": {
-      "types": "./color-picker-field/index.d.ts",
-      "default": "./fesm2022/masterteam-components-color-picker-field.mjs"
+    "./avatar-text": {
+      "types": "./avatar-text/index.d.ts",
+      "default": "./fesm2022/masterteam-components-avatar-text.mjs"
     },
     "./checkbox-field": {
       "types": "./checkbox-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-checkbox-field.mjs"
     },
+    "./color-picker-field": {
+      "types": "./color-picker-field/index.d.ts",
+      "default": "./fesm2022/masterteam-components-color-picker-field.mjs"
+    },
+    "./dialog": {
+      "types": "./dialog/index.d.ts",
+      "default": "./fesm2022/masterteam-components-dialog.mjs"
+    },
     "./date-field": {
       "types": "./date-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-date-field.mjs"
     },
+    "./chip": {
+      "types": "./chip/index.d.ts",
+      "default": "./fesm2022/masterteam-components-chip.mjs"
+    },
+    "./dynamic-drawer": {
+      "types": "./dynamic-drawer/index.d.ts",
+      "default": "./fesm2022/masterteam-components-dynamic-drawer.mjs"
+    },
     "./drawer": {
       "types": "./drawer/index.d.ts",
       "default": "./fesm2022/masterteam-components-drawer.mjs"
     },
-    "./dialog": {
-      "types": "./dialog/index.d.ts",
-      "default": "./fesm2022/masterteam-components-dialog.mjs"
+    "./editor-field": {
+      "types": "./editor-field/index.d.ts",
+      "default": "./fesm2022/masterteam-components-editor-field.mjs"
     },
     "./field-validation": {
       "types": "./field-validation/index.d.ts",
       "default": "./fesm2022/masterteam-components-field-validation.mjs"
     },
-    "./editor-field": {
-      "types": "./editor-field/index.d.ts",
-      "default": "./fesm2022/masterteam-components-editor-field.mjs"
+    "./list": {
+      "types": "./list/index.d.ts",
+      "default": "./fesm2022/masterteam-components-list.mjs"
+    },
+    "./icon-field": {
+      "types": "./icon-field/index.d.ts",
+      "default": "./fesm2022/masterteam-components-icon-field.mjs"
     },
     "./formula-builder": {
       "types": "./formula-builder/index.d.ts",
       "default": "./fesm2022/masterteam-components-formula-builder.mjs"
     },
-    "./icon-field": {
-      "types": "./icon-field/index.d.ts",
-      "default": "./fesm2022/masterteam-components-icon-field.mjs"
+    "./modal": {
+      "types": "./modal/index.d.ts",
+      "default": "./fesm2022/masterteam-components-modal.mjs"
     },
     "./module-summary-card": {
       "types": "./module-summary-card/index.d.ts",
       "default": "./fesm2022/masterteam-components-module-summary-card.mjs"
     },
-    "./menu": {
-      "types": "./menu/index.d.ts",
-      "default": "./fesm2022/masterteam-components-menu.mjs"
-    },
-    "./list": {
-      "types": "./list/index.d.ts",
-      "default": "./fesm2022/masterteam-components-list.mjs"
-    },
     "./multi-select-field": {
       "types": "./multi-select-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-multi-select-field.mjs"
     },
+    "./menu": {
+      "types": "./menu/index.d.ts",
+      "default": "./fesm2022/masterteam-components-menu.mjs"
+    },
     "./number-field": {
       "types": "./number-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-number-field.mjs"
@@ -127,17 +135,13 @@
       "types": "./paginator/index.d.ts",
       "default": "./fesm2022/masterteam-components-paginator.mjs"
     },
-    "./radio-cards": {
-      "types": "./radio-cards/index.d.ts",
-      "default": "./fesm2022/masterteam-components-radio-cards.mjs"
-    },
     "./radio-button-field": {
       "types": "./radio-button-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-radio-button-field.mjs"
     },
-    "./select-field": {
-      "types": "./select-field/index.d.ts",
-      "default": "./fesm2022/masterteam-components-select-field.mjs"
+    "./radio-cards": {
+      "types": "./radio-cards/index.d.ts",
+      "default": "./fesm2022/masterteam-components-radio-cards.mjs"
     },
     "./radio-cards-field": {
       "types": "./radio-cards-field/index.d.ts",
@@ -147,6 +151,14 @@
       "types": "./slider-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-slider-field.mjs"
     },
+    "./select-field": {
+      "types": "./select-field/index.d.ts",
+      "default": "./fesm2022/masterteam-components-select-field.mjs"
+    },
+    "./text-field": {
+      "types": "./text-field/index.d.ts",
+      "default": "./fesm2022/masterteam-components-text-field.mjs"
+    },
     "./table": {
       "types": "./table/index.d.ts",
       "default": "./fesm2022/masterteam-components-table.mjs"
@@ -155,25 +167,21 @@
       "types": "./tabs/index.d.ts",
       "default": "./fesm2022/masterteam-components-tabs.mjs"
     },
-    "./text-field": {
-      "types": "./text-field/index.d.ts",
-      "default": "./fesm2022/masterteam-components-text-field.mjs"
-    },
-    "./toast": {
-      "types": "./toast/index.d.ts",
-      "default": "./fesm2022/masterteam-components-toast.mjs"
-    },
     "./textarea-field": {
       "types": "./textarea-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-textarea-field.mjs"
     },
+    "./tooltip": {
+      "types": "./tooltip/index.d.ts",
+      "default": "./fesm2022/masterteam-components-tooltip.mjs"
+    },
     "./toggle-field": {
       "types": "./toggle-field/index.d.ts",
       "default": "./fesm2022/masterteam-components-toggle-field.mjs"
     },
-    "./tooltip": {
-      "types": "./tooltip/index.d.ts",
-      "default": "./fesm2022/masterteam-components-tooltip.mjs"
+    "./toast": {
+      "types": "./toast/index.d.ts",
+      "default": "./fesm2022/masterteam-components-toast.mjs"
     },
     "./user-search-field": {
       "types": "./user-search-field/index.d.ts",