@stackshift-ui/button 6.1.0-beta.3 → 7.0.0-beta.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stackshift-ui/button",
-  "version": "6.1.0-beta.3",
+  "version": "7.0.0-beta.6",
   "private": false,
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -35,9 +35,9 @@
     "class-variance-authority": "^0.7.1",
     "classnames": "^2.5.1",
     "react-icons": "^5.3.0",
-    "@stackshift-ui/system": "6.1.0-beta.1",
-    "@stackshift-ui/link": "6.0.12-beta.1",
-    "@stackshift-ui/scripts": "6.1.0-beta.0"
+    "@stackshift-ui/system": "7.0.0-beta.4",
+    "@stackshift-ui/scripts": "7.0.0-beta.3",
+    "@stackshift-ui/link": "7.0.0-beta.4"
   },
   "peerDependencies": {
     "@types/react": "16.8 - 19",

package/src/button.tsx

@@ -1,8 +1,14 @@
 import { Slot } from "@radix-ui/react-slot";
+import { Link } from "@stackshift-ui/link";
+import {
+  buildSanityLink,
+  cn,
+  DefaultComponent,
+  useStackShiftUIComponents,
+} from "@stackshift-ui/system";
 import { cva, type VariantProps } from "class-variance-authority";
 import * as React from "react";
-
-import { cn, DefaultComponent, useStackShiftUIComponents } from "@stackshift-ui/system";
+import { LabeledRoute } from "./types";
 
 const displayName = "Button";
 
@@ -34,25 +40,69 @@ const buttonVariants = cva(
   },
 );
 
-export interface ButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof buttonVariants> {
-  asChild?: boolean;
-}
+type BaseButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> &
+  VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+    iconPosition?: "left" | "right";
+    icon?: React.ReactNode;
+    className?: string;
+    children?: React.ReactNode;
+  };
+
+type LinkButtonProps = BaseButtonProps & {
+  as: "link";
+  link: LabeledRoute;
+};
+
+type DefaultButtonProps = BaseButtonProps & {
+  as?: undefined;
+  link?: never;
+};
+
+export type ButtonProps = LinkButtonProps | DefaultButtonProps;
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  ({ className, variant, size, asChild = false, ...props }, ref) => {
+  (
+    { className, variant, size, asChild = false, iconPosition = "right", icon, children, ...props },
+    ref,
+  ) => {
     const { [displayName]: Component = DefaultComponent } = useStackShiftUIComponents();
 
     const Comp = asChild ? Slot : "button";
 
+    if (props.as === "link") {
+      const { link, ...rest } = props as ButtonProps;
+      const anchorProps = rest as React.AnchorHTMLAttributes<HTMLAnchorElement>;
+
+      if (!link) return;
+
+      const processedLink = buildSanityLink(link);
+
+      return (
+        <Link
+          className={cn(buttonVariants({ variant, size, className }))}
+          aria-label={link.ariaLabel}
+          href={processedLink.href}
+          target={processedLink.target}
+          rel={processedLink.rel}
+          {...anchorProps}>
+          {children}
+        </Link>
+      );
+    }
+
     return (
       <Component
         as={Comp}
         className={cn(buttonVariants({ variant, size, className }))}
         ref={ref}
-        {...props}
-      />
+        {...props}>
+        <span className="flex items-center gap-2">
+          {iconPosition === "left" && icon && <span>{icon}</span>}
+          {children}
+          {iconPosition === "right" && icon && <span>{icon}</span>}
+        </span>
+      </Component>
     );
   },
 );

package/dist/button.d.ts

