0.0.8

Author: hoangdevnull

apps/web/src/stories/layout.stories.tsx

@@ -197,7 +197,28 @@ const links = [
         icon: <UsersPlusIcon className="h-5 w-5" />,
         label: 'Recruitment Management',
         value: 'Recruitment Management',
-        href: '/',
+        dropdowns: [
+          {
+            label: 'Work from home',
+            value: 'Work from home',
+            href: '/',
+          },
+          {
+            label: 'Day off',
+            value: 'Day off',
+            href: '/',
+          },
+          {
+            label: 'CI/CO',
+            value: 'CI/CO',
+            href: '/',
+          },
+          {
+            label: 'Overtime',
+            value: 'Overtime',
+            href: '/',
+          },
+        ],
       },
       {
         icon: <GraduationHat01Icon className="h-5 w-5" />,

apps/web/src/stories/select.stories.tsx

@@ -33,6 +33,9 @@ const meta: Meta = {
       description: 'The open state of the menu.',
       control: { type: 'boolean' },
     },
+    disabled: {
+      control: { type: 'boolean' },
+    },
   },
   args: {
     withScrollAction: true,

packages/icons/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@var-meta/icons",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "sideEffects": [
     "*.svg"
   ],

packages/theme/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@var-meta/theme",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "license": "MIT",
   "sideEffects": false,
   "exports": {

packages/ui/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@var-meta/ui",
   "license": "MIT",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "sideEffects": [
     "**/*.css"
   ],

packages/ui/src/components/layout/layout.tsx

@@ -7,6 +7,10 @@ import { SidebarProvider as BaseSidebarProvider } from './sidebar.context';
 
 export interface LayoutProps extends VisibleState {
   expandOnHover?: boolean;
+  /**
+   * Width of the sidebar
+   * @default 272
+   */
   sidebarWidth?: number;
   active?: string;
   defaultActive?: string;

packages/ui/src/components/navigation/navigation-dropdown.tsx

@@ -77,7 +77,7 @@ const NavigationDropdown = forwardRef<ElementRef<'div'>, NavigationDropdownProps
           {...etc}
         >
           {collapsedIcon ?? (
-            <ChevronRightIcon className="h-5 w-5 transition-transform duration-300 group-aria-expanded/nav-item:rotate-90" />
+            <ChevronRightIcon className="h-5 w-5 min-w-5 transition-transform duration-300 group-aria-expanded/nav-item:rotate-90" />
           )}
         </NavigationItem>
       </CollapsibleTrigger>

packages/ui/src/components/navigation/navigation-item.tsx

@@ -86,11 +86,17 @@ const NavigationItem = forwardRef<ElementRef<'div'>, NavigationItemProps>(
           <div className="aspect-square min-w-5">{icon}</div>
         ) : (
           <>
-            <div className="flex flex-1 items-center gap-3">
+            <div
+              className={cn('flex flex-1 items-center gap-3', {
+                'w-[calc(100%-28px)]': !!children,
+              })}
+            >
               {icon}
-              <div className="flex-1 whitespace-nowrap">{label}</div>
+              <div className="flex-1 truncate whitespace-nowrap" title={String(label)}>
+                {label}
+              </div>
             </div>
-            <div className="ml-2">{children}</div>
+            {children && <>{children}</>}
           </>
         )}
 

packages/ui/src/components/select/core-select.tsx

@@ -24,9 +24,10 @@ const SelectValue = React.forwardRef<
 
 export const selectTriggerVariants = tv({
   base: [
-    'flex items-center justify-between text-foreground data-[placeholder]:text-muted disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
+    'flex items-center justify-between text-foreground data-[placeholder]:text-muted [&>span]:line-clamp-1',
     'border outline-none ',
     'focus:outline-none outline-none group',
+    'disabled:cursor-not-allowed disabled:shadow-xs disabled:bg-background-disabled disabled:text-disabled',
   ],
   variants: {
     variant: {