@spark-ui/components 10.0.0

package/dist/link-box/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/link-box/LinkBox.tsx","../../src/link-box/LinkBoxLink.tsx","../../src/link-box/LinkBoxRaised.tsx","../../src/link-box/index.ts"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithRef } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface LinkBoxProps extends ComponentPropsWithRef<'div'> {\n  asChild?: boolean\n}\n\nexport const LinkBox = ({ className, asChild, ref, ...props }: LinkBoxProps) => {\n  const Component = asChild ? Slot : 'div'\n\n  return (\n    <Component\n      ref={ref}\n      data-spark-component=\"link-box\"\n      className={cx('relative', className)}\n      {...props}\n    />\n  )\n}\n\nLinkBox.displayName = 'LinkBox'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithRef } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface LinkBoxLinkProps extends ComponentPropsWithRef<'a'> {\n  asChild?: boolean\n}\n\nexport const LinkBoxLink = ({ className, asChild, ref, ...props }: LinkBoxLinkProps) => {\n  const Component = asChild ? Slot : 'a'\n\n  return (\n    <Component\n      ref={ref}\n      data-spark-component=\"link-box-link\"\n      className={cx(\n        \"before:z-base static before:absolute before:top-0 before:left-0 before:block before:size-full before:content-['']\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nLinkBoxLink.displayName = 'LinkBox.Link'\n","import { cx } from 'class-variance-authority'\nimport { ReactNode } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface LinkBoxRaisedProps {\n  className?: string\n  children: ReactNode\n}\n\nexport const LinkBoxRaised = ({ className, ...props }: LinkBoxRaisedProps) => {\n  return <Slot className={cx('z-raised relative', className)} {...props} />\n}\n\nLinkBoxRaised.displayName = 'LinkBox.Raised'\n","import { LinkBox as Root } from './LinkBox'\nimport { LinkBoxLink } from './LinkBoxLink'\nimport { LinkBoxRaised } from './LinkBoxRaised'\n\nexport const LinkBox: typeof Root & {\n  Link: typeof LinkBoxLink\n  Raised: typeof LinkBoxRaised\n} = Object.assign(Root, { Link: LinkBoxLink, Raised: LinkBoxRaised })\n\nLinkBox.displayName = 'LinkBox'\nLinkBox.Link.displayName = 'LinkBox.Link'\nLinkBox.Raised.displayName = 'LinkBox.Raised'\n\nexport { type LinkBoxProps } from './LinkBox'\nexport { type LinkBoxLinkProps } from './LinkBoxLink'\n"],"mappings":";;;;;AAAA,SAAS,UAAU;AAaf;AAJG,IAAM,UAAU,CAAC,EAAE,WAAW,SAAS,KAAK,GAAG,MAAM,MAAoB;AAC9E,QAAM,YAAY,UAAU,OAAO;AAEnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,wBAAqB;AAAA,MACrB,WAAW,GAAG,YAAY,SAAS;AAAA,MAClC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,QAAQ,cAAc;;;ACtBtB,SAAS,MAAAA,WAAU;AAaf,gBAAAC,YAAA;AAJG,IAAM,cAAc,CAAC,EAAE,WAAW,SAAS,KAAK,GAAG,MAAM,MAAwB;AACtF,QAAM,YAAY,UAAU,OAAO;AAEnC,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,wBAAqB;AAAA,MACrB,WAAWC;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,YAAY,cAAc;;;ACzB1B,SAAS,MAAAC,WAAU;AAWV,gBAAAC,YAAA;AADF,IAAM,gBAAgB,CAAC,EAAE,WAAW,GAAG,MAAM,MAA0B;AAC5E,SAAO,gBAAAA,KAAC,QAAK,WAAWC,IAAG,qBAAqB,SAAS,GAAI,GAAG,OAAO;AACzE;AAEA,cAAc,cAAc;;;ACVrB,IAAMC,WAGT,OAAO,OAAO,SAAM,EAAE,MAAM,aAAa,QAAQ,cAAc,CAAC;AAEpEA,SAAQ,cAAc;AACtBA,SAAQ,KAAK,cAAc;AAC3BA,SAAQ,OAAO,cAAc;","names":["cx","jsx","cx","cx","jsx","cx","LinkBox"]}

package/dist/pagination/index.d.mts

