diff --git a/doc/common/presetdoc/index.json b/doc/common/presetdoc/index.json index b9476c4f..a9f8b99b 100644 --- a/doc/common/presetdoc/index.json +++ b/doc/common/presetdoc/index.json @@ -1,7 +1,7 @@ { "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}", + "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 -ms-4\n}\n\n.p-avatar-group .p-avatar {\n @apply border-2 border-surface-200 dark:border-surface-700\n}\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}", "blockui": ".p-blockui {\n @apply relative\n}\n\n.p-blockui-mask {\n @apply rounded-md\n}\n\n.p-blockui-mask.p-overlay-mask {\n @apply absolute\n}\n\n.p-blockui-mask-document.p-overlay-mask {\n @apply fixed\n}", "breadcrumb": ".p-breadcrumb {\n @apply bg-surface-0 dark:bg-surface-900 p-4 overflow-x-auto\n}\n\n.p-breadcrumb-list {\n @apply m-0 p-0 list-none flex items-center flex-nowrap gap-2\n}\n\n.p-breadcrumb-separator {\n @apply flex items-center text-surface-400 dark:text-surface-500\n}\n\n.p-breadcrumb-separator-icon:dir(rtl) {\n @apply rotate-180\n}\n\n.p-breadcrumb::-webkit-scrollbar {\n @apply hidden\n}\n\n.p-breadcrumb-item-link {\n @apply no-underline flex items-center gap-2 transition-colors duration-200 rounded-md\n text-surface-500 dark:text-surface-400\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-breadcrumb-item-link:hover .p-breadcrumb-item-label {\n @apply text-surface-700 dark:text-surface-0\n}\n\n.p-breadcrumb-item-label {\n @apply transition-colors duration-200\n}\n\n.p-breadcrumb-item-icon {\n @apply text-surface-400 dark:text-surface-500 transition-colors duration-200\n}\n\n.p-breadcrumb-item-link:hover .p-breadcrumb-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n", @@ -11,7 +11,7 @@ "carousel": "@import './button';\n\n.p-carousel {\n @apply flex flex-col\n}\n\n.p-carousel-content-container {\n @apply flex flex-col overflow-auto\n}\n\n.p-carousel-content {\n @apply flex flex-row gap-1\n}\n\n.p-carousel-content:dir(rtl) {\n @apply flex-row-reverse\n}\n\n.p-carousel-viewport {\n @apply overflow-hidden w-full\n}\n\n.p-carousel-item-list {\n @apply flex flex-row\n}\n\n.p-carousel-prev-button,\n.p-carousel-next-button {\n @apply self-center flex-shrink-0\n}\n\n.p-carousel-indicator-list {\n @apply flex flex-row justify-center flex-wrap p-4 gap-2 m-0 list-none\n}\n\n.p-carousel-indicator-list:dir(rtl) {\n @apply rtl:flex-row-reverse\n}\n\n.p-carousel-indicator-button {\n @apply flex items-center justify-center w-8 h-2 border-none rounded-md p-0 m-0 select-none cursor-pointer transition-colors duration-200\n bg-surface-200 hover:bg-surface-300 dark:bg-surface-700 dark:hover:bg-surface-600\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-carousel-indicator-active .p-carousel-indicator-button {\n @apply bg-primary\n}\n\n.p-carousel-vertical .p-carousel-content {\n @apply flex-col\n}\n\n.p-carousel-vertical .p-carousel-item-list {\n @apply flex-col h-full\n}\n\n.p-items-hidden .p-carousel-item {\n @apply invisible\n}\n\n.p-items-hidden .p-carousel-item.p-carousel-item-active {\n @apply visible\n}\n", "cascadeselect": ".p-cascadeselect {\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-cascadeselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-cascadeselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-cascadeselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-cascadeselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-cascadeselect.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-cascadeselect-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-cascadeselect-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-cascadeselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-clearable .p-cascadeselect-label {\n @apply pe-7\n}\n\n.p-cascadeselect.p-disabled .p-cascadeselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-label-empty {\n @apply overflow-hidden opacity-0\n}\n\n.p-cascadeselect-fluid {\n @apply flex\n}\n\n.p-cascadeselect-fluid .p-cascadeselect-label {\n @apply w-[1%]\n}\n\n.p-cascadeselect-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-cascadeselect .p-cascadeselect-overlay {\n @apply min-w-full\n}\n\n.p-cascadeselect-option-list {\n @apply hidden min-w-full absolute z-10\n}\n\n.p-cascadeselect-list {\n @apply min-w-full m-0 list-none p-1 flex flex-col gap-[2px]\n}\n\n.p-cascadeselect-option {\n @apply cursor-pointer font-normal whitespace-nowrap\n text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200 rounded-sm\n}\n\n.p-cascadeselect-option-active {\n @apply overflow-visible\n}\n\n.p-cascadeselect-option-active > .p-cascadeselect-option-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-cascadeselect-option:not(.p-cascadeselect-option-selected):not(.p-disabled).p-focus > .p-cascadeselect-option-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-cascadeselect-option:not(.p-cascadeselect-option-selected):not(.p-disabled).p-focus .p-cascadeselect-group-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-cascadeselect-option-selected .p-cascadeselect-option-content {\n @apply bg-highlight\n}\n\n.p-cascadeselect-option-selected.p-focus {\n @apply bg-highlight-emphasis\n}\n\n.p-cascadeselect-option-active > .p-cascadeselect-option-list {\n @apply block start-full top-0\n}\n\n.p-cascadeselect-option-content {\n @apply flex items-center justify-between overflow-hidden relative px-3 py-2\n}\n\n.p-cascadeselect-group-icon {\n @apply text-sm w-[0.875rem] h-[0.875rem] text-surface-400 dark:text-surface-500\n}\n\n.p-cascadeselect-group-icon:dir(rtl) {\n @apply rotate-180\n}\n\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-content {\n @apply rounded-sm\n}\n\n.p-cascadeselect-mobile-active-active .p-cascadeselect-list {\n @apply flex flex-col top-full start-0 z-10\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-list > .p-cascadeselect-option > .p-cascadeselect-option-content .p-cascadeselect-group-icon {\n @apply ms-auto transition-transform duration-200\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-list .p-cascadeselect-group-icon {\n @apply transition-transform duration-200 rotate-90\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-active > .p-cascadeselect-option-content .p-cascadeselect-group-icon {\n @apply -rotate-90\n}\n\n.p-cascadeselect-mobile-active .p-cascadeselect-option-list {\n @apply static shadow-none border-none ps-4\n}\n", "checkbox": ".p-checkbox {\n @apply relative inline-flex select-none w-5 h-5 align-bottom\n}\n\n.p-checkbox-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-sm\n}\n\n.p-checkbox-box {\n @apply flex justify-center items-center rounded-sm w-5 h-5\n border border-surface-300 dark:border-surface-700\n bg-surface-0 dark:bg-surface-950\n transition-colors duration-200\n shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]\n}\n\n.p-checkbox-icon {\n @apply text-surface-700 dark:text-surface-0\n text-sm w-[0.875rem] h-[0.875rem]\n transition-colors duration-200\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-checkbox-checked .p-checkbox-box {\n @apply border-primary bg-primary\n}\n\n.p-checkbox-checked .p-checkbox-icon {\n @apply text-primary-contrast\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n @apply bg-primary-emphasis border-primary-emphasis\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-icon {\n @apply text-primary-contrast\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible) .p-checkbox-box {\n @apply outline outline-1 outline-offset-2 outline-primary\n}\n\n.p-checkbox.p-invalid > .p-checkbox-box {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-checkbox.p-variant-filled .p-checkbox-box {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-checkbox.p-disabled {\n @apply opacity-100\n}\n\n.p-checkbox.p-disabled .p-checkbox-box {\n @apply bg-surface-200 dark:bg-surface-400 border-surface-300 dark:border-surface-700\n}\n\n.p-checkbox.p-disabled .p-checkbox-box .p-checkbox-icon {\n @apply text-surface-700 dark:text-surface-400\n}\n", - "chip": ".p-chip {\n @apply inline-flex items-center rounded-2xl gap-2 px-3 py-2\n bg-surface-100 dark:bg-surface-800\n text-surface-800 dark:text-surface-0\n}\n\n.p-chip-icon {\n @apply text-surface-800 dark:bg-surface-0 text-base w-4 h-4\n}\n\n.p-chip-image {\n @apply rounded-full w-8 h-8 -ml-2\n}\n\n.p-chip:has(.p-chip-remove-icon) {\n @apply pr-2\n}\n\n.p-chip:has(.p-chip-image) {\n @apply pt-1 pb-1\n}\n\n.p-chip-remove-icon {\n @apply cursor-pointer text-base w-4 h-4 rounded-full\n text-surface-800 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}", + "chip": ".p-chip {\n @apply inline-flex items-center rounded-2xl gap-2 px-3 py-2\n bg-surface-100 dark:bg-surface-800\n text-surface-800 dark:text-surface-0\n}\n\n.p-chip-icon {\n @apply text-surface-800 dark:bg-surface-0 text-base w-4 h-4\n}\n\n.p-chip-image {\n @apply rounded-full w-8 h-8 -ms-2\n}\n\n.p-chip:has(.p-chip-remove-icon) {\n @apply pe-2\n}\n\n.p-chip:has(.p-chip-image) {\n @apply pt-1 pb-1\n}\n\n.p-chip-remove-icon {\n @apply cursor-pointer text-base w-4 h-4 rounded-full\n text-surface-800 dark:text-surface-0\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n", "colorpicker": ".p-colorpicker {\n @apply inline-block relative;\n}\n\n.p-colorpicker-dragging {\n @apply cursor-pointer\n}\n\n.p-colorpicker-preview {\n @apply w-6 h-6 p-0 border-none rounded-md transition-colors duration-200 cursor-pointer disabled:cursor-auto\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-colorpicker-panel {\n @apply bg-surface-800 dark:bg-surface-900\n border border-surface-900 dark:border-surface-700\n rounded-md shadow-[0_4px_6px_-1px_rgba(0,0,0,0.1),0_2px_4px_-2px_rgba(0,0,0,0.1)]\n w-[193px] h-[166px] absolute top-0 start-0\n}\n\n.p-colorpicker-panel-inline {\n @apply static shadow-none\n}\n\n.p-colorpicker-content {\n @apply relative;\n}\n\n.p-colorpicker-color-selector {\n @apply w-[150px] h-[150px] top-[8px] start-[8px] absolute\n}\n\n.p-colorpicker-color-background {\n @apply w-full h-full bg-[linear-gradient(to_top,#000_0%,rgba(0,0,0,0)_100%),linear-gradient(to_right,#fff_0%,rgba(255,255,255,0)_100%)];\n}\n\n.p-colorpicker-color-handle {\n @apply absolute top-0 start-[150px] rounded-full w-[10px] h-[10px] border border-surface-0 -mt-[5px] me-0 mb-0 -ms-[5px] cursor-pointer opacity-85\n}\n\n.p-colorpicker-hue {\n @apply w-[17px] h-[150px] top-[8px] start-[167px] absolute opacity-85 bg-[linear-gradient(0deg,red_0,#ff0_17%,#0f0_33%,#0ff_50%,#00f_67%,#f0f_83%,red)];\n}\n\n.p-colorpicker-hue-handle {\n @apply absolute top-[150px] start-0 w-[21px] -ms-[2px] -mt-[5px] h-[10px] border-2 opacity-85 border-surface-0 cursor-pointer\n}\n", "common": ".p-connected-overlay-enter-from {\n @apply opacity-0 scale-y-75\n}\n\n.p-connected-overlay-leave-to {\n @apply opacity-0\n}\n\n.p-connected-overlay-enter-active {\n @apply transition-[opacity,transform] duration-150 ease-[cubic-bezier(0,0,0.2,1)]\n}\n\n.p-connected-overlay-leave-active {\n @apply transition-opacity duration-100 ease-linear\n}\n\n.p-toggleable-content-enter-from,\n.p-toggleable-content-leave-to {\n @apply max-h-0\n}\n\n.p-toggleable-content-enter-to,\n.p-toggleable-content-leave-from {\n @apply max-h-[1000px]\n}\n\n.p-toggleable-content-leave-active {\n @apply overflow-hidden transition-[max-height] animate-duration-[450ms] ease-[cubic-bezier(0,1,0,1)];\n}\n\n.p-toggleable-content-enter-active {\n @apply overflow-hidden transition-[max-height] duration-1000 ease-in-out\n}\n\n.p-disabled,\n.p-disabled * {\n @apply cursor-default pointer-events-none select-none\n}\n\n.p-disabled,\n.p-component:disabled {\n @apply opacity-60\n}\n\n.pi {\n @apply text-base\n}\n\n.p-icon {\n @apply w-4 h-4\n}\n\n.p-overlay-mask {\n @apply bg-black/50 text-surface-200 transition-colors duration-150 fixed top-0 start-0 w-full h-full\n}\n\n.p-overlay-mask-enter {\n animation: p-overlay-mask-enter-animation 150ms forwards;\n}\n\n.p-overlay-mask-leave {\n animation: p-overlay-mask-leave-animation 150ms forwards;\n}\n\n@keyframes p-overlay-mask-enter-animation {\n from {\n background: transparent;\n }\n to {\n background: rgba(0,0,0,0.5);\n }\n}\n\n@keyframes p-overlay-mask-leave-animation {\n from {\n background: rgba(0,0,0,0.5);\n }\n to {\n background: transparent;\n }\n}\n", "confirmdialog": "@import './dialog';\n@import './button';\n\n.p-confirmdialog .p-dialog-content {\n @apply flex items-center gap-4\n}\n\n.p-confirmdialog-icon {\n @apply text-surface-700 dark:text-surface-0 text-[2rem] h-8 w-8\n}", @@ -43,11 +43,11 @@ "menu": ".p-menu {\n @apply bg-surface-0 dark:bg-surface-900 \n text-surface-700 dark:text-surface-0 \n border border-surface-200 dark:border-surface-700\n rounded-md min-w-52\n}\n\n.p-menu-list {\n @apply m-0 p-1 list-none outline-none flex flex-col gap-[2px]\n}\n\n.p-menu-item-content {\n @apply transition-colors duration-200 rounded-sm text-surface-700 dark:text-surface-0\n}\n\n.p-menu-item-link {\n @apply cursor-pointer flex items-center no-underline overflow-hidden relative text-inherit\n px-3 py-2 gap-2 select-none outline-none\n}\n\n.p-menu-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-menu-item.p-focus .p-menu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0 \n}\n\n.p-menu-item.p-focus .p-menu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menu-item:not(.p-disabled) .p-menu-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menu-item:not(.p-disabled) .p-menu-item-content:hover .p-menu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menu-overlay {\n @apply 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-menu-submenu-label {\n @apply bg-transparent px-3 py-2 text-surface-500 dark:text-surface-400 font-semibold\n}\n\n.p-menu-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}", "menubar": ".p-menubar {\n @apply flex items-center rounded-md px-3 py-2 gap-2\n bg-surface-0 dark:bg-surface-900\n text-surface-700 dark:text-surface-0\n border border-surface-200 dark:border-surface-700\n}\n\n.p-menubar-start,\n.p-megamenu-end {\n @apply flex items-center\n}\n\n.p-menubar-root-list,\n.p-menubar-submenu {\n @apply flex m-0 p-0 list-none outline-none\n}\n\n.p-menubar-root-list {\n @apply items-center flex-wrap gap-2\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content {\n @apply rounded-md\n}\n\n.p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {\n @apply px-3 py-2\n}\n\n.p-menubar-item-content {\n @apply transition-colors duration-200 rounded-sm text-surface-700 dark:text-surface-0\n}\n\n.p-menubar-item-link {\n @apply cursor-pointer flex items-center no-underline overflow-hidden relative text-inherit\n px-3 py-2 gap-2 select-none outline-none\n}\n\n.p-menubar-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-menubar-submenu-icon {\n @apply text-surface-400 dark:text-surface-500 ms-auto text-sm w-[0.875rem] h-[0.875rem]\n}\n\n.p-menubar-submenu-icon:dir(rtl) {\n @apply rotate-180\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item.p-focus > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item:not(.p-disabled) > .p-menubar-item-content:hover .p-menubar-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item-active > .p-menubar-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-menubar-submenu {\n @apply hidden absolute min-w-52 z-10\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 flex-col p-1 gap-[2px] rounded-md\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-menubar-submenu .p-menubar-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-menubar-submenu .p-menubar-item {\n @apply relative\n}\n\n .p-menubar-submenu > .p-menubar-item-active > .p-menubar-submenu {\n @apply block start-full top-0\n}\n\n.p-menubar-end {\n @apply ms-auto self-center\n}\n\n.p-menubar-button {\n @apply hidden justify-center items-center cursor-pointer w-7 h-7 relative border-none rounded-full\n text-surface-500 dark:text-surface-400 hover:text-surface-600 dark:hover:text-surface-300\n bg-transparent hover:bg-surface-100 dark:hover:bg-surface-800\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-menubar-mobile {\n @apply relative\n}\n\n.p-menubar-mobile .p-menubar-button {\n @apply flex\n}\n\n.p-menubar-mobile .p-menubar-root-list {\n @apply absolute hidden w-full flex-col top-full start-0 z-10 p-1 gap-[2px] rounded-md\n border border-surface-200 dark:border-surface-700\n bg-surface-0 dark:bg-surface-900\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-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content > .p-menubar-item-link {\n @apply px-3 py-3\n}\n\n.p-menubar-mobile-active .p-menubar-root-list {\n @apply flex\n}\n\n.p-menubar-mobile .p-menubar-root-list .p-menubar-item {\n @apply w-full static\n}\n\n.p-menubar-mobile .p-menubar-root-list .p-menubar-separator {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply ms-auto transition-transform duration-[200ms]\n}\n\n.p-menubar-mobile .p-menubar-root-list > .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply -rotate-180\n}\n\n.p-menubar-mobile .p-menubar-submenu .p-menubar-submenu-icon {\n @apply transition-transform duration-200 rotate-90\n}\n\n.p-menubar-mobile .p-menubar-item-active > .p-menubar-item-content .p-menubar-submenu-icon {\n @apply -rotate-90\n}\n\n.p-menubar-mobile .p-menubar-submenu {\n @apply w-full static shadow-none border-none ps-4 pe-0\n}\n", "message": ".p-message {\n @apply rounded-md outline outline-1\n}\n\n.p-message-content {\n @apply flex items-center px-3 py-2 gap-2 h-full\n}\n\n.p-message-icon {\n @apply flex-shrink-0\n}\n\n.p-message-close-button {\n @apply flex items-center justify-center flex-shrink-0 ms-auto overflow-hidden relative cursor-pointer select-none\n w-7 h-7 rounded-full bg-transparent transition-colors duration-200 text-inherit p-0 border-none\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2\n}\n\n.p-message-info {\n @apply bg-blue-50/95 outline-blue-200 text-blue-600\n dark:bg-blue-500/15 dark:outline-blue-700/35 dark:text-blue-500\n shadow-[0px_4px_8px_0px_theme(colors.blue.500/0.04)]\n}\n\n.p-message-info .p-message-close-button {\n @apply hover:bg-blue-100 focus-visible:outline-blue-600\n dark:hover:bg-white/5 dark:focus-visible:outline-blue-500\n}\n\n.p-message-info.p-message-outlined {\n @apply text-blue-500 outline-blue-500 dark:text-blue-600 dark:outline-blue-600\n}\n\n.p-message-info.p-message-simple {\n @apply text-blue-500 dark:text-blue-600\n}\n\n.p-message-success {\n @apply bg-green-50/95 outline-green-200 text-green-600\n dark:bg-green-500/15 dark:outline-green-700/35 dark:text-green-500\n shadow-[0px_4px_8px_0px_theme(colors.green.500/0.04)]\n}\n\n.p-message-success .p-message-close-button {\n @apply hover:bg-green-100 focus-visible:outline-green-600\n dark:hover:bg-white/5 dark:focus-visible:outline-green-500\n}\n\n.p-message-success.p-message-outlined {\n @apply text-green-500 outline-green-500 dark:text-green-600 dark:outline-green-600\n}\n\n.p-message-success.p-message-simple {\n @apply text-green-500 dark:text-green-600\n}\n\n.p-message-warn {\n @apply bg-yellow-50/95 outline-yellow-200 text-yellow-600\n dark:bg-yellow-500/15 dark:outline-yellow-700/35 dark:text-yellow-500\n shadow-[0px_4px_8px_0px_theme(colors.yellow.500/0.04)]\n}\n\n.p-message-warn .p-message-close-button {\n @apply hover:bg-yellow-100 focus-visible:outline-yellow-600\n dark:hover:bg-white/5 dark:focus-visible:outline-yellow-500\n}\n\n.p-message-warn.p-message-outlined {\n @apply text-yellow-500 outline-yellow-500 dark:text-yellow-600 dark:outline-yellow-600\n}\n\n.p-message-warn.p-message-simple {\n @apply text-yellow-500 dark:text-yellow-600\n}\n\n.p-message-error {\n @apply bg-red-50/95 outline-red-200 text-red-600\n dark:bg-red-500/15 dark:outline-red-700/35 dark:text-red-500\n shadow-[0px_4px_8px_0px_theme(colors.red.500/0.04)]\n}\n\n.p-message-error .p-message-close-button {\n @apply hover:bg-red-100 focus-visible:outline-red-600\n dark:hover:bg-white/5 dark:focus-visible:outline-red-500\n}\n\n.p-message-error.p-message-outlined {\n @apply text-red-500 outline-red-500 dark:text-red-600 dark:outline-red-600\n}\n\n.p-message-error.p-message-simple {\n @apply text-red-500 dark:text-red-600\n}\n\n.p-message-secondary {\n @apply bg-surface-100 outline-surface-200 text-surface-600\n dark:bg-surface-800 dark:outline-surface-700 dark:text-surface-300\n shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)]\n}\n\n.p-message-secondary .p-message-close-button {\n @apply hover:bg-surface-200 focus-visible:outline-surface-600\n dark:hover:bg-surface-700 dark:focus-visible:outline-surface-300\n}\n\n.p-message-secondary.p-message-outlined {\n @apply text-surface-500 outline-surface-500 dark:text-surface-600 dark:outline-surface-600\n}\n\n.p-message-secondary.p-message-simple {\n @apply text-surface-500 dark:text-surface-600\n}\n\n.p-message-contrast {\n @apply bg-surface-900 outline-surface-950 text-surface-50\n dark:bg-surface-0 dark:outline-surface-100 dark:text-surface-950\n shadow-[0px_4px_8px_0px_rgba(0,0,0,0.04)]\n}\n\n.p-message-contrast .p-message-close-button {\n @apply hover:bg-surface-800 focus-visible:outline-surface-50\n dark:hover:bg-surface-100 dark:focus-visible:outline-surface-950\n}\n\n.p-message-contrast.p-message-outlined {\n @apply text-surface-950 outline-surface-950 dark:text-surface-0 dark:outline-surface-0\n}\n\n.p-message-contrast.p-message-simple {\n @apply text-surface-950 dark:text-surface-0\n}\n\n.p-message-text {\n @apply text-base font-medium\n}\n\n.p-message-icon {\n @apply text-lg w-[1.125rem] h-[1.125rem]\n}\n\n.p-message-enter-from {\n @apply opacity-0\n}\n\n.p-message-enter-active {\n @apply transition-opacity duration-300\n}\n\n.p-message.p-message-leave-from {\n @apply max-h-[1000px]\n}\n\n.p-message.p-message-leave-to {\n @apply max-h-0 opacity-0 m-0\n}\n\n.p-message-leave-active {\n @apply overflow-hidden [transition:max-height_0.45s_cubic-bezier(0,1,0,1),opacity_0.3s,margin0.3s]\n}\n\n.p-message-leave-active .p-message-close-button {\n @apply opacity-0\n}\n\n.p-message-sm .p-message-content {\n @apply px-2.5 py-[0.375rem]\n}\n\n.p-message-sm .p-message-text {\n @apply text-sm\n}\n\n.p-message-sm .p-message-icon {\n @apply w-4 h-4 text-sm\n}\n\n.p-message-sm .p-message-close-icon {\n @apply w-3.5 h-3.5 text-sm\n}\n\n.p-message-lg .p-message-content {\n @apply px-3.5 py-2.5\n}\n\n.p-message-lg .p-message-text {\n @apply text-xl\n}\n\n.p-message-lg .p-message-icon {\n @apply w-5 h-5 text-xl\n}\n\n.p-message-lg .p-message-close-icon {\n @apply w-[1.125rem] h-[1.125rem] text-xl\n}\n\n.p-message-outlined {\n @apply bg-transparent outline outline-1\n}\n\n.p-message-simple {\n @apply bg-transparent outline-none shadow-none\n}\n\n.p-message-simple .p-message-content {\n @apply p-0\n}\n\n.p-message-outlined .p-message-close-button:hover,\n.p-message-simple .p-message-close-button:hover {\n @apply bg-transparent\n}\n", - "metergroup": ".p-metergroup {\n @apply flex gap-4\n}\n\n.p-metergroup-meters {\n @apply flex bg-surface-200 dark:bg-surface-700 rounded-md\n}\n\n.p-metergroup-label-list {\n @apply flex flex-wrap m-0 p-0 list-none\n}\n\n.p-metergroup-label {\n @apply inline-flex items-center gap-2\n}\n\n.p-metergroup-label-marker {\n @apply inline-flex w-2 h-2 rounded-full\n}\n\n.p-metergroup-label-icon {\n @apply text-base w-4 h-4\n}\n\n.p-metergroup-horizontal {\n @apply flex-col\n}\n\n.p-metergroup-label-list-horizontal {\n @apply gap-4\n}\n\n.p-metergroup-horizontal .p-metergroup-meters {\n @apply h-2\n}\n\n.p-metergroup-horizontal .p-metergroup-meter:first-of-type {\n @apply rounded-l-md\n}\n\n.p-metergroup-horizontal .p-metergroup-meter:last-of-type {\n @apply rounded-r-md\n}\n\n.p-metergroup-vertical {\n @apply flex-row\n}\n\n.p-metergroup-label-list-vertical {\n @apply flex-col gap-2\n}\n\n.p-metergroup-vertical .p-metergroup-meters {\n @apply flex-col w-2 h-full\n}\n\n.p-metergroup-vertical .p-metergroup-label-list {\n @apply items-start\n}\n\n.p-metergroup-vertical .p-metergroup-meter:first-of-type {\n @apply rounded-t-md\n}\n\n.p-metergroup-vertical .p-metergroup-meter:last-of-type {\n @apply rounded-b-md\n}", + "metergroup": ".p-metergroup {\n @apply flex gap-4\n}\n\n.p-metergroup-meters {\n @apply flex bg-surface-200 dark:bg-surface-700 rounded-md\n}\n\n.p-metergroup-label-list {\n @apply flex flex-wrap m-0 p-0 list-none\n}\n\n.p-metergroup-label {\n @apply inline-flex items-center gap-2\n}\n\n.p-metergroup-label-marker {\n @apply inline-flex w-2 h-2 rounded-full\n}\n\n.p-metergroup-label-icon {\n @apply text-base w-4 h-4\n}\n\n.p-metergroup-horizontal {\n @apply flex-col\n}\n\n.p-metergroup-label-list-horizontal {\n @apply gap-4\n}\n\n.p-metergroup-horizontal .p-metergroup-meters {\n @apply h-2\n}\n\n.p-metergroup-horizontal .p-metergroup-meter:first-of-type {\n @apply rounded-s-md\n}\n\n.p-metergroup-horizontal .p-metergroup-meter:last-of-type {\n @apply rounded-e-md\n}\n\n.p-metergroup-vertical {\n @apply flex-row\n}\n\n.p-metergroup-label-list-vertical {\n @apply flex-col gap-2\n}\n\n.p-metergroup-vertical .p-metergroup-meters {\n @apply flex-col w-2 h-full\n}\n\n.p-metergroup-vertical .p-metergroup-label-list {\n @apply items-start\n}\n\n.p-metergroup-vertical .p-metergroup-meter:first-of-type {\n @apply rounded-ss-md rounded-se-md\n}\n\n.p-metergroup-vertical .p-metergroup-meter:last-of-type {\n @apply rounded-ee-md rounded-es-md\n}\n", "multiselect": "@import './checkbox';\n@import './chip';\n@import './inputtext';\n@import './iconfield';\n\n.p-multiselect {\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-multiselect:not(.p-disabled):hover {\n @apply border-surface-400 dark:border-surface-600\n}\n\n.p-multiselect:not(.p-disabled).p-focus {\n @apply border-primary\n}\n\n.p-multiselect.p-variant-filled {\n @apply bg-surface-50 dark:bg-surface-800\n}\n\n.p-multiselect.p-invalid {\n @apply border-red-400 dark:border-red-300\n}\n\n.p-multiselect.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-multiselect-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-multiselect-label-container {\n @apply overflow-hidden flex-auto\n}\n\n.p-multiselect-label {\n @apply flex items-center gap-1 whitespace-nowrap overflow-hidden text-ellipsis px-3 py-2 text-surface-700 dark:text-surface-0\n}\n\n.p-multiselect-label.p-placeholder {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-multiselect.p-disabled .p-multiselect-label {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-multiselect-label-empty {\n @apply overflow-hidden opacity-0\n}\n\n.p-multiselect .p-multiselect-overlay {\n @apply min-w-full\n}\n\n.p-multiselect-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-multiselect-header {\n @apply flex items-center pt-2 pb-1 px-4\n}\n\n.p-multiselect-header .p-checkbox {\n @apply me-2\n}\n\n.p-multiselect-filter-container {\n @apply flex-auto\n}\n\n.p-multiselect-filter {\n @apply w-full\n}\n\n.p-multiselect-list-container {\n @apply overflow-auto\n}\n\n.p-multiselect-list {\n @apply m-0 p-1 list-none gap-[2px] flex flex-col\n}\n\n.p-multiselect-option {\n @apply cursor-pointer font-normal whitespace-nowrap relative overflow-hidden flex items-center gap-2 px-3 py-2\n rounded-sm text-surface-700 dark:text-surface-0 bg-transparent border-none\n transition-colors duration-200\n}\n\n.p-multiselect-option:not(.p-disabled).p-focus {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-600 dark:text-surface-0\n}\n\n.p-multiselect-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-multiselect-empty-message {\n @apply px-3 py-2\n}\n\n.p-multiselect-label .p-chip {\n @apply py-1 rounded-sm\n}\n\n.p-multiselect-label:has(.p-chip) {\n @apply py-1 px-[0.375rem]\n}\n\n.p-multiselect-fluid {\n @apply flex\n}\n", "orderlist": "@import './button';\n@import './listbox';\n\n.p-orderlist {\n @apply flex gap-[1.125rem]\n}\n\n.p-orderlist-controls {\n @apply flex flex-col justify-center gap-2\n}", "organizationchart": ".p-organizationchart-table {\n @apply border-spacing-0 border-separate my-0 mx-auto\n}\n\n.p-organizationchart-table > tbody > tr > td {\n @apply text-center align-top py-0 px-3\n}\n\n.p-organizationchart-node {\n @apply inline-block relative py-3 px-4 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 transition-colors duration-200\n}\n\n.p-organizationchart-node:has(.p-organizationchart-node-toggle-button) {\n @apply pt-3 px-4 pb-5\n}\n\n.p-organizationchart-node.p-organizationchart-node-selectable:not(.p-organizationchart-node-selected):hover {\n @apply bg-surface-100 text-surface-800 dark:bg-surface-800 dark:text-surface-0\n}\n\n.p-organizationchart-node-selected {\n @apply bg-highlight\n}\n\n.p-organizationchart-node-toggle-button {\n @apply absolute -bottom-3 -ms-3 z-20 start-1/2 select-none cursor-pointer w-6 h-6 no-underline rounded-full\n inline-flex items-center justify-center transition-colors duration-200\n border border-surface-200 dark:border-surface-700\n bg-surface-0 text-surface-500 hover:bg-surface-100 hover:text-surface-700\n dark:bg-surface-900 dark:text-surface-400 dark:hover:bg-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}\n.p-organizationchart-node-toggle-button-icon {\n @apply relative top-px\n}\n\n.p-organizationchart-connector-down {\n @apply my-0 mx-auto h-6 w-px bg-surface-200 dark:bg-surface-700\n}\n\n.p-organizationchart-connector-right {\n @apply rounded-none\n}\n\n.p-organizationchart-connector-left {\n @apply rounded-none border-e border-surface-200 dark:border-surface-700\n}\n\n.p-organizationchart-connector-top {\n @apply border-t border-surface-200 dark:border-surface-700\n}\n\n.p-organizationchart-node-selectable {\n @apply cursor-pointer\n}\n\n.p-organizationchart-connectors :nth-child(1 of .p-organizationchart-connector-left) {\n @apply border-e-0\n}\n\n.p-organizationchart-connectors :nth-last-child(1 of .p-organizationchart-connector-left) {\n @apply rounded-se-md\n}\n\n.p-organizationchart-connectors :nth-child(1 of .p-organizationchart-connector-right) {\n @apply border-s border-surface-200 dark:border-surface-700 rounded-ss-md\n}\n", - "overlaybadge": "@import './badge';\n\n.p-overlaybadge {\n @apply relative\n}\n\n.p-overlaybadge .p-badge {\n @apply absolute top-0 right-0 translate-x-[50%] translate-y-[-50%] origin-[100%_0] m-0 outline outline-2 outline-surface-0 dark:outline-surface-900\n}", + "overlaybadge": "@import './badge';\n\n.p-overlaybadge {\n @apply relative\n}\n\n.p-overlaybadge .p-badge {\n @apply absolute top-0 end-0 translate-x-[50%] translate-y-[-50%] origin-[100%_0] m-0 outline outline-2 outline-surface-0 dark:outline-surface-900\n}\n\n.p-overlaybadge .p-badge:dir(rtl) {\n @apply -translate-x-1/2 -translate-y-1/2\n}\n", "paginator": ".p-paginator {\n @apply flex items-center justify-center flex-wrap py-2 px-4 rounded-md gap-1\n bg-surface-0 dark:bg-surface-900 text-surface-700 dark:text-surface-0\n}\n\n.p-paginator-content {\n @apply flex items-center justify-center flex-wrap gap-1\n}\n\n.p-paginator-content-start {\n @apply ms-auto\n}\n\n.p-paginator-content-end {\n @apply me-auto\n}\n\n.p-paginator-page,\n.p-paginator-next,\n.p-paginator-last,\n.p-paginator-first,\n.p-paginator-prev {\n @apply cursor-pointer inline-flex items-center justify-center leading-none overflow-hidden relative\n bg-transparent border-none min-w-10 h-10 transition-colors duration-200 rounded-full p-0 m-0\n text-surface-500 dark:text-surface-400\n focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-primary\n}\n\n.p-paginator-page:not(.p-disabled):not(.p-paginator-page-selected):hover,\n.p-paginator-first:not(.p-disabled):hover,\n.p-paginator-prev:not(.p-disabled):hover,\n.p-paginator-next:not(.p-disabled):hover,\n.p-paginator-last:not(.p-disabled):hover {\n @apply bg-surface-100 text-surface-600 dark:bg-surface-800 dark:text-surface-300\n}\n\n.p-paginator-page.p-paginator-page-selected {\n @apply bg-highlight\n}\n\n.p-paginator-current {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-paginator-pages {\n @apply flex items-center gap-1\n}\n\n.p-paginator-jtp-input .p-inputtext {\n @apply max-w-10\n}\n\n.p-paginator-first:dir(rtl) {\n @apply order-2\n}\n.p-paginator-prev:dir(rtl) {\n @apply order-1\n}\n.p-paginator-next:dir(rtl) {\n @apply order-[-1]\n}\n.p-paginator-last:dir(rtl) {\n @apply order-[-2]\n}\n", "panel": "@import './button';\n\n.p-panel {\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}\n\n.p-panel-header {\n @apply flex justify-between items-center p-[1.125rem]\n}\n\n.p-panel-toggleable .p-panel-header {\n @apply py-[0.375rem] px-[1.125rem]\n}\n\n.p-panel-title {\n @apply leading-none font-semibold\n}\n\n.p-panel-content {\n @apply pt-0 pb-[1.125rem] px-[1.125rem] \n}\n\n.p-panel-footer {\n @apply pt-0 pb-[1.125rem] px-[1.125rem] \n}", "panelmenu": ".p-panelmenu {\n @apply flex flex-col gap-2\n}\n\n.p-panelmenu-panel {\n @apply bg-surface-0 dark:bg-surface-900 rounded-md p-1\n border border-surface-200 dark:border-surface-700\n text-surface-700 dark:text-surface-0\n}\n\n.p-panelmenu-header {\n @apply outline-none\n}\n\n.p-panelmenu-header-content {\n @apply rounded-md transition-colors duration-200 text-surface-700 dark:text-surface-0\n}\n\n.p-panelmenu-header-link {\n @apply flex items-center gap-2 px-3 py-2 select-none cursor-pointer relative no-underline text-inherit\n}\n\n.p-panelmenu-header-icon,\n.p-panelmenu-item-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-panelmenu-submenu-icon {\n @apply text-surface-400 dark:text-surface-500\n}\n\n.p-panelmenu-header:not(.p-disabled):focus-visible .p-panelmenu-header-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-header:not(.p-disabled):focus-visible .p-panelmenu-header-content .p-panelmenu-header-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-header:not(.p-disabled):focus-visible .p-panelmenu-header-content .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-header:not(.p-panelmenu-header-active) .p-panelmenu-submenu-icon:dir(rtl) {\n @apply rotate-180;\n}\n\n.p-panelmenu-header:not(.p-disabled) .p-panelmenu-header-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-header:not(.p-disabled) .p-panelmenu-header-content:hover .p-panelmenu-header-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-header:not(.p-disabled) .p-panelmenu-header-content:hover .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-submenu {\n @apply m-0 py-0 ps-4 outline-none list-none\n}\n\n.p-panelmenu-item-link {\n @apply flex items-center gap-2 px-3 py-2 select-none cursor-pointer no-underline text-inherit relative overflow-hidden\n}\n\n.p-panelmenu-item-content {\n @apply rounded-md transition-colors duration-200 text-surface-700 dark:text-surface-0\n}\n\n.p-panelmenu-item.p-focus > .p-panelmenu-item-content {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-item.p-focus > .p-panelmenu-item-content .p-panelmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-item.p-focus > .p-panelmenu-item-content .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover {\n @apply bg-surface-100 dark:bg-surface-800 text-surface-800 dark:text-surface-0\n}\n\n.p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover .p-panelmenu-item-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n\n.p-panelmenu-item:not(.p-disabled) > .p-panelmenu-item-content:hover .p-panelmenu-submenu-icon {\n @apply text-surface-500 dark:text-surface-400\n}\n",