@ropav/styles 0.3.0 → 0.5.0

package/dist/components/separator.css

@@ -17,17 +17,34 @@
   @apply h-auto min-h-2 w-px self-stretch;
 }
 
-/* Color variants */
+/* Color variants
+ *
+ * The whole separator *is* its background, so Forced Colors Mode flattening it onto the page
+ * removes the rule entirely rather than weakening it. Each variant restates the fallback because
+ * each one sets `background-color` after the base rule and would otherwise win. All three land on
+ * the same ink - the mode has no second tier to give them. */
 .separator--default {
   @apply bg-separator;
+
+  @media (forced-colors: active) {
+    background-color: CanvasText;
+  }
 }
 
 .separator--secondary {
   @apply bg-separator-secondary;
+
+  @media (forced-colors: active) {
+    background-color: CanvasText;
+  }
 }
 
 .separator--tertiary {
   @apply bg-separator-tertiary;
+
+  @media (forced-colors: active) {
+    background-color: CanvasText;
+  }
 }
 
 .separator__container {

package/dist/components/sidebar/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./sidebar.styles";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/sidebar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}

package/dist/components/sidebar/index.js

@@ -0,0 +1,2 @@
+import { sidebarVariants } from "./sidebar.styles.js";
+export { sidebarVariants };

package/dist/components/sidebar/sidebar.styles.d.ts

@@ -0,0 +1,190 @@
+import type { VariantProps } from "tailwind-variants";
+export declare const sidebarVariants: import("tailwind-variants").TVReturnType<{
+    collapsible: {
+        icon: {
+            panel: string;
+        };
+        none: {
+            panel: string;
+        };
+        offcanvas: {
+            panel: string;
+        };
+    };
+    inDrawer: {
+        true: {
+            panel: string;
+        };
+    };
+    isCollapsible: {
+        true: {
+            subMenu: string;
+        };
+    };
+    isResizable: {
+        true: {
+            rail: string;
+        };
+    };
+    isSub: {
+        true: {
+            item: string;
+        };
+    };
+    side: {
+        left: {
+            base: string;
+            panel: string;
+        };
+        right: {
+            base: string;
+            panel: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+    footer: string;
+    group: string;
+    groupLabel: string;
+    header: string;
+    inset: string;
+    item: string;
+    itemIcon: string;
+    itemIndicator: string;
+    itemLabel: string;
+    itemTooltip: string;
+    itemTrailing: string;
+    panel: string;
+    rail: string;
+    railTarget: string;
+    separator: string;
+    subMenu: string;
+    trigger: string;
+}, undefined, {
+    collapsible: {
+        icon: {
+            panel: string;
+        };
+        none: {
+            panel: string;
+        };
+        offcanvas: {
+            panel: string;
+        };
+    };
+    inDrawer: {
+        true: {
+            panel: string;
+        };
+    };
+    isCollapsible: {
+        true: {
+            subMenu: string;
+        };
+    };
+    isResizable: {
+        true: {
+            rail: string;
+        };
+    };
+    isSub: {
+        true: {
+            item: string;
+        };
+    };
+    side: {
+        left: {
+            base: string;
+            panel: string;
+        };
+        right: {
+            base: string;
+            panel: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+    footer: string;
+    group: string;
+    groupLabel: string;
+    header: string;
+    inset: string;
+    item: string;
+    itemIcon: string;
+    itemIndicator: string;
+    itemLabel: string;
+    itemTooltip: string;
+    itemTrailing: string;
+    panel: string;
+    rail: string;
+    railTarget: string;
+    separator: string;
+    subMenu: string;
+    trigger: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    collapsible: {
+        icon: {
+            panel: string;
+        };
+        none: {
+            panel: string;
+        };
+        offcanvas: {
+            panel: string;
+        };
+    };
+    inDrawer: {
+        true: {
+            panel: string;
+        };
+    };
+    isCollapsible: {
+        true: {
+            subMenu: string;
+        };
+    };
+    isResizable: {
+        true: {
+            rail: string;
+        };
+    };
+    isSub: {
+        true: {
+            item: string;
+        };
+    };
+    side: {
+        left: {
+            base: string;
+            panel: string;
+        };
+        right: {
+            base: string;
+            panel: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+    footer: string;
+    group: string;
+    groupLabel: string;
+    header: string;
+    inset: string;
+    item: string;
+    itemIcon: string;
+    itemIndicator: string;
+    itemLabel: string;
+    itemTooltip: string;
+    itemTrailing: string;
+    panel: string;
+    rail: string;
+    railTarget: string;
+    separator: string;
+    subMenu: string;
+    trigger: string;
+}>>;
+export type SidebarVariants = VariantProps<typeof sidebarVariants>;
+//# sourceMappingURL=sidebar.styles.d.ts.map

package/dist/components/sidebar/sidebar.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.styles.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/sidebar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AActD,eAAO,MAAM,eAAe;;QA4BtB,IAAI;YACF,KAAK;;QAEP,IAAI;YACF,KAAK;;QAEP,SAAS;YACP,KAAK;;;;QAMP,IAAI;YACF,KAAK;;;;QAMP,IAAI;YACF,OAAO;;;;QAMT,IAAI;YACF,IAAI;;;;QAMN,IAAI;YACF,IAAI;;;;QAIN,IAAI;YACF,IAAI;YACJ,KAAK;;QAEP,KAAK;YACH,IAAI;YACJ,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIX,CAAC;AAEH,MAAM,MAAM,eAAe,GAAG,YAAY,CAAC,OAAO,eAAe,CAAC,CAAC"}

package/dist/components/sidebar/sidebar.styles.js

@@ -0,0 +1,52 @@
+import { tv } from "tailwind-variants";
+//#region src/components/sidebar/sidebar.styles.ts
+const sidebarVariants = tv({
+	defaultVariants: {
+		collapsible: "icon",
+		side: "left"
+	},
+	slots: {
+		base: "sidebar",
+		content: "sidebar__content",
+		footer: "sidebar__footer",
+		group: "sidebar__group",
+		groupLabel: "sidebar__group-label",
+		header: "sidebar__header",
+		inset: "sidebar__inset",
+		item: "sidebar__item",
+		itemIcon: "sidebar__item-icon",
+		itemIndicator: "sidebar__item-indicator",
+		itemLabel: "sidebar__item-label",
+		itemTooltip: "sidebar__item-tooltip",
+		itemTrailing: "sidebar__item-trailing",
+		panel: "sidebar__panel",
+		rail: "sidebar__rail",
+		railTarget: "sidebar__rail-target",
+		separator: "sidebar__separator",
+		subMenu: "sidebar__sub-menu",
+		trigger: "sidebar__trigger"
+	},
+	variants: {
+		collapsible: {
+			icon: { panel: "sidebar__panel--icon" },
+			none: { panel: "sidebar__panel--none" },
+			offcanvas: { panel: "sidebar__panel--offcanvas" }
+		},
+		inDrawer: { true: { panel: "sidebar__panel--drawer" } },
+		isCollapsible: { true: { subMenu: "sidebar__sub-menu--collapsible" } },
+		isResizable: { true: { rail: "sidebar__rail--resizable" } },
+		isSub: { true: { item: "sidebar__item--sub" } },
+		side: {
+			left: {
+				base: "sidebar--left",
+				panel: "sidebar__panel--left"
+			},
+			right: {
+				base: "sidebar--right",
+				panel: "sidebar__panel--right"
+			}
+		}
+	}
+});
+//#endregion
+export { sidebarVariants };