@altimateai/ui-components 0.0.72 → 0.0.73

package/dist/ToggleGroup.js

@@ -69,15 +69,15 @@ function Nc({ className: e, ...n }) {
       "data-slot": "input-group",
       role: "group",
       className: G(
-        "al-group/input-group al-border-input dark:al-bg-input/30 al-shadow-xs al-relative al-flex al-w-full al-items-center al-rounded-md al-border al-outline-none al-transition-[color,box-shadow]",
-        "al-h-9 has-[>textarea]:al-h-auto",
+        "al-group/input-group al-border-input al-bg-background al-relative al-flex al-w-full al-items-center al-overflow-hidden al-rounded-md al-border al-outline-none al-transition-[color,box-shadow]",
+        "al-h-10 has-[>textarea]:al-h-auto",
         // Variants based on alignment.
         "has-[>[data-align=inline-start]]:[&>input]:al-pl-2",
         "has-[>[data-align=inline-end]]:[&>input]:al-pr-2",
         "has-[>[data-align=block-start]]:al-h-auto has-[>[data-align=block-start]]:al-flex-col has-[>[data-align=block-start]]:[&>input]:al-pb-3",
         "has-[>[data-align=block-end]]:al-h-auto has-[>[data-align=block-end]]:al-flex-col has-[>[data-align=block-end]]:[&>input]:al-pt-3",
-        // Focus state.
-        "has-[[data-slot=input-group-control]:focus-visible]:al-ring-ring has-[[data-slot=input-group-control]:focus-visible]:al-ring-1",
+        // Focus state - matches Input component styles.
+        "has-[[data-slot=input-group-control]:focus-visible]:al-ring-ring has-[[data-slot=input-group-control]:focus-visible]:al-ring-2 has-[[data-slot=input-group-control]:focus-visible]:al-ring-offset-2 has-[[data-slot=input-group-control]:focus-visible]:al-ring-offset-background",
         // Error state.
         "has-[[data-slot][aria-invalid=true]]:al-ring-destructive/20 has-[[data-slot][aria-invalid=true]]:al-border-destructive dark:has-[[data-slot][aria-invalid=true]]:al-ring-destructive/40",
         e
@@ -87,12 +87,12 @@ function Nc({ className: e, ...n }) {
   );
 }
 const _c = pt(
-  "al-text-muted-foreground al-flex al-h-auto al-cursor-text al-select-none al-items-center al-gap-2 al-py-1.5 al-text-sm al-font-medium al-group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:al-rounded-[calc(var(--radius)-5px)] [&>svg:not([class*=size-])]:al-size-4",
+  "al-text-muted-foreground al-flex al-cursor-text al-select-none al-items-center al-gap-2 al-text-sm al-font-medium al-group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:al-rounded-[calc(var(--radius)-5px)] [&>svg:not([class*=size-])]:al-size-4",
   {
     variants: {
       align: {
-        "inline-start": "al-order-first al-pl-3 has-[>button]:al-ml-[-0.45rem] has-[>kbd]:al-ml-[-0.35rem]",
-        "inline-end": "al-order-last al-pr-3 has-[>button]:al-mr-[-0.4rem] has-[>kbd]:al-mr-[-0.35rem]",
+        "inline-start": "al-order-first al-pl-3 al-pr-1 has-[>button]:al-ml-[-0.45rem] has-[>kbd]:al-ml-[-0.35rem]",
+        "inline-end": "al-order-last al-pl-1 al-pr-3 has-[>button]:al-mr-[-0.4rem] has-[>kbd]:al-mr-[-0.35rem]",
         "block-start": "[.border-b]:al-pb-3 al-order-first al-w-full al-justify-start al-px-3 al-pt-3 al-group-has-[>input]/input-group:pt-2.5",
         "block-end": "[.border-t]:al-pt-3 al-order-last al-w-full al-justify-start al-px-3 al-pb-3 al-group-has-[>input]/input-group:pb-2.5"
       }
@@ -127,7 +127,7 @@ const Ac = pt("al-flex al-items-center al-gap-2 al-text-sm al-shadow-none", {
     size: {
       xs: "al-h-6 al-gap-1 al-rounded-[calc(var(--radius)-5px)] al-px-2 has-[>svg]:al-px-2 [&>svg:not([class*=size-])]:al-size-3.5",
       sm: "al-h-8 al-gap-1.5 al-rounded-md al-px-2.5 has-[>svg]:al-px-2.5",
-      icon: "!al-size-6 al-rounded-[calc(var(--radius)-5px)] al-p-0 has-[>svg]:al-p-0"
+      icon: "!al-size-7 al-rounded-[calc(var(--radius)-5px)] al-p-0 has-[>svg]:al-p-0"
     }
   },
   defaultVariants: {
@@ -170,7 +170,7 @@ function Rc({ className: e, ...n }) {
     {
       "data-slot": "input-group-control",
       className: G(
-        "al-flex-1 al-rounded-none al-border-0 al-bg-transparent al-shadow-none focus-visible:!al-ring-offset-0 focus-visible:!al-ring-0 dark:al-bg-transparent",
+        "al-flex-1 !al-h-full al-py-0 al-rounded-none al-border-0 al-bg-transparent al-shadow-none focus-visible:!al-ring-offset-0 focus-visible:!al-ring-0 dark:al-bg-transparent",
         e
       ),
       ...n

package/dist/shadcn/index.js

@@ -2967,13 +2967,12 @@ const Fa = (e, t) => {
 const Qd = [["path", { d: "M10.585 10.587a2 2 0 0 0 2.829 2.828", key: "svg-0" }], ["path", { d: "M16.681 16.673a8.717 8.717 0 0 1 -4.681 1.327c-3.6 0 -6.6 -2 -9 -6c1.272 -2.12 2.712 -3.678 4.32 -4.674m2.86 -1.146a9.055 9.055 0 0 1 1.82 -.18c3.6 0 6.6 2 9 6c-.666 1.11 -1.379 2.067 -2.138 2.87", key: "svg-1" }], ["path", { d: "M3 3l18 18", key: "svg-2" }]], Jd = gl("outline", "eye-off", "EyeOff", Qd), ef = At(
   ({ className: e, ...t }, n) => {
     const [a, r] = Ne(!1);
-    return /* @__PURE__ */ u.jsxs(Bi, { children: [
+    return /* @__PURE__ */ u.jsxs(Bi, { className: e, children: [
       /* @__PURE__ */ u.jsx(
         Hi,
         {
           ref: n,
           type: a ? "text" : "password",
-          className: e,
           ...t
         }
       ),

package/dist/storybook/InputGroup.stories.tsx

@@ -42,7 +42,7 @@ export default {
 } as Meta<typeof InputGroup>;
 
 export const Default: StoryFn = () => (
-  <div className="al-grid al-w-full al-max-w-sm al-gap-6">
+  <div className="al-grid al-w-full al-max-w-sm al-gap-6 al-p-4">
     <InputGroup>
       <InputGroupInput placeholder="Search..." />
       <InputGroupAddon>
@@ -109,7 +109,7 @@ export const Default: StoryFn = () => (
 
 // Alignment Variations
 export const AlignmentVariations: StoryFn = () => (
-  <div className="al-w-96 al-space-y-6">
+  <div className="al-w-96 al-space-y-6 al-p-4">
     <div>
       <label className="al-text-sm al-font-medium al-block al-mb-2">Inline Start</label>
       <InputGroup>
@@ -155,7 +155,7 @@ export const AlignmentVariations: StoryFn = () => (
 
 // Button Variations
 export const ButtonVariations: StoryFn = () => (
-  <div className="al-w-96 al-space-y-4">
+  <div className="al-w-96 al-space-y-4 al-p-4">
     <InputGroup>
       <InputGroupInput placeholder="Enter text to copy" defaultValue="https://example.com" />
       <InputGroupAddon align="inline-end">
@@ -181,7 +181,7 @@ export const ButtonVariations: StoryFn = () => (
 
 // Text Variations
 export const TextVariations: StoryFn = () => (
-  <div className="al-w-96 al-space-y-4">
+  <div className="al-w-96 al-space-y-4 al-p-4">
     <InputGroup>
       <InputGroupAddon>
         <InputGroupText>$</InputGroupText>
@@ -220,7 +220,7 @@ export const TextVariations: StoryFn = () => (
 
 // Complex Interactions
 export const ComplexInteractions: StoryFn = () => (
-  <div className="al-w-96 al-space-y-4">
+  <div className="al-w-96 al-space-y-4 al-p-4">
     <InputGroup>
       <InputGroupAddon>
         <IconGlobe className="al-size-4" />
@@ -263,7 +263,7 @@ export const ComplexInteractions: StoryFn = () => (
 
 // Textarea Variations
 export const TextareaVariations: StoryFn = () => (
-  <div className="al-w-96 al-space-y-4">
+  <div className="al-w-96 al-space-y-4 al-p-4">
     <div className="al-grid al-w-full al-max-w-md al-gap-4">
       <InputGroup>
         <InputGroupTextarea
@@ -296,7 +296,7 @@ export const TextareaVariations: StoryFn = () => (
 
 // State Variations
 export const StateVariations: StoryFn = () => (
-  <div className="al-w-96 al-space-y-4">
+  <div className="al-w-96 al-space-y-4 al-p-4">
     <div>
       <label className="al-text-sm al-font-medium al-block al-mb-2">Normal State</label>
       <InputGroup>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altimateai/ui-components",
-  "version": "0.0.72",
+  "version": "0.0.73",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/AltimateAI/altimate-components.git"