diff --git a/doc/common/presetdoc/index.json b/doc/common/presetdoc/index.json index 80e77ae3..3a795542 100644 --- a/doc/common/presetdoc/index.json +++ b/doc/common/presetdoc/index.json @@ -1,5 +1,5 @@ { - "accordion": ".p-accordionpanel {\n @apply flex flex-col border-b border-surface-200 dark:border-surface-700\n}\n\n.p-accordionheader {\n @apply cursor-pointer disabled:cursor-auto flex items-center justify-between p-[1.125rem] font-semibold\n bg-surface-0 dark:bg-surface-900\n text-surface-500 dark:text-surface-400\n transition-colors duration-200\n}\n\n.p-accordionpanel:first-child > .p-accordionheader {\n @apply rounded-t-md\n}\n\n.p-accordionpanel:last-child > .p-accordionheader {\n @apply rounded-b-md\n}\n\n.p-accordionpanel:last-child.p-accordionpanel-active > .p-accordionheader {\n @apply rounded-b-md\n}\n\n.p-accordionheader-toggle-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-accordionpanel:not(.p-disabled) .p-accordionheader:focus-visible {\n @apply outline outline-1 outline-offset-[-1px] outline-primary\n}\n\n.p-accordionpanel:not(.p-accordionpanel-active):not(.p-disabled) > .p-accordionheader:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-accordionpanel-active):not(.p-disabled) .p-accordionheader:hover .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0;\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader:hover .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0;\n}\n\n.p-accordioncontent-content {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 pt-0 px-[1.125rem] pb-[1.125rem]\n}", + "accordion": ".p-accordionpanel {\n @apply flex flex-col border-b border-surface-200 dark:border-surface-700\n}\n\n.p-accordionheader {\n @apply cursor-pointer disabled:cursor-auto flex items-center justify-between p-[1.125rem] font-semibold\n bg-surface-0 dark:bg-surface-900\n text-surface-500 dark:text-surface-400\n transition-colors duration-200\n}\n\n.p-accordionpanel:first-child > .p-accordionheader {\n @apply rounded-ss-md rounded-se-md\n}\n\n.p-accordionpanel:last-child > .p-accordionheader {\n @apply rounded-ee-md rounded-es-md\n}\n\n.p-accordionpanel:last-child.p-accordionpanel-active > .p-accordionheader {\n @apply rounded-ee-md rounded-es-md\n}\n\n.p-accordionheader-toggle-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-accordionpanel:not(.p-disabled) .p-accordionheader:focus-visible {\n @apply outline outline-1 outline-offset-[-1px] outline-primary\n}\n\n.p-accordionpanel:not(.p-accordionpanel-active):not(.p-disabled) > .p-accordionheader:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-accordionpanel-active):not(.p-disabled) .p-accordionheader:hover .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0;\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader:hover {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-accordionpanel:not(.p-disabled).p-accordionpanel-active > .p-accordionheader:hover .p-accordionheader-toggle-icon {\n @apply text-surface-700 dark:text-surface-0;\n}\n\n.p-accordioncontent-content {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0 pt-0 px-[1.125rem] pb-[1.125rem]\n}\n", "autocomplete": "@import './inputtext';\n@import './chip';\n\n.p-autocomplete {\n @apply inline-flex\n}\n\n.p-autocomplete.p-disabled {\n @apply opacity-100\n}\n\n.p-autocomplete-loader {\n @apply absolute top-1/2 -mt-2 end-3\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-loader {\n @apply end-[3.25rem]\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n @apply flex-auto w-[1%]\n}\n\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input,\n.p-autocomplete:has(.p-autocomplete-dropdown) .p-autocomplete-input-multiple {\n @apply rounded-e-none\n}\n\n.p-autocomplete-dropdown {\n @apply cursor-pointer inline-flex items-center justify-center select-none overflow-hidden relative w-10 rounded-e-md\n bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:hover:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-autocomplete .p-autocomplete-overlay {\n @apply min-w-full\n}\n\n.p-autocomplete-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-autocomplete-list-container {\n @apply overflow-auto\n}\n\n.p-autocomplete-list {\n @apply m-0 p-1 list-none flex flex-col gap-[2px]\n}\n\n.p-autocomplete-option {\n @apply cursor-pointer whitespace-nowrap relative overflow-hidden flex items-center px-3 py-2 rounded-sm\n text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200\n}\n\n.p-autocomplete-option:not(.p-autocomplete-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-700 dark:text-surface-0\n}\n\n.p-autocomplete-option-selected {\n @apply bg-highlight\n}\n\n.p-autocomplete-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-autocomplete-option-group {\n @apply m-0 px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold bg-transparent\n}\n\n.p-autocomplete-input-multiple {\n @apply m-0 list-none cursor-text overflow-hidden flex items-center flex-wrap\n px-3 py-1 gap-1 text-surface-700 dark:text-surface-0 bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700 rounded-md w-full\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200 outline-none\n}\n\n.p-autocomplete:not(.p-disabled):hover .p-autocomplete-input-multiple {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-autocomplete:not(.p-disabled).p-focus .p-autocomplete-input-multiple {\n @apply border-primary\n}\n\n.p-autocomplete.p-invalid .p-autocomplete-input-multiple {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-variant-filled.p-autocomplete-input-multiple {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-autocomplete.p-disabled .p-autocomplete-input-multiple {\n @apply opacity-100 cursor-default bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400\n}\n\n.p-autocomplete-chip.p-chip {\n @apply py-1 rounded-sm\n}\n\n.p-autocomplete-input-multiple:has(.p-autocomplete-chip) {\n @apply px-1\n}\n\n.p-autocomplete-chip-item.p-focus .p-autocomplete-chip {\n @apply bg-surface-200 text-surface-800 dark:bg-surface-700 dark:text-surface-0\n}\n\n.p-autocomplete-input-chip {\n @apply flex-auto inline-flex py-1\n}\n\n.p-autocomplete-input-chip input {\n @apply border-none outline-none bg-transparent m-0 p-0 shadow-none rounded-none w-full text-inherit\n}\n\n.p-autocomplete-input-chip input::placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-autocomplete-empty-message {\n @apply px-3 py-2\n}\n\n.p-autocomplete-fluid {\n @apply flex\n}\n\n.p-autocomplete-fluid:has(.p-autocomplete-dropdown) .p-autocomplete-input {\n @apply w-[1%]\n}\n", "avatar": ".p-avatar {\n @apply inline-flex items-center justify-center\n w-8 h-8 text-base rounded-md\n bg-surface-200 dark:bg-surface-700 \n}\n\n.p-avatar-image {\n @apply bg-transparent\n}\n\n.p-avatar-circle,\n.p-avatar-circle img {\n @apply rounded-full\n}\n\n.p-avatar-icon {\n @apply text-base\n}\n\n.p-avatar img {\n @apply w-full h-full\n}\n\n.p-avatar-lg {\n @apply w-12 h-12 text-2xl\n}\n\n.p-avatar-lg .p-avatar-icon {\n @apply text-2xl\n}\n\n.p-avatar-xl {\n @apply w-16 h-16 text-[2rem]\n}\n\n.p-avatar-xl .p-avatar-icon {\n @apply text-[2rem]\n}\n\n.p-avatar-group {\n @apply flex items-center\n}\n\n.p-avatar-group .p-avatar + .p-avatar {\n @apply -ml-4\n}\n\n.p-avatar-group .p-avatar {\n @apply border-2 border-surface-200 dark:border-surface-700\n}", "badge": ".p-badge {\n @apply inline-flex items-center justify-center rounded-md\n py-0 px-2 text-xs font-bold min-w-6 h-6\n bg-primary text-primary-contrast\n}\n\n.p-badge-dot {\n @apply min-w-2 h-2 rounded-full p-0\n}\n\n.p-badge-circle {\n @apply p-0 rounded-full\n}\n\n.p-badge-secondary {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-600 dark:text-surface-300\n}\n\n.p-badge-success {\n @apply bg-green-500 dark:bg-green-400 text-white dark:text-green-950\n}\n\n.p-badge-info {\n @apply bg-sky-500 dark:bg-sky-400 text-white dark:text-sky-950\n}\n\n.p-badge-warn {\n @apply bg-orange-500 dark:bg-orange-400 text-white dark:text-orange-950\n}\n\n.p-badge-danger {\n @apply bg-red-500 dark:bg-red-400 text-white dark:text-red-950\n}\n\n.p-badge-contrast {\n @apply bg-surface-950 dark:bg-white text-white dark:text-surface-950\n}\n\n.p-badge-sm {\n @apply text-[0.625rem] min-w-5 h-5\n}\n\n.p-badge-lg {\n @apply text-sm min-w-7 h-7\n}\n\n.p-badge-xl {\n @apply text-base min-w-8 h-8\n}", @@ -21,7 +21,7 @@ "dataview": "@import './paginator';\n\n.p-dataview {\n @apply border-none\n}\n\n.p-dataview-header {\n @apply py-3 px-4 border-b border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-content {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-footer {\n @apply py-3 px-4 border-t border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-dataview-paginator-top {\n @apply border-b border-surface-200 dark:border-surface-700\n}\n\n.p-dataview-paginator-bottom {\n @apply border-t border-surface-200 dark:border-surface-700\n}", "datepicker": "@import './button';\n@import './inputtext';\n\n.p-datepicker {\n @apply inline-flex max-w-full\n}\n\n.p-datepicker-input {\n @apply flex-auto w-[1%]\n}\n\n.p-datepicker:has(.p-datepicker-dropdown) .p-datepicker-input {\n @apply rounded-e-none\n}\n\n.p-datepicker-dropdown {\n @apply inline-flex items-center justify-center overflow-hidden relative cursor-pointer select-none\n w-10 rounded-e-md border border-s-0 border-surface-300 dark:border-surface-700\n bg-surface-100 enabled:hover:bg-surface-200 enabled:active:bg-surface-300\n text-surface-600 enabled:hover:text-surface-700 enabled:active:text-surface-800\n dark:bg-surface-800 dark:enabled:hover:bg-surface-700 dark:enabled:active:bg-surface-600\n dark:text-surface-300 dark:enabled:hover:text-surface-200 dark:enabled:active:text-surface-100\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-datepicker:has(.p-datepicker-input-icon-container) {\n @apply relative\n}\n\n.p-datepicker:has(.p-datepicker-input-icon-container) .p-datepicker-input {\n @apply pe-10\n}\n\n.p-datepicker-input-icon-container {\n @apply cursor-pointer absolute top-1/2 end-3 -mt-2 text-surface-400\n}\n\n.p-datepicker-fluid {\n @apply flex\n}\n\n.p-datepicker-fluid .p-datepicker-input {\n @apply w-[1%]\n}\n\n.p-datepicker .p-datepicker-panel {\n @apply min-w-full\n}\n\n.p-datepicker-panel {\n @apply w-auto p-3 rounded-md\n border border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-datepicker-panel-inline {\n @apply inline-block overflow-x-auto shadow-none\n}\n\n.p-datepicker-header {\n @apply flex items-center justify-between pt-0 px-0 pb-2 font-medium gap-2\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n border-b border-surface-200 dark:border-surface-700\n}\n\n.p-datepicker-next-button:dir(rtl) {\n @apply order-[-1]\n}\n.p-datepicker-prev-button:dir(rtl) {\n @apply order-1\n}\n\n.p-datepicker-title {\n @apply flex items-center justify-between gap-2 font-medium\n}\n\n.p-datepicker-select-year,\n.p-datepicker-select-month {\n @apply border-none bg-transparent m-0 cursor-pointer font-medium transition-colors duration-200\n py-1 px-2 rounded-md text-surface-700 dark:text-surface-0\n enabled:hover:bg-surface-100 enabled:hover:text-surface-800\n dark:enabled:hover:bg-surface-800 dark:enabled:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-calendar-container {\n @apply flex\n}\n\n.p-datepicker-calendar-container .p-datepicker-calendar {\n @apply flex-auto border-s border-surface-200 dark:border-surface-700 gap-3\n first:ps-0 first:border-s-0 last:pe-0\n}\n\n.p-datepicker-day-view {\n @apply w-full border-collapse text-base mt-2 mx-0 mb-0\n}\n\n.p-datepicker-weekday-cell {\n @apply p-1\n}\n\n.p-datepicker-weekday {\n @apply font-medium text-surface-700 dark:text-surface-0\n}\n\n.p-datepicker-day-cell {\n @apply p-1\n}\n\n.p-datepicker-day {\n @apply flex items-center justify-center cursor-pointer my-0 mx-auto overflow-hidden relative w-8 h-8\n rounded-full p-1 transition-colors duration-200 border border-transparent text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-day:not(.p-datepicker-day-selected):not(.p-disabled):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-day-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-day-selected-range {\n @apply bg-highlight\n}\n\n.p-datepicker-today > .p-datepicker-day {\n @apply bg-surface-200 text-surface-900 dark:bg-surface-700 dark:text-surface-0\n}\n\n.p-datepicker-today > .p-datepicker-day-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-today > .p-datepicker-day-selected-range {\n @apply bg-highlight\n}\n\n.p-datepicker-weeknumber {\n @apply text-center\n}\n\n.p-datepicker-month-view {\n @apply mt-2 mb-0 mx-0\n}\n\n.p-datepicker-month {\n @apply w-1/3 inline-flex items-center justify-center cursor-pointer overflow-hidden relative\n p-[0.375rem] transition-colors duration-200 rounded-md text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-month:not(.p-disabled):not(.p-datepicker-month-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-month-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-year-view {\n @apply mt-2 mb-0 mx-0\n}\n\n.p-datepicker-year {\n @apply w-1/2 inline-flex items-center justify-center cursor-pointer overflow-hidden relative\n p-[0.375rem] transition-colors duration-200 rounded-md text-surface-700 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-datepicker-year:not(.p-disabled):not(.p-datepicker-year-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-datepicker-year-selected {\n @apply bg-primary text-primary-contrast\n}\n\n.p-datepicker-buttonbar {\n @apply flex justify-between items-center pt-2 pb-0 px-0 border-t border-surface-200 dark:border-surface-700\n}\n\n.p-datepicker-buttonbar .p-button {\n @apply w-auto\n}\n\n.p-datepicker-time-picker {\n @apply flex items-center justify-center border-t border-surface-200 dark:border-surface-700 p-0 gap-2\n}\n\n.p-datepicker-calendar-container + .p-datepicker-time-picker {\n @apply pt-2 pb-0 px-0\n}\n\n.p-datepicker-time-picker > div {\n @apply flex items-center flex-col gap-1\n}\n\n.p-datepicker-time-picker span {\n @apply text-base\n}\n\n.p-datepicker-timeonly .p-datepicker-time-picker {\n @apply border-t-0\n}\n", "dialog": "@import './button';\n\n.p-dialog {\n @apply max-h-[90%] scale-100 rounded-xl \n border border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_20px_25px_-5px_rgba(0,0,0,0.1),0_8px_10px_-6px_rgba(0,0,0,0.1)]\n}\n\n.p-dialog-content {\n @apply overflow-y-auto pt-0 px-5 pb-5\n}\n\n.p-dialog-header {\n @apply flex items-center justify-between shrink-0 p-5\n}\n\n.p-dialog-title {\n @apply font-semibold text-xl\n}\n\n.p-dialog-footer {\n @apply shrink-0 pt-0 px-5 pb-5 flex justify-end gap-2\n}\n\n.p-dialog-header-actions {\n @apply flex items-center gap-2\n}\n\n.p-dialog-enter-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0,0,0.2,1)]\n}\n\n.p-dialog-leave-active {\n @apply transition-all duration-150 ease-[cubic-bezier(0.4,0,0.2,1)]\n}\n\n.p-dialog-enter-from,\n.p-dialog-leave-to {\n @apply opacity-0 scale-75\n}\n\n.p-dialog-top .p-dialog,\n.p-dialog-bottom .p-dialog,\n.p-dialog-left .p-dialog,\n.p-dialog-right .p-dialog,\n.p-dialog-topleft .p-dialog,\n.p-dialog-topright .p-dialog,\n.p-dialog-bottomleft .p-dialog,\n.p-dialog-bottomright .p-dialog {\n @apply m-3 [transform:translate3d(0,0,0)]\n}\n\n.p-dialog-top .p-dialog-enter-active,\n.p-dialog-top .p-dialog-leave-active,\n.p-dialog-bottom .p-dialog-enter-active,\n.p-dialog-bottom .p-dialog-leave-active,\n.p-dialog-left .p-dialog-enter-active,\n.p-dialog-left .p-dialog-leave-active,\n.p-dialog-right .p-dialog-enter-active,\n.p-dialog-right .p-dialog-leave-active,\n.p-dialog-topleft .p-dialog-enter-active,\n.p-dialog-topleft .p-dialog-leave-active,\n.p-dialog-topright .p-dialog-enter-active,\n.p-dialog-topright .p-dialog-leave-active,\n.p-dialog-bottomleft .p-dialog-enter-active,\n.p-dialog-bottomleft .p-dialog-leave-active,\n.p-dialog-bottomright .p-dialog-enter-active,\n.p-dialog-bottomright .p-dialog-leave-active {\n @apply transition-all duration-300 ease-out\n}\n\n.p-dialog-top .p-dialog-enter-from,\n.p-dialog-top .p-dialog-leave-to {\n @apply [transform:translate3d(0,-100%,0)]\n}\n\n.p-dialog-bottom .p-dialog-enter-from,\n.p-dialog-bottom .p-dialog-leave-to {\n @apply [transform:translate3d(0,100%,0)]\n}\n\n.p-dialog-left .p-dialog-enter-from,\n.p-dialog-left .p-dialog-leave-to,\n.p-dialog-topleft .p-dialog-enter-from,\n.p-dialog-topleft .p-dialog-leave-to,\n.p-dialog-bottomleft .p-dialog-enter-from,\n.p-dialog-bottomleft .p-dialog-leave-to {\n @apply [transform:translate3d(-100%,0,0)]\n}\n\n.p-dialog-right .p-dialog-enter-from,\n.p-dialog-right .p-dialog-leave-to,\n.p-dialog-topright .p-dialog-enter-from,\n.p-dialog-topright .p-dialog-leave-to,\n.p-dialog-bottomright .p-dialog-enter-from,\n.p-dialog-bottomright .p-dialog-leave-to {\n @apply [transform:translate3d(100%,0,0)]\n}\n\n.p-dialog-maximized {\n @apply !w-screen !h-screen top-0 left-0 max-h-full rounded-none \n}\n\n.p-dialog-maximized .p-dialog-content {\n @apply flex-grow\n}", - "divider": ".p-divider-horizontal {\n @apply flex w-full relative items-center my-4 mx-0 py-0 px-4\n before:absolute before:block before:top-1/2 before:left-0 before:w-full\n before:border-t before:border-surface-200 dark:before:border-surface-700\n}\n\n.p-divider-horizontal .p-divider-content {\n @apply py-0 px-2\n}\n\n.p-divider-vertical {\n @apply min-h-full flex relative justify-center my-0 mx-4 py-2 px-0\n before:absolute before:block before:top-0 before:left-1/2 before:h-full\n before:border-l before:border-surface-200 before:dark:border-surface-700\n}\n\n.p-divider.p-divider-vertical .p-divider-content {\n @apply py-2 px-0\n}\n\n.p-divider-content {\n @apply z-10 bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n @apply border-solid\n}\n\n.p-divider-solid.p-divider-vertical:before {\n @apply border-solid\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n @apply border-dashed\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n @apply border-dashed\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n @apply border-dotted\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n @apply border-dotted\n}", + "divider": ".p-divider-horizontal {\n @apply flex w-full relative items-center my-4 mx-0 py-0 px-4\n before:absolute before:block before:top-1/2 before:start-0 before:w-full\n before:border-t before:border-surface-200 dark:before:border-surface-700\n}\n\n.p-divider-horizontal .p-divider-content {\n @apply py-0 px-2\n}\n\n.p-divider-vertical {\n @apply min-h-full flex relative justify-center my-0 mx-4 py-2 px-0\n before:absolute before:block before:top-0 before:start-1/2 before:h-full\n before:border-s before:border-surface-200 before:dark:border-surface-700\n}\n\n.p-divider.p-divider-vertical .p-divider-content {\n @apply py-2 px-0\n}\n\n.p-divider-content {\n @apply z-10 bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-divider-solid.p-divider-horizontal:before {\n @apply border-solid\n}\n\n.p-divider-solid.p-divider-vertical:before {\n @apply border-solid\n}\n\n.p-divider-dashed.p-divider-horizontal:before {\n @apply border-dashed\n}\n\n.p-divider-dashed.p-divider-vertical:before {\n @apply border-dashed\n}\n\n.p-divider-dotted.p-divider-horizontal:before {\n @apply border-dotted\n}\n\n.p-divider-dotted.p-divider-vertical:before {\n @apply border-dotted\n}\n\n.p-divider-left:dir(rtl),\n.p-divider-right:dir(rtl) {\n @apply flex-row-reverse\n}\n", "dock": ".p-dock {\n @apply absolute z-10 flex justify-center items-center pointer-events-none\n}\n\n.p-dock-list-container {\n @apply flex pointer-events-auto bg-white/10 border border-white/10 p-2 rounded-xl\n}\n\n.p-dock-list {\n @apply m-0 p-0 list-none flex items-center justify-center outline-none\n}\n\n.p-dock-item {\n @apply transition-all duration-200 ease-[cubic-bezier(0.4,0,0.2,1)] will-change-transform p-2 rounded-md\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-dock-item-link {\n @apply flex flex-col items-center justify-center relative cursor-default w-12 h-12\n}\n\n.p-dock-top {\n @apply left-0 top-0 w-full\n}\n\n.p-dock-top .p-dock-item {\n @apply origin-[center_top]\n}\n\n.p-dock-bottom {\n @apply left-0 bottom-0 w-full\n}\n\n.p-dock-bottom .p-dock-item {\n @apply origin-[center_bottom]\n}\n\n.p-dock-right {\n @apply right-0 top-0 h-full\n}\n\n.p-dock-right .p-dock-item {\n @apply origin-[center_right]\n}\n\n.p-dock-right .p-dock-list {\n @apply flex-col\n}\n\n.p-dock-left {\n @apply left-0 top-0 h-full\n}\n\n.p-dock-left .p-dock-item {\n @apply origin-[center_left]\n}\n\n.p-dock-left .p-dock-list {\n @apply flex-col\n}\n\n.p-dock-mobile.p-dock-top .p-dock-list-container,\n.p-dock-mobile.p-dock-bottom .p-dock-list-container {\n @apply overflow-x-auto w-full\n}\n\n.p-dock-mobile.p-dock-top .p-dock-list-container .p-dock-list,\n.p-dock-mobile.p-dock-bottom .p-dock-list-container .p-dock-list {\n @apply mt-0 mx-auto\n}\n\n.p-dock-mobile.p-dock-left .p-dock-list-container,\n.p-dock-mobile.p-dock-right .p-dock-list-container {\n @apply overflow-y-auto h-full\n}\n\n.p-dock-mobile.p-dock-left .p-dock-list-container .p-dock-list,\n.p-dock-mobile.p-dock-right .p-dock-list-container .p-dock-list {\n @apply mt-auto mx-0\n}\n\n.p-dock-mobile .p-dock-list .p-dock-item {\n @apply transform-none m-0\n}", "drawer": "@import './button';\n\n.p-drawer {\n @apply flex flex-col pointer-events-auto relative transition-transform duration-300\n border border-surface-200 dark:border-surface-700 \n bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0\n shadow-[0_20px_25px_-5px_rgba(0,0,0,0.1),0_8px_10px_-6px_rgba(0,0,0,0.1)]\n}\n\n.p-drawer {\n @apply [transform:translate3d(0,0,0)]\n}\n\n.p-drawer-content {\n @apply overflow-y-auto flex-grow pt-0 pb-5 px-5\n}\n\n.p-drawer-header {\n @apply flex items-center justify-between flex-shrink-0 p-5\n}\n\n.p-drawer-footer {\n @apply px-5\n}\n\n.p-drawer-title {\n @apply font-semibold text-2xl \n}\n\n.p-drawer-full .p-drawer {\n @apply transition-none transform-none w-screen h-screen max-h-full top-0 left-0\n}\n\n.p-drawer-left .p-drawer-enter-from,\n.p-drawer-left .p-drawer-leave-to {\n @apply -translate-x-full\n}\n\n.p-drawer-right .p-drawer-enter-from,\n.p-drawer-right .p-drawer-leave-to {\n @apply translate-x-full\n}\n\n.p-drawer-top .p-drawer-enter-from,\n.p-drawer-top .p-drawer-leave-to {\n @apply -translate-y-full\n}\n\n.p-drawer-bottom .p-drawer-enter-from,\n.p-drawer-bottom .p-drawer-leave-to {\n @apply translate-y-full\n}\n\n.p-drawer-full .p-drawer-enter-from,\n.p-drawer-full .p-drawer-leave-to {\n @apply opacity-0\n}\n\n.p-drawer-full .p-drawer-enter-active,\n.p-drawer-full .p-drawer-leave-active {\n @apply transition-opacity animate-duration-400 ease-[cubic-bezier(0.25,0.8,0.25,1)]\n}\n\n.p-drawer-left .p-drawer {\n @apply w-80 h-full border-r\n}\n\n.p-drawer-right .p-drawer {\n @apply w-80 h-full border-l\n}\n\n.p-drawer-top .p-drawer {\n @apply h-40 w-full border-b\n}\n\n.p-drawer-bottom .p-drawer {\n @apply h-40 w-full border-t\n}\n\n.p-drawer-left .p-drawer-content,\n.p-drawer-right .p-drawer-content,\n.p-drawer-top .p-drawer-content,\n.p-drawer-bottom .p-drawer-content {\n @apply w-full h-full\n}\n\n.p-drawer-open {\n @apply flex\n}", "fieldset": ".p-fieldset {\n @apply border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n px-[1.125rem] pt-0 pb-[1.125rem]\n}\n\n.p-fieldset-legend {\n @apply border border-transparent rounded-md px-3 py-2\n transition-colors duration-200\n}\n\n.p-fieldset-toggleable > .p-fieldset-legend {\n @apply p-0\n}\n\n.p-fieldset-toggle-button {\n @apply select-none overflow-hidden relative\n flex items-center justify-center gap-2\n px-3 py-2\n border-none rounded-md\n bg-surface-0 dark:bg-surface-900\n hover:bg-surface-100 dark:hover:bg-surface-800\n text-surface-700 dark:text-surface-0\n hover:text-surface-800 dark:hover:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-fieldset-legend-label {\n @apply font-semibold;\n}\n\n.p-fieldset-toggle-icon {\n @apply text-surface-500 dark:text-surface-400\n transition-colors duration-200\n}\n\n.p-fieldset-toggle-button:hover .p-fieldset-toggle-icon {\n @apply text-surface-600 dark:text-surface-300\n}\n\n.p-fieldset .p-fieldset-content {\n @apply p-0\n}", @@ -59,7 +59,7 @@ "radiobutton": ".p-radiobutton {\n @apply relative inline-flex select-none w-5 h-5\n}\n\n.p-radiobutton-input {\n @apply cursor-pointer disabled:cursor-default appearance-none absolute start-0 top-0 w-full h-full m-0 p-0 opacity-0 z-10\n border border-transparent rounded-full\n}\n\n.p-radiobutton-box {\n @apply flex justify-center items-center rounded-full\n border border-surface-300 dark:border-surface-700\n bg-surface-0 dark:bg-surface-950\n w-5 h-5\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n}\n\n.p-radiobutton-icon {\n @apply bg-transparent text-xs w-3 h-3 rounded-full\n transition-all duration-200 backface-hidden\n}\n\n.p-radiobutton-icon {\n @apply scale-[0.1]\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-radiobutton-checked .p-radiobutton-box {\n @apply border-primary bg-primary\n}\n\n.p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-primary-contrast visible\n}\n\n.p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply scale-100\n}\n\n.p-radiobutton-checked:not(.p-disabled):has(.p-radiobutton-input:hover) .p-radiobutton-box {\n @apply border-primary-emphasis bg-primary-emphasis\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:hover).p-radiobutton-checked .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-primary-contrast\n}\n\n.p-radiobutton:not(.p-disabled):has(.p-radiobutton-input:focus-visible) .p-radiobutton-box {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-radiobutton.p-invalid > .p-radiobutton-box {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-radiobutton.p-variant-filled .p-radiobutton-box {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-radiobutton.p-disabled {\n @apply opacity-100\n}\n\n.p-radiobutton.p-disabled .p-radiobutton-box {\n @apply bg-surface-200 dark:bg-surface-400\n border-surface-300 dark:border-surface-700\n}\n\n.p-radiobutton-checked.p-disabled .p-radiobutton-box .p-radiobutton-icon {\n @apply bg-surface-700 dark:bg-surface-400\n}\n", "rating": ".p-rating {\n @apply relative flex items-center gap-1\n}\n\n.p-rating-option {\n @apply inline-flex items-center cursor-pointer rounded-full\n}\n\n.p-rating-option.p-focus-visible {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-rating-icon {\n @apply text-surface-500 dark:text-surface-400 text-base w-4 h-4 transition-colors duration-200\n}\n\n.p-rating:not(.p-disabled):not(.p-readonly) .p-rating-option:hover .p-rating-icon {\n @apply text-primary\n}\n\n.p-rating-option-active .p-rating-icon {\n @apply text-primary\n}", "ripple": ".p-ink {\n @apply block absolute bg-black/10 dark:bg-white/30 scale-0 rounded-[100%] pointer-events-none\n}\n\n.p-ink-active {\n @apply transition-[opacity,transform] duration-500 scale-[2.5] opacity-0 ease-linear\n}", - "scrollpanel": ".p-scrollpanel-content-container {\n @apply overflow-hidden w-full h-full relative z-10 float-left\n}\n\n.p-scrollpanel-content {\n @apply relative overflow-auto \n h-[calc(100%+18px)] w-[calc(100%+18px)]\n pt-0 pl-0 pr-[18px] pb-[18px] [scrollbar-width:none]\n}\n\n.p-scrollpanel-content::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-scrollpanel-bar {\n @apply relative rounded-sm z-20 cursor-pointer opacity-0 \n bg-surface-100 dark:bg-surface-800\n transition-opacity duration-200 border-none\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-scrollpanel-bar-y {\n @apply w-[9px] top-0\n}\n\n.p-scrollpanel-bar-x {\n @apply h-[9px] bottom-0\n}\n\n.p-scrollpanel-hidden {\n @apply invisible\n}\n\n.p-scrollpanel:hover .p-scrollpanel-bar,\n.p-scrollpanel:active .p-scrollpanel-bar {\n @apply opacity-100\n}\n\n.p-scrollpanel-grabbed {\n @apply select-none\n}", + "scrollpanel": ".p-scrollpanel-content-container {\n @apply overflow-hidden w-full h-full relative z-10 float-left\n}\n\n.p-scrollpanel-content {\n @apply relative overflow-auto\n h-[calc(100%+18px)] w-[calc(100%+18px)]\n pt-0 ps-0 pr-[18px] pb-[18px] [scrollbar-width:none]\n}\n\n.p-scrollpanel-content::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-scrollpanel-bar {\n @apply relative rounded-sm z-20 cursor-pointer opacity-0\n bg-surface-100 dark:bg-surface-800\n transition-opacity duration-200 border-none\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-scrollpanel-bar-y {\n @apply w-[9px] top-0\n}\n\n.p-scrollpanel-bar-x {\n @apply h-[9px] bottom-0\n}\n\n.p-scrollpanel-hidden {\n @apply invisible\n}\n\n.p-scrollpanel:hover .p-scrollpanel-bar,\n.p-scrollpanel:active .p-scrollpanel-bar {\n @apply opacity-100\n}\n\n.p-scrollpanel-grabbed {\n @apply select-none\n}\n", "scrolltop": "@import './button';\n\n.p-scrolltop.p-button {\n @apply fixed bottom-5 right-5\n}\n\n.p-scrolltop-sticky.p-button {\n @apply sticky flex ml-auto\n}\n\n.p-scrolltop-enter-from {\n @apply opacity-0\n}\n\n.p-scrolltop-enter-active {\n @apply transition-opacity duration-150\n}\n\n.p-scrolltop.p-scrolltop-leave-to {\n @apply opacity-0\n}\n\n.p-scrolltop-leave-active {\n @apply transition-opacity duration-150\n}", "select": "@import './button';\n@import './inputtext';\n@import './iconfield';\n\n.p-select {\n @apply inline-flex cursor-pointer relative select-none rounded-md\n bg-surface-0 dark:bg-surface-950\n border border-surface-300 dark:border-surface-700\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n transition-colors duration-200\n}\n\n.p-select:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-select:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-select.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-select.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-select.p-disabled {\n @apply bg-surface-200 text-surface-500 dark:bg-surface-700 dark:text-surface-400 opacity-100 cursor-default\n}\n\n.p-select-clear-icon {\n @apply absolute top-1/2 -mt-2 text-surface-500 dark:text-surface-400 end-10\n}\n\n.p-select-dropdown {\n @apply flex items-center justify-center shrink-0 bg-transparent\n text-surface-500 dark:text-surface-400 w-10 rounded-e-md\n}\n\n.p-select-label {\n @apply block whitespace-nowrap overflow-hidden flex-auto w-[1%]\n py-2 px-3 overflow-ellipsis\n text-surface-700 dark:text-surface-0 bg-transparent border-none outline-none\n}\n\n.p-select-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-select:has(.p-select-clear-icon) .p-select-label {\n @apply pe-7\n}\n\n.p-select.p-disabled .p-select-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-select-label-empty {\n @apply overflow-hidden opacity-0\n}\n\ninput.p-select-label {\n @apply cursor-default\n}\n\n.p-select .p-select-overlay {\n @apply min-w-full\n}\n\n.p-select-overlay {\n @apply absolute top-0 left-0 rounded-md\n bg-surface-0 dark:bg-surface-900\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n}\n\n.p-select-header {\n @apply pt-2 pb-1 px-4\n}\n\n.p-select-filter {\n @apply w-full\n}\n\n.p-select-list-container {\n @apply overflow-auto\n}\n\n.p-select-option-group {\n @apply m-0 px-3 py-2 bg-transparent text-surface-500 dark:text-surface-400 font-semibold\n}\n\n.p-select-list {\n @apply m-0 p-1 list-none gap-[2px] flex flex-col\n}\n\n.p-select-option {\n @apply cursor-pointer font-normal whitespace-nowrap relative overflow-hidden flex items-center\n px-3 py-2 border-none text-surface-700 dark:text-surface-0 bg-transparent rounded-sm\n transition-colors duration-200\n}\n\n.p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-select-option.p-select-option-selected {\n @apply bg-highlight\n}\n\n.p-select-option.p-select-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-select-option-check-icon {\n @apply relative -ms-[0.375rem] me-[0.375rem] text-surface-700 dark:text-surface-0\n}\n\n.p-select-empty-message {\n @apply px-3 py-2\n}\n\n.p-select-fluid {\n @apply flex\n}\n", "selectbutton": "@import './togglebutton';\n\n.p-selectbutton {\n @apply inline-flex select-none rounded-md\n}\n\n.p-selectbutton .p-togglebutton {\n @apply rounded-none border-y border-r border-s-0\n}\n\n.p-selectbutton .p-togglebutton:focus-visible {\n @apply relative z-10\n}\n\n.p-selectbutton .p-togglebutton:first-child {\n @apply border-s rounded-s-md\n}\n\n.p-selectbutton .p-togglebutton:last-child {\n @apply rounded-e-md\n}\n\n.p-selectbutton.p-invalid {\n @apply outline outline-offset-0 outline-red-400 dark:outline-red-300\n}\n", @@ -68,7 +68,7 @@ "speeddial": "@import './button';\n\n.p-speeddial {\n @apply static flex gap-2\n}\n\n.p-speeddial-button {\n @apply z-10\n}\n\n.p-speeddial-button.p-speeddial-rotate {\n @apply [transition:transform_250ms_cubic-bezier(0.4,0,0.2,1)_0ms,background_200ms,color_200ms,border-color_200ms] will-change-transform\n}\n\n.p-speeddial-list {\n @apply m-0 p-0 list-none flex items-center justify-center pointer-events-none outline-none z-20 gap-2\n transition-[top] ease-linear duration-200\n}\n\n.p-speeddial-item {\n @apply scale-0 opacity-0 [transition:transform_200ms_cubic-bezier(0.4,0,0.2,1)_0ms,opacity_0.8s] will-change-transform\n}\n\n.p-speeddial-circle .p-speeddial-item,\n.p-speeddial-semi-circle .p-speeddial-item,\n.p-speeddial-quarter-circle .p-speeddial-item {\n @apply absolute\n}\n\n.p-speeddial-mask {\n @apply absolute start-0 top-0 w-full h-full opacity-0 bg-white/40 dark:bg-white/60 rounded-md transition-opacity duration-150\n}\n\n.p-speeddial-mask-visible {\n @apply pointer-events-none opacity-100 transition-opacity duration-150\n}\n\n.p-speeddial-open .p-speeddial-list {\n @apply pointer-events-auto\n}\n\n.p-speeddial-open .p-speeddial-item {\n @apply scale-100 opacity-100\n}\n\n.p-speeddial-open .p-speeddial-rotate {\n @apply rotate-45\n}\n", "splitbutton": "@import './button';\n@import './tieredmenu';\n\n.p-splitbutton {\n @apply inline-flex relative rounded-md\n}\n\n.p-splitbutton-button {\n @apply rounded-e-none border-r-0 enabled:hover:border-r-0 enabled:active:border-r-0 focus-visible:z-10\n}\n\n.p-splitbutton-dropdown {\n @apply rounded-s-none focus-visible:z-10\n}\n\n.p-splitbutton .p-menu {\n @apply min-w-full\n}\n\n.p-splitbutton-fluid {\n @apply w-full\n}\n\n.p-splitbutton-rounded .p-splitbutton-dropdown {\n @apply rounded-e-[2rem]\n}\n\n.p-splitbutton-rounded .p-splitbutton-button {\n @apply rounded-s-[2rem]\n}\n\n.p-splitbutton-raised {\n @apply shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),0_2px_2px_0_rgba(0,0,0,0.14),0_1px_5px_0_rgba(0,0,0,0.12)]\n}\n", "splitter": ".p-splitter {\n @apply flex flex-wrap\n border border-surface-200 dark:border-surface-700 rounded-md\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n}\n\n.p-splitter-vertical {\n @apply flex-col\n}\n\n.p-splitter-gutter {\n @apply flex-grow-0 flex-shrink-0 flex items-center justify-center z-10 bg-surface-200 dark:bg-surface-700\n}\n\n.p-splitter-gutter-handle {\n @apply rounded-md bg-transparent \n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n transition-colors duration-200\n}\n\n.p-splitter-horizontal.p-splitter-resizing {\n @apply cursor-col-resize select-none\n}\n\n.p-splitter-vertical.p-splitter-resizing {\n @apply cursor-row-resize select-none\n}\n\n.p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {\n @apply h-[24px] w-full\n}\n\n.p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {\n @apply w-[24px] h-full\n}\n\n.p-splitter-horizontal > .p-splitter-gutter {\n @apply cursor-col-resize\n}\n\n.p-splitter-vertical > .p-splitter-gutter {\n @apply cursor-row-resize\n}\n\n.p-splitterpanel {\n @apply flex-grow overflow-hidden\n}\n\n.p-splitterpanel-nested {\n @apply flex\n}\n\n.p-splitterpanel .p-splitter {\n @apply flex-grow border-none\n}", - "stepper": ".p-steplist {\n @apply relative flex justify-between items-center m-0 p-0 list-none overflow-x-auto\n}\n\n.p-step {\n @apply relative flex flex-auto items-center gap-4 p-2 last-of-type:flex-initial\n}\n\n.p-step-header {\n @apply border-none inline-flex items-center no-underline cursor-pointer\n transition-colors duration-200 rounded-md bg-transparent p-0 gap-2\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-step.p-disabled .p-step-header {\n @apply cursor-default\n}\n\n\n.p-stepper.p-stepper-readonly .p-step {\n @apply cursor-auto\n}\n\n.p-step-title {\n @apply block whitespace-nowrap overflow-hidden text-ellipsis max-w-full\n text-surface-500 dark:text-surface-400 font-medium transition-colors duration-200\n}\n\n.p-step-number {\n @apply flex items-center justify-center text-surface-500 dark:text-surface-400\n bg-surface-0 dark:bg-surface-900 border-2 border-surface-200 dark:border-surface-700\n min-w-8 h-8 leading-8 text-lg font-medium rounded-full z-10 relative\n after:absolute after:w-full after:h-full after:rounded-full after:shadow-[0px_0.5px_0px_0px_rgba(0,0,0,0.06),0px_1px_1px_0px_rgba(0,0,0,0.12)]\n}\n\n.p-step-active .p-step-header {\n @apply cursor-default\n}\n\n.p-step-active .p-step-number {\n @apply bg-surface-0 dark:bg-surface-900 text-primary border-surface-200 dark:border-surface-700\n}\n\n.p-step-active .p-step-title {\n @apply text-primary\n}\n\n.p-step:not(.p-disabled):focus-visible {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-step:has(~ .p-step-active) .p-stepper-separator {\n @apply bg-primary\n}\n\n.p-stepper-separator {\n @apply flex-1 bg-surface-200 dark:bg-surface-700 w-full h-[2px] transition-colors duration-200\n}\n\n.p-steppanels {\n @apply pt-[0.875rem] pb-[1.125rem] px-2\n}\n\n.p-steppanel {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-stepper:has(.p-stepitem) {\n @apply flex flex-col\n}\n\n.p-stepitem {\n @apply flex flex-col flex-initial\n}\n\n.p-stepitem.p-stepitem-active {\n @apply flex-auto\n}\n\n.p-stepitem .p-step {\n @apply flex-initial\n}\n\n.p-stepitem .p-steppanel-content {\n @apply w-full pl-4\n}\n\n.p-stepitem .p-steppanel {\n @apply flex flex-auto\n}\n\n.p-stepitem .p-stepper-separator {\n @apply flex-grow-0 flex-shrink-0 basis-auto w-[2px] h-auto ml-[1.625rem] relative left-[-2.5px]\n}\n\n.p-stepitem:has(~ .p-stepitem-active) .p-stepper-separator {\n @apply bg-primary\n}\n\n.p-stepitem:last-of-type .p-steppanel {\n @apply ps-8\n}", + "stepper": ".p-steplist {\n @apply relative flex justify-between items-center m-0 p-0 list-none overflow-x-auto\n}\n\n.p-step {\n @apply relative flex flex-auto items-center gap-4 p-2 last-of-type:flex-initial\n}\n\n.p-step-header {\n @apply border-none inline-flex items-center no-underline cursor-pointer\n transition-colors duration-200 rounded-md bg-transparent p-0 gap-2\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-step.p-disabled .p-step-header {\n @apply cursor-default\n}\n\n\n.p-stepper.p-stepper-readonly .p-step {\n @apply cursor-auto\n}\n\n.p-step-title {\n @apply block whitespace-nowrap overflow-hidden text-ellipsis max-w-full\n text-surface-500 dark:text-surface-400 font-medium transition-colors duration-200\n}\n\n.p-step-number {\n @apply flex items-center justify-center text-surface-500 dark:text-surface-400\n bg-surface-0 dark:bg-surface-900 border-2 border-surface-200 dark:border-surface-700\n min-w-8 h-8 leading-8 text-lg font-medium rounded-full z-10 relative\n after:absolute after:w-full after:h-full after:rounded-full after:shadow-[0px_0.5px_0px_0px_rgba(0,0,0,0.06),0px_1px_1px_0px_rgba(0,0,0,0.12)]\n}\n\n.p-step-active .p-step-header {\n @apply cursor-default\n}\n\n.p-step-active .p-step-number {\n @apply bg-surface-0 dark:bg-surface-900 text-primary border-surface-200 dark:border-surface-700\n}\n\n.p-step-active .p-step-title {\n @apply text-primary\n}\n\n.p-step:not(.p-disabled):focus-visible {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-step:has(~ .p-step-active) .p-stepper-separator {\n @apply bg-primary\n}\n\n.p-stepper-separator {\n @apply flex-1 bg-surface-200 dark:bg-surface-700 w-full h-[2px] transition-colors duration-200\n}\n\n.p-steppanels {\n @apply pt-[0.875rem] pb-[1.125rem] px-2\n}\n\n.p-steppanel {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-stepper:has(.p-stepitem) {\n @apply flex flex-col\n}\n\n.p-stepitem {\n @apply flex flex-col flex-initial\n}\n\n.p-stepitem.p-stepitem-active {\n @apply flex-auto\n}\n\n.p-stepitem .p-step {\n @apply flex-initial\n}\n\n.p-stepitem .p-steppanel-content {\n @apply w-full ps-4\n}\n\n.p-stepitem .p-steppanel {\n @apply flex flex-auto\n}\n\n.p-stepitem .p-stepper-separator {\n @apply flex-grow-0 flex-shrink-0 basis-auto w-[2px] h-auto ms-[1.625rem] relative start-[-2.5px]\n}\n\n.p-stepitem:has(~ .p-stepitem-active) .p-stepper-separator {\n @apply bg-primary\n}\n\n.p-stepitem:last-of-type .p-steppanel {\n @apply ps-8\n}\n", "tabs": ".p-tabs {\n @apply flex flex-col\n}\n\n.p-tablist {\n @apply flex relative\n}\n\n.p-tabs-scrollable > .p-tablist {\n @apply overflow-hidden\n}\n\n.p-tablist-viewport {\n @apply overflow-x-auto overflow-y-hidden overscroll-y-contain overscroll-x-auto\n}\n\n.p-tablist-viewport::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-tablist-tab-list {\n @apply relative flex bg-surface-0 dark:bg-surface-900 border-b border-surface-200 dark:border-surface-700\n}\n\n.p-tablist-content {\n @apply flex-grow\n}\n\n.p-tablist-nav-button {\n @apply absolute flex-shrink-0 top-0 z-20 h-full flex items-center justify-center cursor-pointer\n bg-surface-0 dark:bg-surface-900 text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-0 w-10\n shadow-[0px_0px_10px_50px_rgba(255,255,255,0.6)] dark:shadow-[0px_0px_10px_50px] dark:shadow-surface-900/50\n focus-visible:z-10 focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-[-1px] focus-visible:outline-primary\n transition-colors duration-200 \n}\n\n.p-tablist-prev-button {\n @apply left-0\n}\n\n.p-tablist-next-button {\n @apply right-0\n}\n\n.p-tab {\n @apply flex-shrink-0 cursor-pointer select-none relative whitespace-nowrap py-4 px-[1.125rem]\n border-b border-surface-200 dark:border-surface-700 font-semibold\n text-surface-500 dark:text-surface-400\n transition-colors duration-200 -mb-px\n}\n\n.p-tab.p-disabled {\n @apply cursor-default\n}\n\n.p-tab:not(.p-disabled):focus-visible {\n @apply z-10 outline outline-1 outline-offset-[-1px] outline-primary\n}\n\n.p-tab:not(.p-tab-active):not(.p-disabled):hover {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-tab-active {\n @apply border-primary text-primary\n}\n\n.p-tabpanels {\n @apply bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n pt-[0.875rem] pb-[1.125rem] px-[1.125rem] outline-none\n}\n\n.p-tablist-active-bar {\n @apply z-10 block absolute -bottom-px h-px bg-primary transition-[left] duration-200 ease-[cubic-bezier(0.35,0,0.25,1)]\n}\n\n.p-tablist-viewport {\n @apply [scrollbar-behavior:smooth] [scrollbar-width:none]\n}", "tag": ".p-tag {\n @apply inline-flex items-center justify-center\n bg-primary-100 dark:bg-primary-500/15\n text-primary-700 dark:text-primary-300\n text-sm font-bold py-1 px-2 rounded-md gap-1\n}\n\n.p-tag-icon {\n @apply text-xs w-3 h-3\n}\n\n.p-tag-rounded {\n @apply rounded-2xl\n}\n\n.p-tag-success {\n @apply bg-green-100 dark:bg-green-500/15 text-green-700 dark:text-green-300\n}\n\n.p-tag-info {\n @apply bg-sky-100 dark:bg-sky-500/15 text-sky-700 dark:text-sky-300\n}\n\n.p-tag-warn {\n @apply bg-orange-100 dark:bg-orange-500/15 text-orange-700 dark:text-orange-300\n}\n\n.p-tag-danger {\n @apply bg-red-100 dark:bg-red-500/15 text-red-700 dark:text-red-300\n}\n\n.p-tag-secondary {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-600 dark:text-surface-300\n}\n\n.p-tag-contrast {\n @apply bg-surface-950 dark:bg-surface-0 text-surface-0 dark:text-surface-950\n}", "tailwind": "@import './common';\n\n/* Form */\n@import './autocomplete';\n@import './cascadeselect';\n@import './checkbox';\n@import './colorpicker';\n@import './datepicker';\n@import './iconfield';\n@import './iftalabel';\n@import './inputgroup';\n@import './inputnumber';\n@import './inputotp';\n@import './inputtext';\n@import './floatlabel';\n@import './knob';\n@import './listbox';\n@import './multiselect';\n@import './password';\n@import './radiobutton';\n@import './rating';\n@import './select';\n@import './selectbutton';\n@import './slider';\n@import './textarea';\n@import './togglebutton';\n@import './toggleswitch';\n@import './treeselect';\n\n/* Button */\n@import './button';\n@import './buttongroup';\n@import './speeddial';\n@import './splitbutton';\n\n/* Data */\n@import './datatable';\n@import './dataview';\n@import './paginator';\n@import './picklist';\n@import './orderlist';\n@import './organizationchart';\n@import './timeline';\n@import './tree';\n@import './treetable';\n\n/* Overlay */\n@import './confirmdialog';\n@import './confirmpopup';\n@import './dialog';\n@import './drawer';\n@import './popover';\n@import './tooltip';\n\n/* Menu */\n@import './breadcrumb';\n@import './contextmenu';\n@import './dock';\n@import './menu';\n@import './menubar';\n@import './megamenu';\n@import './panelmenu';\n@import './tieredmenu';\n\n/* Panel */\n@import './accordion';\n@import './card';\n@import './divider';\n@import './fieldset';\n@import './panel';\n@import './scrollpanel';\n@import './splitter';\n@import './stepper';\n@import './tabs';\n@import './toolbar';\n\n/* File */\n@import './fileupload';\n\n/* Message */\n@import './message';\n@import './toast';\n\n/* Media */\n@import './carousel';\n@import './galleria';\n@import './image';\n@import './imagecompare';\n\n/* Misc */\n@import './avatar';\n@import './badge';\n@import './blockui';\n@import './chip';\n@import './inplace';\n@import './metergroup';\n@import './overlaybadge';\n@import './progressbar';\n@import './progressspinner';\n@import './ripple';\n@import './scrolltop';\n@import './skeleton';\n@import './tag';\n@import './terminal';\n",