@primer/styled-react 0.0.0-20251006202127 → 0.0.0-20251006202420
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/components/ActionList.d.ts +36 -0
- package/dist/components/ActionList.d.ts.map +1 -0
- package/dist/components/Button.d.ts +13 -0
- package/dist/components/Button.d.ts.map +1 -0
- package/dist/components/IconButton.d.ts +9 -0
- package/dist/components/IconButton.d.ts.map +1 -0
- package/dist/components/NavList.d.ts +27 -19
- package/dist/components/NavList.d.ts.map +1 -1
- package/dist/components/PageHeader.d.ts.map +1 -1
- package/dist/components/TextInput.d.ts +20 -0
- package/dist/components/TextInput.d.ts.map +1 -0
- package/dist/components.json +11 -0
- package/dist/index.d.ts +4 -5
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +286 -9
- package/dist/sx.d.ts +3 -0
- package/dist/sx.d.ts.map +1 -1
- package/package.json +3 -3
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ActionList as PrimerActionList, type ActionListProps as PrimerActionListProps, type ActionListItemProps as PrimerActionListItemProps, type ActionListLinkItemProps as PrimerActionListLinkItemProps, type ActionListGroupProps as PrimerActionListGroupProps, type ActionListDividerProps as PrimerActionListDividerProps, type ActionListLeadingVisualProps as PrimerActionListLeadingVisualProps, type ActionListTrailingVisualProps as PrimerActionListTrailingVisualProps } from '@primer/react';
|
|
3
|
+
import { type SxProp } from '../sx';
|
|
4
|
+
import type { ForwardRefComponent } from '../polymorphic';
|
|
5
|
+
type PrimerActionListTrailingActionProps = React.ComponentProps<typeof PrimerActionList.TrailingAction>;
|
|
6
|
+
export type ActionListProps<As extends React.ElementType = 'ul'> = PrimerActionListProps<As> & SxProp;
|
|
7
|
+
export type ActionListItemProps = React.PropsWithChildren<PrimerActionListItemProps & SxProp>;
|
|
8
|
+
export type ActionListLinkItemProps = React.PropsWithChildren<PrimerActionListLinkItemProps & SxProp>;
|
|
9
|
+
export type ActionListGroupProps = React.PropsWithChildren<PrimerActionListGroupProps & SxProp>;
|
|
10
|
+
export type ActionListDividerProps = React.PropsWithChildren<PrimerActionListDividerProps & SxProp>;
|
|
11
|
+
export type ActionListLeadingVisualProps = React.PropsWithChildren<PrimerActionListLeadingVisualProps & SxProp>;
|
|
12
|
+
export type ActionListTrailingVisualProps = React.PropsWithChildren<PrimerActionListTrailingVisualProps & SxProp>;
|
|
13
|
+
export type ActionListTrailingActionProps = React.PropsWithChildren<PrimerActionListTrailingActionProps & SxProp>;
|
|
14
|
+
declare const ActionListImpl: React.ForwardRefExoticComponent<Omit<ActionListProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>>;
|
|
15
|
+
declare const ActionListLinkItem: ForwardRefComponent<'a', ActionListLinkItemProps>;
|
|
16
|
+
type TrailingActionElements = 'button' | 'a';
|
|
17
|
+
declare const ActionListTrailingAction: ForwardRefComponent<TrailingActionElements, ActionListTrailingActionProps>;
|
|
18
|
+
declare const ActionListItem: ForwardRefComponent<"li", ActionListItemProps>;
|
|
19
|
+
declare const ActionListGroup: React.ComponentType<ActionListGroupProps>;
|
|
20
|
+
declare const ActionListDivider: React.ComponentType<ActionListDividerProps>;
|
|
21
|
+
declare const ActionListLeadingVisual: React.ComponentType<ActionListLeadingVisualProps>;
|
|
22
|
+
declare const ActionListTrailingVisual: React.ComponentType<ActionListTrailingVisualProps>;
|
|
23
|
+
export declare const ActionList: typeof ActionListImpl & {
|
|
24
|
+
Item: typeof ActionListItem;
|
|
25
|
+
LinkItem: typeof ActionListLinkItem;
|
|
26
|
+
Group: typeof ActionListGroup;
|
|
27
|
+
GroupHeading: typeof PrimerActionList.GroupHeading;
|
|
28
|
+
Divider: typeof ActionListDivider;
|
|
29
|
+
Description: typeof PrimerActionList.Description;
|
|
30
|
+
LeadingVisual: typeof ActionListLeadingVisual;
|
|
31
|
+
TrailingVisual: typeof ActionListTrailingVisual;
|
|
32
|
+
Heading: typeof PrimerActionList.Heading;
|
|
33
|
+
TrailingAction: typeof ActionListTrailingAction;
|
|
34
|
+
};
|
|
35
|
+
export {};
|
|
36
|
+
//# sourceMappingURL=ActionList.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionList.d.ts","sourceRoot":"","sources":["../../src/components/ActionList.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type ButtonProps as PrimerButtonProps } from '@primer/react';
|
|
2
|
+
import type { SxProp } from '../sx';
|
|
3
|
+
import type { BetterSystemStyleObject } from '../styled-props';
|
|
4
|
+
import type { ForwardRefComponent } from '../polymorphic';
|
|
5
|
+
type ButtonComponentProps = PrimerButtonProps & SxProp & {
|
|
6
|
+
as?: React.ElementType;
|
|
7
|
+
};
|
|
8
|
+
declare const ButtonComponent: ForwardRefComponent<"button", ButtonComponentProps>;
|
|
9
|
+
export declare function generateCustomSxProp(props: Partial<Pick<PrimerButtonProps, 'size' | 'block' | 'leadingVisual' | 'trailingVisual' | 'trailingAction'>>, providedSx: BetterSystemStyleObject): {
|
|
10
|
+
[key: string]: BetterSystemStyleObject;
|
|
11
|
+
};
|
|
12
|
+
export { ButtonComponent, type ButtonComponentProps };
|
|
13
|
+
//# sourceMappingURL=Button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,WAAW,IAAI,iBAAiB,EAAC,MAAM,eAAe,CAAA;AAC3F,OAAO,KAAK,EAAC,MAAM,EAAsB,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,EAAC,uBAAuB,EAAC,MAAM,iBAAiB,CAAA;AAG5D,OAAO,KAAK,EAAC,mBAAmB,EAAC,MAAM,gBAAgB,CAAA;AAEvD,KAAK,oBAAoB,GAAG,iBAAiB,GAAG,MAAM,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AAoBjF,QAAA,MAAM,eAAe,EAEf,mBAAmB,CAAC,QAAQ,EAAE,oBAAoB,CAAC,CAAA;AA0CzD,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,iBAAiB,EAAE,MAAM,GAAG,OAAO,GAAG,eAAe,GAAG,gBAAgB,GAAG,gBAAgB,CAAC,CAAC,EACjH,UAAU,EAAE,uBAAuB;;EAmBpC;AAID,OAAO,EAAC,eAAe,EAAE,KAAK,oBAAoB,EAAC,CAAA"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type IconButtonProps as PrimerIconButtonProps, type SxProp } from '@primer/react';
|
|
2
|
+
import { type ForwardRefComponent } from '../polymorphic';
|
|
3
|
+
type IconButtonProps = PrimerIconButtonProps & SxProp & {
|
|
4
|
+
as?: React.ElementType;
|
|
5
|
+
};
|
|
6
|
+
declare const IconButton: ForwardRefComponent<"a" | "button", IconButtonProps>;
|
|
7
|
+
export { IconButton };
|
|
8
|
+
export type { IconButtonProps };
|
|
9
|
+
//# sourceMappingURL=IconButton.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/components/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,eAAe,IAAI,qBAAqB,EAAE,KAAK,MAAM,EAAC,MAAM,eAAe,CAAA;AACxH,OAAO,EAAC,KAAK,mBAAmB,EAAC,MAAM,gBAAgB,CAAA;AAKvD,KAAK,eAAe,GAAG,qBAAqB,GAAG,MAAM,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AAahF,QAAA,MAAM,UAAU,EAEV,mBAAmB,CAAC,GAAG,GAAG,QAAQ,EAAE,eAAe,CAAC,CAAA;AAE1D,OAAO,EAAC,UAAU,EAAC,CAAA;AACnB,YAAY,EAAC,eAAe,EAAC,CAAA"}
|
|
@@ -1,25 +1,33 @@
|
|
|
1
1
|
import { NavList as PrimerNavList } from '@primer/react';
|
|
2
|
-
import type { NavListProps as PrimerNavListProps, NavListItemProps as PrimerNavListItemProps } from '@primer/react';
|
|
3
|
-
import { type
|
|
2
|
+
import type { NavListProps as PrimerNavListProps, NavListItemProps as PrimerNavListItemProps, NavListGroupHeadingProps as PrimerNavListGroupHeadingProps, NavListLeadingVisualProps as PrimerNavListLeadingVisualProps } from '@primer/react';
|
|
3
|
+
import { type PropsWithChildren } from 'react';
|
|
4
4
|
import { type SxProp } from '../sx';
|
|
5
|
+
type RefComponent<E extends HTMLElement, P> = React.ForwardRefExoticComponent<P & React.RefAttributes<E>>;
|
|
5
6
|
type NavListProps = PropsWithChildren<PrimerNavListProps> & SxProp;
|
|
6
|
-
declare const
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
7
|
+
declare const NavListItem: import("react").ForwardRefExoticComponent<PrimerNavListItemProps & {
|
|
8
|
+
children?: import("react").ReactNode | undefined;
|
|
9
|
+
} & SxProp & import("react").RefAttributes<HTMLAnchorElement>>;
|
|
10
|
+
declare const NavListGroup: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLLIElement> & {
|
|
11
|
+
children: React.ReactNode;
|
|
12
|
+
title?: string;
|
|
13
|
+
} & {
|
|
14
|
+
children?: import("react").ReactNode | undefined;
|
|
15
|
+
} & SxProp & import("react").RefAttributes<HTMLLIElement>>;
|
|
16
|
+
type NavListGroupHeadingProps = PropsWithChildren<PrimerNavListGroupHeadingProps> & SxProp;
|
|
17
|
+
declare const NavListGroupHeading: RefComponent<HTMLElement, NavListGroupHeadingProps>;
|
|
18
|
+
type NavListLeadingVisualProps = PropsWithChildren<PrimerNavListLeadingVisualProps> & SxProp;
|
|
19
|
+
declare const NavListLeadingVisual: RefComponent<HTMLSpanElement, NavListLeadingVisualProps>;
|
|
20
|
+
type NavListCompound = React.ForwardRefExoticComponent<NavListProps & React.RefAttributes<HTMLElement>> & {
|
|
21
|
+
Item: typeof NavListItem;
|
|
22
|
+
Group: typeof NavListGroup;
|
|
23
|
+
GroupHeading: typeof NavListGroupHeading;
|
|
24
|
+
LeadingVisual: typeof NavListLeadingVisual;
|
|
25
|
+
SubNav: typeof PrimerNavList.SubNav;
|
|
26
|
+
Divider: typeof PrimerNavList.Divider;
|
|
27
|
+
TrailingVisual: typeof PrimerNavList.TrailingVisual;
|
|
28
|
+
TrailingAction: typeof PrimerNavList.TrailingAction;
|
|
29
|
+
GroupExpand: typeof PrimerNavList.GroupExpand;
|
|
23
30
|
};
|
|
31
|
+
declare const NavList: NavListCompound;
|
|
24
32
|
export { NavList, type NavListProps };
|
|
25
33
|
//# sourceMappingURL=NavList.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavList.d.ts","sourceRoot":"","sources":["../../src/components/NavList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,IAAI,aAAa,EAAM,MAAM,eAAe,CAAA;AAC3D,OAAO,KAAK,EACV,YAAY,IAAI,kBAAkB,EAClC,gBAAgB,IAAI,sBAAsB,
|
|
1
|
+
{"version":3,"file":"NavList.d.ts","sourceRoot":"","sources":["../../src/components/NavList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,IAAI,aAAa,EAAM,MAAM,eAAe,CAAA;AAC3D,OAAO,KAAK,EACV,YAAY,IAAI,kBAAkB,EAClC,gBAAgB,IAAI,sBAAsB,EAE1C,wBAAwB,IAAI,8BAA8B,EAC1D,yBAAyB,IAAI,+BAA+B,EAC7D,MAAM,eAAe,CAAA;AACtB,OAAO,EAAa,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAA;AACxD,OAAO,EAAC,KAAK,MAAM,EAAC,MAAM,OAAO,CAAA;AAEjC,KAAK,YAAY,CAAC,CAAC,SAAS,WAAW,EAAE,CAAC,IAAI,KAAK,CAAC,yBAAyB,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAA;AAEzG,KAAK,YAAY,GAAG,iBAAiB,CAAC,kBAAkB,CAAC,GAAG,MAAM,CAAA;AAQlE,QAAA,MAAM,WAAW;;8DAGf,CAAA;AAIF,QAAA,MAAM,YAAY;;;;;0DAGhB,CAAA;AAEF,KAAK,wBAAwB,GAAG,iBAAiB,CAAC,8BAA8B,CAAC,GAAG,MAAM,CAAA;AAE1F,QAAA,MAAM,mBAAmB,EAGnB,YAAY,CAAC,WAAW,EAAE,wBAAwB,CAAC,CAAA;AAEzD,KAAK,yBAAyB,GAAG,iBAAiB,CAAC,+BAA+B,CAAC,GAAG,MAAM,CAAA;AAE5F,QAAA,MAAM,oBAAoB,EAKrB,YAAY,CAAC,eAAe,EAAE,yBAAyB,CAAC,CAAA;AAE7D,KAAK,eAAe,GAAG,KAAK,CAAC,yBAAyB,CAAC,YAAY,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,GAAG;IACxG,IAAI,EAAE,OAAO,WAAW,CAAA;IACxB,KAAK,EAAE,OAAO,YAAY,CAAA;IAC1B,YAAY,EAAE,OAAO,mBAAmB,CAAA;IACxC,aAAa,EAAE,OAAO,oBAAoB,CAAA;IAC1C,MAAM,EAAE,OAAO,aAAa,CAAC,MAAM,CAAA;IACnC,OAAO,EAAE,OAAO,aAAa,CAAC,OAAO,CAAA;IACrC,cAAc,EAAE,OAAO,aAAa,CAAC,cAAc,CAAA;IACnD,cAAc,EAAE,OAAO,aAAa,CAAC,cAAc,CAAA;IACnD,WAAW,EAAE,OAAO,aAAa,CAAC,WAAW,CAAA;CAC9C,CAAA;AAED,QAAA,MAAM,OAAO,EAAE,eAUb,CAAA;AAEF,OAAO,EAAC,OAAO,EAAE,KAAK,YAAY,EAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,IAAI,gBAAgB,EAC9B,KAAK,eAAe,IAAI,qBAAqB,EAC7C,KAAK,oBAAoB,IAAI,0BAA0B,EACvD,KAAK,sBAAsB,IAAI,4BAA4B,EAC3D,KAAK,wBAAwB,IAAI,8BAA8B,EAChE,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAK,KAAK,MAAM,
|
|
1
|
+
{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/components/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,IAAI,gBAAgB,EAC9B,KAAK,eAAe,IAAI,qBAAqB,EAC7C,KAAK,oBAAoB,IAAI,0BAA0B,EACvD,KAAK,sBAAsB,IAAI,4BAA4B,EAC3D,KAAK,wBAAwB,IAAI,8BAA8B,EAChE,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAK,KAAK,MAAM,EAA2B,MAAM,OAAO,CAAA;AAC/D,OAAO,KAAK,EAAC,mBAAmB,EAAC,MAAM,gBAAgB,CAAA;AAEvD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAC5C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,eAAe,GAAG,qBAAqB,GAAG,MAAM,CAAA;AAcrD,KAAK,sBAAsB,GAAG,4BAA4B,GAAG,MAAM,CAAA;AAEnE,iBAAS,iBAAiB,CAAC,EAAC,EAAE,EAAE,GAAG,IAAI,EAAC,EAAE,sBAAsB,qBAY/D;AAED,KAAK,oBAAoB,GAAG,iBAAiB,CAAC,0BAA0B,CAAC,GAAG,MAAM,CAAA;AAwBlF,QAAA,MAAM,eAAe,GAAI,kBAAgB,oBAAoB,sBAE5D,CAAA;AAED,KAAK,wBAAwB,GAAG,iBAAiB,CAAC,8BAA8B,CAAC,GAAG,MAAM,CAAA;AAE1F,QAAA,MAAM,mBAAmB,EAAE,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,CAM7E,CAAA;AAED,KAAK,uBAAuB,GAAG,mBAAmB,CAAC,KAAK,EAAE,eAAe,CAAC,GAAG;IAC3E,OAAO,EAAE,OAAO,iBAAiB,CAAA;IACjC,WAAW,EAAE,OAAO,gBAAgB,CAAC,WAAW,CAAA;IAChD,UAAU,EAAE,OAAO,gBAAgB,CAAC,UAAU,CAAA;IAC9C,UAAU,EAAE,OAAO,gBAAgB,CAAC,UAAU,CAAA;IAC9C,SAAS,EAAE,OAAO,mBAAmB,CAAA;IACrC,kBAAkB,EAAE,OAAO,gBAAgB,CAAC,kBAAkB,CAAA;IAC9D,aAAa,EAAE,OAAO,gBAAgB,CAAC,aAAa,CAAA;IACpD,WAAW,EAAE,OAAO,gBAAgB,CAAC,WAAW,CAAA;IAChD,aAAa,EAAE,OAAO,gBAAgB,CAAC,aAAa,CAAA;IACpD,KAAK,EAAE,OAAO,eAAe,CAAA;IAC7B,cAAc,EAAE,OAAO,gBAAgB,CAAC,cAAc,CAAA;IACtD,WAAW,EAAE,OAAO,gBAAgB,CAAC,WAAW,CAAA;IAChD,cAAc,EAAE,OAAO,gBAAgB,CAAC,cAAc,CAAA;CACvD,CAAA;AAED,QAAA,MAAM,UAAU,EAAE,uBAchB,CAAA;AAEF,OAAO,EAAC,UAAU,EAAC,CAAA;AACnB,YAAY,EAAC,eAAe,EAAE,sBAAsB,EAAE,oBAAoB,EAAC,CAAA"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { type TextInputProps as PrimerTextInputProps, type TextInputActionProps as PrimerTextInputActionProps } from '@primer/react';
|
|
2
|
+
import type { SxProp } from '../sx';
|
|
3
|
+
import type { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
4
|
+
export type TextInputProps = PrimerTextInputProps & SxProp & {
|
|
5
|
+
as?: React.ElementType;
|
|
6
|
+
};
|
|
7
|
+
export type TextInputActionProps = PrimerTextInputActionProps & SxProp;
|
|
8
|
+
declare const TextInputAction: ForwardRefExoticComponent<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "size" | "aria-label" | "tooltipDirection"> & {
|
|
9
|
+
children?: React.ReactNode;
|
|
10
|
+
"aria-label"?: string;
|
|
11
|
+
tooltipDirection?: "n" | "ne" | "e" | "se" | "s" | "sw" | "w" | "nw";
|
|
12
|
+
icon?: React.FunctionComponent<React.PropsWithChildren<import("@primer/octicons-react").IconProps>>;
|
|
13
|
+
variant?: import("@primer/react").ButtonProps["variant"];
|
|
14
|
+
} & SxProp & RefAttributes<HTMLButtonElement>>;
|
|
15
|
+
type TextInputComposite = ForwardRefExoticComponent<TextInputProps & RefAttributes<HTMLInputElement>> & {
|
|
16
|
+
Action: typeof TextInputAction;
|
|
17
|
+
};
|
|
18
|
+
export declare const TextInput: TextInputComposite;
|
|
19
|
+
export {};
|
|
20
|
+
//# sourceMappingURL=TextInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/components/TextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,IAAI,oBAAoB,EAC3C,KAAK,oBAAoB,IAAI,0BAA0B,EACxD,MAAM,eAAe,CAAA;AAGtB,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AACjC,OAAO,KAAK,EAAC,yBAAyB,EAAE,aAAa,EAAC,MAAM,OAAO,CAAA;AAEnE,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAAG,MAAM,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AACrF,MAAM,MAAM,oBAAoB,GAAG,0BAA0B,GAAG,MAAM,CAAA;AAUtE,QAAA,MAAM,eAAe;;;;;;8CAEnB,CAAA;AAEF,KAAK,kBAAkB,GAAG,yBAAyB,CAAC,cAAc,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC,GAAG;IACtG,MAAM,EAAE,OAAO,eAAe,CAAA;CAC/B,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,kBAEtB,CAAA"}
|
package/dist/components.json
CHANGED
|
@@ -50,12 +50,21 @@
|
|
|
50
50
|
"UnderlinePanels"
|
|
51
51
|
],
|
|
52
52
|
"types": [
|
|
53
|
+
"ActionListDividerProps",
|
|
54
|
+
"ActionListGroupProps",
|
|
55
|
+
"ActionListItemProps",
|
|
56
|
+
"ActionListLeadingVisualProps",
|
|
57
|
+
"ActionListLinkItemProps",
|
|
58
|
+
"ActionListProps",
|
|
59
|
+
"ActionListTrailingActionProps",
|
|
60
|
+
"ActionListTrailingVisualProps",
|
|
53
61
|
"AutocompleteOverlayProps",
|
|
54
62
|
"AvatarProps",
|
|
55
63
|
"BetterSystemStyleObject",
|
|
56
64
|
"BoxProps",
|
|
57
65
|
"BreadcrumbsItemProps",
|
|
58
66
|
"BreadcrumbsProps",
|
|
67
|
+
"ButtonProps",
|
|
59
68
|
"CheckboxGroupProps",
|
|
60
69
|
"CheckboxProps",
|
|
61
70
|
"CounterLabelProps",
|
|
@@ -63,6 +72,7 @@
|
|
|
63
72
|
"DialogHeaderProps",
|
|
64
73
|
"DialogProps",
|
|
65
74
|
"HeaderProps",
|
|
75
|
+
"IconButtonProps",
|
|
66
76
|
"LabelProps",
|
|
67
77
|
"LinkButtonProps",
|
|
68
78
|
"LinkProps",
|
|
@@ -91,6 +101,7 @@
|
|
|
91
101
|
"TableTitleProps",
|
|
92
102
|
"TabNavLinkProps",
|
|
93
103
|
"TabNavProps",
|
|
104
|
+
"TextInputActionProps",
|
|
94
105
|
"TextInputProps",
|
|
95
106
|
"TextProps",
|
|
96
107
|
"TimelineBadgeProps",
|
package/dist/index.d.ts
CHANGED
|
@@ -1,25 +1,22 @@
|
|
|
1
|
-
export { ActionList } from '@primer/react';
|
|
2
1
|
export { Box, type BoxProps } from './components/Box';
|
|
3
|
-
export { Button } from '@primer/react';
|
|
4
2
|
export { Details } from '@primer/react';
|
|
5
3
|
export { FormControl } from '@primer/react';
|
|
6
|
-
export { IconButton } from '@primer/react';
|
|
7
4
|
export { ProgressBar } from '@primer/react';
|
|
8
5
|
export { PageLayout } from '@primer/react';
|
|
9
6
|
export { Select } from '@primer/react';
|
|
10
7
|
export { Textarea } from '@primer/react';
|
|
11
|
-
export { TextInput } from '@primer/react';
|
|
12
|
-
export { type TextInputProps } from '@primer/react';
|
|
13
8
|
export { ThemeProvider } from '@primer/react';
|
|
14
9
|
export { merge } from '@primer/react';
|
|
15
10
|
export { theme } from '@primer/react';
|
|
16
11
|
export { themeGet } from '@primer/react';
|
|
17
12
|
export { useColorSchemeVar } from '@primer/react';
|
|
18
13
|
export { useTheme } from '@primer/react';
|
|
14
|
+
export { ActionList, type ActionListProps, type ActionListItemProps, type ActionListLinkItemProps, type ActionListGroupProps, type ActionListDividerProps, type ActionListLeadingVisualProps, type ActionListTrailingVisualProps, type ActionListTrailingActionProps, } from './components/ActionList';
|
|
19
15
|
export { ActionMenu } from './components/ActionMenu';
|
|
20
16
|
export { Autocomplete, type AutocompleteOverlayProps } from './components/Autocomplete';
|
|
21
17
|
export { Avatar, type AvatarProps } from './components/Avatar';
|
|
22
18
|
export { Breadcrumbs, Breadcrumb, type BreadcrumbsProps, type BreadcrumbsItemProps } from './components/Breadcrumbs';
|
|
19
|
+
export { ButtonComponent as Button, type ButtonComponentProps as ButtonProps } from './components/Button';
|
|
23
20
|
export { Checkbox, type CheckboxProps } from './components/Checkbox';
|
|
24
21
|
export { CheckboxGroup, type CheckboxGroupProps } from './components/CheckboxGroup';
|
|
25
22
|
export { CircleBadge } from './components/CircleBadge';
|
|
@@ -28,6 +25,7 @@ export { Dialog, type DialogProps } from './components/Dialog';
|
|
|
28
25
|
export { Flash } from './components/Flash';
|
|
29
26
|
export { Header, type HeaderProps } from './components/Header';
|
|
30
27
|
export { Heading } from './components/Heading';
|
|
28
|
+
export { IconButton, type IconButtonProps } from './components/IconButton';
|
|
31
29
|
export { Label, type LabelProps } from './components/Label';
|
|
32
30
|
export { Link, type LinkProps } from './components/Link';
|
|
33
31
|
export { LinkButton, type LinkButtonProps } from './components/LinkButton';
|
|
@@ -41,6 +39,7 @@ export { Spinner, type SpinnerProps } from './components/Spinner';
|
|
|
41
39
|
export { StateLabel, type StateLabelProps } from './components/StateLabel';
|
|
42
40
|
export { SubNav, type SubNavProps, type SubNavLinkProps } from './components/SubNav';
|
|
43
41
|
export { Text, type TextProps } from './components/Text';
|
|
42
|
+
export { TextInput, type TextInputProps, type TextInputActionProps } from './components/TextInput';
|
|
44
43
|
export { Timeline, type TimelineProps, type TimelineItemProps, type TimelineBadgeProps, type TimelineBodyProps, type TimelineBreakProps, } from './components/Timeline';
|
|
45
44
|
export { ToggleSwitch, type ToggleSwitchProps } from './components/ToggleSwitch';
|
|
46
45
|
export { Tooltip, type TooltipProps } from './components/Tooltip';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -1,13 +1,111 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export {
|
|
3
|
-
import styled from 'styled-components';
|
|
1
|
+
import { ActionList as ActionList$1, sx, ActionMenu as ActionMenu$1, Autocomplete as Autocomplete$1, Box, Avatar as Avatar$1, Breadcrumbs as Breadcrumbs$1, Button, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, CircleBadge as CircleBadge$1, CounterLabel as CounterLabel$1, Flash as Flash$1, Header as Header$1, Heading as Heading$1, IconButton as IconButton$1, Label as Label$1, Link as Link$1, LinkButton as LinkButton$1, NavList as NavList$1, Overlay as Overlay$1, RadioGroup as RadioGroup$1, RelativeTime as RelativeTime$1, SegmentedControl as SegmentedControl$1, Spinner as Spinner$1, StateLabel as StateLabel$1, SubNav as SubNav$1, Text as Text$1, TextInput as TextInput$1, Timeline as Timeline$1, ToggleSwitch as ToggleSwitch$1, useTheme, theme, Token as Token$1, Truncate as Truncate$1, UnderlineNav as UnderlineNav$1 } from '@primer/react';
|
|
2
|
+
export { Box, Details, FormControl, PageLayout, ProgressBar, Select, Textarea, ThemeProvider, merge, sx, theme, themeGet, useColorSchemeVar, useTheme } from '@primer/react';
|
|
4
3
|
import React, { forwardRef } from 'react';
|
|
4
|
+
import styled from 'styled-components';
|
|
5
5
|
import { jsx } from 'react/jsx-runtime';
|
|
6
6
|
export { D as Dialog, P as PageHeader } from './PageHeader-DCDIR2C1.js';
|
|
7
7
|
export { T as Tooltip } from './Tooltip-YuSlJ5b_.js';
|
|
8
8
|
import css from '@styled-system/css';
|
|
9
9
|
import '@primer/react/deprecated';
|
|
10
10
|
|
|
11
|
+
const StyledActionList = styled(ActionList$1).withConfig({
|
|
12
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
13
|
+
}).withConfig({
|
|
14
|
+
displayName: "ActionList__StyledActionList",
|
|
15
|
+
componentId: "sc-hw2362-0"
|
|
16
|
+
})(["", ""], sx);
|
|
17
|
+
const ActionListImpl = /*#__PURE__*/React.forwardRef(function ActionListImpl({
|
|
18
|
+
as,
|
|
19
|
+
...rest
|
|
20
|
+
}, ref) {
|
|
21
|
+
return /*#__PURE__*/jsx(StyledActionList, {
|
|
22
|
+
ref: ref,
|
|
23
|
+
...rest,
|
|
24
|
+
...(as ? {
|
|
25
|
+
forwardedAs: as
|
|
26
|
+
} : {})
|
|
27
|
+
});
|
|
28
|
+
});
|
|
29
|
+
const ActionListLinkItem = styled(ActionList$1.LinkItem).withConfig({
|
|
30
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
31
|
+
}).withConfig({
|
|
32
|
+
displayName: "ActionList__ActionListLinkItem",
|
|
33
|
+
componentId: "sc-hw2362-1"
|
|
34
|
+
})(["", ""], sx);
|
|
35
|
+
const StyledActionListTrailingAction = styled(ActionList$1.TrailingAction).withConfig({
|
|
36
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
37
|
+
}).withConfig({
|
|
38
|
+
displayName: "ActionList__StyledActionListTrailingAction",
|
|
39
|
+
componentId: "sc-hw2362-2"
|
|
40
|
+
})(["", ""], sx);
|
|
41
|
+
const ActionListTrailingAction = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
42
|
+
const {
|
|
43
|
+
as,
|
|
44
|
+
...rest
|
|
45
|
+
} = props;
|
|
46
|
+
return /*#__PURE__*/jsx(StyledActionListTrailingAction, {
|
|
47
|
+
...rest,
|
|
48
|
+
...(as ? {
|
|
49
|
+
forwardedAs: as
|
|
50
|
+
} : {}),
|
|
51
|
+
ref: ref
|
|
52
|
+
});
|
|
53
|
+
});
|
|
54
|
+
const StyledActionListItem = styled(ActionList$1.Item).withConfig({
|
|
55
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
56
|
+
}).withConfig({
|
|
57
|
+
displayName: "ActionList__StyledActionListItem",
|
|
58
|
+
componentId: "sc-hw2362-3"
|
|
59
|
+
})(["", ""], sx);
|
|
60
|
+
const ActionListItem = /*#__PURE__*/React.forwardRef(({
|
|
61
|
+
children,
|
|
62
|
+
as,
|
|
63
|
+
...props
|
|
64
|
+
}, ref) => /*#__PURE__*/jsx(StyledActionListItem, {
|
|
65
|
+
ref: ref,
|
|
66
|
+
...props,
|
|
67
|
+
...(as ? {
|
|
68
|
+
forwardedAs: as
|
|
69
|
+
} : {}),
|
|
70
|
+
children: children
|
|
71
|
+
}));
|
|
72
|
+
const ActionListGroup = styled(ActionList$1.Group).withConfig({
|
|
73
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
74
|
+
}).withConfig({
|
|
75
|
+
displayName: "ActionList__ActionListGroup",
|
|
76
|
+
componentId: "sc-hw2362-4"
|
|
77
|
+
})(["", ""], sx);
|
|
78
|
+
const ActionListDivider = styled(ActionList$1.Divider).withConfig({
|
|
79
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
80
|
+
}).withConfig({
|
|
81
|
+
displayName: "ActionList__ActionListDivider",
|
|
82
|
+
componentId: "sc-hw2362-5"
|
|
83
|
+
})(["", ""], sx);
|
|
84
|
+
const ActionListLeadingVisual = styled(ActionList$1.LeadingVisual).withConfig({
|
|
85
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
86
|
+
}).withConfig({
|
|
87
|
+
displayName: "ActionList__ActionListLeadingVisual",
|
|
88
|
+
componentId: "sc-hw2362-6"
|
|
89
|
+
})(["", ""], sx);
|
|
90
|
+
const ActionListTrailingVisual = styled(ActionList$1.TrailingVisual).withConfig({
|
|
91
|
+
shouldForwardProp: prop => prop !== 'sx'
|
|
92
|
+
}).withConfig({
|
|
93
|
+
displayName: "ActionList__ActionListTrailingVisual",
|
|
94
|
+
componentId: "sc-hw2362-7"
|
|
95
|
+
})(["", ""], sx);
|
|
96
|
+
const ActionList = Object.assign(ActionListImpl, {
|
|
97
|
+
Item: ActionListItem,
|
|
98
|
+
LinkItem: ActionListLinkItem,
|
|
99
|
+
Group: ActionListGroup,
|
|
100
|
+
GroupHeading: ActionList$1.GroupHeading,
|
|
101
|
+
Divider: ActionListDivider,
|
|
102
|
+
Description: ActionList$1.Description,
|
|
103
|
+
LeadingVisual: ActionListLeadingVisual,
|
|
104
|
+
TrailingVisual: ActionListTrailingVisual,
|
|
105
|
+
Heading: ActionList$1.Heading,
|
|
106
|
+
TrailingAction: ActionListTrailingAction
|
|
107
|
+
});
|
|
108
|
+
|
|
11
109
|
const ActionMenuOverlay = styled(ActionMenu$1.Overlay).withConfig({
|
|
12
110
|
shouldForwardProp: prop => prop !== 'sx'
|
|
13
111
|
}).withConfig({
|
|
@@ -74,6 +172,108 @@ const Breadcrumbs = Object.assign(BreadcrumbsImpl, {
|
|
|
74
172
|
*/
|
|
75
173
|
const Breadcrumb = Breadcrumbs;
|
|
76
174
|
|
|
175
|
+
const StyledButtonComponent = /*#__PURE__*/forwardRef(({
|
|
176
|
+
sx,
|
|
177
|
+
...rest
|
|
178
|
+
}, ref) => {
|
|
179
|
+
const {
|
|
180
|
+
block,
|
|
181
|
+
size = 'medium',
|
|
182
|
+
leadingVisual,
|
|
183
|
+
trailingVisual,
|
|
184
|
+
trailingAction
|
|
185
|
+
} = rest;
|
|
186
|
+
let sxStyles = {};
|
|
187
|
+
const style = {};
|
|
188
|
+
if (sx !== null && Object.keys(sx || {}).length > 0) {
|
|
189
|
+
sxStyles = generateCustomSxProp({
|
|
190
|
+
block,
|
|
191
|
+
size,
|
|
192
|
+
leadingVisual,
|
|
193
|
+
trailingVisual,
|
|
194
|
+
trailingAction
|
|
195
|
+
}, sx);
|
|
196
|
+
const {
|
|
197
|
+
color
|
|
198
|
+
} = sx;
|
|
199
|
+
if (color) style['--button-color'] = color;
|
|
200
|
+
}
|
|
201
|
+
return /*#__PURE__*/jsx(Box, {
|
|
202
|
+
as: Button,
|
|
203
|
+
style: style,
|
|
204
|
+
sx: sxStyles,
|
|
205
|
+
ref: ref,
|
|
206
|
+
...rest
|
|
207
|
+
});
|
|
208
|
+
});
|
|
209
|
+
const ButtonComponent = /*#__PURE__*/forwardRef(({
|
|
210
|
+
as,
|
|
211
|
+
...props
|
|
212
|
+
}, ref) => /*#__PURE__*/jsx(StyledButtonComponent, {
|
|
213
|
+
ref: ref,
|
|
214
|
+
...props,
|
|
215
|
+
...(as ? {
|
|
216
|
+
forwardedAs: as
|
|
217
|
+
} : {})
|
|
218
|
+
}));
|
|
219
|
+
|
|
220
|
+
// This function is used to generate a custom cssSelector for the sxProp
|
|
221
|
+
|
|
222
|
+
// The usual sx prop can like this:
|
|
223
|
+
// sx={{
|
|
224
|
+
// [`@media (max-width: 768px)`]: {
|
|
225
|
+
// '& > ul': {
|
|
226
|
+
// backgroundColor: 'deeppink',
|
|
227
|
+
// },
|
|
228
|
+
// '&:hover': {
|
|
229
|
+
// backgroundColor: 'yellow',
|
|
230
|
+
// },
|
|
231
|
+
// },
|
|
232
|
+
// '&:hover': {
|
|
233
|
+
// backgroundColor: 'yellow',
|
|
234
|
+
// },
|
|
235
|
+
// '&': {
|
|
236
|
+
// width : 320px
|
|
237
|
+
// }
|
|
238
|
+
// }}
|
|
239
|
+
//*
|
|
240
|
+
/* What we want for Button styles is this:
|
|
241
|
+
sx={{
|
|
242
|
+
// [`@media (max-width: 768px)`]: {
|
|
243
|
+
// '&[data-attribute="something"] > ul': {
|
|
244
|
+
// backgroundColor: 'deeppink',
|
|
245
|
+
// },
|
|
246
|
+
// '&[data-attribute="something"]:hover': {
|
|
247
|
+
// backgroundColor: 'yellow',
|
|
248
|
+
// },
|
|
249
|
+
// },
|
|
250
|
+
// '&[data-attribute="something"]:hover': {
|
|
251
|
+
// backgroundColor: 'yellow',
|
|
252
|
+
// },
|
|
253
|
+
// '&[data-attribute="something"]': {
|
|
254
|
+
// width : 320px
|
|
255
|
+
// }
|
|
256
|
+
// }}
|
|
257
|
+
|
|
258
|
+
// We need to make sure we append the customCSSSelector to the original class selector. i.e & - > &[data-attribute="Icon"][data-size="small"]
|
|
259
|
+
*/
|
|
260
|
+
function generateCustomSxProp(props, providedSx) {
|
|
261
|
+
// Possible data attributes: data-size, data-block, data-no-visuals
|
|
262
|
+
const size = `[data-size="${props.size}"]`;
|
|
263
|
+
const block = props.block ? `[data-block="block"]` : '';
|
|
264
|
+
const noVisuals = props.leadingVisual || props.trailingVisual || props.trailingAction ? '' : '[data-no-visuals]';
|
|
265
|
+
|
|
266
|
+
// this is a custom selector. We need to make sure we add the data attributes to the base css class (& -> &[data-attributename="value"]])
|
|
267
|
+
const cssSelector = `&${size}${block}${noVisuals}`; // &[data-size="small"][data-block="block"][data-no-visuals]
|
|
268
|
+
|
|
269
|
+
const customSxProp = {};
|
|
270
|
+
if (!providedSx) return customSxProp;else {
|
|
271
|
+
customSxProp[cssSelector] = providedSx;
|
|
272
|
+
return customSxProp;
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
ButtonComponent.displayName = 'Button';
|
|
276
|
+
|
|
77
277
|
const Checkbox = /*#__PURE__*/forwardRef(function Checkbox(props, ref) {
|
|
78
278
|
return /*#__PURE__*/jsx(Box, {
|
|
79
279
|
as: Checkbox$1,
|
|
@@ -190,6 +390,38 @@ const Heading = styled(Heading$1).withConfig({
|
|
|
190
390
|
componentId: "sc-1vc165i-0"
|
|
191
391
|
})(["", ""], sx);
|
|
192
392
|
|
|
393
|
+
const StyledIconButton = /*#__PURE__*/forwardRef(({
|
|
394
|
+
sx,
|
|
395
|
+
...rest
|
|
396
|
+
}, ref) => {
|
|
397
|
+
let sxStyles = sx;
|
|
398
|
+
// grap the button props that have associated data attributes in the styles
|
|
399
|
+
const {
|
|
400
|
+
size = 'medium'
|
|
401
|
+
} = rest;
|
|
402
|
+
if (sx !== null && sx !== undefined && Object.keys(sx).length > 0) {
|
|
403
|
+
sxStyles = generateCustomSxProp({
|
|
404
|
+
size
|
|
405
|
+
}, sx);
|
|
406
|
+
}
|
|
407
|
+
return /*#__PURE__*/jsx(Box, {
|
|
408
|
+
sx: sxStyles,
|
|
409
|
+
as: IconButton$1,
|
|
410
|
+
ref: ref,
|
|
411
|
+
...rest
|
|
412
|
+
});
|
|
413
|
+
});
|
|
414
|
+
const IconButton = /*#__PURE__*/forwardRef(({
|
|
415
|
+
as,
|
|
416
|
+
...props
|
|
417
|
+
}, ref) => /*#__PURE__*/jsx(StyledIconButton, {
|
|
418
|
+
...props,
|
|
419
|
+
...(as ? {
|
|
420
|
+
forwardedAs: as
|
|
421
|
+
} : {}),
|
|
422
|
+
ref: ref
|
|
423
|
+
}));
|
|
424
|
+
|
|
193
425
|
const StyledLabel = /*#__PURE__*/forwardRef(function Label(props, ref) {
|
|
194
426
|
return /*#__PURE__*/jsx(Box, {
|
|
195
427
|
as: Label$1,
|
|
@@ -259,18 +491,31 @@ const NavListGroup = /*#__PURE__*/forwardRef(function NavListGroup(props, ref) {
|
|
|
259
491
|
...props
|
|
260
492
|
});
|
|
261
493
|
});
|
|
494
|
+
const NavListGroupHeading = /*#__PURE__*/forwardRef(function NavListGroupHeading(props, ref) {
|
|
495
|
+
// @ts-expect-error - PrimerNavList.GroupHeading is not recognized as a valid component type
|
|
496
|
+
return /*#__PURE__*/jsx(Box, {
|
|
497
|
+
as: NavList$1.GroupHeading,
|
|
498
|
+
ref: ref,
|
|
499
|
+
...props
|
|
500
|
+
});
|
|
501
|
+
});
|
|
502
|
+
const NavListLeadingVisual = /*#__PURE__*/forwardRef(function NavListLeadingVisual(props, ref) {
|
|
503
|
+
// @ts-expect-error - PrimerNavList.LeadingVisual is not recognized as a valid component type
|
|
504
|
+
return /*#__PURE__*/jsx(Box, {
|
|
505
|
+
as: NavList$1.LeadingVisual,
|
|
506
|
+
ref: ref,
|
|
507
|
+
...props
|
|
508
|
+
});
|
|
509
|
+
});
|
|
262
510
|
const NavList = Object.assign(NavListImpl, {
|
|
263
|
-
// Wrapped components that need sx support added back in
|
|
264
511
|
Item: NavListItem,
|
|
265
512
|
Group: NavListGroup,
|
|
266
|
-
|
|
267
|
-
|
|
513
|
+
GroupHeading: NavListGroupHeading,
|
|
514
|
+
LeadingVisual: NavListLeadingVisual,
|
|
268
515
|
SubNav: NavList$1.SubNav,
|
|
269
516
|
Divider: NavList$1.Divider,
|
|
270
|
-
LeadingVisual: NavList$1.LeadingVisual,
|
|
271
517
|
TrailingVisual: NavList$1.TrailingVisual,
|
|
272
518
|
TrailingAction: NavList$1.TrailingAction,
|
|
273
|
-
GroupHeading: NavList$1.GroupHeading,
|
|
274
519
|
GroupExpand: NavList$1.GroupExpand
|
|
275
520
|
});
|
|
276
521
|
|
|
@@ -398,6 +643,38 @@ const Text = /*#__PURE__*/forwardRef(({
|
|
|
398
643
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
399
644
|
});
|
|
400
645
|
|
|
646
|
+
const StyledTextInput = /*#__PURE__*/forwardRef((props, ref) => {
|
|
647
|
+
return /*#__PURE__*/jsx(Box, {
|
|
648
|
+
as: TextInput$1,
|
|
649
|
+
ref: ref,
|
|
650
|
+
...props
|
|
651
|
+
});
|
|
652
|
+
});
|
|
653
|
+
const TextInputImpl = /*#__PURE__*/forwardRef(({
|
|
654
|
+
as,
|
|
655
|
+
...props
|
|
656
|
+
}, ref) => {
|
|
657
|
+
return /*#__PURE__*/jsx(StyledTextInput, {
|
|
658
|
+
ref: ref,
|
|
659
|
+
...props,
|
|
660
|
+
...(as ? {
|
|
661
|
+
forwardedAs: as
|
|
662
|
+
} : {})
|
|
663
|
+
});
|
|
664
|
+
});
|
|
665
|
+
const TextInputAction = /*#__PURE__*/forwardRef((props, ref) => {
|
|
666
|
+
return /*#__PURE__*/jsx(Box, {
|
|
667
|
+
as: TextInput$1.Action,
|
|
668
|
+
ref: ref,
|
|
669
|
+
...props
|
|
670
|
+
});
|
|
671
|
+
});
|
|
672
|
+
const TextInput = Object.assign(TextInputImpl, {
|
|
673
|
+
Action: TextInputAction
|
|
674
|
+
});
|
|
675
|
+
TextInputAction.displayName = 'TextInputAction';
|
|
676
|
+
TextInputImpl.displayName = 'TextInput';
|
|
677
|
+
|
|
401
678
|
const TimelineImpl = /*#__PURE__*/forwardRef(function Timeline(props, ref) {
|
|
402
679
|
return /*#__PURE__*/jsx(Box, {
|
|
403
680
|
as: Timeline$1,
|
|
@@ -521,4 +798,4 @@ const UnderlineNav = Object.assign(UnderlineNavImpl, {
|
|
|
521
798
|
Item: UnderlineNavItem
|
|
522
799
|
});
|
|
523
800
|
|
|
524
|
-
export { ActionMenu, Autocomplete, Avatar, Breadcrumb, Breadcrumbs, Checkbox, CheckboxGroup, CircleBadge, CounterLabel, Flash, Header, Heading, Label, Link, LinkButton, NavList, Overlay, RadioGroup, RelativeTime, SegmentedControl, Spinner, StateLabel, SubNav, Text, Timeline, ToggleSwitch, Token, Truncate, UnderlineNav };
|
|
801
|
+
export { ActionList, ActionMenu, Autocomplete, Avatar, Breadcrumb, Breadcrumbs, ButtonComponent as Button, Checkbox, CheckboxGroup, CircleBadge, CounterLabel, Flash, Header, Heading, IconButton, Label, Link, LinkButton, NavList, Overlay, RadioGroup, RelativeTime, SegmentedControl, Spinner, StateLabel, SubNav, Text, TextInput, Timeline, ToggleSwitch, Token, Truncate, UnderlineNav };
|
package/dist/sx.d.ts
CHANGED
package/dist/sx.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sx.d.ts","sourceRoot":"","sources":["../src/sx.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,EAAE,EAAE,KAAK,MAAM,EAAC,MAAM,eAAe,CAAA"}
|
|
1
|
+
{"version":3,"file":"sx.d.ts","sourceRoot":"","sources":["../src/sx.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,EAAE,EAAE,KAAK,MAAM,EAAC,MAAM,eAAe,CAAA;AAC7C,MAAM,MAAM,mBAAmB,GAAG;IAChC,CAAC,GAAG,EAAE,KAAK,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,CAAA;CACtC,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@primer/styled-react",
|
|
3
|
-
"version": "0.0.0-
|
|
3
|
+
"version": "0.0.0-20251006202420",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"@babel/preset-react": "^7.27.1",
|
|
32
32
|
"@babel/preset-typescript": "^7.27.1",
|
|
33
|
-
"@primer/react": "0.0.0-
|
|
33
|
+
"@primer/react": "0.0.0-20251006202420",
|
|
34
34
|
"@rollup/plugin-babel": "^6.0.4",
|
|
35
35
|
"@types/react": "18.3.11",
|
|
36
36
|
"@types/react-dom": "18.3.1",
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"typescript": "^5.9.2"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
|
-
"@primer/react": "0.0.0-
|
|
49
|
+
"@primer/react": "0.0.0-20251006202420",
|
|
50
50
|
"@types/react": "18.x || 19.x",
|
|
51
51
|
"@types/react-dom": "18.x || 19.x",
|
|
52
52
|
"@types/react-is": "18.x || 19.x",
|