@vector-business-services/cristal-ds-web 0.7.0 → 0.8.0

package/dist/index.d.cts

@@ -149,6 +149,11 @@ type DrawerSide = 'right' | 'left';
  * corpo rola).
  */
 type DrawerBehavior = 'full' | 'fixed';
+/**
+ * Largura da gaveta. O Figma só tem a de 340px (small); medium (480px), large (720px) e full (a
+ * tela toda) são do Cristal, nas faixas usuais de drawer.
+ */
+type DrawerSize = 'small' | 'medium' | 'large' | 'full';
 interface DrawerProps {
     visible: boolean;
     /** Pedido para fechar (X, Esc ou clique no overlay). */
@@ -161,6 +166,8 @@ interface DrawerProps {
     side?: DrawerSide;
     /** Padrão: full. */
     behavior?: DrawerBehavior;
+    /** Padrão: small (340px, a do Figma). */
+    size?: DrawerSize;
     /**
      * Com overlay (padrão): a gaveta é modal, a página atrás fica bloqueada e o clique no overlay
      * fecha. Sem overlay (`false`): a página continua rolando e clicável, e só o X e o Esc fecham.
@@ -176,7 +183,7 @@ interface DrawerProps {
     id?: string;
     className?: string;
 }
-declare function Drawer({ visible, onHide, title, subtitle, side, behavior, modal, onBack, backLabel, closeLabel, footer, children, id, className, }: DrawerProps): react.JSX.Element;
+declare function Drawer({ visible, onHide, title, subtitle, side, behavior, size, modal, onBack, backLabel, closeLabel, footer, children, id, className, }: DrawerProps): react.JSX.Element;
 
 /**
  * Hierarchy no Figma: Primary (Filled), Secondary (Tonal), Tertiary (Outlined) e Other (Icon),
@@ -607,4 +614,4 @@ interface TooltipProps {
 declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, id, className, }: TooltipProps): react.JSX.Element;
 
 export { AutoComplete, Badge, Button, Card, Checkbox, Chip, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Modal, MultiSelect, Panel, Radio, ScrollPanel, SegmentControl, Select, Switch, TabPanel, Tabs, Tag, Tooltip };
-export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, TooltipPosition, TooltipProps, TooltipType };
+export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, DrawerSize, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, TooltipPosition, TooltipProps, TooltipType };

package/dist/index.d.ts

@@ -149,6 +149,11 @@ type DrawerSide = 'right' | 'left';
  * corpo rola).
  */
 type DrawerBehavior = 'full' | 'fixed';
+/**
+ * Largura da gaveta. O Figma só tem a de 340px (small); medium (480px), large (720px) e full (a
+ * tela toda) são do Cristal, nas faixas usuais de drawer.
+ */
+type DrawerSize = 'small' | 'medium' | 'large' | 'full';
 interface DrawerProps {
     visible: boolean;
     /** Pedido para fechar (X, Esc ou clique no overlay). */
@@ -161,6 +166,8 @@ interface DrawerProps {
     side?: DrawerSide;
     /** Padrão: full. */
     behavior?: DrawerBehavior;
+    /** Padrão: small (340px, a do Figma). */
+    size?: DrawerSize;
     /**
      * Com overlay (padrão): a gaveta é modal, a página atrás fica bloqueada e o clique no overlay
      * fecha. Sem overlay (`false`): a página continua rolando e clicável, e só o X e o Esc fecham.
@@ -176,7 +183,7 @@ interface DrawerProps {
     id?: string;
     className?: string;
 }
-declare function Drawer({ visible, onHide, title, subtitle, side, behavior, modal, onBack, backLabel, closeLabel, footer, children, id, className, }: DrawerProps): react.JSX.Element;
+declare function Drawer({ visible, onHide, title, subtitle, side, behavior, size, modal, onBack, backLabel, closeLabel, footer, children, id, className, }: DrawerProps): react.JSX.Element;
 
 /**
  * Hierarchy no Figma: Primary (Filled), Secondary (Tonal), Tertiary (Outlined) e Other (Icon),
@@ -607,4 +614,4 @@ interface TooltipProps {
 declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, id, className, }: TooltipProps): react.JSX.Element;
 
 export { AutoComplete, Badge, Button, Card, Checkbox, Chip, Divider, Drawer, IconButton, Input, Menu, MenuPrincipal, Menubar, Modal, MultiSelect, Panel, Radio, ScrollPanel, SegmentControl, Select, Switch, TabPanel, Tabs, Tag, Tooltip };
-export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, TooltipPosition, TooltipProps, TooltipType };
+export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CardPadding, CardProps, CheckboxLabelSize, CheckboxPosition, CheckboxProps, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, DrawerBehavior, DrawerProps, DrawerSide, DrawerSize, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuPrincipalEntry, MenuPrincipalGroup, MenuPrincipalHandle, MenuPrincipalItem, MenuPrincipalProps, MenuProps, MenubarProps, MenubarTool, MenubarUser, ModalProps, ModalSize, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, PanelProps, RadioLabelSize, RadioProps, ScrollPanelProps, SegmentControlOption, SegmentControlProps, SegmentControlVariant, SelectProps, SelectSize, SelectVariant, SwitchLabelPosition, SwitchProps, SwitchSize, TabPanelProps, TabsProps, TagProps, TagSize, TagVariant, TooltipPosition, TooltipProps, TooltipType };

package/dist/index.js

@@ -319,6 +319,7 @@ function Drawer({
   subtitle,
   side = "right",
   behavior = "full",
+  size = "small",
   modal = true,
   onBack,
   backLabel = "Voltar",
@@ -366,7 +367,13 @@ function Drawer({
       primeiro.focus();
     }
   };
-  const classes = ["cr-drawer", `cr-drawer--${side}`, `cr-drawer--${behavior}`, className].filter(Boolean).join(" ");
+  const classes = [
+    "cr-drawer",
+    `cr-drawer--${side}`,
+    `cr-drawer--${behavior}`,
+    `cr-drawer--size-${size}`,
+    className
+  ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx(
     Sidebar,
     {