property-practice-ui 0.3.1 → 0.4.1

package/src/molecules/ContentCard/ContentCard.tsx

@@ -11,7 +11,7 @@ const Container = styled.div`
   gap: 1rem;
   background-color: #ffffff;
   width: 284px;
-  height: 482px;
+  height: 100%;
   padding: 1.5rem;
   border-radius: 8px;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);

package/src/molecules/SideNav/SideNav.tsx

@@ -231,7 +231,7 @@ export const SideNav = ({
     const isActive = activeItem === item.href;
     return (
       <NavItem key={item.href}>
-        <NavLink href={item.href} $isActive={isActive}>
+        <NavLink href={item.href} $isActive={isActive} onClick={onClose}>
           {isActive ? <ActiveTriangle triangleColor={triangleColor} /> : <InactiveSpacer />}
           <TextButton
             asChild

package/src/organisms/FeatureCarousel/FeatureCarousel.tsx

@@ -17,12 +17,13 @@ const CarouselContainer = styled.div`
 
 const CardsWrapper = styled.div`
   display: flex;
+  align-items: stretch;
   gap: 1.5rem;
   padding: 1rem 0;
   
   /* Desktop: controlled by JS */
   @media (min-width: 768px) {
-    overflow-x: hidden;
+    overflow: hidden;
   }
   
   /* Mobile: native scroll with snap */
@@ -40,6 +41,7 @@ const CardsWrapper = styled.div`
 
 const CardContainer = styled.div<{ $translateX: number }>`
   display: flex;
+  align-items: stretch;
   gap: 1.5rem;
   
   /* Desktop: transform animation */

package/src/organisms/Header/Header.tsx

@@ -1,16 +1,22 @@
+import { useEffect, useRef, useState } from 'react';
 import styled from 'styled-components';
 import { ExtendedButton, TextButton } from '../../atoms';
 import { colors } from '../../tokens/colors';
 
 type BorderColor = keyof typeof colors.border;
 
-const HeaderContainer = styled.header`
+const HeaderContainer = styled.header<{ $isVisible: boolean }>`
   display: flex;
   justify-content: space-between;
   align-items: center;
   background-color: #ffffff;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
   padding: 0 1rem;
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  transform: translateY(${props => props.$isVisible ? '0' : '-100%'});
+  transition: transform 0.3s ease-in-out;
 `;
 
 const LogoWrapper = styled.div`
@@ -111,8 +117,27 @@ export const Header = ({
   secondaryBgVariant = 'transparent',
   secondaryTextVariant = 'brand',
 }: HeaderProps) => {
+  const [isVisible, setIsVisible] = useState(true);
+  const lastScrollY = useRef(0);
+
+  useEffect(() => {
+    const handleScroll = () => {
+      const currentScrollY = window.scrollY;
+      
+      if (currentScrollY < lastScrollY.current) {
+        setIsVisible(true);   
+      } else {
+        setIsVisible(false);  
+      }
+      
+      lastScrollY.current = currentScrollY;
+    };
+
+    window.addEventListener('scroll', handleScroll, { passive: true });
+    return () => window.removeEventListener('scroll', handleScroll);
+  }, []);
   return (
-    <HeaderContainer>
+    <HeaderContainer $isVisible={isVisible}>
       <LogoWrapper>
         <img src={logo} alt="Logo" />
       </LogoWrapper>

package/tsup.config.ts

@@ -5,6 +5,7 @@ export default defineConfig({
     index: './src/index.ts',
     atoms: './src/atoms/index.ts',
     molecules: './src/molecules/index.ts',
+    organisms: './src/organisms/index.ts',
     types: './src/types/index.ts',
   },
   clean: true,

package/dist/Button-BT32YGe5.d.cts

@@ -1,46 +0,0 @@
-import { ChangeHandler } from 'react-hook-form';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactElement } from 'react';
-
-declare const InputTypes: readonly ["number", "text", "email", "date"];
-type InputType = (typeof InputTypes)[number];
-interface BaseInputProps {
-    name: string;
-    label?: string;
-    type?: InputType;
-    placeholder?: string;
-    onBlur?: ChangeHandler;
-    onFocus?: () => void;
-}
-type Option<T> = {
-    label: string;
-    value: T;
-    disabled?: boolean;
-};
-
-declare const variants$1: readonly ["primary", "secondary", "tertiary", "subtle", "blue", "brand", "light", "active", "hover", "error", "focus", "success"];
-declare const tokens: readonly ["background", "border", "text", "button"];
-type Token = (typeof tokens)[number];
-type Variant$1 = (typeof variants$1)[number];
-type TokenVariant = Record<Variant$1, string>;
-declare const colors: Record<Token, Partial<TokenVariant>>;
-
-declare const ButtonTypes: readonly ["submit", "reset", "button"];
-type ButtonType = (typeof ButtonTypes)[number];
-declare const variants: readonly ["dark", "light"];
-type Variant = (typeof variants)[number];
-interface ButtonProps {
-    onClick?: () => void;
-    text?: string;
-    type?: ButtonType;
-    disabled?: boolean;
-    icon?: ReactElement;
-    variant?: Variant;
-    isLoading?: boolean;
-}
-declare const Button: {
-    ({ onClick, text, type, disabled, icon, variant, isLoading, }: ButtonProps): react_jsx_runtime.JSX.Element;
-    types: readonly ["submit", "reset", "button"];
-};
-
-export { type BaseInputProps as B, type Option as O, Button as a, colors as c };

package/dist/Button-BT32YGe5.d.ts

@@ -1,46 +0,0 @@
-import { ChangeHandler } from 'react-hook-form';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactElement } from 'react';
-
-declare const InputTypes: readonly ["number", "text", "email", "date"];
-type InputType = (typeof InputTypes)[number];
-interface BaseInputProps {
-    name: string;
-    label?: string;
-    type?: InputType;
-    placeholder?: string;
-    onBlur?: ChangeHandler;
-    onFocus?: () => void;
-}
-type Option<T> = {
-    label: string;
-    value: T;
-    disabled?: boolean;
-};
-
-declare const variants$1: readonly ["primary", "secondary", "tertiary", "subtle", "blue", "brand", "light", "active", "hover", "error", "focus", "success"];
-declare const tokens: readonly ["background", "border", "text", "button"];
-type Token = (typeof tokens)[number];
-type Variant$1 = (typeof variants$1)[number];
-type TokenVariant = Record<Variant$1, string>;
-declare const colors: Record<Token, Partial<TokenVariant>>;
-
-declare const ButtonTypes: readonly ["submit", "reset", "button"];
-type ButtonType = (typeof ButtonTypes)[number];
-declare const variants: readonly ["dark", "light"];
-type Variant = (typeof variants)[number];
-interface ButtonProps {
-    onClick?: () => void;
-    text?: string;
-    type?: ButtonType;
-    disabled?: boolean;
-    icon?: ReactElement;
-    variant?: Variant;
-    isLoading?: boolean;
-}
-declare const Button: {
-    ({ onClick, text, type, disabled, icon, variant, isLoading, }: ButtonProps): react_jsx_runtime.JSX.Element;
-    types: readonly ["submit", "reset", "button"];
-};
-
-export { type BaseInputProps as B, type Option as O, Button as a, colors as c };