@studiocubics/components 0.0.2 → 0.0.4
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/README.md +2 -0
- package/dist/Cards/Card/Card.js +1 -44
- package/dist/Cards/Card/Card.js.map +1 -1
- package/dist/Cards/Card/Card.module.css.js +1 -3
- package/dist/Cards/Card/Card.module.css.js.map +1 -1
- package/dist/Cards/CollectionItemCard/CollectionItemCard.js +1 -47
- package/dist/Cards/CollectionItemCard/CollectionItemCard.js.map +1 -1
- package/dist/Cards/CollectionItemCard/CollectionItemCard.module.css.js +1 -3
- package/dist/Cards/CollectionItemCard/CollectionItemCard.module.css.js.map +1 -1
- package/dist/Cards/CollectionItemCard/CollectionItemCardActions.js +1 -33
- package/dist/Cards/CollectionItemCard/CollectionItemCardActions.js.map +1 -1
- package/dist/Cards/GlassCard/GlassCard.js +1 -51
- package/dist/Cards/GlassCard/GlassCard.js.map +1 -1
- package/dist/Cards/GlassCard/GlassCard.module.css.js +1 -3
- package/dist/Cards/GlassCard/GlassCard.module.css.js.map +1 -1
- package/dist/Display/Accordion/Accordion.js +1 -27
- package/dist/Display/Accordion/Accordion.js.map +1 -1
- package/dist/Display/Accordion/Accordion.module.css.js +1 -3
- package/dist/Display/Accordion/Accordion.module.css.js.map +1 -1
- package/dist/Display/Accordion/AccordionItem.js +1 -55
- package/dist/Display/Accordion/AccordionItem.js.map +1 -1
- package/dist/Display/Chip/Chip.js +1 -42
- package/dist/Display/Chip/Chip.js.map +1 -1
- package/dist/Display/Chip/Chip.module.css.js +1 -3
- package/dist/Display/Chip/Chip.module.css.js.map +1 -1
- package/dist/Display/IdentityDisplay/IdentityDisplay.js +1 -35
- package/dist/Display/IdentityDisplay/IdentityDisplay.js.map +1 -1
- package/dist/Display/IdentityDisplay/IdentityDisplay.module.css.js +1 -3
- package/dist/Display/IdentityDisplay/IdentityDisplay.module.css.js.map +1 -1
- package/dist/Display/InputErrors/InputErrors.js +1 -24
- package/dist/Display/InputErrors/InputErrors.js.map +1 -1
- package/dist/Display/InputErrors/InputErrors.module.css.js +1 -3
- package/dist/Display/InputErrors/InputErrors.module.css.js.map +1 -1
- package/dist/Display/Kbd/Kbd.js +1 -18
- package/dist/Display/Kbd/Kbd.js.map +1 -1
- package/dist/Display/Kbd/Kbd.module.css.js +1 -3
- package/dist/Display/Kbd/Kbd.module.css.js.map +1 -1
- package/dist/Display/Kbd/buttonList.js +1 -197
- package/dist/Display/Kbd/buttonList.js.map +1 -1
- package/dist/Display/LabeledValue/LabeledValue.js +1 -10
- package/dist/Display/LabeledValue/LabeledValue.js.map +1 -1
- package/dist/Display/LabeledValue/LabeledValue.module.css.js +1 -3
- package/dist/Display/LabeledValue/LabeledValue.module.css.js.map +1 -1
- package/dist/Display/List/List.js +1 -95
- package/dist/Display/List/List.js.map +1 -1
- package/dist/Display/List/List.module.css.js +1 -3
- package/dist/Display/List/List.module.css.js.map +1 -1
- package/dist/Display/PasswordStrength/PasswordStrength.js +1 -16
- package/dist/Display/PasswordStrength/PasswordStrength.js.map +1 -1
- package/dist/Display/PasswordStrength/PasswordStrength.module.css.js +1 -3
- package/dist/Display/PasswordStrength/PasswordStrength.module.css.js.map +1 -1
- package/dist/Display/PasswordStrength/usePasswordStrength.js +1 -48
- package/dist/Display/PasswordStrength/usePasswordStrength.js.map +1 -1
- package/dist/Display/Skeleton/Skeleton.d.ts +1 -1
- package/dist/Display/Skeleton/Skeleton.js +1 -10
- package/dist/Display/Skeleton/Skeleton.js.map +1 -1
- package/dist/Display/Skeleton/Skeleton.module.css.js +1 -3
- package/dist/Display/Skeleton/Skeleton.module.css.js.map +1 -1
- package/dist/Display/Toast/Toaster.js +1 -44
- package/dist/Display/Toast/Toaster.js.map +1 -1
- package/dist/Display/Toast/toast.js +1 -31
- package/dist/Display/Toast/toast.js.map +1 -1
- package/dist/Display/Tooltip/Tooltip.js +1 -44
- package/dist/Display/Tooltip/Tooltip.js.map +1 -1
- package/dist/Display/Tooltip/Tooltip.module.css.js +1 -3
- package/dist/Display/Tooltip/Tooltip.module.css.js.map +1 -1
- package/dist/Display/Tooltip/getArrowDirection.js +1 -47
- package/dist/Display/Tooltip/getArrowDirection.js.map +1 -1
- package/dist/Display/Tooltip/useTooltip.js +1 -47
- package/dist/Display/Tooltip/useTooltip.js.map +1 -1
- package/dist/Display/WIP/WIP.d.ts +5 -0
- package/dist/Forms/ConfirmationForm/ConfirmationForm.js +1 -11
- package/dist/Forms/ConfirmationForm/ConfirmationForm.js.map +1 -1
- package/dist/Forms/ConfirmationForm/ConfirmationForm.module.css.js +1 -3
- package/dist/Forms/ConfirmationForm/ConfirmationForm.module.css.js.map +1 -1
- package/dist/Inputs/Button/Button.js +1 -55
- package/dist/Inputs/Button/Button.js.map +1 -1
- package/dist/Inputs/Button/Button.module.css.js +1 -3
- package/dist/Inputs/Button/Button.module.css.js.map +1 -1
- package/dist/Inputs/Checkbox/Checkbox.js +1 -54
- package/dist/Inputs/Checkbox/Checkbox.js.map +1 -1
- package/dist/Inputs/Checkbox/Checkbox.module.css.js +1 -3
- package/dist/Inputs/Checkbox/Checkbox.module.css.js.map +1 -1
- package/dist/Inputs/Checkbox/CheckboxGroup/CheckboxGroup.js +1 -34
- package/dist/Inputs/Checkbox/CheckboxGroup/CheckboxGroup.js.map +1 -1
- package/dist/Inputs/Checkbox/CheckboxGroup/CheckboxGroup.module.css.js +1 -3
- package/dist/Inputs/Checkbox/CheckboxGroup/CheckboxGroup.module.css.js.map +1 -1
- package/dist/Inputs/Checkbox/CheckboxSelectAll.js +1 -18
- package/dist/Inputs/Checkbox/CheckboxSelectAll.js.map +1 -1
- package/dist/Inputs/PasswordInput/PasswordInput.js +1 -44
- package/dist/Inputs/PasswordInput/PasswordInput.js.map +1 -1
- package/dist/Inputs/PasswordInput/PasswordInput.module.css.js +1 -3
- package/dist/Inputs/PasswordInput/PasswordInput.module.css.js.map +1 -1
- package/dist/Inputs/Select/Select.js +1 -25
- package/dist/Inputs/Select/Select.js.map +1 -1
- package/dist/Inputs/Select/Select.module.css.js +1 -3
- package/dist/Inputs/Select/Select.module.css.js.map +1 -1
- package/dist/Inputs/Switch/Switch.js +1 -80
- package/dist/Inputs/Switch/Switch.js.map +1 -1
- package/dist/Inputs/Switch/Switch.module.css.js +1 -3
- package/dist/Inputs/Switch/Switch.module.css.js.map +1 -1
- package/dist/Inputs/TextAreaInput/TextAreaInput.js +1 -29
- package/dist/Inputs/TextAreaInput/TextAreaInput.js.map +1 -1
- package/dist/Inputs/TextAreaInput/TextAreaInput.module.css.js +1 -3
- package/dist/Inputs/TextAreaInput/TextAreaInput.module.css.js.map +1 -1
- package/dist/Inputs/TextInput/TextInput.js +1 -22
- package/dist/Inputs/TextInput/TextInput.js.map +1 -1
- package/dist/Inputs/TextInput/TextInput.module.css.js +1 -3
- package/dist/Inputs/TextInput/TextInput.module.css.js.map +1 -1
- package/dist/Inputs/ThemeToggle/ThemeToggleListItem.js +1 -30
- package/dist/Inputs/ThemeToggle/ThemeToggleListItem.js.map +1 -1
- package/dist/Layout/Dialog/Dialog.d.ts +1 -1
- package/dist/Layout/Dialog/Dialog.js +1 -73
- package/dist/Layout/Dialog/Dialog.js.map +1 -1
- package/dist/Layout/Dialog/Dialog.module.css.js +1 -3
- package/dist/Layout/Dialog/Dialog.module.css.js.map +1 -1
- package/dist/Layout/Drawer/Drawer.d.ts +15 -0
- package/dist/Layout/Drawer/Drawer.js +2 -0
- package/dist/Layout/Drawer/Drawer.js.map +1 -0
- package/dist/Layout/Drawer/Drawer.module.css.js +2 -0
- package/dist/Layout/Drawer/Drawer.module.css.js.map +1 -0
- package/dist/Layout/PageLayout/PageLayout.js +1 -24
- package/dist/Layout/PageLayout/PageLayout.js.map +1 -1
- package/dist/Layout/PageLayout/PageLayout.module.css.js +1 -3
- package/dist/Layout/PageLayout/PageLayout.module.css.js.map +1 -1
- package/dist/Layout/PageLayoutPagination/PageLayoutPagination.js +1 -12
- package/dist/Layout/PageLayoutPagination/PageLayoutPagination.js.map +1 -1
- package/dist/Layout/PageLayoutPagination/PageLayoutPagination.module.css.js +1 -3
- package/dist/Layout/PageLayoutPagination/PageLayoutPagination.module.css.js.map +1 -1
- package/dist/Layout/PageLayoutTabs/PageLayoutTabs.js +1 -21
- package/dist/Layout/PageLayoutTabs/PageLayoutTabs.js.map +1 -1
- package/dist/Layout/PageLayoutTabs/PageLayoutTabs.module.css.js +1 -3
- package/dist/Layout/PageLayoutTabs/PageLayoutTabs.module.css.js.map +1 -1
- package/dist/Layout/Popover/Popover.js +1 -102
- package/dist/Layout/Popover/Popover.js.map +1 -1
- package/dist/Layout/Popover/Popover.module.css.js +1 -3
- package/dist/Layout/Popover/Popover.module.css.js.map +1 -1
- package/dist/Layout/SectionWrapper/SectionWrapper.js +1 -10
- package/dist/Layout/SectionWrapper/SectionWrapper.js.map +1 -1
- package/dist/Layout/SectionWrapper/SectionWrapper.module.css.js +1 -3
- package/dist/Layout/SectionWrapper/SectionWrapper.module.css.js.map +1 -1
- package/dist/Layout/Sidebar/Sidebar.js +1 -24
- package/dist/Layout/Sidebar/Sidebar.js.map +1 -1
- package/dist/Layout/Sidebar/Sidebar.module.css.js +1 -3
- package/dist/Layout/Sidebar/Sidebar.module.css.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarBody/SidebarBody.js +1 -13
- package/dist/Layout/Sidebar/SidebarBody/SidebarBody.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarBody/SidebarBody.module.css.js +1 -3
- package/dist/Layout/Sidebar/SidebarBody/SidebarBody.module.css.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarDrawer/SidebarDrawer.js +1 -13
- package/dist/Layout/Sidebar/SidebarDrawer/SidebarDrawer.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarDrawer/SidebarDrawer.module.css.js +1 -3
- package/dist/Layout/Sidebar/SidebarDrawer/SidebarDrawer.module.css.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarFooter/SidebarFooter.js +1 -13
- package/dist/Layout/Sidebar/SidebarFooter/SidebarFooter.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarFooter/SidebarFooter.module.css.js +1 -3
- package/dist/Layout/Sidebar/SidebarFooter/SidebarFooter.module.css.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarHeader/SidebarHeader.js +1 -11
- package/dist/Layout/Sidebar/SidebarHeader/SidebarHeader.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarViewport/SidebarViewport.js +1 -10
- package/dist/Layout/Sidebar/SidebarViewport/SidebarViewport.js.map +1 -1
- package/dist/Layout/Sidebar/SidebarViewport/SidebarViewport.module.css.js +1 -3
- package/dist/Layout/Sidebar/SidebarViewport/SidebarViewport.module.css.js.map +1 -1
- package/dist/Layout/Table/Table.js +1 -130
- package/dist/Layout/Table/Table.js.map +1 -1
- package/dist/Layout/Table/Table.module.css.js +1 -3
- package/dist/Layout/Table/Table.module.css.js.map +1 -1
- package/dist/Layout/Table/TableFooter.js +1 -8
- package/dist/Layout/Table/TableFooter.js.map +1 -1
- package/dist/Layout/Table/TableHeader.js +1 -8
- package/dist/Layout/Table/TableHeader.js.map +1 -1
- package/dist/Layout/Table/tableUtils.js +1 -123
- package/dist/Layout/Table/tableUtils.js.map +1 -1
- package/dist/Layout/_index.d.ts +1 -0
- package/dist/Misc/Cursor/Cursor.js +1 -58
- package/dist/Misc/Cursor/Cursor.js.map +1 -1
- package/dist/Misc/Cursor/Cursor.module.css.js +1 -3
- package/dist/Misc/Cursor/Cursor.module.css.js.map +1 -1
- package/dist/Misc/Logos.js +1 -28
- package/dist/Misc/Logos.js.map +1 -1
- package/dist/Misc/PoweredByBanner/PoweredByBanner.d.ts +5 -2
- package/dist/Misc/PoweredByBanner/PoweredByBanner.js +1 -10
- package/dist/Misc/PoweredByBanner/PoweredByBanner.js.map +1 -1
- package/dist/Misc/PoweredByBanner/PoweredByBanner.module.css.js +1 -3
- package/dist/Misc/PoweredByBanner/PoweredByBanner.module.css.js.map +1 -1
- package/dist/Misc/Ripple/Ripple.js +1 -61
- package/dist/Misc/Ripple/Ripple.js.map +1 -1
- package/dist/Misc/Ripple/Ripple.module.css.js +1 -3
- package/dist/Misc/Ripple/Ripple.module.css.js.map +1 -1
- package/dist/Misc/Spinner/Spinner.js +1 -11
- package/dist/Misc/Spinner/Spinner.js.map +1 -1
- package/dist/Misc/Spinner/Spinner.module.css.js +1 -3
- package/dist/Misc/Spinner/Spinner.module.css.js.map +1 -1
- package/dist/Misc/TransitionAnimation/TransitionAnimation.js +1 -86
- package/dist/Misc/TransitionAnimation/TransitionAnimation.js.map +1 -1
- package/dist/Misc/TransitionAnimation/TransitionAnimation.module.css.js +1 -3
- package/dist/Misc/TransitionAnimation/TransitionAnimation.module.css.js.map +1 -1
- package/dist/Navigation/Breadcrumbs/Breadcrumbs.js +1 -35
- package/dist/Navigation/Breadcrumbs/Breadcrumbs.js.map +1 -1
- package/dist/Navigation/Breadcrumbs/Breadcrumbs.module.css.js +1 -3
- package/dist/Navigation/Breadcrumbs/Breadcrumbs.module.css.js.map +1 -1
- package/dist/Navigation/Breadcrumbs/BreadcrumbsItem.js +1 -14
- package/dist/Navigation/Breadcrumbs/BreadcrumbsItem.js.map +1 -1
- package/dist/Navigation/Breadcrumbs/useBreadcrumbs.js +1 -43
- package/dist/Navigation/Breadcrumbs/useBreadcrumbs.js.map +1 -1
- package/dist/Navigation/Pagination/Pagination.js +1 -60
- package/dist/Navigation/Pagination/Pagination.js.map +1 -1
- package/dist/Navigation/Pagination/Pagination.module.css.js +1 -3
- package/dist/Navigation/Pagination/Pagination.module.css.js.map +1 -1
- package/dist/Navigation/Pagination/PaginationItem.js +1 -13
- package/dist/Navigation/Pagination/PaginationItem.js.map +1 -1
- package/dist/Navigation/Pagination/usePagination.js +1 -37
- package/dist/Navigation/Pagination/usePagination.js.map +1 -1
- package/dist/Navigation/Tabs/Tab/Tab.js +1 -69
- package/dist/Navigation/Tabs/Tab/Tab.js.map +1 -1
- package/dist/Navigation/Tabs/Tab/Tab.module.css.js +1 -3
- package/dist/Navigation/Tabs/Tab/Tab.module.css.js.map +1 -1
- package/dist/Navigation/Tabs/Tabs.js +1 -21
- package/dist/Navigation/Tabs/Tabs.js.map +1 -1
- package/dist/Navigation/Tabs/TabsBar/TabsBar.d.ts +10 -7
- package/dist/Navigation/Tabs/TabsBar/TabsBar.js +1 -43
- package/dist/Navigation/Tabs/TabsBar/TabsBar.js.map +1 -1
- package/dist/Navigation/Tabs/TabsBar/TabsBar.module.css.js +1 -3
- package/dist/Navigation/Tabs/TabsBar/TabsBar.module.css.js.map +1 -1
- package/dist/Typography/ClampedText/ClampedText.js +1 -43
- package/dist/Typography/ClampedText/ClampedText.js.map +1 -1
- package/dist/Typography/ClampedText/ClampedText.module.css.js +1 -3
- package/dist/Typography/ClampedText/ClampedText.module.css.js.map +1 -1
- package/dist/Typography/CopyableText/CopyableText.js +1 -38
- package/dist/Typography/CopyableText/CopyableText.js.map +1 -1
- package/dist/Typography/CopyableText/CopyableText.module.css.js +1 -3
- package/dist/Typography/CopyableText/CopyableText.module.css.js.map +1 -1
- package/dist/Typography/PageTitle/PageTitle.js +1 -9
- package/dist/Typography/PageTitle/PageTitle.js.map +1 -1
- package/dist/Typography/PageTitle/PageTitle.module.css.js +1 -3
- package/dist/Typography/PageTitle/PageTitle.module.css.js.map +1 -1
- package/dist/index.css +1 -2392
- package/dist/index.js +1 -63
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
- package/rollup.config.js +0 -34
|
@@ -1,22 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { createContext, useContext, useState } from 'react';
|
|
4
|
-
|
|
5
|
-
const TabsContext = createContext(null);
|
|
6
|
-
function useTabs() {
|
|
7
|
-
const c = useContext(TabsContext);
|
|
8
|
-
if (!c)
|
|
9
|
-
throw new Error("Components must be wrapped in <Tabs/>");
|
|
10
|
-
return c;
|
|
11
|
-
}
|
|
12
|
-
function Tabs(props) {
|
|
13
|
-
const { children } = props;
|
|
14
|
-
const [activeTab, setActiveTab] = useState(null);
|
|
15
|
-
return (jsx(TabsContext.Provider, { value: {
|
|
16
|
-
activeTab,
|
|
17
|
-
setActiveTab,
|
|
18
|
-
}, children: children }));
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export { Tabs, useTabs };
|
|
1
|
+
"use client";import{jsx as r}from"react/jsx-runtime";import{createContext as t,useContext as e,useState as n}from"react";const o=t(null);function i(){const r=e(o);if(!r)throw new Error("Components must be wrapped in <Tabs/>");return r}function c(t){const{children:e}=t,[i,c]=n(null);return r(o.Provider,{value:{activeTab:i,setActiveTab:c},children:e})}export{c as Tabs,i as useTabs};
|
|
22
2
|
//# sourceMappingURL=Tabs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","sources":["../../../src/Navigation/Tabs/Tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport type { SetState } from \"@studiocubics/types\";\nimport { createContext, type ReactNode, useContext, useState } from \"react\";\n\ninterface TabsContextProps {\n activeTab: HTMLButtonElement | null;\n setActiveTab: SetState<HTMLButtonElement | null>;\n}\nexport interface TabsProps {\n children: ReactNode;\n}\n\nconst TabsContext = createContext<TabsContextProps | null>(null);\n\nexport function useTabs() {\n const c = useContext(TabsContext);\n if (!c) throw new Error(\"Components must be wrapped in <Tabs/>\");\n return c;\n}\n\nexport function Tabs(props: TabsProps) {\n const { children } = props;\n const [activeTab, setActiveTab] =\n useState<TabsContextProps[\"activeTab\"]>(null);\n\n return (\n <TabsContext.Provider\n value={{\n activeTab,\n setActiveTab,\n }}\n >\n {children}\n </TabsContext.Provider>\n );\n}\n"],"names":["
|
|
1
|
+
{"version":3,"file":"Tabs.js","sources":["../../../src/Navigation/Tabs/Tabs.tsx"],"sourcesContent":["\"use client\";\n\nimport type { SetState } from \"@studiocubics/types\";\nimport { createContext, type ReactNode, useContext, useState } from \"react\";\n\ninterface TabsContextProps {\n activeTab: HTMLButtonElement | null;\n setActiveTab: SetState<HTMLButtonElement | null>;\n}\nexport interface TabsProps {\n children: ReactNode;\n}\n\nconst TabsContext = createContext<TabsContextProps | null>(null);\n\nexport function useTabs() {\n const c = useContext(TabsContext);\n if (!c) throw new Error(\"Components must be wrapped in <Tabs/>\");\n return c;\n}\n\nexport function Tabs(props: TabsProps) {\n const { children } = props;\n const [activeTab, setActiveTab] =\n useState<TabsContextProps[\"activeTab\"]>(null);\n\n return (\n <TabsContext.Provider\n value={{\n activeTab,\n setActiveTab,\n }}\n >\n {children}\n </TabsContext.Provider>\n );\n}\n"],"names":["TabsContext","createContext","useTabs","c","useContext","Error","Tabs","props","children","activeTab","setActiveTab","useState","_jsx","Provider","value"],"mappings":"yHAaA,MAAMA,EAAcC,EAAuC,eAE3CC,IACd,MAAMC,EAAIC,EAAWJ,GACrB,IAAKG,EAAG,MAAM,IAAIE,MAAM,yCACxB,OAAOF,CACT,CAEM,SAAUG,EAAKC,GACnB,MAAMC,SAAEA,GAAaD,GACdE,EAAWC,GAChBC,EAAwC,MAE1C,OACEC,EAACZ,EAAYa,SAAQ,CACnBC,MAAO,CACLL,YACAC,gBACDF,SAEAA,GAGP"}
|
|
@@ -1,12 +1,15 @@
|
|
|
1
|
-
import { type ComponentProps } from "react";
|
|
2
|
-
import {
|
|
3
|
-
|
|
1
|
+
import { type ComponentProps, type ElementType, type ReactElement } from "react";
|
|
2
|
+
import { GlassCard } from "../../../Cards/GlassCard/GlassCard";
|
|
3
|
+
export type TabsBarProps<M extends ElementType = typeof GlassCard> = ComponentProps<"nav"> & {
|
|
4
4
|
column?: boolean;
|
|
5
|
+
marker?: M;
|
|
6
|
+
color?: "default" | "primary" | "secondary";
|
|
7
|
+
tabs?: string[];
|
|
8
|
+
renderTab?: (t: string) => ReactElement;
|
|
5
9
|
slotProps?: {
|
|
6
10
|
overflowContainer?: ComponentProps<"div">;
|
|
7
|
-
|
|
8
|
-
|
|
11
|
+
markerContainer?: ComponentProps<"span">;
|
|
12
|
+
marker?: ComponentProps<M>;
|
|
9
13
|
};
|
|
10
|
-
}
|
|
14
|
+
};
|
|
11
15
|
export declare function TabsBar(props: TabsBarProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
-
export {};
|
|
@@ -1,44 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
-
import { useRef, useEffect } from 'react';
|
|
4
|
-
import { useTabs } from '../Tabs.js';
|
|
5
|
-
import styles from './TabsBar.module.css.js';
|
|
6
|
-
import { cn } from '@studiocubics/utils';
|
|
7
|
-
import { GlassCard } from '../../../Cards/GlassCard/GlassCard.js';
|
|
8
|
-
|
|
9
|
-
function TabsBar(props) {
|
|
10
|
-
const { children, className, column = false, slotProps = {}, ...rest } = props;
|
|
11
|
-
const { activeTab } = useTabs();
|
|
12
|
-
const markerRef = useRef(null);
|
|
13
|
-
const rootRef = useRef(null);
|
|
14
|
-
useEffect(() => {
|
|
15
|
-
if (!rootRef.current || !markerRef.current || !activeTab)
|
|
16
|
-
return;
|
|
17
|
-
const updateMarkerPosition = () => {
|
|
18
|
-
if (!rootRef.current || !markerRef.current || !activeTab)
|
|
19
|
-
return;
|
|
20
|
-
const marker = markerRef.current;
|
|
21
|
-
const tabRect = activeTab.getBoundingClientRect();
|
|
22
|
-
const rootRect = rootRef.current.getBoundingClientRect();
|
|
23
|
-
// Account for scroll offset
|
|
24
|
-
const scrollLeft = rootRef.current.scrollLeft;
|
|
25
|
-
const scrollTop = rootRef.current.scrollTop;
|
|
26
|
-
marker.style.width = `${tabRect.width}px`;
|
|
27
|
-
marker.style.height = `${tabRect.height}px`;
|
|
28
|
-
marker.style.left = `${tabRect.left - rootRect.left + scrollLeft}px`;
|
|
29
|
-
marker.style.top = `${tabRect.top - rootRect.top + scrollTop}px`;
|
|
30
|
-
};
|
|
31
|
-
updateMarkerPosition();
|
|
32
|
-
const container = rootRef.current;
|
|
33
|
-
// Update marker position when container resizes
|
|
34
|
-
const resizeObserver = new ResizeObserver(updateMarkerPosition);
|
|
35
|
-
resizeObserver.observe(container);
|
|
36
|
-
return () => {
|
|
37
|
-
resizeObserver.disconnect();
|
|
38
|
-
};
|
|
39
|
-
}, [activeTab]);
|
|
40
|
-
return (jsx("nav", { ...rest, className: cn(styles.root, className), children: jsxs("div", { ...slotProps.overflowContainer, ref: rootRef, className: cn(styles.overflowContainer, column ? styles.columnContainer : styles.rowContainer, slotProps.overflowContainer?.className), children: [children, jsx("span", { ...slotProps.marker, className: cn(styles.marker, slotProps.marker?.className), ref: markerRef, children: jsx(GlassCard, { ...slotProps.markerGlass, className: cn(styles.markerGlass, slotProps.markerGlass?.className) }) })] }) }));
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
export { TabsBar };
|
|
1
|
+
"use client";import{jsx as r,Fragment as e,jsxs as t}from"react/jsx-runtime";import{useRef as a,useEffect as s}from"react";import{useTabs as n}from"../Tabs.js";import o from"./TabsBar.module.css.js";import{cn as c}from"@studiocubics/utils";import{GlassCard as l}from"../../../Cards/GlassCard/GlassCard.js";import{Tab as i}from"../Tab/Tab.js";function m(e){const{as:t=l,className:a,...s}=e;return r(t,{className:c(o.markerInner,a),...s})}function u(l){const{children:u,className:d,column:f=!1,marker:p=m,color:h="default",tabs:b,renderTab:v=t=>r(e,{children:t}),slotProps:N={},...C}=l,{activeTab:k}=n(),w=a(null),T=a(null);s(()=>{if(!T.current||!w.current||!k)return;const r=()=>{if(!T.current||!w.current||!k)return;const r=k.getBoundingClientRect(),e=T.current.getBoundingClientRect();w.current.style.width=`${r.width}px`,w.current.style.height=`${r.height}px`,w.current.style.left=`${r.left-e.left+T.current.scrollLeft}px`,w.current.style.top=`${r.top-e.top+T.current.scrollTop}px`};r();const e=new ResizeObserver(r);return e.observe(T.current),()=>e.disconnect()},[k]);const g=null!=b?b.map((e,t)=>r(i,{"data-value":e,selected:0===t,className:c(o.tab,k?.dataset.value===e?o.active:""),children:v(e)},e)):u;return r("nav",{...C,"data-color":h,className:c(o.root,d),children:t("div",{...N.overflowContainer,ref:T,className:c(o.overflowContainer,f?o.column:o.row,N.overflowContainer?.className),children:[g,r("span",{...N.markerContainer,ref:w,className:c(o.marker,N.markerContainer?.className),children:r(p,{...N.marker,className:c(o.markerGlass,N.marker?.className)})})]})})}export{u as TabsBar};
|
|
44
2
|
//# sourceMappingURL=TabsBar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabsBar.js","sources":["../../../../src/Navigation/Tabs/TabsBar/TabsBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRef, useEffect, type ReactNode, type ComponentProps } from \"react\";\nimport { useTabs } from \"../Tabs\";\nimport styles from \"./TabsBar.module.css\";\nimport { cn } from \"@studiocubics/utils\";\nimport {\n GlassCard,\n type GlassCardProps,\n} from \"../../../Cards/GlassCard/GlassCard\";\n\ninterface TabsBarProps extends ComponentProps<\"div\"> {\n column?: boolean;\n slotProps?: {\n overflowContainer?: ComponentProps<\"div\">;\n marker?: ComponentProps<\"span\">;\n markerGlass?: GlassCardProps;\n };\n}\n\nexport function TabsBar(props: TabsBarProps) {\n const {\n children,\n className,\n column = false,\n slotProps = {},\n ...rest\n } = props;\n\n const { activeTab } = useTabs();\n const markerRef = useRef<HTMLSpanElement>(null);\n const rootRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!rootRef.current || !markerRef.current || !activeTab) return;\n\n const updateMarkerPosition = () => {\n if (!rootRef.current || !markerRef.current || !activeTab) return;\n\n const marker = markerRef.current;\n const tabRect = activeTab.getBoundingClientRect();\n const rootRect = rootRef.current.getBoundingClientRect();\n\n // Account for scroll offset\n const scrollLeft = rootRef.current.scrollLeft;\n const scrollTop = rootRef.current.scrollTop;\n\n marker.style.width = `${tabRect.width}px`;\n marker.style.height = `${tabRect.height}px`;\n marker.style.left = `${tabRect.left - rootRect.left + scrollLeft}px`;\n marker.style.top = `${tabRect.top - rootRect.top + scrollTop}px`;\n };\n\n updateMarkerPosition();\n\n const container = rootRef.current;\n\n // Update marker position when container resizes\n const resizeObserver = new ResizeObserver(updateMarkerPosition);\n resizeObserver.observe(container);\n\n return () => {\n resizeObserver.disconnect();\n };\n }, [activeTab]);\n\n return (\n <nav {...rest} className={cn(styles.root, className)}>\n <div\n {...slotProps.overflowContainer}\n ref={rootRef}\n className={cn(\n styles.overflowContainer,\n column ? styles.columnContainer : styles.rowContainer,\n slotProps.overflowContainer?.className,\n )}\n >\n {children as ReactNode}\n <span\n {...slotProps.marker}\n className={cn(styles.marker, slotProps.marker?.className)}\n ref={markerRef}\n >\n <GlassCard\n {...slotProps.markerGlass}\n className={cn(styles.markerGlass, slotProps.markerGlass?.className)}\n />\n </span>\n </div>\n </nav>\n );\n}\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TabsBar.js","sources":["../../../../src/Navigation/Tabs/TabsBar/TabsBar.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n useRef,\n useEffect,\n type ReactNode,\n type ComponentProps,\n type ElementType,\n type ReactElement,\n} from \"react\";\nimport { useTabs } from \"../Tabs\";\nimport styles from \"./TabsBar.module.css\";\nimport { cn } from \"@studiocubics/utils\";\nimport { GlassCard } from \"../../../Cards/GlassCard/GlassCard\";\nimport { Tab } from \"../Tab/Tab\";\nimport type { PolymorphicComponentProps } from \"@studiocubics/types\";\n\nfunction DefaultMarker<C extends ElementType>(\n props: PolymorphicComponentProps<C, object>,\n) {\n const { as: Component = GlassCard, className, ...rest } = props;\n return <Component className={cn(styles.markerInner, className)} {...rest} />;\n}\n\nexport type TabsBarProps<M extends ElementType = typeof GlassCard> =\n ComponentProps<\"nav\"> & {\n column?: boolean;\n marker?: M;\n color?: \"default\" | \"primary\" | \"secondary\";\n tabs?: string[];\n renderTab?: (t: string) => ReactElement;\n slotProps?: {\n overflowContainer?: ComponentProps<\"div\">;\n markerContainer?: ComponentProps<\"span\">;\n marker?: ComponentProps<M>;\n };\n };\n\nexport function TabsBar(props: TabsBarProps) {\n const {\n children,\n className,\n column = false,\n marker: Marker = DefaultMarker,\n color = \"default\",\n tabs,\n renderTab = (t) => <>{t}</>,\n slotProps = {},\n ...rest\n } = props;\n\n const { activeTab } = useTabs();\n const markerRef = useRef<HTMLSpanElement>(null);\n const rootRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!rootRef.current || !markerRef.current || !activeTab) return;\n\n const update = () => {\n if (!rootRef.current || !markerRef.current || !activeTab) return;\n\n const tabRect = activeTab.getBoundingClientRect();\n const rootRect = rootRef.current.getBoundingClientRect();\n\n markerRef.current.style.width = `${tabRect.width}px`;\n markerRef.current.style.height = `${tabRect.height}px`;\n markerRef.current.style.left = `${tabRect.left - rootRect.left + rootRef.current.scrollLeft}px`;\n markerRef.current.style.top = `${tabRect.top - rootRect.top + rootRef.current.scrollTop}px`;\n };\n\n update();\n\n const ro = new ResizeObserver(update);\n ro.observe(rootRef.current);\n\n return () => ro.disconnect();\n }, [activeTab]);\n\n const content: ReactNode =\n tabs != null\n ? tabs.map((t, i) => (\n <Tab\n key={t}\n data-value={t}\n selected={i === 0}\n className={cn(\n styles.tab,\n activeTab?.dataset.value === t ? styles.active : \"\",\n )}\n >\n {renderTab(t)}\n </Tab>\n ))\n : children;\n\n return (\n <nav {...rest} data-color={color} className={cn(styles.root, className)}>\n <div\n {...slotProps.overflowContainer}\n ref={rootRef}\n className={cn(\n styles.overflowContainer,\n column ? styles.column : styles.row,\n slotProps.overflowContainer?.className,\n )}\n >\n {content}\n <span\n {...slotProps.markerContainer}\n ref={markerRef}\n className={cn(styles.marker, slotProps.markerContainer?.className)}\n >\n <Marker\n {...slotProps.marker}\n className={cn(styles.markerGlass, slotProps.marker?.className)}\n />\n </span>\n </div>\n </nav>\n );\n}\n"],"names":["DefaultMarker","props","as","Component","GlassCard","className","rest","_jsx","cn","styles","markerInner","TabsBar","children","column","marker","Marker","color","tabs","renderTab","t","slotProps","activeTab","useTabs","markerRef","useRef","rootRef","useEffect","current","update","tabRect","getBoundingClientRect","rootRect","style","width","height","left","scrollLeft","top","scrollTop","ro","ResizeObserver","observe","disconnect","content","map","i","Tab","selected","tab","dataset","value","active","root","_jsxs","overflowContainer","ref","row","markerContainer","markerGlass"],"mappings":"sVAiBA,SAASA,EACPC,GAEA,MAAQC,GAAIC,EAAYC,EAASC,UAAEA,KAAcC,GAASL,EAC1D,OAAOM,EAACJ,EAAS,CAACE,UAAWG,EAAGC,EAAOC,YAAaL,MAAgBC,GACtE,CAgBM,SAAUK,EAAQV,GACtB,MAAMW,SACJA,EAAQP,UACRA,EAASQ,OACTA,GAAS,EACTC,OAAQC,EAASf,EAAagB,MAC9BA,EAAQ,UAASC,KACjBA,EAAIC,UACJA,EAAaC,GAAMZ,cAAGY,IAAKC,UAC3BA,EAAY,CAAA,KACTd,GACDL,GAEEoB,UAAEA,GAAcC,IAChBC,EAAYC,EAAwB,MACpCC,EAAUD,EAAuB,MAEvCE,EAAU,KACR,IAAKD,EAAQE,UAAYJ,EAAUI,UAAYN,EAAW,OAE1D,MAAMO,EAAS,KACb,IAAKH,EAAQE,UAAYJ,EAAUI,UAAYN,EAAW,OAE1D,MAAMQ,EAAUR,EAAUS,wBACpBC,EAAWN,EAAQE,QAAQG,wBAEjCP,EAAUI,QAAQK,MAAMC,MAAQ,GAAGJ,EAAQI,UAC3CV,EAAUI,QAAQK,MAAME,OAAS,GAAGL,EAAQK,WAC5CX,EAAUI,QAAQK,MAAMG,KAAO,GAAGN,EAAQM,KAAOJ,EAASI,KAAOV,EAAQE,QAAQS,eACjFb,EAAUI,QAAQK,MAAMK,IAAM,GAAGR,EAAQQ,IAAMN,EAASM,IAAMZ,EAAQE,QAAQW,eAGhFV,IAEA,MAAMW,EAAK,IAAIC,eAAeZ,GAG9B,OAFAW,EAAGE,QAAQhB,EAAQE,SAEZ,IAAMY,EAAGG,cACf,CAACrB,IAEJ,MAAMsB,EACI,MAAR1B,EACIA,EAAK2B,IAAI,CAACzB,EAAG0B,IACXtC,EAACuC,EAAG,CAAA,aAEU3B,EACZ4B,SAAgB,IAANF,EACVxC,UAAWG,EACTC,EAAOuC,IACP3B,GAAW4B,QAAQC,QAAU/B,EAAIV,EAAO0C,OAAS,IAClDvC,SAEAM,EAAUC,IARNA,IAWTP,EAEN,OACEL,YAASD,EAAI,aAAcU,EAAOX,UAAWG,EAAGC,EAAO2C,KAAM/C,GAAUO,SACrEyC,EAAA,MAAA,IACMjC,EAAUkC,kBACdC,IAAK9B,EACLpB,UAAWG,EACTC,EAAO6C,kBACPzC,EAASJ,EAAOI,OAASJ,EAAO+C,IAChCpC,EAAUkC,mBAAmBjD,WAC9BO,SAAA,CAEA+B,EACDpC,EAAA,OAAA,IACMa,EAAUqC,gBACdF,IAAKhC,EACLlB,UAAWG,EAAGC,EAAOK,OAAQM,EAAUqC,iBAAiBpD,WAAUO,SAElEL,EAACQ,EAAM,IACDK,EAAUN,OACdT,UAAWG,EAAGC,EAAOiD,YAAatC,EAAUN,QAAQT,mBAMhE"}
|
|
@@ -1,4 +1,2 @@
|
|
|
1
|
-
var
|
|
2
|
-
|
|
3
|
-
export { styles as default };
|
|
1
|
+
var a={root:"TabsBar-module_root__Uve19",overflowContainer:"TabsBar-module_overflowContainer__FuUXd",row:"TabsBar-module_row__5PKvn",column:"TabsBar-module_column__8Mc64",tab:"TabsBar-module_tab__jD1nX",active:"TabsBar-module_active__ESPgA",marker:"TabsBar-module_marker__2e4am",markerGlass:"TabsBar-module_markerGlass__-8xd8",markerInner:"TabsBar-module_markerInner__T0FZ3"};export{a as default};
|
|
4
2
|
//# sourceMappingURL=TabsBar.module.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabsBar.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TabsBar.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,44 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { cn } from '@studiocubics/utils';
|
|
4
|
-
import styles from './ClampedText.module.css.js';
|
|
5
|
-
|
|
6
|
-
const defaultElement = "p";
|
|
7
|
-
/**
|
|
8
|
-
* Base implementation for the ClampedText component.
|
|
9
|
-
*
|
|
10
|
-
* This is a polymorphic component that defaults to rendering a `<ClampedText>`.
|
|
11
|
-
* Use the `as` prop to change the underlying element.
|
|
12
|
-
*
|
|
13
|
-
* @typeParam C - The intrinsic or custom element type to render.
|
|
14
|
-
*
|
|
15
|
-
* @group ClampedText
|
|
16
|
-
* @category inputs
|
|
17
|
-
*/
|
|
18
|
-
function ClampedTextBase(props) {
|
|
19
|
-
const { as, className, lineCount = 1, style, ...restProps } = props;
|
|
20
|
-
const Component = (as || defaultElement);
|
|
21
|
-
const componentProps = {
|
|
22
|
-
className: cn(className, styles.root),
|
|
23
|
-
style: { WebkitLineClamp: `${lineCount}`, ...style },
|
|
24
|
-
...restProps,
|
|
25
|
-
};
|
|
26
|
-
return jsx(Component, { ...componentProps });
|
|
27
|
-
}
|
|
28
|
-
ClampedTextBase.displayName = "ClampedText";
|
|
29
|
-
/**
|
|
30
|
-
* A polymorphic ClampedText component.
|
|
31
|
-
*
|
|
32
|
-
* By default it renders a `<ClampedText>`, but any element can be used via the `as` prop:
|
|
33
|
-
*
|
|
34
|
-
* ```tsx
|
|
35
|
-
* <ClampedText as="a" href="/docs">Read docs</ClampedText>
|
|
36
|
-
* ```
|
|
37
|
-
*
|
|
38
|
-
* @group ClampedText
|
|
39
|
-
* @category inputs
|
|
40
|
-
*/
|
|
41
|
-
const ClampedText = ClampedTextBase;
|
|
42
|
-
|
|
43
|
-
export { ClampedText };
|
|
1
|
+
"use client";import{jsx as t}from"react/jsx-runtime";import{cn as e}from"@studiocubics/utils";import s from"./ClampedText.module.css.js";function o(o){const{as:m,className:i,lineCount:l=1,style:r,...a}=o,c=m||"p",n={className:e(i,s.root),style:{WebkitLineClamp:`${l}`,...r},...a};return t(c,{...n})}o.displayName="ClampedText";const m=o;export{m as ClampedText};
|
|
44
2
|
//# sourceMappingURL=ClampedText.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClampedText.js","sources":["../../../src/Typography/ClampedText/ClampedText.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n PolymorphicComponentProps,\n PolymorphicComponentType,\n} from \"@studiocubics/types\";\nimport { cn } from \"@studiocubics/utils\";\nimport type { ElementType } from \"react\";\nimport styles from \"./ClampedText.module.css\";\n\n/**\n * Props specific to the ClampedText component.\n *\n * These extend the intrinsic element props of whatever element is passed via `as`.\n * @group ClampedText\n * @category inputs\n */\nexport interface ClampedTextBaseProps {\n lineCount?: number;\n}\nconst defaultElement = \"p\";\ntype DefaultElement = typeof defaultElement;\n/**\n * Polymorphic props for the ClampedText component.\n *\n * `C` defines the element type rendered by the component (e.g. `\"ClampedText\"`, `\"a\"`, `\"div\"`).\n * All intrinsic props for `C` are supported unless overridden by `ClampedTextBaseProps`.\n *\n * @group ClampedText\n * @category inputs\n */\nexport type ClampedTextProps<C extends ElementType = DefaultElement> =\n PolymorphicComponentProps<C, ClampedTextBaseProps>;\n\n/**\n * Base implementation for the ClampedText component.\n *\n * This is a polymorphic component that defaults to rendering a `<ClampedText>`.\n * Use the `as` prop to change the underlying element.\n *\n * @typeParam C - The intrinsic or custom element type to render.\n *\n * @group ClampedText\n * @category inputs\n */\nfunction ClampedTextBase<C extends ElementType = DefaultElement>(\n props: ClampedTextProps<C>,\n) {\n const { as, className, lineCount = 1, style, ...restProps } = props;\n const Component = (as || defaultElement) as ElementType;\n\n const componentProps = {\n className: cn(className, styles.root),\n style: { WebkitLineClamp: `${lineCount}`, ...style },\n ...restProps,\n };\n\n return <Component {...componentProps} />;\n}\nClampedTextBase.displayName = \"ClampedText\";\n\n/**\n * A polymorphic ClampedText component.\n *\n * By default it renders a `<ClampedText>`, but any element can be used via the `as` prop:\n *\n * ```tsx\n * <ClampedText as=\"a\" href=\"/docs\">Read docs</ClampedText>\n * ```\n *\n * @group ClampedText\n * @category inputs\n */\nexport const ClampedText = ClampedTextBase as PolymorphicComponentType<\n ClampedTextBaseProps,\n DefaultElement\n>;\n"],"names":["
|
|
1
|
+
{"version":3,"file":"ClampedText.js","sources":["../../../src/Typography/ClampedText/ClampedText.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n PolymorphicComponentProps,\n PolymorphicComponentType,\n} from \"@studiocubics/types\";\nimport { cn } from \"@studiocubics/utils\";\nimport type { ElementType } from \"react\";\nimport styles from \"./ClampedText.module.css\";\n\n/**\n * Props specific to the ClampedText component.\n *\n * These extend the intrinsic element props of whatever element is passed via `as`.\n * @group ClampedText\n * @category inputs\n */\nexport interface ClampedTextBaseProps {\n lineCount?: number;\n}\nconst defaultElement = \"p\";\ntype DefaultElement = typeof defaultElement;\n/**\n * Polymorphic props for the ClampedText component.\n *\n * `C` defines the element type rendered by the component (e.g. `\"ClampedText\"`, `\"a\"`, `\"div\"`).\n * All intrinsic props for `C` are supported unless overridden by `ClampedTextBaseProps`.\n *\n * @group ClampedText\n * @category inputs\n */\nexport type ClampedTextProps<C extends ElementType = DefaultElement> =\n PolymorphicComponentProps<C, ClampedTextBaseProps>;\n\n/**\n * Base implementation for the ClampedText component.\n *\n * This is a polymorphic component that defaults to rendering a `<ClampedText>`.\n * Use the `as` prop to change the underlying element.\n *\n * @typeParam C - The intrinsic or custom element type to render.\n *\n * @group ClampedText\n * @category inputs\n */\nfunction ClampedTextBase<C extends ElementType = DefaultElement>(\n props: ClampedTextProps<C>,\n) {\n const { as, className, lineCount = 1, style, ...restProps } = props;\n const Component = (as || defaultElement) as ElementType;\n\n const componentProps = {\n className: cn(className, styles.root),\n style: { WebkitLineClamp: `${lineCount}`, ...style },\n ...restProps,\n };\n\n return <Component {...componentProps} />;\n}\nClampedTextBase.displayName = \"ClampedText\";\n\n/**\n * A polymorphic ClampedText component.\n *\n * By default it renders a `<ClampedText>`, but any element can be used via the `as` prop:\n *\n * ```tsx\n * <ClampedText as=\"a\" href=\"/docs\">Read docs</ClampedText>\n * ```\n *\n * @group ClampedText\n * @category inputs\n */\nexport const ClampedText = ClampedTextBase as PolymorphicComponentType<\n ClampedTextBaseProps,\n DefaultElement\n>;\n"],"names":["ClampedTextBase","props","as","className","lineCount","style","restProps","Component","componentProps","cn","styles","root","WebkitLineClamp","_jsx","displayName","ClampedText"],"mappings":"yIA6CA,SAASA,EACPC,GAEA,MAAMC,GAAEA,EAAEC,UAAEA,EAASC,UAAEA,EAAY,EAACC,MAAEA,KAAUC,GAAcL,EACxDM,EAAaL,GA7BE,IA+BfM,EAAiB,CACrBL,UAAWM,EAAGN,EAAWO,EAAOC,MAChCN,MAAO,CAAEO,gBAAiB,GAAGR,OAAgBC,MAC1CC,GAGL,OAAOO,EAACN,EAAS,IAAKC,GACxB,CACAR,EAAgBc,YAAc,cAcvB,MAAMC,EAAcf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClampedText.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ClampedText.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,39 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { cn } from '@studiocubics/utils';
|
|
4
|
-
import { useState, useEffect } from 'react';
|
|
5
|
-
import styles from './CopyableText.module.css.js';
|
|
6
|
-
import { useDelayedAction } from '@studiocubics/hooks';
|
|
7
|
-
import { Button } from '../../Inputs/Button/Button.js';
|
|
8
|
-
|
|
9
|
-
const defaultElement = "div";
|
|
10
|
-
function CopyableTextBase(props) {
|
|
11
|
-
const { as, children, className, disabled = false, slotProps = {}, ...rest } = props;
|
|
12
|
-
const [copied, setCopied] = useState(false);
|
|
13
|
-
const delay = useDelayedAction();
|
|
14
|
-
const Component = (as || defaultElement);
|
|
15
|
-
const componentProps = { ...rest, className: cn(className, styles.root) };
|
|
16
|
-
async function handleCopy(e) {
|
|
17
|
-
await navigator.clipboard.writeText(children);
|
|
18
|
-
setCopied(true);
|
|
19
|
-
slotProps.button?.onClick?.(e);
|
|
20
|
-
}
|
|
21
|
-
useEffect(() => {
|
|
22
|
-
if (copied) {
|
|
23
|
-
delay(() => setCopied(false), 2000);
|
|
24
|
-
}
|
|
25
|
-
}, [delay, copied]);
|
|
26
|
-
return (jsxs(Component, { ...componentProps, children: [jsx("span", { children: children }), jsx(Button, { disabled: disabled, square: true, size: "sm", ...slotProps.button, onClick: handleCopy, children: copied ? (jsx(CheckIcon, { width: 24, height: 24 })) : (jsx(CopyIcon, { width: 24, height: 24 })) })] }));
|
|
27
|
-
}
|
|
28
|
-
CopyableTextBase.displayName = "CopyableText";
|
|
29
|
-
const CopyableText = CopyableTextBase;
|
|
30
|
-
function CopyIcon(props) {
|
|
31
|
-
return (jsxs("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.3", strokeLinecap: "round", strokeLinejoin: "round", children: [jsx("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }), jsx("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })] }));
|
|
32
|
-
}
|
|
33
|
-
// TODO convert to animated check icon
|
|
34
|
-
function CheckIcon(props) {
|
|
35
|
-
return (jsx("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.3", strokeLinecap: "round", strokeLinejoin: "round", children: jsx("path", { d: "M4 12 9 17l11 -11" }) }));
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
export { CopyIcon, CopyableText };
|
|
1
|
+
"use client";import{jsxs as t,jsx as o}from"react/jsx-runtime";import{cn as r}from"@studiocubics/utils";import{useState as e,useEffect as i}from"react";import n from"./CopyableText.module.css.js";import{useDelayedAction as s}from"@studiocubics/hooks";import{Button as c}from"../../Inputs/Button/Button.js";function l(l){const{as:u,children:h,className:m,disabled:p=!1,slotProps:w={},...f}=l,[k,x]=e(!1),b=s(),g=u||"div",v={...f,className:r(m,n.root)};return i(()=>{k&&b(()=>x(!1),2e3)},[b,k]),t(g,{...v,children:[o("span",{children:h}),o(c,{disabled:p,square:!0,size:"sm",...w.button,onClick:async function(t){await navigator.clipboard.writeText(h),x(!0),w.button?.onClick?.(t)},children:o(k?a:d,{width:24,height:24})})]})}l.displayName="CopyableText";const u=l;function d(r){return t("svg",{...r,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.3",strokeLinecap:"round",strokeLinejoin:"round",children:[o("rect",{width:"14",height:"14",x:"8",y:"8",rx:"2",ry:"2"}),o("path",{d:"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"})]})}function a(t){return o("svg",{...t,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.3",strokeLinecap:"round",strokeLinejoin:"round",children:o("path",{d:"M4 12 9 17l11 -11"})})}export{d as CopyIcon,u as CopyableText};
|
|
39
2
|
//# sourceMappingURL=CopyableText.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CopyableText.js","sources":["../../../src/Typography/CopyableText/CopyableText.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n PolymorphicComponentProps,\n PolymorphicComponentType,\n} from \"@studiocubics/types\";\nimport { cn } from \"@studiocubics/utils\";\nimport {\n type ComponentProps,\n type MouseEvent,\n useEffect,\n useState,\n type ElementType,\n} from \"react\";\nimport styles from \"./CopyableText.module.css\";\nimport { useDelayedAction } from \"@studiocubics/hooks\";\nimport { Button, type ButtonProps } from \"../../Inputs/Button/Button\";\n\nexport interface CopyableTextBaseProps {\n children: string;\n disabled?: boolean;\n slotProps?: {\n button?: ButtonProps;\n };\n}\n\nconst defaultElement = \"div\";\ntype DefaultElement = typeof defaultElement;\n\nexport type CopyableTextProps<C extends ElementType = DefaultElement> =\n PolymorphicComponentProps<C, CopyableTextBaseProps>;\n\nfunction CopyableTextBase<C extends ElementType = DefaultElement>(\n props: CopyableTextProps<C>,\n) {\n const {\n as,\n children,\n className,\n disabled = false,\n slotProps = {},\n ...rest\n } = props as CopyableTextProps<DefaultElement>;\n\n const [copied, setCopied] = useState(false);\n const delay = useDelayedAction();\n const Component = (as || defaultElement) as ElementType;\n const componentProps = { ...rest, className: cn(className, styles.root) };\n\n async function handleCopy(e: MouseEvent<HTMLButtonElement>) {\n await navigator.clipboard.writeText(children);\n setCopied(true);\n slotProps.button?.onClick?.(e);\n }\n useEffect(() => {\n if (copied) {\n delay(() => setCopied(false), 2000);\n }\n }, [delay, copied]);\n return (\n <Component {...componentProps}>\n <span>{children}</span>\n <Button\n disabled={disabled}\n square\n size=\"sm\"\n {...slotProps.button}\n onClick={handleCopy}\n >\n {copied ? (\n <CheckIcon width={24} height={24} />\n ) : (\n <CopyIcon width={24} height={24} />\n )}\n </Button>\n </Component>\n );\n}\n\nCopyableTextBase.displayName = \"CopyableText\";\n\nexport const CopyableText = CopyableTextBase as PolymorphicComponentType<\n CopyableTextBaseProps,\n DefaultElement\n>;\n\nexport function CopyIcon(props: ComponentProps<\"svg\">) {\n return (\n <svg\n {...props}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\" />\n <path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\" />\n </svg>\n );\n}\n// TODO convert to animated check icon\nfunction CheckIcon(props: ComponentProps<\"svg\">) {\n return (\n <svg\n {...props}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M4 12 9 17l11 -11\" />\n </svg>\n );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CopyableText.js","sources":["../../../src/Typography/CopyableText/CopyableText.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n PolymorphicComponentProps,\n PolymorphicComponentType,\n} from \"@studiocubics/types\";\nimport { cn } from \"@studiocubics/utils\";\nimport {\n type ComponentProps,\n type MouseEvent,\n useEffect,\n useState,\n type ElementType,\n} from \"react\";\nimport styles from \"./CopyableText.module.css\";\nimport { useDelayedAction } from \"@studiocubics/hooks\";\nimport { Button, type ButtonProps } from \"../../Inputs/Button/Button\";\n\nexport interface CopyableTextBaseProps {\n children: string;\n disabled?: boolean;\n slotProps?: {\n button?: ButtonProps;\n };\n}\n\nconst defaultElement = \"div\";\ntype DefaultElement = typeof defaultElement;\n\nexport type CopyableTextProps<C extends ElementType = DefaultElement> =\n PolymorphicComponentProps<C, CopyableTextBaseProps>;\n\nfunction CopyableTextBase<C extends ElementType = DefaultElement>(\n props: CopyableTextProps<C>,\n) {\n const {\n as,\n children,\n className,\n disabled = false,\n slotProps = {},\n ...rest\n } = props as CopyableTextProps<DefaultElement>;\n\n const [copied, setCopied] = useState(false);\n const delay = useDelayedAction();\n const Component = (as || defaultElement) as ElementType;\n const componentProps = { ...rest, className: cn(className, styles.root) };\n\n async function handleCopy(e: MouseEvent<HTMLButtonElement>) {\n await navigator.clipboard.writeText(children);\n setCopied(true);\n slotProps.button?.onClick?.(e);\n }\n useEffect(() => {\n if (copied) {\n delay(() => setCopied(false), 2000);\n }\n }, [delay, copied]);\n return (\n <Component {...componentProps}>\n <span>{children}</span>\n <Button\n disabled={disabled}\n square\n size=\"sm\"\n {...slotProps.button}\n onClick={handleCopy}\n >\n {copied ? (\n <CheckIcon width={24} height={24} />\n ) : (\n <CopyIcon width={24} height={24} />\n )}\n </Button>\n </Component>\n );\n}\n\nCopyableTextBase.displayName = \"CopyableText\";\n\nexport const CopyableText = CopyableTextBase as PolymorphicComponentType<\n CopyableTextBaseProps,\n DefaultElement\n>;\n\nexport function CopyIcon(props: ComponentProps<\"svg\">) {\n return (\n <svg\n {...props}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\" />\n <path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\" />\n </svg>\n );\n}\n// TODO convert to animated check icon\nfunction CheckIcon(props: ComponentProps<\"svg\">) {\n return (\n <svg\n {...props}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2.3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M4 12 9 17l11 -11\" />\n </svg>\n );\n}\n"],"names":["CopyableTextBase","props","as","children","className","disabled","slotProps","rest","copied","setCopied","useState","delay","useDelayedAction","Component","componentProps","cn","styles","root","useEffect","_jsxs","_jsx","Button","square","size","button","onClick","async","e","navigator","clipboard","writeText","CheckIcon","CopyIcon","width","height","displayName","CopyableText","xmlns","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","x","y","rx","ry","d"],"mappings":"kTAgCA,SAASA,EACPC,GAEA,MAAMC,GACJA,EAAEC,SACFA,EAAQC,UACRA,EAASC,SACTA,GAAW,EAAKC,UAChBA,EAAY,CAAA,KACTC,GACDN,GAEGO,EAAQC,GAAaC,GAAS,GAC/BC,EAAQC,IACRC,EAAaX,GApBE,MAqBfY,EAAiB,IAAKP,EAAMH,UAAWW,EAAGX,EAAWY,EAAOC,OAYlE,OALAC,EAAU,KACJV,GACFG,EAAM,IAAMF,GAAU,GAAQ,MAE/B,CAACE,EAAOH,IAETW,EAACN,EAAS,IAAKC,EAAcX,SAAA,CAC3BiB,EAAA,OAAA,CAAAjB,SAAOA,IACPiB,EAACC,GACChB,SAAUA,EACViB,QAAM,EACNC,KAAK,QACDjB,EAAUkB,OACdC,QAlBNC,eAA0BC,SAClBC,UAAUC,UAAUC,UAAU3B,GACpCM,GAAU,GACVH,EAAUkB,QAAQC,UAAUE,EAC9B,WAiBQP,EADDZ,EACEuB,EAEAC,EAFS,CAACC,MAAO,GAAIC,OAAQ,SAOxC,CAEAlC,EAAiBmC,YAAc,eAExB,MAAMC,EAAepC,EAKtB,SAAUgC,EAAS/B,GACvB,OACEkB,EAAA,MAAA,IACMlB,EACJoC,MAAM,6BACNC,QAAQ,YACRC,KAAK,OACLC,OAAO,eACPC,YAAY,MACZC,cAAc,QACdC,eAAe,QAAOxC,SAAA,CAEtBiB,EAAA,OAAA,CAAMa,MAAM,KAAKC,OAAO,KAAKU,EAAE,IAAIC,EAAE,IAAIC,GAAG,IAAIC,GAAG,MACnD3B,EAAA,OAAA,CAAM4B,EAAE,8DAGd,CAEA,SAASjB,EAAU9B,GACjB,OACEmB,EAAA,MAAA,IACMnB,EACJoC,MAAM,6BACNC,QAAQ,YACRC,KAAK,OACLC,OAAO,eACPC,YAAY,MACZC,cAAc,QACdC,eAAe,QAAOxC,SAEtBiB,UAAM4B,EAAE,uBAGd"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CopyableText.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CopyableText.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,10 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import styles from './PageTitle.module.css.js';
|
|
3
|
-
import { cn } from '@studiocubics/utils';
|
|
4
|
-
|
|
5
|
-
function PageTitle({ title, subtitle, actions, size = "md", noBorders = false, }) {
|
|
6
|
-
return (jsxs("div", { className: cn(styles.root, styles[`size_${size}`], noBorders ? styles.noBorder : ""), children: [jsxs("div", { className: styles.main, children: [jsx("h1", { children: title }), jsx("h2", { children: subtitle })] }), actions && jsx("div", { className: styles.actions, children: actions })] }));
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
export { PageTitle };
|
|
1
|
+
import{jsxs as i,jsx as e}from"react/jsx-runtime";import r from"./PageTitle.module.css.js";import{cn as s}from"@studiocubics/utils";function o({title:o,subtitle:t,actions:c,size:n="md",noBorders:d=!1}){return i("div",{className:s(r.root,r[`size_${n}`],d?r.noBorder:""),children:[i("div",{className:r.main,children:[e("h1",{children:o}),e("h2",{children:t})]}),c&&e("div",{className:r.actions,children:c})]})}export{o as PageTitle};
|
|
10
2
|
//# sourceMappingURL=PageTitle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTitle.js","sources":["../../../src/Typography/PageTitle/PageTitle.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport styles from \"./PageTitle.module.css\";\nimport { cn } from \"@studiocubics/utils\";\n\nexport interface PageTitleProps {\n title: ReactNode;\n actions?: ReactNode;\n subtitle?: ReactNode;\n size?: \"sm\" | \"md\" | \"lg\";\n noBorders?: boolean;\n}\n\nexport function PageTitle({\n title,\n subtitle,\n actions,\n size = \"md\",\n noBorders = false,\n}: PageTitleProps) {\n return (\n <div\n className={cn(\n styles.root,\n styles[`size_${size}`],\n noBorders ? styles.noBorder : \"\"\n )}\n >\n <div className={styles.main}>\n <h1>{title}</h1>\n <h2>{subtitle}</h2>\n </div>\n {actions && <div className={styles.actions}>{actions}</div>}\n </div>\n );\n}\n"],"names":["
|
|
1
|
+
{"version":3,"file":"PageTitle.js","sources":["../../../src/Typography/PageTitle/PageTitle.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport styles from \"./PageTitle.module.css\";\nimport { cn } from \"@studiocubics/utils\";\n\nexport interface PageTitleProps {\n title: ReactNode;\n actions?: ReactNode;\n subtitle?: ReactNode;\n size?: \"sm\" | \"md\" | \"lg\";\n noBorders?: boolean;\n}\n\nexport function PageTitle({\n title,\n subtitle,\n actions,\n size = \"md\",\n noBorders = false,\n}: PageTitleProps) {\n return (\n <div\n className={cn(\n styles.root,\n styles[`size_${size}`],\n noBorders ? styles.noBorder : \"\"\n )}\n >\n <div className={styles.main}>\n <h1>{title}</h1>\n <h2>{subtitle}</h2>\n </div>\n {actions && <div className={styles.actions}>{actions}</div>}\n </div>\n );\n}\n"],"names":["PageTitle","title","subtitle","actions","size","noBorders","_jsxs","className","cn","styles","root","noBorder","children","main","_jsx"],"mappings":"6IAYgBA,GAAUC,MACxBA,EAAKC,SACLA,EAAQC,QACRA,EAAOC,KACPA,EAAO,KAAIC,UACXA,GAAY,IAEZ,OACEC,EAAA,MAAA,CACEC,UAAWC,EACTC,EAAOC,KACPD,EAAO,QAAQL,KACfC,EAAYI,EAAOE,SAAW,IAC/BC,SAAA,CAEDN,EAAA,MAAA,CAAKC,UAAWE,EAAOI,KAAID,SAAA,CACzBE,EAAA,KAAA,CAAAF,SAAKX,IACLa,EAAA,KAAA,CAAAF,SAAKV,OAENC,GAAWW,EAAA,MAAA,CAAKP,UAAWE,EAAON,QAAOS,SAAGT,MAGnD"}
|
|
@@ -1,4 +1,2 @@
|
|
|
1
|
-
var
|
|
2
|
-
|
|
3
|
-
export { styles as default };
|
|
1
|
+
var e={root:"PageTitle-module_root__qgEO4",noBorder:"PageTitle-module_noBorder__hoNLA",size_lg:"PageTitle-module_size_lg__VBUCT",size_sm:"PageTitle-module_size_sm__QmF4G",main:"PageTitle-module_main__bncFv",actions:"PageTitle-module_actions__Wef1k"};export{e as default};
|
|
4
2
|
//# sourceMappingURL=PageTitle.module.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTitle.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PageTitle.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|