keystone-design-bootstrap 1.0.32 → 1.0.34

package/README.md

@@ -108,120 +108,37 @@ import { themes } from '@keystone-pzjr/design-bootstrap/themes'
 
 **Available themes:** `classic`, `aman`, `barelux`
 
-Components automatically load theme-specific variants. Set theme in your config and import the corresponding CSS file in `globals.css`.
+### Themes
 
-### Creating a New Theme
+- **classic**: Default professional theme, Inter font, neutral colors
+- **aman**: Luxury theme with Playfair Display serifs, warm beige, bronze accents
+- **barelux**: Modern minimal theme with Poppins, clean lines
 
-#### 1. Register Theme
-Add to `src/themes/index.ts`:
-```typescript
-export const THEME_CONFIG = {
-  classic: '',
-  aman: '.aman',
-  barelux: '.barelux',
-  mytheme: '.mytheme', // Add your theme
-} as const;
-```
-
-#### 2. Add Fonts
-Install Fontsource packages in the design bootstrap:
-```bash
-cd keystone-design-bootstrap
-npm install @fontsource/your-body-font @fontsource/your-display-font
-```
-
-Add to `src/styles/fonts.css`:
-```css
-/* MyTheme Fonts */
-@import "@fontsource/your-body-font/400.css";
-@import "@fontsource/your-body-font/600.css";
-@import "@fontsource/your-display-font/400.css";
-@import "@fontsource/your-display-font/700.css";
-```
+### Creating a Theme
 
-#### 3. Create CSS Overrides
-Create `src/styles/style-overrides.mytheme.css`:
-```css
-[data-theme="mytheme"] {
-  /* Typography */
-  --font-body: "YourBodyFont", sans-serif;
-  --font-display: "YourDisplayFont", serif;
-  
-  /* Colors - set both prefixes */
-  --color-bg-primary: #FFFFFF;
-  --background-color-primary: #FFFFFF;
-  --color-bg-secondary: rgb(240, 240, 245);
-  --background-color-secondary: rgb(240, 240, 245);
-  --color-bg-brand-solid: rgb(100, 120, 200);
-  --background-color-brand-solid: rgb(100, 120, 200);
-  --color-bg-brand-solid_hover: rgb(80, 100, 180);
-  --background-color-brand-solid_hover: rgb(80, 100, 180);
-}
+See [`docs/theme-system.md`](./docs/theme-system.md) for complete instructions.
 
-/* Override Tailwind utilities if needed */
-[data-theme="mytheme"] .bg-secondary {
-  background-color: rgb(240, 240, 245) !important;
-}
+**With AI assistance:**
 ```
+I am creating a new theme. Here is a link to an example: https://www.example.com
+[Attach screenshots of various pages]
 
-#### 4. Use in Customer Site
-In `config/index.ts`:
-```typescript
-export const config: SiteConfig = {
-  site: { theme: "mytheme" }
-}
+Please follow the prompt in /docs/ai-prompt-template.md
 ```
 
-In `app/globals.css`:
-```css
-@import "keystone-design-bootstrap/styles/fonts.css";
-@import "keystone-design-bootstrap/styles/theme.css";
-@import "keystone-design-bootstrap/styles/typography.css";
-@import "keystone-design-bootstrap/styles/style-overrides.mytheme.css"; /* Your theme */
-```
-
-Restart your dev server. Fonts are self-hosted via Fontsource and automatically loaded.
-
-#### 5. Create Component Variants (Optional)
-**CRITICAL:** Use the exact same props interface as the base component.
-
-Check the base component first:
-```typescript
-// Check: src/design_system/sections/hero-home.tsx
-interface HeroHomeProps {
-  title?: string;  // ← Use these exact prop names
-  subtitle?: string;
-  ctaText?: string;
-  ctaHref?: string;
-}
-```
-
-Then create variant with matching interface. Props should have empty string defaults, not `*TR*` markers. Translation strings belong in the customer template.
-
-```typescript
-// src/design_system/sections/hero-home.mytheme.tsx
-export const HeroHome = ({ title, subtitle, ctaText, ctaHref }: HeroHomeProps) => (
-  <section className="bg-primary py-20">
-    <h1 className="font-display text-display-xl">{title}</h1>
-    <p className="font-body text-lg">{subtitle}</p>
-    <Button href={ctaHref} color="primary" size="md">{ctaText}</Button>
-  </section>
-);
-
-import { registerThemeVariant } from '../../lib/component-registry';
-registerThemeVariant('hero-home', 'mytheme', HeroHome);
-```
-
-#### 6. Register Component Variants
-In `src/design_system/sections/index.tsx`:
-```typescript
-import './hero-home.mytheme';
-```
+**Manual steps:**
+1. Register in `src/themes/index.ts`
+2. Install fonts via Fontsource
+3. Create `src/styles/style-overrides.{theme}.css`
+4. Create component variants (optional)
+5. Add to design gallery app
+6. Pass lint, typecheck, and build
 
