@obosbbl/grunnmuren-react 3.0.8 → 3.0.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +13 -5
- package/dist/index.mjs +22 -10
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -2,7 +2,7 @@ import { RouterProvider, ButtonProps as ButtonProps$1, LinkProps, ContextValue,
|
|
|
2
2
|
export { ListBoxItemProps as ComboboxItemProps, Form, Group, LabelProps, ListBoxItemProps as SelectItemProps, DisclosureGroup as UNSAFE_DisclosureGroup, DisclosureGroupProps as UNSAFE_DisclosureGroupProps } from 'react-aria-components';
|
|
3
3
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
4
4
|
import * as react from 'react';
|
|
5
|
-
import { Ref, HTMLProps, ReactNode, RefAttributes,
|
|
5
|
+
import { Ref, HTMLProps, HTMLAttributes, ReactNode, RefAttributes, RefObject, Dispatch, SetStateAction, ComponentProps, JSX } from 'react';
|
|
6
6
|
import * as cva from 'cva';
|
|
7
7
|
import { VariantProps } from 'cva';
|
|
8
8
|
import { DateFormatterOptions } from 'react-aria';
|
|
@@ -444,9 +444,8 @@ type ButtonOrLinkProps = {
|
|
|
444
444
|
type BacklinkProps = (ButtonProps$1 | LinkProps) & ButtonOrLinkProps;
|
|
445
445
|
declare function Backlink(props: BacklinkProps): react_jsx_runtime.JSX.Element;
|
|
446
446
|
|
|
447
|
-
type CardProps = VariantProps<typeof cardVariants> & {
|
|
447
|
+
type CardProps = VariantProps<typeof cardVariants> & HTMLAttributes<HTMLDivElement> & {
|
|
448
448
|
children?: React.ReactNode;
|
|
449
|
-
className?: string;
|
|
450
449
|
};
|
|
451
450
|
declare const cardVariants: (props?: ({
|
|
452
451
|
variant?: "subtle" | "outlined" | undefined;
|
|
@@ -702,7 +701,16 @@ declare function Tab(props: TabProps): react_jsx_runtime.JSX.Element;
|
|
|
702
701
|
*/
|
|
703
702
|
declare function TabPanel(props: TabPanelProps): react_jsx_runtime.JSX.Element;
|
|
704
703
|
|
|
705
|
-
type
|
|
704
|
+
type CustomLinkProps = LinkProps & {
|
|
705
|
+
children: ReactNode;
|
|
706
|
+
};
|
|
707
|
+
/**
|
|
708
|
+
* A basic link component that extends react-aria-components Link with consistent styling.
|
|
709
|
+
* Provides accessible focus styles and maintains design system consistency.
|
|
710
|
+
*/
|
|
711
|
+
declare const CustomLink: ({ children, className, ...restProps }: CustomLinkProps) => react_jsx_runtime.JSX.Element;
|
|
712
|
+
|
|
713
|
+
type LinkListProps = React.HTMLProps<HTMLDivElement> & {
|
|
706
714
|
children: JSX.Element | JSX.Element[];
|
|
707
715
|
};
|
|
708
716
|
declare const LinkList: ({ className, children, ...restProps }: LinkListProps) => react_jsx_runtime.JSX.Element;
|
|
@@ -712,4 +720,4 @@ type LinkListItemProps = LinkProps & {
|
|
|
712
720
|
};
|
|
713
721
|
declare const LinkListItem: ({ children, isExternal, className, ...restProps }: LinkListItemProps) => react_jsx_runtime.JSX.Element;
|
|
714
722
|
|
|
715
|
-
export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, Alertbox, type Props as AlertboxProps, Avatar, type AvatarProps, Backlink, type BacklinkProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonContext, type ButtonProps, Caption, type CaptionProps, Card, CardLink, type CardLinkProps, type CardProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, Combobox, ListBoxHeader as ComboboxHeader, ListBoxItem as ComboboxItem, type ComboboxProps, ListBoxSection as ComboboxSection, Content, ContentContext, type ContentProps, DateFormatter, type DateFormatterProps, Description, type DescriptionProps, DisclosureStateContext, ErrorMessage, type ErrorMessageProps, Footer, type FooterProps, GrunnmurenProvider, type GrunnmurenProviderProps, Heading, HeadingContext, type HeadingProps, Label, type Locale, Media, MediaContext, type MediaProps, NumberField, type NumberFieldProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Select, ListBoxHeader as SelectHeader, ListBoxItem as SelectItem, type SelectProps, ListBoxSection as SelectSection, type TagGroupProps, type TagListProps, type TagProps, TextArea, type TextAreaProps, TextField, type TextFieldProps, Carousel as UNSAFE_Carousel, CarouselItem as UNSAFE_CarouselItem, type CarouselItemProps as UNSAFE_CarouselItemProps, CarouselItems as UNSAFE_CarouselItems, type CarouselItemsProps as UNSAFE_CarouselItemsProps, type CarouselProps as UNSAFE_CarouselProps, Dialog as UNSAFE_Dialog, type DialogProps as UNSAFE_DialogProps, DialogTrigger as UNSAFE_DialogTrigger, type DialogTriggerProps as UNSAFE_DialogTriggerProps, Disclosure as UNSAFE_Disclosure, DisclosureButton as UNSAFE_DisclosureButton, type DisclosureButtonProps as UNSAFE_DisclosureButtonProps, DisclosurePanel as UNSAFE_DisclosurePanel, type DisclosurePanelProps as UNSAFE_DisclosurePanelProps, type DisclosureProps as UNSAFE_DisclosureProps, FileUpload as UNSAFE_FileUpload, type FileUploadProps as UNSAFE_FileUploadProps, Hero as UNSAFE_Hero, type HeroProps as UNSAFE_HeroProps, LinkList as UNSAFE_LinkList, LinkListItem as UNSAFE_LinkListItem, type LinkListItemProps as UNSAFE_LinkListItemProps, type LinkListProps as UNSAFE_LinkListProps, Modal as UNSAFE_Modal, type ModalProps as UNSAFE_ModalProps, Tab as UNSAFE_Tab, TabList as UNSAFE_TabList, type TabListProps as UNSAFE_TabListProps, TabPanel as UNSAFE_TabPanel, type TabPanelProps as UNSAFE_TabPanelProps, type TabProps as UNSAFE_TabProps, Tabs as UNSAFE_Tabs, type TabsProps as UNSAFE_TabsProps, Tag as UNSAFE_Tag, TagGroup as UNSAFE_TagGroup, TagList as UNSAFE_TagList, VideoLoop, _useLocale as useLocale };
|
|
723
|
+
export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, Alertbox, type Props as AlertboxProps, Avatar, type AvatarProps, Backlink, type BacklinkProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonContext, type ButtonProps, Caption, type CaptionProps, Card, CardLink, type CardLinkProps, type CardProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, Combobox, ListBoxHeader as ComboboxHeader, ListBoxItem as ComboboxItem, type ComboboxProps, ListBoxSection as ComboboxSection, Content, ContentContext, type ContentProps, DateFormatter, type DateFormatterProps, Description, type DescriptionProps, DisclosureStateContext, ErrorMessage, type ErrorMessageProps, Footer, type FooterProps, GrunnmurenProvider, type GrunnmurenProviderProps, Heading, HeadingContext, type HeadingProps, Label, CustomLink as Link, type CustomLinkProps as LinkProps, type Locale, Media, MediaContext, type MediaProps, NumberField, type NumberFieldProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Select, ListBoxHeader as SelectHeader, ListBoxItem as SelectItem, type SelectProps, ListBoxSection as SelectSection, type TagGroupProps, type TagListProps, type TagProps, TextArea, type TextAreaProps, TextField, type TextFieldProps, Carousel as UNSAFE_Carousel, CarouselItem as UNSAFE_CarouselItem, type CarouselItemProps as UNSAFE_CarouselItemProps, CarouselItems as UNSAFE_CarouselItems, type CarouselItemsProps as UNSAFE_CarouselItemsProps, type CarouselProps as UNSAFE_CarouselProps, Dialog as UNSAFE_Dialog, type DialogProps as UNSAFE_DialogProps, DialogTrigger as UNSAFE_DialogTrigger, type DialogTriggerProps as UNSAFE_DialogTriggerProps, Disclosure as UNSAFE_Disclosure, DisclosureButton as UNSAFE_DisclosureButton, type DisclosureButtonProps as UNSAFE_DisclosureButtonProps, DisclosurePanel as UNSAFE_DisclosurePanel, type DisclosurePanelProps as UNSAFE_DisclosurePanelProps, type DisclosureProps as UNSAFE_DisclosureProps, FileUpload as UNSAFE_FileUpload, type FileUploadProps as UNSAFE_FileUploadProps, Hero as UNSAFE_Hero, type HeroProps as UNSAFE_HeroProps, LinkList as UNSAFE_LinkList, LinkListItem as UNSAFE_LinkListItem, type LinkListItemProps as UNSAFE_LinkListItemProps, type LinkListProps as UNSAFE_LinkListProps, Modal as UNSAFE_Modal, type ModalProps as UNSAFE_ModalProps, Tab as UNSAFE_Tab, TabList as UNSAFE_TabList, type TabListProps as UNSAFE_TabListProps, TabPanel as UNSAFE_TabPanel, type TabPanelProps as UNSAFE_TabPanelProps, type TabProps as UNSAFE_TabProps, Tabs as UNSAFE_Tabs, type TabsProps as UNSAFE_TabsProps, Tag as UNSAFE_Tag, TagGroup as UNSAFE_TagGroup, TagList as UNSAFE_TagList, VideoLoop, _useLocale as useLocale };
|
package/dist/index.mjs
CHANGED
|
@@ -1186,7 +1186,9 @@ const cardVariants = cva({
|
|
|
1186
1186
|
'[&_[data-slot="media"]]:rounded-t-2xl'
|
|
1187
1187
|
],
|
|
1188
1188
|
horizontal: [
|
|
1189
|
-
|
|
1189
|
+
// Use more gap for horizontal cards that have media
|
|
1190
|
+
// Since this does not affect the layout before the flex direction is set (at breakpoint @2xl for Card with Media), we can set it here
|
|
1191
|
+
'has-data-[slot=media]:layout-gap-x not-has-data-[slot=media]:gap-x-4',
|
|
1190
1192
|
// **** With Media ****
|
|
1191
1193
|
'[&:has(>[data-slot="media"]:last-child)]:flex-col-reverse',
|
|
1192
1194
|
'has-data-[slot=media]:@2xl:!flex-row',
|
|
@@ -1763,7 +1765,7 @@ const FileUpload = ({ children, files: _files, onChange, validate, isInvalid: _i
|
|
|
1763
1765
|
],
|
|
1764
1766
|
children: /*#__PURE__*/ jsxs("div", {
|
|
1765
1767
|
"data-slot": "file-upload",
|
|
1766
|
-
className: "group grid
|
|
1768
|
+
className: "group grid gap-2",
|
|
1767
1769
|
"data-required": isRequired,
|
|
1768
1770
|
children: [
|
|
1769
1771
|
/*#__PURE__*/ jsx(Provider, {
|
|
@@ -1809,7 +1811,7 @@ const FileUpload = ({ children, files: _files, onChange, validate, isInvalid: _i
|
|
|
1809
1811
|
})
|
|
1810
1812
|
}),
|
|
1811
1813
|
controlledOrUncontrolledFiles.length > 0 && /*#__PURE__*/ jsx("ul", {
|
|
1812
|
-
className: "mt-4 grid gap-y-2",
|
|
1814
|
+
className: "mt-4 grid max-w-fit gap-y-2",
|
|
1813
1815
|
children: controlledOrUncontrolledFiles.map((file, fileIndex)=>{
|
|
1814
1816
|
let fileName = file.name;
|
|
1815
1817
|
if (fileTriggerProps.acceptDirectory && file.webkitRelativePath !== '') {
|
|
@@ -1823,9 +1825,8 @@ const FileUpload = ({ children, files: _files, onChange, validate, isInvalid: _i
|
|
|
1823
1825
|
className: cx('flex items-center justify-between gap-2 rounded-lg border-2 px-4 py-2', hasError ? 'border-red bg-red-light' : 'border-gray bg-gray-lightest'),
|
|
1824
1826
|
children: [
|
|
1825
1827
|
fileName,
|
|
1826
|
-
' ',
|
|
1827
1828
|
/*#__PURE__*/ jsx("button", {
|
|
1828
|
-
className: cx('-m-2 grid h-11 w-11 shrink-0 cursor-pointer place-items-center rounded-xl', // Focus styles
|
|
1829
|
+
className: cx('self-start', '-m-2 grid h-11 w-11 shrink-0 cursor-pointer place-items-center rounded-xl', // Focus styles
|
|
1829
1830
|
'focus-visible:-outline-offset-8 focus-visible:outline-focus'),
|
|
1830
1831
|
onClick: ()=>{
|
|
1831
1832
|
// For controlled component
|
|
@@ -2076,11 +2077,11 @@ const variants = cva({
|
|
|
2076
2077
|
// Match the heights of the <Media> or <Carousel> wrapper for the Media content (e.g. image, VideoLoop, video etc.)
|
|
2077
2078
|
// This is necessary due to the absolute positioning of the media and carousel containers in this variant
|
|
2078
2079
|
// biome-ignore lint/nursery/useSortedClasses: biome is unable to sort the custom classes for 3xl and 4xl breakpoints
|
|
2079
|
-
'**:data-[slot="media"]:h-
|
|
2080
|
+
'**:data-[slot="media"]:h-80 sm:**:data-[slot="media"]:h-[25rem] md:**:data-[slot="media"]:h-[30rem] lg:**:data-[slot="media"]:h-[35rem] xl:**:data-[slot="media"]:h-[40rem] 2xl:**:data-[slot="media"]:h-[42rem] 3xl:**:data-[slot="media"]:h-[48rem] 4xl:**:data-[slot="media"]:h-[53rem]',
|
|
2080
2081
|
// biome-ignore lint/nursery/useSortedClasses: biome is unable to sort the custom classes for 3xl and 4xl breakpoints
|
|
2081
|
-
'**:data-[slot="media"]:*:h-
|
|
2082
|
+
'**:data-[slot="media"]:*:h-80 sm:**:data-[slot="media"]:*:h-[25rem] md:**:data-[slot="media"]:*:h-[30rem] lg:**:data-[slot="media"]:*:h-[35rem] xl:**:data-[slot="media"]:*:h-[40rem] 2xl:**:data-[slot="media"]:*:h-[42rem] 3xl:**:data-[slot="media"]:*:h-[48rem] 4xl:**:data-[slot="media"]:*:h-[53rem]',
|
|
2082
2083
|
// biome-ignore lint/nursery/useSortedClasses: biome is unable to sort the custom classes for 3xl and 4xl breakpoints
|
|
2083
|
-
'*:data-[slot="carousel"]:h-
|
|
2084
|
+
'*:data-[slot="carousel"]:h-80 sm:*:data-[slot="carousel"]:h-[25rem] md:*:data-[slot="carousel"]:h-[30rem] lg:*:data-[slot="carousel"]:h-[35rem] xl:*:data-[slot="carousel"]:h-[40rem] 2xl:*:data-[slot="carousel"]:h-[42rem] 3xl:*:data-[slot="carousel"]:h-[48rem] 4xl:*:data-[slot="carousel"]:h-[53rem]',
|
|
2084
2085
|
// Override aspect ratio of the media and carousel-item slots (since we can not use aspect for full-bleed layout)
|
|
2085
2086
|
'**:data-[slot="carousel-item"]:data-[slot="media"]:*:aspect-none',
|
|
2086
2087
|
'**:data-[slot="carousel-controls"]:container **:data-[slot="carousel-controls"]:right-0 **:data-[slot="carousel-controls"]:bottom-4 **:data-[slot="carousel-controls"]:left-0 **:data-[slot="carousel-controls"]:justify-end',
|
|
@@ -2504,12 +2505,23 @@ const tabsVariants = cva({
|
|
|
2504
2505
|
});
|
|
2505
2506
|
}
|
|
2506
2507
|
|
|
2508
|
+
/**
|
|
2509
|
+
* A basic link component that extends react-aria-components Link with consistent styling.
|
|
2510
|
+
* Provides accessible focus styles and maintains design system consistency.
|
|
2511
|
+
*/ const CustomLink = ({ children, className, ...restProps })=>{
|
|
2512
|
+
return /*#__PURE__*/ jsx(Link, {
|
|
2513
|
+
...restProps,
|
|
2514
|
+
className: cx(className, 'cursor-pointer font-medium focus-visible:outline-focus-offset'),
|
|
2515
|
+
children: children
|
|
2516
|
+
});
|
|
2517
|
+
};
|
|
2518
|
+
|
|
2507
2519
|
const LinkList = ({ className, children, ...restProps })=>{
|
|
2508
2520
|
const numberofLinks = Children.count(children);
|
|
2509
2521
|
return /*#__PURE__*/ jsx("div", {
|
|
2510
2522
|
className: cx(className, '@container'),
|
|
2523
|
+
...restProps,
|
|
2511
2524
|
children: /*#__PURE__*/ jsx("ul", {
|
|
2512
|
-
...restProps,
|
|
2513
2525
|
className: cx('min-w-fit', // Hide dividers at the top of the list (overflow-y) and prevents arrow icon from overflowing container when animated to the right (overflow-x)
|
|
2514
2526
|
'overflow-hidden', // Add a small gap between items that fits the divider lines (this way the divider line don't take up any space in each item)
|
|
2515
2527
|
'grid auto-rows-max gap-y-0.25', // Gaps for when the list is displayed in multiple columns
|
|
@@ -2549,4 +2561,4 @@ const LinkListItem = ({ children, isExternal, className, ...restProps })=>{
|
|
|
2549
2561
|
});
|
|
2550
2562
|
};
|
|
2551
2563
|
|
|
2552
|
-
export { Accordion, AccordionItem, Alertbox, Avatar, Backlink, Badge, Breadcrumb, Breadcrumbs, Button, ButtonContext, Caption, Card, CardLink, Checkbox, CheckboxGroup, Combobox, ListBoxHeader as ComboboxHeader, ListBoxItem as ComboboxItem, ListBoxSection as ComboboxSection, Content, ContentContext, DateFormatter, Description, DisclosureStateContext, ErrorMessage, Footer, GrunnmurenProvider, Heading, HeadingContext, Label, Media, MediaContext, NumberField, Radio, RadioGroup, Select, ListBoxHeader as SelectHeader, ListBoxItem as SelectItem, ListBoxSection as SelectSection, TextArea, TextField, Carousel as UNSAFE_Carousel, CarouselItem as UNSAFE_CarouselItem, CarouselItems as UNSAFE_CarouselItems, Dialog as UNSAFE_Dialog, DialogTrigger as UNSAFE_DialogTrigger, Disclosure as UNSAFE_Disclosure, DisclosureButton as UNSAFE_DisclosureButton, DisclosurePanel as UNSAFE_DisclosurePanel, FileUpload as UNSAFE_FileUpload, Hero as UNSAFE_Hero, LinkList as UNSAFE_LinkList, LinkListItem as UNSAFE_LinkListItem, Modal as UNSAFE_Modal, Tab as UNSAFE_Tab, TabList as UNSAFE_TabList, TabPanel as UNSAFE_TabPanel, Tabs as UNSAFE_Tabs, Tag as UNSAFE_Tag, TagGroup as UNSAFE_TagGroup, TagList as UNSAFE_TagList, VideoLoop, _useLocale as useLocale };
|
|
2564
|
+
export { Accordion, AccordionItem, Alertbox, Avatar, Backlink, Badge, Breadcrumb, Breadcrumbs, Button, ButtonContext, Caption, Card, CardLink, Checkbox, CheckboxGroup, Combobox, ListBoxHeader as ComboboxHeader, ListBoxItem as ComboboxItem, ListBoxSection as ComboboxSection, Content, ContentContext, DateFormatter, Description, DisclosureStateContext, ErrorMessage, Footer, GrunnmurenProvider, Heading, HeadingContext, Label, CustomLink as Link, Media, MediaContext, NumberField, Radio, RadioGroup, Select, ListBoxHeader as SelectHeader, ListBoxItem as SelectItem, ListBoxSection as SelectSection, TextArea, TextField, Carousel as UNSAFE_Carousel, CarouselItem as UNSAFE_CarouselItem, CarouselItems as UNSAFE_CarouselItems, Dialog as UNSAFE_Dialog, DialogTrigger as UNSAFE_DialogTrigger, Disclosure as UNSAFE_Disclosure, DisclosureButton as UNSAFE_DisclosureButton, DisclosurePanel as UNSAFE_DisclosurePanel, FileUpload as UNSAFE_FileUpload, Hero as UNSAFE_Hero, LinkList as UNSAFE_LinkList, LinkListItem as UNSAFE_LinkListItem, Modal as UNSAFE_Modal, Tab as UNSAFE_Tab, TabList as UNSAFE_TabList, TabPanel as UNSAFE_TabPanel, Tabs as UNSAFE_Tabs, Tag as UNSAFE_Tag, TagGroup as UNSAFE_TagGroup, TagList as UNSAFE_TagList, VideoLoop, _useLocale as useLocale };
|