@navette-js/panels 0.0.0-stage → 1.0.0-beta.1

package/resources/filament/packages/support/resources/css/components/grid.css

@@ -0,0 +1,511 @@
+.fi-grid {
+    &:not(.fi-grid-direction-col) {
+        @apply grid grid-cols-(--cols-default);
+
+        &.sm\:fi-grid-cols {
+            @apply sm:grid-cols-(--cols-sm);
+        }
+
+        &.md\:fi-grid-cols {
+            @apply md:grid-cols-(--cols-md);
+        }
+
+        &.lg\:fi-grid-cols {
+            @apply lg:grid-cols-(--cols-lg);
+        }
+
+        &.xl\:fi-grid-cols {
+            @apply xl:grid-cols-(--cols-xl);
+        }
+
+        &.\32xl\:fi-grid-cols {
+            @apply 2xl:grid-cols-(--cols-2xl);
+        }
+
+        @supports (container-type: inline-size) {
+            &.\@3xs\:fi-grid-cols {
+                @apply @3xs:grid-cols-(--cols-c3xs);
+            }
+
+            &.\@2xs\:fi-grid-cols {
+                @apply @2xs:grid-cols-(--cols-c2xs);
+            }
+
+            &.\@xs\:fi-grid-cols {
+                @apply @xs:grid-cols-(--cols-cxs);
+            }
+
+            &.\@sm\:fi-grid-cols {
+                @apply @sm:grid-cols-(--cols-csm);
+            }
+
+            &.\@md\:fi-grid-cols {
+                @apply @md:grid-cols-(--cols-cmd);
+            }
+
+            &.\@lg\:fi-grid-cols {
+                @apply @lg:grid-cols-(--cols-clg);
+            }
+
+            &.\@xl\:fi-grid-cols {
+                @apply @xl:grid-cols-(--cols-cxl);
+            }
+
+            &.\@2xl\:fi-grid-cols {
+                @apply @2xl:grid-cols-(--cols-c2xl);
+            }
+
+            &.\@3xl\:fi-grid-cols {
+                @apply @3xl:grid-cols-(--cols-c3xl);
+            }
+
+            &.\@4xl\:fi-grid-cols {
+                @apply @4xl:grid-cols-(--cols-c4xl);
+            }
+
+            &.\@5xl\:fi-grid-cols {
+                @apply @5xl:grid-cols-(--cols-c5xl);
+            }
+
+            &.\@6xl\:fi-grid-cols {
+                @apply @6xl:grid-cols-(--cols-c6xl);
+            }
+
+            &.\@7xl\:fi-grid-cols {
+                @apply @7xl:grid-cols-(--cols-c7xl);
+            }
+        }
+
+        @supports not (container-type: inline-size) {
+            &.\!\@sm\:fi-grid-cols {
+                @apply sm:grid-cols-(--cols-ncsm);
+            }
+
+            &.\!\@md\:fi-grid-cols {
+                @apply md:grid-cols-(--cols-ncmd);
+            }
+
+            &.\!\@lg\:fi-grid-cols {
+                @apply lg:grid-cols-(--cols-nclg);
+            }
+
+            &.\!\@xl\:fi-grid-cols {
+                @apply xl:grid-cols-(--cols-ncxl);
+            }
+
+            &.\!\@2xl\:fi-grid-cols {
+                @apply 2xl:grid-cols-(--cols-nc2xl);
+            }
+        }
+    }
+
+    &.fi-grid-direction-col {
+        @apply columns-(--cols-default);
+
+        &.sm\:fi-grid-cols {
+            @apply sm:columns-(--cols-sm);
+        }
+
+        &.md\:fi-grid-cols {
+            @apply md:columns-(--cols-md);
+        }
+
+        &.lg\:fi-grid-cols {
+            @apply lg:columns-(--cols-lg);
+        }
+
+        &.xl\:fi-grid-cols {
+            @apply xl:columns-(--cols-xl);
+        }
+
+        &.\32xl\:fi-grid-cols {
+            @apply 2xl:columns-(--cols-2xl);
+        }
+
+        @supports (container-type: inline-size) {
+            &.\@3xs\:fi-grid-cols {
+                @apply @3xs:columns-(--cols-c3xs);
+            }
+
+            &.\@2xs\:fi-grid-cols {
+                @apply @2xs:columns-(--cols-c2xs);
+            }
+
+            &.\@xs\:fi-grid-cols {
+                @apply @xs:columns-(--cols-cxs);
+            }
+
+            &.\@sm\:fi-grid-cols {
+                @apply @sm:columns-(--cols-csm);
+            }
+
+            &.\@md\:fi-grid-cols {
+                @apply @md:columns-(--cols-cmd);
+            }
+
+            &.\@lg\:fi-grid-cols {
+                @apply @lg:columns-(--cols-clg);
+            }
+
+            &.\@xl\:fi-grid-cols {
+                @apply @xl:columns-(--cols-cxl);
+            }
+
+            &.\@2xl\:fi-grid-cols {
+                @apply @2xl:columns-(--cols-c2xl);
+            }
+
+            &.\@3xl\:fi-grid-cols {
+                @apply @3xl:columns-(--cols-c3xl);
+            }
+
+            &.\@4xl\:fi-grid-cols {
+                @apply @4xl:columns-(--cols-c4xl);
+            }
+
+            &.\@5xl\:fi-grid-cols {
+                @apply @5xl:columns-(--cols-c5xl);
+            }
+
+            &.\@6xl\:fi-grid-cols {
+                @apply @6xl:columns-(--cols-c6xl);
+            }
+
+            &.\@7xl\:fi-grid-cols {
+                @apply @7xl:columns-(--cols-c7xl);
+            }
+        }
+
+        @supports not (container-type: inline-size) {
+            &.\!\@sm\:fi-grid-cols {
+                @apply sm:columns-(--cols-ncsm);
+            }
+
+            &.\!\@md\:fi-grid-cols {
+                @apply md:columns-(--cols-ncmd);
+            }
+
+            &.\!\@lg\:fi-grid-cols {
+                @apply lg:columns-(--cols-nclg);
+            }
+
+            &.\!\@xl\:fi-grid-cols {
+                @apply xl:columns-(--cols-ncxl);
+            }
+
+            &.\!\@2xl\:fi-grid-cols {
+                @apply 2xl:columns-(--cols-nc2xl);
+            }
+        }
+    }
+}
+
+@supports (container-type: inline-size) {
+    .fi-grid-ctn {
+        @apply @container;
+    }
+}
+
+.fi-grid-col {
+    @apply col-(--col-span-default);
+
+    &.sm\:fi-grid-col-span {
+        @apply sm:col-(--col-span-sm);
+    }
+
+    &.md\:fi-grid-col-span {
+        @apply md:col-(--col-span-md);
+    }
+
+    &.lg\:fi-grid-col-span {
+        @apply lg:col-(--col-span-lg);
+    }
+
+    &.xl\:fi-grid-col-span {
+        @apply xl:col-(--col-span-xl);
+    }
+
+    &.\32xl\:fi-grid-col-span {
+        @apply 2xl:col-(--col-span-2xl);
+    }
+
+    @supports (container-type: inline-size) {
+        &.\@3xs\:fi-grid-col-span {
+            @apply @3xs:col-(--col-span-c3xs);
+        }
+
+        &.\@2xs\:fi-grid-col-span {
+            @apply @2xs:col-(--col-span-c2xs);
+        }
+
+        &.\@xs\:fi-grid-col-span {
+            @apply @xs:col-(--col-span-cxs);
+        }
+
+        &.\@sm\:fi-grid-col-span {
+            @apply @sm:col-(--col-span-csm);
+        }
+
+        &.\@md\:fi-grid-col-span {
+            @apply @md:col-(--col-span-cmd);
+        }
+
+        &.\@lg\:fi-grid-col-span {
+            @apply @lg:col-(--col-span-clg);
+        }
+
+        &.\@xl\:fi-grid-col-span {
+            @apply @xl:col-(--col-span-cxl);
+        }
+
+        &.\@2xl\:fi-grid-col-span {
+            @apply @2xl:col-(--col-span-c2xl);
+        }
+
+        &.\@3xl\:fi-grid-col-span {
+            @apply @3xl:col-(--col-span-c3xl);
+        }
+
+        &.\@4xl\:fi-grid-col-span {
+            @apply @4xl:col-(--col-span-c4xl);
+        }
+
+        &.\@5xl\:fi-grid-col-span {
+            @apply @5xl:col-(--col-span-c5xl);
+        }
+
+        &.\@6xl\:fi-grid-col-span {
+            @apply @6xl:col-(--col-span-c6xl);
+        }
+
+        &.\@7xl\:fi-grid-col-span {
+            @apply @7xl:col-(--col-span-c7xl);
+        }
+    }
+
+    @supports not (container-type: inline-size) {
+        &.\!\@sm\:fi-grid-col-span {
+            @apply sm:col-(--col-span-ncsm);
+        }
+
+        &.\!\@md\:fi-grid-col-span {
+            @apply md:col-(--col-span-ncmd);
+        }
+
+        &.\!\@lg\:fi-grid-col-span {
+            @apply lg:col-(--col-span-nclg);
+        }
+
+        &.\!\@xl\:fi-grid-col-span {
+            @apply xl:col-(--col-span-ncxl);
+        }
+
+        &.\!\@2xl\:fi-grid-col-span {
+            @apply 2xl:col-(--col-span-nc2xl);
+        }
+    }
+
+    &.fi-grid-col-start {
+        @apply col-start-(--col-start-default);
+    }
+
+    &.sm\:fi-grid-col-start {
+        @apply sm:col-start-(--col-start-sm);
+    }
+
+    &.md\:fi-grid-col-start {
+        @apply md:col-start-(--col-start-md);
+    }
+
+    &.lg\:fi-grid-col-start {
+        @apply lg:col-start-(--col-start-lg);
+    }
+
+    &.xl\:fi-grid-col-start {
+        @apply xl:col-start-(--col-start-xl);
+    }
+
+    &.\32xl\:fi-grid-col-start {
+        @apply 2xl:col-start-(--col-start-2xl);
+    }
+
+    @supports (container-type: inline-size) {
+        &.\@3xs\:fi-grid-col-start {
+            @apply @3xs:col-start-(--col-start-c3xs);
+        }
+
+        &.\@2xs\:fi-grid-col-start {
+            @apply @2xs:col-start-(--col-start-c2xs);
+        }
+
+        &.\@xs\:fi-grid-col-start {
+            @apply @xs:col-start-(--col-start-cxs);
+        }
+
+        &.\@sm\:fi-grid-col-start {
+            @apply @sm:col-start-(--col-start-csm);
+        }
+
+        &.\@md\:fi-grid-col-start {
+            @apply @md:col-start-(--col-start-cmd);
+        }
+
+        &.\@lg\:fi-grid-col-start {
+            @apply @lg:col-start-(--col-start-clg);
+        }
+
+        &.\@xl\:fi-grid-col-start {
+            @apply @xl:col-start-(--col-start-cxl);
+        }
+
+        &.\@2xl\:fi-grid-col-start {
+            @apply @2xl:col-start-(--col-start-c2xl);
+        }
+
+        &.\@3xl\:fi-grid-col-start {
+            @apply @3xl:col-start-(--col-start-c3xl);
+        }
+
+        &.\@4xl\:fi-grid-col-start {
+            @apply @4xl:col-start-(--col-start-c4xl);
+        }
+
+        &.\@5xl\:fi-grid-col-start {
+            @apply @5xl:col-start-(--col-start-c5xl);
+        }
+
+        &.\@6xl\:fi-grid-col-start {
+            @apply @6xl:col-start-(--col-start-c6xl);
+        }
+
+        &.\@7xl\:fi-grid-col-start {
+            @apply @7xl:col-start-(--col-start-c7xl);
+        }
+    }
+
+    @supports not (container-type: inline-size) {
+        &.\!\@sm\:fi-grid-col-start {
+            @apply sm:col-start-(--col-start-ncsm);
+        }
+
+        &.\!\@md\:fi-grid-col-start {
+            @apply md:col-start-(--col-start-ncmd);
+        }
+
+        &.\!\@lg\:fi-grid-col-start {
+            @apply lg:col-start-(--col-start-nclg);
+        }
+
+        &.\!\@xl\:fi-grid-col-start {
+            @apply xl:col-start-(--col-start-ncxl);
+        }
+
+        &.\!\@2xl\:fi-grid-col-start {
+            @apply 2xl:col-start-(--col-start-nc2xl);
+        }
+    }
+
+    &.fi-grid-col-order {
+        @apply order-(--col-order-default);
+    }
+
+    &.sm\:fi-grid-col-order {
+        @apply sm:order-(--col-order-sm);
+    }
+
+    &.md\:fi-grid-col-order {
+        @apply md:order-(--col-order-md);
+    }
+
+    &.lg\:fi-grid-col-order {
+        @apply lg:order-(--col-order-lg);
+    }
+
+    &.xl\:fi-grid-col-order {
+        @apply xl:order-(--col-order-xl);
+    }
+
+    &.\32xl\:fi-grid-col-order {
+        @apply 2xl:order-(--col-order-2xl);
+    }
+
+    @supports (container-type: inline-size) {
+        &.\@3xs\:fi-grid-col-order {
+            @apply @3xs:order-(--col-order-c3xs);
+        }
+
+        &.\@2xs\:fi-grid-col-order {
+            @apply @2xs:order-(--col-order-c2xs);
+        }
+
+        &.\@xs\:fi-grid-col-order {
+            @apply @xs:order-(--col-order-cxs);
+        }
+
+        &.\@sm\:fi-grid-col-order {
+            @apply @sm:order-(--col-order-csm);
+        }
+
+        &.\@md\:fi-grid-col-order {
+            @apply @md:order-(--col-order-cmd);
+        }
+
+        &.\@lg\:fi-grid-col-order {
+            @apply @lg:order-(--col-order-clg);
+        }
+
+        &.\@xl\:fi-grid-col-order {
+            @apply @xl:order-(--col-order-cxl);
+        }
+
+        &.\@2xl\:fi-grid-col-order {
+            @apply @2xl:order-(--col-order-c2xl);
+        }
+
+        &.\@3xl\:fi-grid-col-order {
+            @apply @3xl:order-(--col-order-c3xl);
+        }
+
+        &.\@4xl\:fi-grid-col-order {
+            @apply @4xl:order-(--col-order-c4xl);
+        }
+
+        &.\@5xl\:fi-grid-col-order {
+            @apply @5xl:order-(--col-order-c5xl);
+        }
+
+        &.\@6xl\:fi-grid-col-order {
+            @apply @6xl:order-(--col-order-c6xl);
+        }
+
+        &.\@7xl\:fi-grid-col-order {
+            @apply @7xl:order-(--col-order-c7xl);
+        }
+    }
+
+    @supports not (container-type: inline-size) {
+        &.\!\@sm\:fi-grid-col-order {
+            @apply sm:order-(--col-order-ncsm);
+        }
+
+        &.\!\@md\:fi-grid-col-order {
+            @apply md:order-(--col-order-ncmd);
+        }
+
+        &.\!\@lg\:fi-grid-col-order {
+            @apply lg:order-(--col-order-nclg);
+        }
+
+        &.\!\@xl\:fi-grid-col-order {
+            @apply xl:order-(--col-order-ncxl);
+        }
+
+        &.\!\@2xl\:fi-grid-col-order {
+            @apply 2xl:order-(--col-order-nc2xl);
+        }
+    }
+
+    &.fi-hidden {
+        @apply hidden;
+    }
+}