-## Design Rules
+**Critical rules:**
+- Never modify base components or foundation CSS
+- Use semantic variables/classes only
+- Set BOTH `--color-*` and `--background-*` prefixes
+- Match base component props exactly
+- Ensure `npm run lint`, `npm run typecheck`, `npm run build` pass with zero errors/warnings
 
-- **Prop Consistency**: Theme variants MUST use identical props interface as base component
-- **CSS Variables Only**: No hardcoded colors/fonts in components
-- **Semantic Classes**: Use `bg-primary`, `text-fg-primary`, `font-display` (not hardcoded values)
-- **Minimal Overrides**: Keep theme CSS files ~100 lines max
-- **Dual Color Prefixes**: Mirror variables to both `--color-*` and `--background-*` prefixes for compatibility
+See [`.cursor/rules/theme-creation.mdc`](./.cursor/rules/theme-creation.mdc) for detailed rules

package/dist/{blog-post-CMvVQiok.d.ts → blog-post-BBWP5Ln9.d.ts}

@@ -1,5 +1,40 @@
 import { a as PhotoAttachment } from './form-yge25wqW.js';
 
+interface Service {
+    id: number;
+    name: string;
+    slug: string;
+    description_markdown: string;
+    summary?: string;
+    pricing_info?: string;
+    features_markdown?: string;
+    featured: boolean;
+    sort_order: number;
+    photo_attachments?: Array<{
+        id: number;
+        featured: boolean;
+        attachable_id?: number;
+        attachable_type?: string;
+        photo?: {
+            id: number;
+            title: string;
+            thumbnail_url?: string;
+            medium_url?: string;
+            large_url?: string;
+            original_url?: string;
+        };
+    }>;
+    created_at: string;
+    updated_at: string;
+}
+interface ServiceParams {
+    featured?: boolean;
+    q?: string;
+    page?: number;
+    per_page?: number;
+}
+type ServiceResponse = Service[];
+
 interface BlogPost {
     id: number;
     title: string;
@@ -47,4 +82,4 @@ interface BlogPostTag {
     updated_at: string;
 }
 
-export type { BlogPost as B, BlogPostParams as a, BlogPostResponse as b, BlogPostAuthor as c, BlogPostTag as d };
+export type { BlogPost as B, Service as S, BlogPostAuthor as a, BlogPostTag as b, BlogPostParams as c, BlogPostResponse as d, ServiceParams as e, ServiceResponse as f };

package/dist/{company-information-DNSi10Q_.d.ts → company-information-BRNLRP0x.d.ts}

@@ -39,6 +39,7 @@ interface CompanyInformation {
     updated_at: string;
     photo_attachments?: PhotoAttachment[];
     account_status?: string;
+    chat_enabled?: boolean;
 }
 type CompanyInformationResponse = CompanyInformation | null;
 

package/dist/contexts/index.js

@@ -7,8 +7,10 @@ var THEME_CONFIG = {
   // Base files with no suffix (hero-home.tsx)
   aman: ".aman",
   // Aman Hotels variant files (hero-home.aman.tsx)
-  barelux: ".barelux"
+  barelux: ".barelux",
   // Bare Lux Studio variant files (hero-home.barelux.tsx)
+  balance: ".balance"
+  // Balance Aesthetics variant files (hero-home.balance.tsx)
 };
 function isValidTheme(theme) {
   return theme in THEME_CONFIG;

package/dist/contexts/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/contexts/ThemeContext.tsx","../../src/themes/index.ts"],"sourcesContent":["'use client';\n\nimport { createContext, useContext } from 'react';\nimport { Theme, isValidTheme } from '../themes';\n\ninterface ThemeContextValue {\n  theme: Theme;\n}\n\nconst ThemeContext = createContext<ThemeContextValue>({ theme: 'classic' });\n\nexport function ThemeProvider({ \n  theme, \n  children \n}: { \n  theme: Theme; \n  children: React.ReactNode;\n}) {\n  // Validate theme at runtime\n  if (!isValidTheme(theme)) {\n    console.warn(`Invalid theme \"${theme}\", falling back to \"classic\"`);\n    theme = 'classic';\n  }\n  \n  return (\n    <ThemeContext.Provider value={{ theme }}>\n      {children}\n    </ThemeContext.Provider>\n  );\n}\n\nexport function useTheme() {\n  return useContext(ThemeContext);\n}\n","/**\n * Theme Configuration\n * Single source of truth for all themes\n */\n\nexport const THEME_CONFIG = {\n  classic: '',           // Base files with no suffix (hero-home.tsx)\n  aman: '.aman',         // Aman Hotels variant files (hero-home.aman.tsx)\n  barelux: '.barelux',   // Bare Lux Studio variant files (hero-home.barelux.tsx)\n} as const;\n\nexport type Theme = keyof typeof THEME_CONFIG;\n\nexport function getAvailableThemes(): Theme[] {\n  return Object.keys(THEME_CONFIG) as Theme[];\n}\n\nexport function getThemeSuffix(theme: Theme): string {\n  return THEME_CONFIG[theme] || '';\n}\n\nexport function isValidTheme(theme: string): theme is Theme {\n  return theme in THEME_CONFIG;\n}\n"],"mappings":";AAEA,SAAS,eAAe,kBAAkB;;;ACGnC,IAAM,eAAe;AAAA,EAC1B,SAAS;AAAA;AAAA,EACT,MAAM;AAAA;AAAA,EACN,SAAS;AAAA;AACX;AAYO,SAAS,aAAa,OAA+B;AAC1D,SAAO,SAAS;AAClB;;;ADdA,IAAM,eAAe,cAAiC,EAAE,OAAO,UAAU,CAAC;AAEnE,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AACF,GAGG;AAED,MAAI,CAAC,aAAa,KAAK,GAAG;AACxB,YAAQ,KAAK,kBAAkB,KAAK,8BAA8B;AAClE,YAAQ;AAAA,EACV;AAEA,SACE,oCAAC,aAAa,UAAb,EAAsB,OAAO,EAAE,MAAM,KACnC,QACH;AAEJ;AAEO,SAAS,WAAW;AACzB,SAAO,WAAW,YAAY;AAChC;","names":[]}
+{"version":3,"sources":["../../src/contexts/ThemeContext.tsx","../../src/themes/index.ts"],"sourcesContent":["'use client';\n\nimport { createContext, useContext } from 'react';\nimport { Theme, isValidTheme } from '../themes';\n\ninterface ThemeContextValue {\n  theme: Theme;\n}\n\nconst ThemeContext = createContext<ThemeContextValue>({ theme: 'classic' });\n\nexport function ThemeProvider({ \n  theme, \n  children \n}: { \n  theme: Theme; \n  children: React.ReactNode;\n}) {\n  // Validate theme at runtime\n  if (!isValidTheme(theme)) {\n    console.warn(`Invalid theme \"${theme}\", falling back to \"classic\"`);\n    theme = 'classic';\n  }\n  \n  return (\n    <ThemeContext.Provider value={{ theme }}>\n      {children}\n    </ThemeContext.Provider>\n  );\n}\n\nexport function useTheme() {\n  return useContext(ThemeContext);\n}\n","/**\n * Theme Configuration\n * Single source of truth for all themes\n */\n\nexport const THEME_CONFIG = {\n  classic: '',           // Base files with no suffix (hero-home.tsx)\n  aman: '.aman',         // Aman Hotels variant files (hero-home.aman.tsx)\n  barelux: '.barelux',   // Bare Lux Studio variant files (hero-home.barelux.tsx)\n  balance: '.balance',   // Balance Aesthetics variant files (hero-home.balance.tsx)\n} as const;\n\nexport type Theme = keyof typeof THEME_CONFIG;\n\nexport function getAvailableThemes(): Theme[] {\n  return Object.keys(THEME_CONFIG) as Theme[];\n}\n\nexport function getThemeSuffix(theme: Theme): string {\n  return THEME_CONFIG[theme] || '';\n}\n\nexport function isValidTheme(theme: string): theme is Theme {\n  return theme in THEME_CONFIG;\n}\n"],"mappings":";AAEA,SAAS,eAAe,kBAAkB;;;ACGnC,IAAM,eAAe;AAAA,EAC1B,SAAS;AAAA;AAAA,EACT,MAAM;AAAA;AAAA,EACN,SAAS;AAAA;AAAA,EACT,SAAS;AAAA;AACX;AAYO,SAAS,aAAa,OAA+B;AAC1D,SAAO,SAAS;AAClB;;;ADfA,IAAM,eAAe,cAAiC,EAAE,OAAO,UAAU,CAAC;AAEnE,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AACF,GAGG;AAED,MAAI,CAAC,aAAa,KAAK,GAAG;AACxB,YAAQ,KAAK,kBAAkB,KAAK,8BAA8B;AAClE,YAAQ;AAAA,EACV;AAEA,SACE,oCAAC,aAAa,UAAb,EAAsB,OAAO,EAAE,MAAM,KACnC,QACH;AAEJ;AAEO,SAAS,WAAW;AACzB,SAAO,WAAW,YAAY;AAChC;","names":[]}

package/dist/design_system/elements/index.d.ts

@@ -1,7 +1,6 @@
-import * as React$1 from 'react';
-import React__default, { ReactNode, Ref, ComponentType, HTMLAttributes, ComponentPropsWithRef, RefAttributes, PropsWithChildren, CSSProperties, FC, SVGProps } from 'react';
-import * as react_aria_components from 'react-aria-components';
-import { TextFieldProps as TextFieldProps$1, Tabs as Tabs$1, TabPanel, TabListProps, TabProps, TabRenderProps, TagGroupProps as TagGroupProps$1, TagProps as TagProps$1, ModalOverlayProps, ModalRenderProps, DialogTrigger, ComboBoxProps as ComboBoxProps$1, ListBoxProps } from 'react-aria-components';
+import * as React from 'react';
+import React__default, { ReactNode, Ref, ComponentType, HTMLAttributes, CSSProperties, FC, SVGProps, ComponentPropsWithRef, RefAttributes } from 'react';
+import { TextFieldProps as TextFieldProps$1, ComboBoxProps as ComboBoxProps$1, ListBoxProps } from 'react-aria-components';
 import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
 
 interface InputBaseProps extends TextFieldProps {
@@ -43,77 +42,7 @@ interface TextFieldProps extends BaseProps, TextFieldProps$1, Pick<InputBaseProp
  * A2P 10DLC-compliant privacy + SMS consent checkbox. Use on any form that collects phone numbers.
  * Same copy and markup used across contact and job application forms.
  */
-declare function PrivacyCheckbox$1(): React$1.JSX.Element;
-
-type Orientation = "horizontal" | "vertical";
-type HorizontalTypes = "button-brand" | "button-gray" | "button-border" | "button-minimal" | "underline";
-type VerticalTypes = "button-brand" | "button-gray" | "button-border" | "button-minimal" | "line";
-type TabTypeColors<T> = T extends "horizontal" ? HorizontalTypes : VerticalTypes;
-declare const sizes: {
-    sm: {
-        "button-brand": string;
-        "button-gray": string;
-        "button-border": string;
-        "button-minimal": string;
-        underline: string;
-        line: string;
-    };
-    md: {
-        "button-brand": string;
-        "button-gray": string;
-        "button-border": string;
-        "button-minimal": string;
-        underline: string;
-        line: string;
-    };
-};
-interface TabListComponentProps<T extends object, K extends Orientation> extends TabListProps<T> {
-    /** The size of the tab list. */
-    size?: keyof typeof sizes;
-    /** The type of the tab list. */
-    type?: TabTypeColors<K>;
-    /** The orientation of the tab list. */
-    orientation?: K;
-    /** The items of the tab list. */
-    items: T[];
-    /** Whether the tab list is full width. */
-    fullWidth?: boolean;
-}
-interface TabComponentProps extends TabProps {
-    /** The label of the tab. */
-    label?: ReactNode;
-    /** The children of the tab. */
-    children?: ReactNode | ((props: TabRenderProps) => ReactNode);
-    /** The badge displayed next to the label. */
-    badge?: number | string;
-}
-declare const Tabs: {
-    ({ className, ...props }: ComponentPropsWithRef<typeof Tabs$1>): React$1.JSX.Element;
-    Panel: (props: ComponentPropsWithRef<typeof TabPanel>) => React$1.JSX.Element;
-    List: <T extends Orientation>({ size, type, orientation: orientationProp, fullWidth, className, children, ...otherProps }: TabListComponentProps<TabComponentProps, T>) => React$1.JSX.Element;
-    Item: (props: TabComponentProps) => React$1.JSX.Element;
-};
-
-interface TagItem {
-    id: string;
-    label: string;
-    count?: number;
-    avatarSrc?: string;
-    avatarContrastBorder?: boolean;
-    dot?: boolean;
-    dotClassName?: string;
-    isDisabled?: boolean;
-    onClose?: (id: string) => void;
-}
-interface TagGroupProps extends TagGroupProps$1, RefAttributes<HTMLDivElement> {
-    label: string;
-    size?: "sm" | "md" | "lg";
-}
-declare const TagGroup: ({ label, selectionMode, size, children, ...otherProps }: TagGroupProps) => React$1.JSX.Element;
-declare const TagList: <T extends object>(props: react_aria_components.TagListProps<T> & React.RefAttributes<HTMLDivElement>) => React.ReactElement | null;
-interface TagProps extends TagProps$1, RefAttributes<object>, Omit<TagItem, "label" | "id"> {
-}
-declare const Tag: ({ id, avatarSrc, avatarContrastBorder, dot, dotClassName, isDisabled, count, className, children, onClose, }: PropsWithChildren<TagProps>) => React$1.JSX.Element;
+declare function PrivacyCheckbox$1(): React.JSX.Element;
 
 type PaginationPage = {
     /** The type of the pagination item. */
@@ -216,38 +145,6 @@ declare const Pagination: {
     Context: FC<PaginationContextComponentProps>;
 };
 
-interface SlideoutMenuProps extends Omit<ModalOverlayProps, "children">, RefAttributes<HTMLDivElement> {
-    children: ReactNode | ((children: ModalRenderProps & {
-        close: () => void;
-    }) => ReactNode);
-    dialogClassName?: string;
-}
-declare const Menu: {
-    ({ children, dialogClassName, ...props }: SlideoutMenuProps): React$1.JSX.Element;
-    displayName: string;
-};
-declare const Content: {
-    ({ role, ...props }: ComponentPropsWithRef<"div">): React$1.JSX.Element;
-    displayName: string;
-};
-interface SlideoutHeaderProps extends ComponentPropsWithRef<"header"> {
-    onClose?: () => void;
-}
-declare const Header: {
-    ({ className, children, onClose, ...props }: SlideoutHeaderProps): React$1.JSX.Element;
-    displayName: string;
-};
-declare const Footer: {
-    (props: ComponentPropsWithRef<"footer">): React$1.JSX.Element;
-    displayName: string;
-};
-declare const SlideoutMenu: typeof Menu & {
-    Trigger: typeof DialogTrigger;
-    Content: typeof Content;
-    Header: typeof Header;
-    Footer: typeof Footer;
-};
-
 declare const getStarProgress: (starPosition: number, rating: number, maxRating?: number) => number;
 interface StarIconProps extends SVGProps<SVGSVGElement> {
     /**
@@ -257,9 +154,9 @@ interface StarIconProps extends SVGProps<SVGSVGElement> {
      */
     progress?: number;
 }
-declare const StarIcon: ({ progress, ...props }: StarIconProps) => React$1.JSX.Element;
+declare const StarIcon: ({ progress, ...props }: StarIconProps) => React.JSX.Element;
 
-declare const Wreath: (props: HTMLAttributes<HTMLOrSVGElement>) => React$1.JSX.Element;
+declare const Wreath: (props: HTMLAttributes<HTMLOrSVGElement>) => React.JSX.Element;
 
 type CarouselApi = UseEmblaCarouselType[1];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
@@ -293,7 +190,7 @@ type CarouselContextProps = CarouselProps & {
     /** The scroll snaps of the carousel. */
     scrollSnaps: number[];
 };
-declare const CarouselContext: React$1.Context<CarouselContextProps | null>;
+declare const CarouselContext: React.Context<CarouselContextProps | null>;
 declare const useCarousel: () => CarouselContextProps;
 interface CarouselContentProps extends ComponentPropsWithRef<"div"> {
     /** The class name of the content. */
@@ -348,13 +245,13 @@ interface CarouselIndicatorGroupProps extends Omit<HTMLAttributes<HTMLDivElement
     className?: string;
 }
 declare const Carousel: {
-    Root: ({ orientation, opts, setApi, plugins, className, children, ...props }: ComponentPropsWithRef<"div"> & CarouselProps) => React$1.JSX.Element;
-    Content: ({ className, overflowHidden, ...props }: CarouselContentProps) => React$1.JSX.Element;
-    Item: ({ className, ...props }: ComponentPropsWithRef<"div">) => React$1.JSX.Element;
-    PrevTrigger: (props: Omit<TriggerProps, "direction">) => React$1.JSX.Element;
-    NextTrigger: (props: Omit<TriggerProps, "direction">) => React$1.JSX.Element;
-    IndicatorGroup: ({ children, ...props }: CarouselIndicatorGroupProps) => React$1.JSX.Element;
-    Indicator: ({ index, isSelected, children, asChild, className, style }: CarouselIndicatorProps) => React$1.JSX.Element;
+    Root: ({ orientation, opts, setApi, plugins, className, children, ...props }: ComponentPropsWithRef<"div"> & CarouselProps) => React.JSX.Element;
+    Content: ({ className, overflowHidden, ...props }: CarouselContentProps) => React.JSX.Element;
+    Item: ({ className, ...props }: ComponentPropsWithRef<"div">) => React.JSX.Element;
+    PrevTrigger: (props: Omit<TriggerProps, "direction">) => React.JSX.Element;
+    NextTrigger: (props: Omit<TriggerProps, "direction">) => React.JSX.Element;
+    IndicatorGroup: ({ children, ...props }: CarouselIndicatorGroupProps) => React.JSX.Element;
+    Indicator: ({ index, isSelected, children, asChild, className, style }: CarouselIndicatorProps) => React.JSX.Element;
 };
 
 interface CarouselSectionWrapperProps {
@@ -389,27 +286,23 @@ interface ComboBoxProps extends Omit<ComboBoxProps$1<SelectItemType>, "children"
     shortcutClassName?: string;
     children: ListBoxProps<SelectItemType>["children"];
 }
-declare const ComboBox: ({ placeholder, shortcut, size, children, items, shortcutClassName, ...otherProps }: ComboBoxProps) => React$1.JSX.Element;
+declare const ComboBox: ({ placeholder, shortcut, size, children, items, shortcutClassName, ...otherProps }: ComboBoxProps) => React.JSX.Element;
 
 interface VideoModalProps {
     isOpen: boolean;
     onClose: () => void;
     videoUrl: string;
 }
-declare function VideoModal({ isOpen, onClose, videoUrl }: VideoModalProps): React$1.JSX.Element | null;
+declare function VideoModal({ isOpen, onClose, videoUrl }: VideoModalProps): React.JSX.Element | null;
 
 interface VideoPlayButtonProps {
     onClick: () => void;
     className?: string;
 }
-declare function VideoPlayButton({ onClick, className }: VideoPlayButtonProps): React$1.JSX.Element;
+declare function VideoPlayButton({ onClick, className }: VideoPlayButtonProps): React.JSX.Element;
 
 declare const Button: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const RoundButton: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const CloseButton: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const SocialButton: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const AppStoreButton: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const GooglePlayButton: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const ButtonGroup: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const Input: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const InputBase: {
@@ -417,9 +310,7 @@ declare const InputBase: {
     displayName: string;
 };
 declare const Textarea: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const Checkbox: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const PrivacyCheckbox: typeof PrivacyCheckbox$1;
-declare const Toggle: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const Form: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const FormContainer: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const InputGroup: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
@@ -427,14 +318,8 @@ declare const Label: (props: Record<string, unknown>) => React__default.ReactEle
 declare const HintText: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const Select: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const SelectItem: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const MultiSelect: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const NativeSelect: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const RadioGroup: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const RadioButton: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const DatePicker: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const DateRangePicker: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const PhotoWithFallback: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const LoadingIndicator: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const Badge: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const BadgeWithDot: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const BadgeGroup: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
@@ -443,18 +328,12 @@ declare const RatingBadge: (props: Record<string, unknown>) => React__default.Re
 declare const Tooltip: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const Avatar: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const AvatarLabelGroup: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const AvatarProfilePhoto: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const VerifiedTick: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const Breadcrumb: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const FeaturedIcon: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const ProgressBar: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const ProgressBarCircle: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const CircleProgressBar: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const PaginationDot: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
-declare const PaginationLine: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const PaginationPageDefault: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const PaginationPageMinimalCenter: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const GoogleMap: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 declare const MarkdownRenderer: (props: Record<string, unknown>) => React__default.ReactElement<Record<string, unknown>, string | React__default.JSXElementConstructor<any>>;
 
-export { AppStoreButton, Avatar, AvatarLabelGroup, AvatarProfilePhoto, Badge, BadgeGroup, BadgeWithDot, Breadcrumb, Button, ButtonGroup, Carousel, CarouselContext, CarouselSectionWrapper, Checkbox, CircleProgressBar, CloseButton, ComboBox, DatePicker, DateRangePicker, FeaturedIcon, Form, FormContainer, GoogleMap, GooglePlayButton, HintText, Input, InputBase, InputGroup, Label, LoadingIndicator, MarkdownRenderer, MultiSelect, NativeSelect, Pagination, PaginationDot, PaginationLine, PaginationPageDefault, PaginationPageMinimalCenter, PhotoWithFallback, PrivacyCheckbox, ProgressBar, ProgressBarCircle, RadioButton, RadioGroup, RatingBadge, RatingStars, RoundButton, Select, SelectItem, SlideoutMenu, SocialButton, StarIcon, Tabs, Tag, TagGroup, TagList, Textarea, Toggle, Tooltip, VerifiedTick, VideoModal, VideoPlayButton, Wreath, getStarProgress, useCarousel };
+export { Avatar, AvatarLabelGroup, Badge, BadgeGroup, BadgeWithDot, Breadcrumb, Button, ButtonGroup, Carousel, CarouselContext, CarouselSectionWrapper, ComboBox, FeaturedIcon, Form, FormContainer, GoogleMap, HintText, Input, InputBase, InputGroup, Label, MarkdownRenderer, NativeSelect, Pagination, PaginationPageDefault, PaginationPageMinimalCenter, PhotoWithFallback, PrivacyCheckbox, RatingBadge, RatingStars, RoundButton, Select, SelectItem, StarIcon, Textarea, Tooltip, VerifiedTick, VideoModal, VideoPlayButton, Wreath, getStarProgress, useCarousel };