@designbasekorea/ui-wc 0.8.0 → 0.8.1

package/dist/react/index.d.ts

@@ -202,6 +202,8 @@ declare global {
 }
 
 declare class DbBanner extends HTMLElement {
+    private clickHandler?;
+    private keydownHandler?;
     static get observedAttributes(): string[];
     connectedCallback(): void;
     attributeChangedCallback(): void;
@@ -211,6 +213,9 @@ declare class DbBanner extends HTMLElement {
     private resolveIconName;
     private createActionControl;
     private render;
+    private createCloseButton;
+    private handleClose;
+    private setupInteractivity;
 }
 declare global {
     interface HTMLElementTagNameMap {
@@ -1713,6 +1718,15 @@ interface DbSidebarPromoBanner {
     ctaHref?: string;
     icon?: string;
 }
+interface DbSidebarUpdateBanner {
+    title: string;
+    description?: string;
+    icon?: string;
+    ctaLabel?: string;
+    ctaHref?: string;
+    /** db-banner variant. 기본 outline(흰 배경+보더). */
+    variant?: 'primary' | 'secondary' | 'tertiary' | 'outline';
+}
 declare class DbSidebar extends HTMLElement {
     private expandedItems;
     private userMenuOpen;
@@ -1762,6 +1776,8 @@ declare class DbSidebar extends HTMLElement {
     set bottomSections(value: DbSidebarSection[] | string);
     get promoBanner(): DbSidebarPromoBanner | null;
     set promoBanner(value: DbSidebarPromoBanner | string | null);
+    get updateBanner(): DbSidebarUpdateBanner | null;
+    set updateBanner(value: DbSidebarUpdateBanner | string | null);
     get headerType(): 'default' | 'back';
     set headerType(value: 'default' | 'back');
     get backLabel(): string;
@@ -1781,6 +1797,7 @@ declare class DbSidebar extends HTMLElement {
     private parseBottomItems;
     private parseBottomSections;
     private parsePromoBanner;
+    private parseUpdateBanner;
     private getSelectedProject;
     private bindOutsideClick;
     private closeOverlayMenus;
@@ -1801,6 +1818,7 @@ declare class DbSidebar extends HTMLElement {
     private dispatchProjectChange;
     private dispatchProjectManage;
     private dispatchPromoCtaClick;
+    private dispatchUpdateCtaClick;
     private createProjectAvatar;
     private createProjectEmptyMark;
     private createProjectBadge;
@@ -1811,6 +1829,7 @@ declare class DbSidebar extends HTMLElement {
     private renderNav;
     private renderBottomNav;
     private createUserDropdown;
+    private createUpdateBanner;
     private createPromoBanner;
     private createHeader;
     private createNavWrapper;
@@ -6592,8 +6611,27 @@ type BannerProps = WebComponentProps & {
     imageAlt?: string;
     actions?: BannerAction[] | string;
     size?: 's' | 'm' | 'l';
-    variant?: 'primary' | 'secondary' | 'tertiary' | 'image';
+    /** 배너 스타일입니다. primary · secondary · tertiary · outline(흰 배경+보더) · image. */
+    variant?: 'primary' | 'secondary' | 'tertiary' | 'outline' | 'image';
     backgroundImage?: string;
+    /** 지정하면 배너 전체가 링크로 동작합니다. */
+    href?: string;
+    /** href 이동 대상입니다. 기본 _self. */
+    target?: '_self' | '_blank';
+    /** true이면 배너 전체가 클릭 요소가 되어 db-click 이벤트를 발생시킵니다. */
+    clickable?: boolean;
+    /** true이면 우측에 닫기 버튼을 표시합니다. */
+    closable?: boolean;
+    /** 닫기 버튼 aria-label입니다. 기본 Close. */
+    closeLabel?: string;
+    onClick?: DbEventHandler<{
+        href: string | null;
+    }>;
+    onDbClick?: DbEventHandler<{
+        href: string | null;
+    }>;
+    onClose?: DbEventHandler<Record<string, never>>;
+    onDbClose?: DbEventHandler<Record<string, never>>;
 };
 type LogoProps = WebComponentProps & {
     type?: 'designbase' | 'designbase-mark' | 'custom';
@@ -7209,6 +7247,15 @@ type SidebarPromoBanner = {
     ctaHref?: string;
     icon?: string;
 };
+type SidebarUpdateBanner = {
+    title: string;
+    description?: string;
+    icon?: string;
+    ctaLabel?: string;
+    ctaHref?: string;
+    /** db-banner variant. 기본 outline(흰 배경+보더). */
+    variant?: 'primary' | 'secondary' | 'tertiary' | 'outline';
+};
 type SidebarProps = WebComponentProps & {
     /**
      * 커스텀 내비게이션 콘텐츠입니다.
@@ -7230,6 +7277,8 @@ type SidebarProps = WebComponentProps & {
     bottomItems?: SidebarItem[] | string;
     bottomSections?: SidebarSection[] | string;
     promoBanner?: SidebarPromoBanner | string;
+    /** 업데이트/공지 배너 영역입니다. Banner 컴포넌트를 활용해 표시합니다. */
+    updateBanner?: SidebarUpdateBanner | string;
     headerType?: 'default' | 'back';
     backLabel?: string;
     backHref?: string;
@@ -7262,6 +7311,18 @@ type SidebarProps = WebComponentProps & {
         panel: string;
         previous?: string;
     }>;
+    onPromoCtaClick?: DbEventHandler<{
+        banner: SidebarPromoBanner;
+    }>;
+    onDbPromoCtaClick?: DbEventHandler<{
+        banner: SidebarPromoBanner;
+    }>;
+    onUpdateCtaClick?: DbEventHandler<{
+        banner: SidebarUpdateBanner;
+    }>;
+    onDbUpdateCtaClick?: DbEventHandler<{
+        banner: SidebarUpdateBanner;
+    }>;
 };
 type SpinnerProps = WebComponentProps & {
     type?: 'circular' | 'dots' | 'bars' | 'pulse' | 'ripple';
@@ -9754,4 +9815,4 @@ declare const TimePicker: react.ForwardRefExoticComponent<Omit<TimePickerProps,
 declare const Calendar: react.ForwardRefExoticComponent<Omit<CalendarProps, "ref"> & react.RefAttributes<HTMLElement>>;
 
 export { Accordion, AdBanner, AiChat, AiChatList, Alert, AnimationBackground, AnimationText, AppBadge, AudioPlayer, Avatar, Backdrop, Badge, Banner, BottomNavigation, BottomSheet, Breadcrumbs, Button, Calendar, Card, Carousel, ChatComposer, ChatList, ChatMessage, ChatOrb, ChatRoom, ChatSuggestions, ChatTyping, ChatWelcome, ChatWidget, Checkbox, Chip, CodeBlock, ColorPicker, ColorSwatch, Confirm, Container, ContextMenu, CookieBanner, Countdown, CursorFollower, DatePicker, Divider, DownloadProgress, Drawer, Dropdown, Dropzone, EmailVerify, EmptyState, FileUploader, FloatingActionButton, Footer, Form, Gantt, Gradient, Grid, GridBackground, GridItem, Image, ImageList, ImagePlaceholder, Indicator, Input, Kanban, Label, Lightbox, List, Logo, Lottie, MarkdownEditor, Marquee, Masonry, MenuItem, Modal, ModalBody, ModalFooter, ModalHeader, Navbar, OnboardingModal, OtpInput, PageHeader, Pagination, PhoneVerify, Popover, Progress, ProgressStep, Progressbar, Radio, RandomGradient, RangeSlider, Rating, Reorder, ResizablePanels, ScrollArea, SearchBar, Section, SectionAppDownload, SectionContact, SectionCta, SectionFaq, SectionFeature, SectionFeatureGrid, SectionHero, SectionLogoCloud, SectionPricing, SectionStats, SectionTestimonials, SegmentControl, Select, Share, Sidebar, Signature, Skeleton, Spinner, SplitView, Stack, Stat, Stepper, Table, Tabs, Testimonial, Textarea, TimePicker, Timeline, Toast, Toggle, Toolbar, Tooltip, TopBanner, Tutorial, TwoFactor, VideoPlayer, YouTubePlayer, useContextMenu };
-export type { AccordionItemConfig, AccordionProps, AdBannerProps, AiChatListProps, AiChatProps, AlertAction, AlertProps, AnimationBackgroundProps, AnimationTextProps, AppBadgeProps, AudioPlayerProps, AvatarProps, BackdropProps, BadgeProps, BannerAction, BannerProps, BottomNavigationItem, BottomNavigationProps, BottomSheetProps, BreadcrumbItemConfig, BreadcrumbMenuItemConfig, BreadcrumbsProps, ButtonProps, CalendarEvent, CalendarProps, CardProps, CarouselItem, CarouselProps, ChatComposerProps, ChatListProps, ChatMessageProps, ChatOrbProps, ChatRoomProps, ChatSuggestionsProps, ChatTypingProps, ChatWelcomeProps, ChatWidgetProps, ChipProps, CodeBlockItem, CodeBlockProps, ColorPickerProps, ColorSwatchItem, ColorSwatchProps, ConfirmProps, ContextMenuItemConfig, ContextMenuProps, CookieBannerProps, CountdownProps, CursorFollowerProps, DatePickerProps, DbChatSuggestion, DbChatTool, DbChatWidgetConversation, DbChatWidgetMessage, DbEventHandler, DividerProps, DownloadProgressProps, DrawerProps, DropdownItemConfig, DropdownProps, DropzoneProps, EmailVerifyProps, EmptyStateProps, FileUploaderProps, FloatingActionButtonProps, FooterCompanyInfo, FooterFamilySite, FooterLink, FooterLinkColumn, FooterProps, FooterSocialLink, FormFieldData, FormProps, GanttAssignee, GanttGroup, GanttItem, GanttProps, GanttRow, GradientColor, GradientProps, GradientScheme, GradientTone, GridBackgroundProps, ImageListItem, ImageListProps, ImagePlaceholderProps, ImageProps, IndicatorProps, InputProps, KanbanAssignee, KanbanCard, KanbanColumn, KanbanProps, KanbanTag, LabelProps, LightboxImage, LightboxProps, ListItemConfig, ListProps, LogoProps, LottieProps, MarkdownEditorProps, MarqueeImageItem, MarqueeProps, MasonryItem, MasonryProps, MenuItemChildConfig, MenuItemProps, ModalProps, ModalSegmentItem, ModalTabItem, NavbarItem, NavbarProps, NavbarUserProfile, OnboardingModalProps, OnboardingStep, OtpInputProps, PageHeaderProps, PageHeaderTabItem, PaginationProps, PhoneVerifyProps, PopoverProps, ProgressProps, ProgressStepItem, ProgressStepProps, RadioProps, RandomGradientProps, RangeSliderProps, RatingProps, ReorderItem, ReorderProps, ResizablePanelsProps, ScrollAreaProps, SearchBarProps, SectionAppDownloadProps, SectionAppDownloadStore, SectionBlockBadge, SectionContactAction, SectionContactProps, SectionCtaButton, SectionCtaProps, SectionFaqItem, SectionFaqProps, SectionFeatureAction, SectionFeatureBadge, SectionFeatureGridItem, SectionFeatureGridProps, SectionFeatureProps, SectionHeroButton, SectionHeroProps, SectionLogoCloudItem, SectionLogoCloudProps, SectionPricingCta, SectionPricingPlan, SectionPricingProps, SectionProps, SectionStatItem, SectionStatsProps, SectionTestimonialItem, SectionTestimonialsProps, SegmentControlProps, SelectProps, SelectionProps, SharePlatform, ShareProps, SidebarItem, SidebarProject, SidebarPromoBanner, SidebarProps, SidebarSection, SidebarUserProfile, SignatureProps, SkeletonProps, SpinnerProps, SplitViewProps, StatChange, StatProps, StepperProps, TabItemConfig, TableColumn, TableProps, TabsProps, TestimonialProps, TextareaProps, TimePickerProps, TimelineItem, TimelineProps, ToastProps, ToggleProps, TooltipProps, TopBannerProps, TutorialProps, TutorialStep, TwoFactorProps, UseContextMenuReturn, VideoPlayerProps, WebComponentProps, YouTubePlayerProps };
+export type { AccordionItemConfig, AccordionProps, AdBannerProps, AiChatListProps, AiChatProps, AlertAction, AlertProps, AnimationBackgroundProps, AnimationTextProps, AppBadgeProps, AudioPlayerProps, AvatarProps, BackdropProps, BadgeProps, BannerAction, BannerProps, BottomNavigationItem, BottomNavigationProps, BottomSheetProps, BreadcrumbItemConfig, BreadcrumbMenuItemConfig, BreadcrumbsProps, ButtonProps, CalendarEvent, CalendarProps, CardProps, CarouselItem, CarouselProps, ChatComposerProps, ChatListProps, ChatMessageProps, ChatOrbProps, ChatRoomProps, ChatSuggestionsProps, ChatTypingProps, ChatWelcomeProps, ChatWidgetProps, ChipProps, CodeBlockItem, CodeBlockProps, ColorPickerProps, ColorSwatchItem, ColorSwatchProps, ConfirmProps, ContextMenuItemConfig, ContextMenuProps, CookieBannerProps, CountdownProps, CursorFollowerProps, DatePickerProps, DbChatSuggestion, DbChatTool, DbChatWidgetConversation, DbChatWidgetMessage, DbEventHandler, DividerProps, DownloadProgressProps, DrawerProps, DropdownItemConfig, DropdownProps, DropzoneProps, EmailVerifyProps, EmptyStateProps, FileUploaderProps, FloatingActionButtonProps, FooterCompanyInfo, FooterFamilySite, FooterLink, FooterLinkColumn, FooterProps, FooterSocialLink, FormFieldData, FormProps, GanttAssignee, GanttGroup, GanttItem, GanttProps, GanttRow, GradientColor, GradientProps, GradientScheme, GradientTone, GridBackgroundProps, ImageListItem, ImageListProps, ImagePlaceholderProps, ImageProps, IndicatorProps, InputProps, KanbanAssignee, KanbanCard, KanbanColumn, KanbanProps, KanbanTag, LabelProps, LightboxImage, LightboxProps, ListItemConfig, ListProps, LogoProps, LottieProps, MarkdownEditorProps, MarqueeImageItem, MarqueeProps, MasonryItem, MasonryProps, MenuItemChildConfig, MenuItemProps, ModalProps, ModalSegmentItem, ModalTabItem, NavbarItem, NavbarProps, NavbarUserProfile, OnboardingModalProps, OnboardingStep, OtpInputProps, PageHeaderProps, PageHeaderTabItem, PaginationProps, PhoneVerifyProps, PopoverProps, ProgressProps, ProgressStepItem, ProgressStepProps, RadioProps, RandomGradientProps, RangeSliderProps, RatingProps, ReorderItem, ReorderProps, ResizablePanelsProps, ScrollAreaProps, SearchBarProps, SectionAppDownloadProps, SectionAppDownloadStore, SectionBlockBadge, SectionContactAction, SectionContactProps, SectionCtaButton, SectionCtaProps, SectionFaqItem, SectionFaqProps, SectionFeatureAction, SectionFeatureBadge, SectionFeatureGridItem, SectionFeatureGridProps, SectionFeatureProps, SectionHeroButton, SectionHeroProps, SectionLogoCloudItem, SectionLogoCloudProps, SectionPricingCta, SectionPricingPlan, SectionPricingProps, SectionProps, SectionStatItem, SectionStatsProps, SectionTestimonialItem, SectionTestimonialsProps, SegmentControlProps, SelectProps, SelectionProps, SharePlatform, ShareProps, SidebarItem, SidebarProject, SidebarPromoBanner, SidebarProps, SidebarSection, SidebarUpdateBanner, SidebarUserProfile, SignatureProps, SkeletonProps, SpinnerProps, SplitViewProps, StatChange, StatProps, StepperProps, TabItemConfig, TableColumn, TableProps, TabsProps, TestimonialProps, TextareaProps, TimePickerProps, TimelineItem, TimelineProps, ToastProps, ToggleProps, TooltipProps, TopBannerProps, TutorialProps, TutorialStep, TwoFactorProps, UseContextMenuReturn, VideoPlayerProps, WebComponentProps, YouTubePlayerProps };