package/resources/filament/packages/support/resources/css/components/icon-button.css

@@ -0,0 +1,124 @@
+.fi-icon-btn {
+    @apply relative -m-2 flex size-9 items-center justify-center rounded-lg text-gray-500 transition duration-75 outline-none dark:text-gray-500;
+
+    &.fi-force-enabled,
+    &:not(.fi-disabled):not([disabled]) {
+        @apply focus-visible:ring-primary-600 dark:focus-visible:ring-primary-500 hover:text-gray-600 focus-visible:ring-2 dark:hover:text-gray-400;
+    }
+
+    &.fi-disabled:not(.fi-force-enabled),
+    &[disabled]:not(.fi-force-enabled) {
+        @apply cursor-default opacity-70;
+
+        &:not([x-tooltip]) {
+            @apply pointer-events-none;
+        }
+    }
+
+    &.fi-size-xs {
+        @apply size-7;
+
+        &:has(.fi-icon.fi-size-sm) {
+            @apply -m-1.5;
+        }
+
+        &:has(.fi-icon.fi-size-md) {
+            @apply -m-1;
+        }
+
+        &:has(.fi-icon.fi-size-lg) {
+            @apply -m-0.5;
+        }
+    }
+
+    &.fi-size-sm {
+        @apply size-8;
+
+        &:has(.fi-icon.fi-size-sm) {
+            @apply -m-2;
+        }
+
+        &:has(.fi-icon.fi-size-md) {
+            @apply -m-1.5;
+        }
+
+        &:has(.fi-icon.fi-size-lg) {
+            @apply -m-1;
+        }
+    }
+
+    &.fi-size-md {
+        &:has(.fi-icon.fi-size-sm) {
+            @apply -m-2.5;
+        }
+
+        &:has(.fi-icon.fi-size-lg) {
+            @apply -m-1.5;
+        }
+    }
+
+    &.fi-size-lg {
+        @apply size-10;
+
+        &:has(.fi-icon.fi-size-sm) {
+            @apply -m-3;
+        }
+
+        &:has(.fi-icon.fi-size-md) {
+            @apply -m-2.5;
+        }
+
+        &:has(.fi-icon.fi-size-lg) {
+            @apply -m-2;
+        }
+    }
+
+    &.fi-size-xl {
+        @apply size-11;
+
+        &:has(.fi-icon.fi-size-sm) {
+            @apply -m-3.5;
+        }
+
+        &:has(.fi-icon.fi-size-md) {
+            @apply -m-3;
+        }
+
+        &:has(.fi-icon.fi-size-lg) {
+            @apply -m-2.5;
+        }
+    }
+
+    &.fi-color {
+        @apply text-(--text) dark:text-(--dark-text);
+
+        &.fi-force-enabled,
+        &:not(.fi-disabled):not([disabled]) {
+            @apply focus-visible:ring-color-600 dark:focus-visible:ring-color-500 hover:text-(--hover-text) dark:hover:text-(--dark-hover-text);
+        }
+    }
+
+    & > .fi-icon-btn-badge-ctn {
+        @apply absolute start-full top-1 z-[1] flex w-max -translate-x-1/2 -translate-y-1/2 rounded-md bg-white rtl:translate-x-1/2 dark:bg-gray-900;
+    }
+
+    &:has(+ .fi-btn.fi-labeled-from-sm) {
+        @apply sm:hidden;
+    }
+
+    &:has(+ .fi-btn.fi-labeled-from-md) {
+        @apply md:hidden;
+    }
+
+    &:has(+ .fi-btn.fi-labeled-from-lg) {
+        @apply lg:hidden;
+    }
+
+    &:has(+ .fi-btn.fi-labeled-from-xl) {
+        @apply xl:hidden;
+    }
+
+    &:has(+ .fi-btn.fi-labeled-from-2xl) {
+        @apply 2xl:hidden;
+    }
+}

