@vygruppen/spor-react 2.3.0 → 2.3.3

package/dist/index.d.ts

@@ -10,7 +10,6 @@ import { DateValue } from '@internationalized/date';
 export { Time } from '@internationalized/date';
 import { AriaDatePickerProps, AriaDateRangePickerProps, AriaPositionProps, AriaListBoxOptions } from 'react-aria';
 import { TimeValue } from '@react-types/datepicker';
-import * as _leile_lobo_t from '@leile/lobo-t';
 import { SelectState, ListState } from 'react-stately';
 export { Item as SelectItem } from 'react-stately';
 import * as _chakra_ui_theme_tools_dist_component from '@chakra-ui/theme-tools/dist/component';
@@ -505,17 +504,69 @@ declare enum Language {
     Swedish = "sv",
     English = "en"
 }
-declare const LanguageProvider: React.Provider<Language>;
-declare const useTranslation: () => {
-    t: _leile_lobo_t.TFunc<typeof Language>;
-    language: Language;
-};
-type LanguageObject = {
-    [key in Language]: string;
+type TranslationObject = {
+    [key in Language]: string | React__default.ReactElement;
 };
-type LanguageFunction = (...args: (string | number)[]) => LanguageObject;
+type TranslationFunction = (...args: Array<string | number>) => TranslationObject;
+type Translation = TranslationObject | TranslationFunction;
 type Translations = {
-    [key: string]: LanguageObject | LanguageFunction;
+    [key: string]: Translation | Translations;
+};
+type LanguageProviderProps = {
+    language: Language;
+    children: React__default.ReactElement;
+};
+/**
+ * A language provider component.
+ *
+ * This component should wrap your entire application. It will provide the language to all components that use it.
+ *
+ * This is done by the SporProvider component, so most likely, you won't need to use it directly, unless you want to use a specific language for a specific part of your application.
+ *
+ * ```tsx
+ * import { LanguageProvider, Language } from "@vygruppen/spor-react";
+ *
+ * const App = () => {
+ *   return (
+ *     <LanguageProvider language={Language.NorwegianBokmal}>
+ *       <Routes />
+ *     </LanguageProvider>
+ *   );
+ * }
+ * ```
+ *
+ */
+declare function LanguageProvider({ language, children, }: LanguageProviderProps): React__default.JSX.Element;
+/**
+ * A hook that returns translation utilities. Typically used to translate text.
+ *
+ * ```tsx
+ * const Example = () => {
+ *   const { t } = useTranslation();
+ *   return <p>{t(texts.greeting)}</p>;
+ * }
+ * const texts = {
+ *   greeting: {
+ *     nb: "Hei",
+ *     nn: "Hei",
+ *     sv: "Hej",
+ *     en: "Hello",
+ *   }
+ * }
+ * ```
+ *
+ * You can also use it to fetch the current language:
+ *
+ * ```tsx
+ * const Example = () => {
+ *   const { language } = useTranslation();
+ *   return <p>{language}</p>;
+ * };
+ * ```
+ */
+declare function useTranslation(): {
+    readonly t: (text: TranslationObject) => string;
+    readonly language: Language;
 };
 /** Utility function that creates type safe text objects with useTranslation
  *
@@ -526,6 +577,14 @@ type Translations = {
  *   nn: "Døme",
  *   sv: "Exempel",
  *   en: "Example",
+ *  },
+ *  another: {
+ *    example: {
+ *      nb: <strong>Eksempel</strong>,
+ *      nn: <strong>Døme</strong>,
+ *      sv: <strong>Exempel</strong>,
+ *      en: <strong>Example</strong>,
+ *    }
  *  }
  * })
  * ```
@@ -677,7 +736,7 @@ type ChoiceChipProps = {
  */
 declare const ChoiceChip: _chakra_ui_system_dist_system_types.ComponentWithAs<_chakra_ui_system_dist_system_types.As, ChoiceChipProps>;
 
-type CounterProps = {
+type NumericStepperProps = {
     /** The name of the input field */
     name?: string;
     /** The current value */
@@ -690,34 +749,34 @@ type CounterProps = {
     minValue?: number;
     /** Optional maximum value. Defaults to 99 */
     maxValue?: number;
-    /** Whether the counter is disabled or not */
+    /** Whether the stepper is disabled or not */
     isDisabled?: boolean;
 } & BoxProps;
-/** A simple counter component
+/** A simple stepper component for integer values
  *
  * Allows you to choose a given integer value, like for example the number of
  * adults on your journey.
  *
  * ```tsx
- * <Counter value={value} onChange={setValue} />
+ * <NumericStepper value={value} onChange={setValue} />
  * ```
  *
  * You can also set a minimum and/or maximum value:
  *
  * ```tsx
- * <Counter value={value} onChange={setValue} minValue={1} maxValue={10} />
+ * <NumericStepper value={value} onChange={setValue} minValue={1} maxValue={10} />
  * ```
  *
- * You can use the Counter inside of a FormControl component to get IDs etc linked up automatically:
+ * You can use the NumericStepper inside of a FormControl component to get IDs etc linked up automatically:
  *
  * ```tsx
  * <FormControl>
  *   <FormLabel>Number of adults</FormLabel>
- *   <Counter />
+ *   <NumericStepper />
  * </FormControl>
  * ```
  */
-declare function Counter({ name: nameProp, id: idProp, value: valueProp, defaultValue, onChange: onChangeProp, minValue, maxValue, isDisabled, ...boxProps }: CounterProps): React__default.JSX.Element;
+declare function NumericStepper({ name: nameProp, id: idProp, value: valueProp, defaultValue, onChange: onChangeProp, minValue, maxValue, isDisabled, ...boxProps }: NumericStepperProps): React__default.JSX.Element;
 
 type FormControlProps = FormControlProps$1;
 declare const FormControl: _chakra_ui_system_dist_system_types.ComponentWithAs<"div", FormControlProps$1>;
@@ -6868,4 +6927,4 @@ type TextProps = Omit<TextProps$1, "textStyle"> & {
  */
 declare const Text: _chakra_ui_system_dist_system_types.ComponentWithAs<"p", TextProps>;
 
-export { Accordion, AccordionProps, AttachedInputs, Badge, BadgeProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, Card, CardProps, CardSelect, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChoiceChip, ChoiceChipProps, ClosableAlert, CloseButton, CloseButtonProps, Code, CodeProps, ColorInlineLoader, ColorInlineLoaderProps, ColorSpinner, ColorSpinnerProps, ContentLoader, ContentLoaderProps, Counter, DarkFullScreenLoader, DarkInlineLoader, DarkInlineLoaderProps, DarkSpinner, DarkSpinnerProps, DatePicker, DateRangePicker, Divider, DividerProps, Drawer, DrawerContent, ModalHeader as DrawerHeader, Expandable, ExpandableAlert, ExpandableItem, ExpandableItemProps, FloatingActionButton, FormControl, FormControlProps, FormErrorMessage, FormErrorMessageProps, FormLabel, FormLabelProps, Heading, HeadingProps, IconButton, IconButtonProps, InfoSelect, InfoTag, InfoTagProps, Input, InputElementProps, InputLeftElement, InputProps, InputRightElement, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightInlineLoaderProps, LightSpinner, LightSpinnerProps, LineIcon, LineIconProps, ListBox, ModalHeader, ModalHeaderProps, NativeSelect, NativeSelectProps, PasswordInput, PasswordInputProps, PhoneNumberInput, PlayPauseButton, PopoverWizardBody, PopoverWizardProps, ProgressBar, ProgressLoader, Radio, RadioGroup, RadioGroupProps, RadioProps, SearchInput, SearchInputProps, SelectItemDescription, SelectItemLabel, SimpleDrawer, SimpleDrawerProps, SimplePopover, Skeleton, SkeletonCircle, SkeletonCircleProps, SkeletonProps, SkeletonText, SkeletonTextProps, SkipButton, SpinnerProps, SporProvider, Stack, StackProps, StaticAlert, Stepper, StepperStep, Switch, SwitchProps, Table, TableProps, Tabs, TabsProps, Text, TextLink, TextProps, Textarea, TextareaProps, TimePicker, ToastOptions, Translations, TravelTag, TravelTagProps, VyLogo, VyLogoProps, WizardPopover, WizardPopoverProps, createTexts, fontFaces, theme, useToast, useTranslation };
+export { Accordion, AccordionProps, AttachedInputs, Badge, BadgeProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, Card, CardProps, CardSelect, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChoiceChip, ChoiceChipProps, ClosableAlert, CloseButton, CloseButtonProps, Code, CodeProps, ColorInlineLoader, ColorInlineLoaderProps, ColorSpinner, ColorSpinnerProps, ContentLoader, ContentLoaderProps, DarkFullScreenLoader, DarkInlineLoader, DarkInlineLoaderProps, DarkSpinner, DarkSpinnerProps, DatePicker, DateRangePicker, Divider, DividerProps, Drawer, DrawerContent, ModalHeader as DrawerHeader, Expandable, ExpandableAlert, ExpandableItem, ExpandableItemProps, FloatingActionButton, FormControl, FormControlProps, FormErrorMessage, FormErrorMessageProps, FormLabel, FormLabelProps, Heading, HeadingProps, IconButton, IconButtonProps, InfoSelect, InfoTag, InfoTagProps, Input, InputElementProps, InputLeftElement, InputProps, InputRightElement, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightInlineLoaderProps, LightSpinner, LightSpinnerProps, LineIcon, LineIconProps, ListBox, ModalHeader, ModalHeaderProps, NativeSelect, NativeSelectProps, NumericStepper, PasswordInput, PasswordInputProps, PhoneNumberInput, PlayPauseButton, PopoverWizardBody, PopoverWizardProps, ProgressBar, ProgressLoader, Radio, RadioGroup, RadioGroupProps, RadioProps, SearchInput, SearchInputProps, SelectItemDescription, SelectItemLabel, SimpleDrawer, SimpleDrawerProps, SimplePopover, Skeleton, SkeletonCircle, SkeletonCircleProps, SkeletonProps, SkeletonText, SkeletonTextProps, SkipButton, SpinnerProps, SporProvider, Stack, StackProps, StaticAlert, Stepper, StepperStep, Switch, SwitchProps, Table, TableProps, Tabs, TabsProps, Text, TextLink, TextProps, Textarea, TextareaProps, TimePicker, ToastOptions, Translations, TravelTag, TravelTagProps, VyLogo, VyLogoProps, WizardPopover, WizardPopoverProps, createTexts, fontFaces, theme, useToast, useTranslation };