@sps-woodland/tabs 7.0.0

package/lib/manifest.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentManifest } from "@sps-woodland/core";
+export declare const MANIFEST: ComponentManifest;

package/lib/style.css

@@ -0,0 +1 @@
+.kz6kzz0{align-items:center;border-top-width:.0625rem;border-right-width:.0625rem;border-style:solid;cursor:pointer;display:flex;font-size:.75rem;font-weight:600;line-height:.875rem;padding:.5rem 1rem}.kz6kzz1{border-bottom-width:0;border-left-width:.0625rem;border-top-left-radius:.25rem;border-top-right-radius:.25rem;color:#717779;margin-bottom:-1px}.kz6kzz2{border-bottom-width:.0625rem;border-left-width:0}.kz6kzz2:first-child{border-left-width:.0625rem;border-bottom-left-radius:.25rem;border-top-left-radius:.25rem}.kz6kzz2:last-child{border-bottom-right-radius:.25rem;border-top-right-radius:.25rem}.kz6kzz5{cursor:not-allowed}.kz6kzz7{background-color:#fff;border-color:#d2d4d4;color:#1f282c}.kz6kzz8{border-color:transparent}.kz6kzz9:hover{background-color:#f3f4f4;border-color:#d2d4d4;box-shadow:0 -.0625rem #d2d4d4 inset}.kz6kzza{background-color:#007db8;border-color:#007db8;color:#fff}.kz6kzzb{background-color:#fff;border-color:#d2d4d4;color:#4b5356}.kz6kzzc:hover{background-color:#f3f4f4}.kz6kzzd{color:#717779}.kz6kzzk{background-color:#fff;color:#4b5356}.fy26er0{display:flex;flex-wrap:wrap}.fy26er1{background-color:#e9e9ea;border-bottom-color:#d2d4d4;border-bottom-style:solid;border-bottom-width:.0625rem;border-top-left-radius:.25rem;border-top-right-radius:.25rem;padding-top:1rem;padding-left:1rem;padding-right:1rem}.fy26er2{margin-bottom:1rem}

package/lib/tab/Tab.css.d.ts

@@ -0,0 +1,11 @@
+import type { RecipeVariants } from "@vanilla-extract/recipes";
+import type { VariantDefinitions, RecipeVariant, BooleanRecipeVariant } from "@sps-woodland/core";
+interface TabVariantDefinitions extends VariantDefinitions {
+    context: RecipeVariant<"container" | "navigation">;
+    active: BooleanRecipeVariant;
+    disabled: BooleanRecipeVariant;
+}
+export declare const tab: import("@vanilla-extract/recipes/dist/declarations/src/types").RuntimeFn<TabVariantDefinitions>;
+export declare type TabVariants = NonNullable<RecipeVariants<typeof tab>>;
+export declare const tabTag: import("@vanilla-extract/recipes/dist/declarations/src/types").RuntimeFn<TabVariantDefinitions>;
+export {};

package/lib/tab/Tab.d.ts

@@ -0,0 +1,9 @@
+import type { TabListState } from "@react-stately/tabs";
+import type { Node } from "@react-types/shared";
+import type { ComponentProps } from "@sps-woodland/core";
+import * as React from "react";
+import type { TabsVariants } from "../tabs/Tabs.css";
+export declare function Tab<T>({ context, item, state, ...rest }: ComponentProps<TabsVariants & {
+    item: Node<T>;
+    state: TabListState<T>;
+}, HTMLDivElement>): React.ReactElement;

package/lib/tab-panel/TabPanel.d.ts

@@ -0,0 +1,8 @@
+import type { TabListState } from "@react-stately/tabs";
+import type { AriaTabPanelProps } from "@react-types/tabs";
+import type { ComponentProps } from "@sps-woodland/core";
+import * as React from "react";
+import type { TabsVariants } from "../tabs/Tabs.css";
+export declare function TabPanel<T>({ context, "data-testid": dataTestId, state, ...rest }: AriaTabPanelProps & ComponentProps<TabsVariants & {
+    state: TabListState<T>;
+}, HTMLDivElement>): React.ReactElement;

package/lib/tabs/Tabs.css.d.ts

@@ -0,0 +1,20 @@
+import type { RecipeVariants } from "@vanilla-extract/recipes";
+export declare const tabs: import("@vanilla-extract/recipes/dist/declarations/src/types").RuntimeFn<{
+    context: {
+        container: {
+            backgroundColor: string;
+            borderBottomColor: string;
+            borderBottomStyle: any;
+            borderBottomWidth: string;
+            borderTopLeftRadius: string;
+            borderTopRightRadius: string;
+            paddingTop: string;
+            paddingLeft: string;
+            paddingRight: string;
+        };
+        navigation: {
+            marginBottom: string;
+        };
+    };
+}>;
+export declare type TabsVariants = RecipeVariants<typeof tabs>;

package/lib/tabs/Tabs.d.ts

@@ -0,0 +1,5 @@
+import type { TabListProps } from "@react-types/tabs";
+import type { ComponentProps } from "@sps-woodland/core";
+import * as React from "react";
+import type { TabsVariants } from "./Tabs.css";
+export declare function Tabs({ className, context, "data-testid": dataTestId, ...rest }: TabListProps<Record<string, unknown>> & ComponentProps<TabsVariants, HTMLDivElement>): React.ReactElement;

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@sps-woodland/tabs",
+  "description": "SPS Woodland Design System tabs component",
+  "version": "7.0.0",
+  "author": "SPS Commerce",
+  "license": "UNLICENSED",
+  "repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/tabs",
+  "homepage": "https://github.com/SPSCommerce/woodland/tree/master/packages/@sps-woodland/tabs#readme",
+  "main": "./lib/index.es.js",
+  "module": "./lib/index.es.js",
+  "types": "./lib/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@react-stately/collections": "^3.3.3",
+    "@sps-woodland/core": "7.0.0",
+    "@sps-woodland/tokens": "7.0.0",
+    "@spscommerce/utils": "^6.12.1",
+    "react": "^16.9.0",
+    "react-dom": "^16.9.0"
+  },
+  "devDependencies": {
+    "@react-stately/collections": "^3.3.3",
+    "@react-types/shared": "^3.8.0",
+    "@react-types/tabs": "^3.0.1",
+    "@types/react": "^16.9.0",
+    "@vanilla-extract/css": "^1.9.1",
+    "@vanilla-extract/recipes": "^0.2.5",
+    "@vanilla-extract/sprinkles": "^1.5.0",
+    "@vanilla-extract/vite-plugin": "^3.6.0",
+    "@sps-woodland/core": "7.0.0",
+    "@sps-woodland/tokens": "7.0.0",
+    "@spscommerce/utils": "^6.12.1",
+    "react": "^16.9.0",
+    "react-dom": "^16.9.0",
+    "vite": "^3.1.4"
+  },
+  "dependencies": {
+    "@react-aria/tabs": "^3.0.1",
+    "@react-stately/tabs": "^3.0.1"
+  },
+  "scripts": {
+    "build": "pnpm run build:js && pnpm run build:types",
+    "build:js": "vite build",
+    "build:types": "tsc --emitDeclarationOnly --declaration --declarationDir lib",
+    "watch": "vite build --watch",
+    "clean": "git clean -fdX",
+    "pub": "node ../../../scripts/publish-package.js"
+  }
+}

package/vite.config.js

@@ -0,0 +1,21 @@
+import path from "path";
+import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
+import { defineConfig } from "vite";
+
+import pkg from "./package.json";
+
+export default defineConfig({
+  plugins: [vanillaExtractPlugin()],
+  build: {
+    lib: {
+      entry: path.resolve(__dirname, "src/index.ts"),
+      formats: ["es", "cjs"],
+      fileName: (format) => `index.${format}.js`,
+    },
+    outDir: path.resolve(__dirname, "./lib"),
+    emptyOutDir: false,
+    rollupOptions: {
+      external: pkg.peerDependencies ? Object.keys(pkg.peerDependencies) : [],
+    },
+  },
+});