@@ -1,11 +0,0 @@
-import { type VariantProps } from "class-variance-authority";
-import * as React from "react";
-declare const buttonVariants: (props?: ({
-    variant?: "unstyled" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
-    asChild?: boolean;
-}
-declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
-export { Button, buttonVariants };

package/dist/button.js

@@ -1 +0,0 @@
-"use strict";var v=Object.create;var s=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,B=Object.prototype.hasOwnProperty;var C=(e,t)=>{for(var n in t)s(e,n,{get:t[n],enumerable:!0})},a=(e,t,n,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of y(t))!B.call(e,o)&&o!==n&&s(e,o,{get:()=>t[o],enumerable:!(i=h(t,o))||i.enumerable});return e};var k=(e,t,n)=>(n=e!=null?v(x(e)):{},a(t||!e||!e.__esModule?s(n,"default",{value:e,enumerable:!0}):n,e)),w=e=>a(s({},"__esModule",{value:!0}),e);var V={};C(V,{Button:()=>l,buttonVariants:()=>f});module.exports=w(V);var d=require("@radix-ui/react-slot"),u=require("class-variance-authority"),c=k(require("react")),r=require("@stackshift-ui/system"),g=require("react/jsx-runtime"),p="Button",f=(0,u.cva)("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",{variants:{variant:{unstyled:"bg-transparent p-0 border-none shadow-none hover:bg-transparent ring-0 outline-none text-inherit",default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3",lg:"h-11 rounded-md px-8",icon:"h-10 w-10"}},defaultVariants:{variant:"default",size:"default"}}),l=c.forwardRef(({className:e,variant:t,size:n,asChild:i=!1,...o},m)=>{let{[p]:b=r.DefaultComponent}=(0,r.useStackShiftUIComponents)();return(0,g.jsx)(b,{as:i?d.Slot:"button",className:(0,r.cn)(f({variant:t,size:n,className:e})),ref:m,...o})});l.displayName=p;0&&(module.exports={Button,buttonVariants});

package/dist/button.mjs

@@ -1 +0,0 @@
-import{a,b}from"./chunk-UMCCY4XB.mjs";export{b as Button,a as buttonVariants};

package/dist/chunk-UMCCY4XB.mjs

@@ -1 +0,0 @@
-import{Slot as u}from"@radix-ui/react-slot";import{cva as c}from"class-variance-authority";import*as e from"react";import{cn as p,DefaultComponent as f,useStackShiftUIComponents as l}from"@stackshift-ui/system";import{jsx as b}from"react/jsx-runtime";var t="Button",g=c("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",{variants:{variant:{unstyled:"bg-transparent p-0 border-none shadow-none hover:bg-transparent ring-0 outline-none text-inherit",default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3",lg:"h-11 rounded-md px-8",icon:"h-10 w-10"}},defaultVariants:{variant:"default",size:"default"}}),m=e.forwardRef(({className:n,variant:o,size:r,asChild:i=!1,...s},a)=>{let{[t]:d=f}=l();return b(d,{as:i?u:"button",className:p(g({variant:o,size:r,className:n})),ref:a,...s})});m.displayName=t;export{g as a,m as b};

package/dist/helper/index.d.ts

@@ -1,2 +0,0 @@
-import { LabeledRoute } from "../types";
-export declare const extractLink: (link: LabeledRoute) => string;

package/dist/helper/index.js

@@ -1 +0,0 @@
-"use strict";var o=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var x=(e,t)=>{for(var r in t)o(e,r,{get:t[r],enumerable:!0})},d=(e,t,r,u)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of f(t))!p.call(e,a)&&a!==r&&o(e,a,{get:()=>t[a],enumerable:!(u=L(t,a))||u.enumerable});return e};var c=e=>d(o({},"__esModule",{value:!0}),e);var s={};x(s,{extractLink:()=>m});module.exports=c(s);var m=e=>{var t,r;return!(e!=null&&e.internalLink)&&!(e!=null&&e.externalLink)?"/page-not-found":(e==null?void 0:e.type)==="linkInternal"&&((r=(t=e==null?void 0:e.internalLink)==null?void 0:t.toLowerCase())!=null&&r.includes("home"))?"/":(e==null?void 0:e.type)==="linkInternal"?`/${e==null?void 0:e.internalLink}`:(e==null?void 0:e.type)==="linkExternal"?`${e==null?void 0:e.externalLink}`:"/"};0&&(module.exports={extractLink});

package/dist/helper/index.mjs

@@ -1 +0,0 @@
-var a=e=>{var t,r;return!(e!=null&&e.internalLink)&&!(e!=null&&e.externalLink)?"/page-not-found":(e==null?void 0:e.type)==="linkInternal"&&((r=(t=e==null?void 0:e.internalLink)==null?void 0:t.toLowerCase())!=null&&r.includes("home"))?"/":(e==null?void 0:e.type)==="linkInternal"?`/${e==null?void 0:e.internalLink}`:(e==null?void 0:e.type)==="linkExternal"?`${e==null?void 0:e.externalLink}`:"/"};export{a as extractLink};

package/dist/index.d.ts

@@ -1 +0,0 @@
-export * from "./button";

package/dist/index.js

@@ -1,2 +0,0 @@
-"use client";
-"use strict";var v=Object.create;var s=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,B=Object.prototype.hasOwnProperty;var C=(e,t)=>{for(var o in t)s(e,o,{get:t[o],enumerable:!0})},a=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of y(t))!B.call(e,n)&&n!==o&&s(e,n,{get:()=>t[n],enumerable:!(i=h(t,n))||i.enumerable});return e};var k=(e,t,o)=>(o=e!=null?v(x(e)):{},a(t||!e||!e.__esModule?s(o,"default",{value:e,enumerable:!0}):o,e)),w=e=>a(s({},"__esModule",{value:!0}),e);var V={};C(V,{Button:()=>l,buttonVariants:()=>f});module.exports=w(V);var d=require("@radix-ui/react-slot"),u=require("class-variance-authority"),c=k(require("react")),r=require("@stackshift-ui/system"),g=require("react/jsx-runtime"),p="Button",f=(0,u.cva)("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",{variants:{variant:{unstyled:"bg-transparent p-0 border-none shadow-none hover:bg-transparent ring-0 outline-none text-inherit",default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3",lg:"h-11 rounded-md px-8",icon:"h-10 w-10"}},defaultVariants:{variant:"default",size:"default"}}),l=c.forwardRef(({className:e,variant:t,size:o,asChild:i=!1,...n},m)=>{let{[p]:b=r.DefaultComponent}=(0,r.useStackShiftUIComponents)();return(0,g.jsx)(b,{as:i?d.Slot:"button",className:(0,r.cn)(f({variant:t,size:o,className:e})),ref:m,...n})});l.displayName=p;0&&(module.exports={Button,buttonVariants});

package/dist/index.mjs

@@ -1,2 +0,0 @@
-"use client";
-"use strict";import{a as e,b as o}from"./chunk-UMCCY4XB.mjs";export{o as Button,e as buttonVariants};

package/dist/types.d.ts

@@ -1,14 +0,0 @@
-export type StyleVariants<T extends string> = Record<T, string>;
-export interface LabeledRoute extends ConditionalLink {
-    ariaLabel?: string;
-    label?: string;
-    linkTarget?: string;
-    linkType?: string;
-    _type?: string;
-    linkInternal?: any;
-}
-export interface ConditionalLink {
-    type?: string;
-    internalLink?: string | null;
-    externalLink?: string | null;
-}

package/dist/types.js

@@ -1 +0,0 @@
-"use strict";var r=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var o=(t,n,l,i)=>{if(n&&typeof n=="object"||typeof n=="function")for(let e of s(n))!g.call(t,e)&&e!==l&&r(t,e,{get:()=>n[e],enumerable:!(i=a(n,e))||i.enumerable});return t};var k=t=>o(r({},"__esModule",{value:!0}),t);var p={};module.exports=k(p);