package/resources/filament/packages/support/resources/css/components/icon.css

@@ -0,0 +1,31 @@
+.fi-icon {
+    @apply size-5;
+
+    &.fi-size-xs {
+        @apply size-3;
+    }
+
+    &.fi-size-sm {
+        @apply size-4;
+    }
+
+    &.fi-size-md {
+        @apply size-5;
+    }
+
+    &.fi-size-lg {
+        @apply size-6;
+    }
+
+    &.fi-size-xl {
+        @apply size-7;
+    }
+
+    &.fi-size-2xl {
+        @apply size-8;
+    }
+
+    & > svg {
+        @apply h-[inherit] w-[inherit];
+    }
+}

package/resources/filament/packages/support/resources/css/components/input/checkbox.css

@@ -0,0 +1,32 @@
+input[type='checkbox'].fi-checkbox-input {
+    @apply text-primary-600 checked:bg-primary-600 focus:ring-primary-600 checked:focus:ring-primary-500/50 dark:text-primary-500 dark:checked:bg-primary-500 dark:focus:ring-primary-500 dark:checked:focus:ring-primary-400/50 size-4 appearance-none rounded border-none bg-white align-middle shadow-sm ring-1 ring-gray-950/10 checked:ring-0 focus:ring-2 focus:ring-offset-0 focus:outline-none disabled:pointer-events-none disabled:bg-gray-50 disabled:text-gray-50 disabled:checked:bg-gray-400 disabled:checked:text-gray-400 dark:bg-white/5 dark:ring-white/20 dark:disabled:bg-transparent dark:disabled:ring-white/10 dark:disabled:checked:bg-gray-600;
+
+    &:checked {
+        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E");
+    }
+
+    &:indeterminate {
+        @apply bg-primary-600 dark:bg-primary-500 ring-0;
+        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.5 6.75a1.25 1.25 0 0 0 0 2.5h7a1.25 1.25 0 0 0 0-2.5h-7z'/%3E%3C/svg%3E");
+
+        &:focus {
+            @apply ring-primary-500/50 dark:ring-primary-400/50 ring-2;
+        }
+
+        &:disabled {
+            @apply bg-gray-400 dark:bg-gray-600;
+        }
+    }
+
+    &.fi-invalid {
+        @apply text-danger-600 checked:bg-danger-600 ring-danger-600 focus:ring-danger-600 checked:focus:ring-danger-500/50 dark:text-danger-500 dark:checked:bg-danger-500 dark:ring-danger-500 dark:checked:bg-danger-500 dark:focus:ring-danger-500 dark:checked:focus:ring-danger-400/50;
+
+        &:indeterminate {
+            @apply bg-danger-600 dark:bg-danger-500;
+
+            &:focus {
+                @apply ring-danger-500/50 dark:ring-danger-400/50;
+            }
+        }
+    }
+}