@@ -0,0 +1,143 @@
+import { ReactNode, ComponentPropsWithRef, ComponentPropsWithoutRef, Ref, FC } from 'react';
+import * as pagination from '@zag-js/pagination';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface PaginationProviderProps {
+    children: ReactNode;
+    /**
+     * Total number of data items available across all pages.
+     */
+    count: number;
+    /**
+     * Maximum amount of items displayed on a single page.
+     */
+    pageSize: number;
+    /**
+     * Number of visible pages (or ellipsis) between previous and next page triggers.
+     */
+    visiblePageItems?: number;
+    /**
+     * The current page (active page)
+     */
+    page?: pagination.Props['page'];
+    /**
+     * If your pagination contains buttons instead of links, set `type` to `button`, extra attributes will be applied on page items for a11y.
+     */
+    type?: pagination.Props['type'];
+    onPageChange?: pagination.Props['onPageChange'];
+    noEllipsis?: boolean;
+}
+
+type PaginationProps = PaginationProviderProps & {
+    className?: string;
+};
+
+interface EllipsisProps extends ComponentPropsWithRef<'span'> {
+    index: number;
+}
+declare const Ellipsis: {
+    ({ children, index, className, ref, ...rest }: EllipsisProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$4 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$4 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type FirstPageTriggerProps = Omit<AnchorProps$4 | ButtonProps$4, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const FirstPageTrigger: {
+    ({ children, className, href, ref, ...props }: FirstPageTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$3 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$3 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type ItemProps = Omit<AnchorProps$3 | ButtonProps$3, 'aria-label'> & {
+    'aria-label': string;
+    value: number;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const Item: {
+    ({ children, value, className, href, ref, ...props }: ItemProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$2 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$2 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type LastPageTriggerProps = Omit<AnchorProps$2 | ButtonProps$2, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const LastPageTrigger: {
+    ({ children, className, href, ref, ...props }: LastPageTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$1 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$1 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type NextTriggerProps = Omit<AnchorProps$1 | ButtonProps$1, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const NextTrigger: {
+    ({ children, className, href, ref, ...props }: NextTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type PageItem = Extract<pagination.Api['pages'][number], {
+    type: 'page';
+}>;
+type TweakedPaginationApi<T extends 'noEllipsis' | ''> = Omit<pagination.Api, 'pages'> & {
+    pages: T extends 'noEllipsis' ? PageItem[] : pagination.Api['pages'];
+};
+interface PagesProps<T extends 'noEllipsis' | ''> {
+    children: (pagination: TweakedPaginationApi<T>) => ReactNode;
+}
+declare const Pages: {
+    <T extends "noEllipsis" | "" = "">({ children }: PagesProps<T>): ReactNode;
+    displayName: string;
+};
+
+interface AnchorProps extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type PrevTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const PrevTrigger: {
+    ({ children, className, href, ref, ...props }: PrevTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Pagination: FC<PaginationProps> & {
+    PrevTrigger: typeof PrevTrigger;
+    NextTrigger: typeof NextTrigger;
+    Pages: typeof Pages;
+    Item: typeof Item;
+    Ellipsis: typeof Ellipsis;
+    FirstPageTrigger: typeof FirstPageTrigger;
+    LastPageTrigger: typeof LastPageTrigger;
+};
+
+export { Pagination };

package/dist/pagination/index.d.ts

@@ -0,0 +1,143 @@
+import { ReactNode, ComponentPropsWithRef, ComponentPropsWithoutRef, Ref, FC } from 'react';
+import * as pagination from '@zag-js/pagination';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface PaginationProviderProps {
+    children: ReactNode;
+    /**
+     * Total number of data items available across all pages.
+     */
+    count: number;
+    /**
+     * Maximum amount of items displayed on a single page.
+     */
+    pageSize: number;
+    /**
+     * Number of visible pages (or ellipsis) between previous and next page triggers.
+     */
+    visiblePageItems?: number;
+    /**
+     * The current page (active page)
+     */
+    page?: pagination.Props['page'];
+    /**
+     * If your pagination contains buttons instead of links, set `type` to `button`, extra attributes will be applied on page items for a11y.
+     */
+    type?: pagination.Props['type'];
+    onPageChange?: pagination.Props['onPageChange'];
+    noEllipsis?: boolean;
+}
+
+type PaginationProps = PaginationProviderProps & {
+    className?: string;
+};
+
+interface EllipsisProps extends ComponentPropsWithRef<'span'> {
+    index: number;
+}
+declare const Ellipsis: {
+    ({ children, index, className, ref, ...rest }: EllipsisProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$4 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$4 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type FirstPageTriggerProps = Omit<AnchorProps$4 | ButtonProps$4, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const FirstPageTrigger: {
+    ({ children, className, href, ref, ...props }: FirstPageTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$3 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$3 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type ItemProps = Omit<AnchorProps$3 | ButtonProps$3, 'aria-label'> & {
+    'aria-label': string;
+    value: number;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const Item: {
+    ({ children, value, className, href, ref, ...props }: ItemProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$2 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$2 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type LastPageTriggerProps = Omit<AnchorProps$2 | ButtonProps$2, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const LastPageTrigger: {
+    ({ children, className, href, ref, ...props }: LastPageTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface AnchorProps$1 extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps$1 extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type NextTriggerProps = Omit<AnchorProps$1 | ButtonProps$1, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const NextTrigger: {
+    ({ children, className, href, ref, ...props }: NextTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type PageItem = Extract<pagination.Api['pages'][number], {
+    type: 'page';
+}>;
+type TweakedPaginationApi<T extends 'noEllipsis' | ''> = Omit<pagination.Api, 'pages'> & {
+    pages: T extends 'noEllipsis' ? PageItem[] : pagination.Api['pages'];
+};
+interface PagesProps<T extends 'noEllipsis' | ''> {
+    children: (pagination: TweakedPaginationApi<T>) => ReactNode;
+}
+declare const Pages: {
+    <T extends "noEllipsis" | "" = "">({ children }: PagesProps<T>): ReactNode;
+    displayName: string;
+};
+
+interface AnchorProps extends ComponentPropsWithoutRef<'a'> {
+    href: string;
+}
+interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
+    href?: undefined;
+}
+type PrevTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {
+    'aria-label': string;
+    ref?: Ref<HTMLButtonElement>;
+};
+declare const PrevTrigger: {
+    ({ children, className, href, ref, ...props }: PrevTriggerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Pagination: FC<PaginationProps> & {
+    PrevTrigger: typeof PrevTrigger;
+    NextTrigger: typeof NextTrigger;
+    Pages: typeof Pages;
+    Item: typeof Item;
+    Ellipsis: typeof Ellipsis;
+    FirstPageTrigger: typeof FirstPageTrigger;
+    LastPageTrigger: typeof LastPageTrigger;
+};
+
+export { Pagination };