@remember-web/primitive 0.1.0 → 0.1.2
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/primitive/src/Avatars/Avatar/Avatar.stories.d.ts +1 -1
- package/dist/primitive/src/Avatars/Avatar/index.d.ts +1 -1
- package/dist/primitive/src/Badge/Badge.d.ts +1 -1
- package/dist/primitive/src/Badge/Badge.stories.d.ts +1 -1
- package/dist/primitive/src/Badge/types.d.ts +1 -1
- package/dist/primitive/src/Badge/utils.d.ts +1 -1
- package/dist/primitive/src/Buttons/Button/Button.stories.d.ts +3 -3
- package/dist/primitive/src/Common/Spinner/Spinner.stories.d.ts +1 -1
- package/dist/primitive/src/Control/Checkbox.stories.d.ts +1 -1
- package/dist/primitive/src/Control/Radio.stories.d.ts +1 -1
- package/dist/primitive/src/Control/Toggle.stories.d.ts +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/DropdownMenu.stories.d.ts +3 -3
- package/dist/primitive/src/Floating/DropdownMenu/DropdownMenu.stories.d.ts.map +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/DropdownMenuSection.cjs.js.map +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/DropdownMenuSection.d.ts +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/DropdownMenuSection.d.ts.map +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/DropdownMenuSection.esm.js.map +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/index.d.ts +2 -2
- package/dist/primitive/src/Floating/DropdownMenu/styles.cjs.js.map +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/styles.d.ts.map +1 -1
- package/dist/primitive/src/Floating/DropdownMenu/styles.esm.js.map +1 -1
- package/dist/primitive/src/Floating/Popover/Popover.stories.d.ts +2 -2
- package/dist/primitive/src/Inputs/Select/NativeSelect/index.d.ts +1 -1
- package/dist/primitive/src/Inputs/TextInput/TextInput.stories.d.ts +4 -4
- package/dist/primitive/src/Logos/RememberLogo/RememberLogo.stories.d.ts +1 -1
- package/dist/primitive/src/Logos/RememberMobileLogo/RememberMobileLogo.stories.d.ts +1 -1
- package/dist/primitive/src/Logos/RememberServiceLogo/index.d.ts +1 -1
- package/dist/primitive/src/Logos/RememberSquareLogo/RememberSquareLogo.stories.d.ts +1 -1
- package/package.json +3 -3
- package/src/Floating/DropdownMenu/DropdownMenu.stories.tsx +1 -0
- package/src/Floating/DropdownMenu/DropdownMenuSection.tsx +1 -1
- package/src/Floating/DropdownMenu/styles.tsx +9 -4
|
@@ -4,7 +4,7 @@ import Avatar from '.';
|
|
|
4
4
|
type Story = StoryObj<typeof Avatar>;
|
|
5
5
|
declare const meta: {
|
|
6
6
|
title: string;
|
|
7
|
-
component: import("react").ForwardRefExoticComponent<Partial<import("@remember-web/shared/types").ConvertTransientProps<import("
|
|
7
|
+
component: import("react").ForwardRefExoticComponent<Partial<import("@remember-web/shared/types").ConvertTransientProps<import("../../Avatars/Avatar/styles").StyledAvatarProps>> & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
8
8
|
argTypes: {
|
|
9
9
|
rounded: {
|
|
10
10
|
options: boolean[];
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ComponentPropsWithoutRef } from 'react';
|
|
2
2
|
import type { ConvertTransientProps } from '@remember-web/shared/types/styles';
|
|
3
|
-
import type { StyledAvatarProps } from '
|
|
3
|
+
import type { StyledAvatarProps } from '../../Avatars/Avatar/styles';
|
|
4
4
|
export type AvatarProps = Partial<ConvertTransientProps<StyledAvatarProps>> & ComponentPropsWithoutRef<'div'>;
|
|
5
5
|
declare const _default: import("react").ForwardRefExoticComponent<Partial<ConvertTransientProps<StyledAvatarProps>> & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
6
6
|
export default _default;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { BadgeValueProps } from '
|
|
1
|
+
import type { BadgeValueProps } from '../Badge/types';
|
|
2
2
|
export declare const getBadgeValue: (props: BadgeValueProps) => string;
|
|
3
3
|
export declare const badgePseudo: {
|
|
4
4
|
getBadgePseudoCss: (pseudo?: "after" | "before", { top, right }?: {
|
|
@@ -6,16 +6,16 @@ declare const meta: {
|
|
|
6
6
|
title: string;
|
|
7
7
|
component: <T extends import("react").ElementType = "button">(props: {
|
|
8
8
|
as?: T | null | undefined;
|
|
9
|
-
} & Omit<import("react").PropsWithoutRef<import("react").ComponentProps<T>>, "icon" | keyof import("
|
|
9
|
+
} & Omit<import("react").PropsWithoutRef<import("react").ComponentProps<T>>, "icon" | keyof import("../../Buttons/Button/types").ButtonStyleProps | "iconPosition"> & import("@remember-web/shared/types").ConvertTransientProps<Partial<import("../../Buttons/Button/types").ButtonStyleProps>> & {
|
|
10
10
|
icon?: import("react").ReactNode;
|
|
11
|
-
iconPosition?: "
|
|
11
|
+
iconPosition?: "left" | "right" | undefined;
|
|
12
12
|
} & {
|
|
13
13
|
ref?: import("react").ComponentPropsWithRef<T>["ref"] | undefined;
|
|
14
14
|
}) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
|
|
15
15
|
argTypes: {
|
|
16
16
|
icon: {
|
|
17
17
|
control: string;
|
|
18
|
-
options: ("none" | import("
|
|
18
|
+
options: ("none" | import("../../stories/util").IconWithSizeNameType)[];
|
|
19
19
|
};
|
|
20
20
|
color: {
|
|
21
21
|
control: string;
|
|
@@ -3,7 +3,7 @@ import { Spinner } from './index';
|
|
|
3
3
|
type Story = StoryObj<typeof Spinner>;
|
|
4
4
|
declare const meta: {
|
|
5
5
|
title: string;
|
|
6
|
-
component: ({ size, className, color, layout, }: import("
|
|
6
|
+
component: ({ size, className, color, layout, }: import("../../Common/Spinner/types").SpinnerProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
args: {};
|
|
8
8
|
};
|
|
9
9
|
export declare const Default: Story;
|
|
@@ -4,7 +4,7 @@ import { Checkbox } from './Checkbox';
|
|
|
4
4
|
type Story = StoryObj<typeof Checkbox>;
|
|
5
5
|
declare const meta: {
|
|
6
6
|
title: string;
|
|
7
|
-
component: import("react").ForwardRefExoticComponent<Omit<import("
|
|
7
|
+
component: import("react").ForwardRefExoticComponent<Omit<import("../Control/BaseToggle/types").BaseToggleProps, "type" | "variant"> & {
|
|
8
8
|
variant?: "checkbox" | "check" | undefined;
|
|
9
9
|
} & import("react").RefAttributes<HTMLInputElement>>;
|
|
10
10
|
argTypes: {
|
|
@@ -4,7 +4,7 @@ import { Radio } from './Radio';
|
|
|
4
4
|
type Story = StoryObj<typeof Radio>;
|
|
5
5
|
declare const meta: {
|
|
6
6
|
title: string;
|
|
7
|
-
component: import("react").ForwardRefExoticComponent<Omit<import("
|
|
7
|
+
component: import("react").ForwardRefExoticComponent<Omit<import("../Control/BaseToggle/types").BaseToggleProps, "type" | "onToggle" | "variant"> & import("react").RefAttributes<HTMLInputElement>>;
|
|
8
8
|
argTypes: {
|
|
9
9
|
inputClassName: {
|
|
10
10
|
table: {
|
|
@@ -4,7 +4,7 @@ import { Toggle } from './Toggle';
|
|
|
4
4
|
type Story = StoryObj<typeof Toggle>;
|
|
5
5
|
declare const meta: {
|
|
6
6
|
title: string;
|
|
7
|
-
component: import("react").ForwardRefExoticComponent<Omit<import("
|
|
7
|
+
component: import("react").ForwardRefExoticComponent<Omit<import("../Control/BaseToggle/types").BaseToggleProps, "type" | "variant"> & {
|
|
8
8
|
variant: "bookmark" | "favorite";
|
|
9
9
|
} & import("react").RefAttributes<HTMLInputElement>>;
|
|
10
10
|
argTypes: {
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { StoryObj } from '@storybook/react';
|
|
3
|
-
import DropdownMenu from '
|
|
3
|
+
import DropdownMenu from '../../Floating/DropdownMenu';
|
|
4
4
|
type Story = StoryObj<typeof DropdownMenu>;
|
|
5
5
|
declare const meta: {
|
|
6
6
|
title: string;
|
|
7
7
|
component: import("react").FC<import("@radix-ui/react-popover").PopoverProps> & {
|
|
8
|
-
Content: ({ isInsideCloseable, ...props }: import("
|
|
8
|
+
Content: ({ isInsideCloseable, ...props }: import("../../Floating/DropdownMenu").DropdownContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
9
|
Arrow: import("react").ForwardRefExoticComponent<import("@radix-ui/react-popover").PopoverArrowProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
10
10
|
Trigger: (props: import("@radix-ui/react-popover").PopoverTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
Portal: import("react").FC<import("@radix-ui/react-popover").PopoverPortalProps>;
|
|
@@ -16,7 +16,7 @@ declare const meta: {
|
|
|
16
16
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
17
17
|
Item: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
18
18
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
19
|
-
}>, import("@remember-web/shared/types").ConvertTransientProps<import("
|
|
19
|
+
}>, import("@remember-web/shared/types").ConvertTransientProps<import("../../Floating/DropdownMenu/styles").StyledDropdownMenuItemProps>>, import("../../Floating/DropdownMenu/styles").StyledDropdownMenuItemProps>>;
|
|
20
20
|
};
|
|
21
21
|
};
|
|
22
22
|
export declare const Default: Story;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.stories.d.ts","sourceRoot":"","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenu.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,YAAY,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenu.stories.d.ts","sourceRoot":"","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenu.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,YAAY,MAAM,yBAAyB,CAAC;AAInD,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAC;AAE3C,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;CAG2B,CAAC;AAEtC,eAAO,MAAM,OAAO,EAAE,KAwMrB,CAAC;AAEF,eAAe,IAAI,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuSection.cjs.js","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenuSection.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n StyledDropdownMenuSectionTitle,\n StyledDropdownMenuSection,\n} from '@/Floating/DropdownMenu/styles';\
|
|
1
|
+
{"version":3,"file":"DropdownMenuSection.cjs.js","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenuSection.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { GetStyledComponentProps } from '@remember-web/shared/types/styles';\n\nimport {\n StyledDropdownMenuSectionTitle,\n StyledDropdownMenuSection,\n} from '@/Floating/DropdownMenu/styles';\n\ntype DropdownMenuSectionProps<As> = GetStyledComponentProps<\n typeof StyledDropdownMenuSection,\n As\n> & {\n title?: ReactNode;\n};\n\nexport const DropdownMenuSection = <As,>({\n title,\n children,\n ...props\n}: DropdownMenuSectionProps<As>) => (\n <StyledDropdownMenuSection {...props}>\n {title && (\n <StyledDropdownMenuSectionTitle>{title}</StyledDropdownMenuSectionTitle>\n )}\n {children}\n </StyledDropdownMenuSection>\n);\n"],"names":["DropdownMenuSection","_ref","title","children","props","_objectWithoutProperties","_excluded","_jsxs","StyledDropdownMenuSection","_objectSpread","_jsx","StyledDropdownMenuSectionTitle"],"mappings":";;;;;;;;;;;;;;;IAeaA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAC9BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;AACLC,IAAAA,KAAK,GAAAC,yCAAA,CAAAJ,IAAA,EAAAK,SAAA,CAAA,CAAA;EAAA,oBAERC,eAAA,CAACC,gCAAyB,EAAAC,aAAA,CAAAA,aAAA,KAAKL,KAAK,CAAA,EAAA,EAAA,EAAA;AAAAD,IAAAA,QAAA,EACjCD,CAAAA,KAAK,iBACJQ,cAAA,CAACC,qCAA8B,EAAA;AAAAR,MAAAA,QAAA,EAAED,KAAAA;KAAsC,CACxE,EACAC,QAAQ,CAAA;AAAA,GAAA,CACgB,CAAC,CAAA;AAAA;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
|
-
import { StyledDropdownMenuSection } from '@/Floating/DropdownMenu/styles';
|
|
3
2
|
import type { GetStyledComponentProps } from '@remember-web/shared/types/styles';
|
|
3
|
+
import { StyledDropdownMenuSection } from '../../Floating/DropdownMenu/styles';
|
|
4
4
|
type DropdownMenuSectionProps<As> = GetStyledComponentProps<typeof StyledDropdownMenuSection, As> & {
|
|
5
5
|
title?: ReactNode;
|
|
6
6
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuSection.d.ts","sourceRoot":"","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenuSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenuSection.d.ts","sourceRoot":"","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenuSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,mCAAmC,CAAC;AAEjF,OAAO,EAEL,yBAAyB,EAC1B,MAAM,gCAAgC,CAAC;AAExC,KAAK,wBAAwB,CAAC,EAAE,IAAI,uBAAuB,CACzD,OAAO,yBAAyB,EAChC,EAAE,CACH,GAAG;IACF,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,mBAAmB,sCAI7B,yBAAyB,EAAE,CAAC,4CAO9B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuSection.esm.js","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenuSection.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport {\n StyledDropdownMenuSectionTitle,\n StyledDropdownMenuSection,\n} from '@/Floating/DropdownMenu/styles';\
|
|
1
|
+
{"version":3,"file":"DropdownMenuSection.esm.js","sources":["../../../../../src/Floating/DropdownMenu/DropdownMenuSection.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { GetStyledComponentProps } from '@remember-web/shared/types/styles';\n\nimport {\n StyledDropdownMenuSectionTitle,\n StyledDropdownMenuSection,\n} from '@/Floating/DropdownMenu/styles';\n\ntype DropdownMenuSectionProps<As> = GetStyledComponentProps<\n typeof StyledDropdownMenuSection,\n As\n> & {\n title?: ReactNode;\n};\n\nexport const DropdownMenuSection = <As,>({\n title,\n children,\n ...props\n}: DropdownMenuSectionProps<As>) => (\n <StyledDropdownMenuSection {...props}>\n {title && (\n <StyledDropdownMenuSectionTitle>{title}</StyledDropdownMenuSectionTitle>\n )}\n {children}\n </StyledDropdownMenuSection>\n);\n"],"names":["DropdownMenuSection","_ref","title","children","props","_objectWithoutProperties","_excluded","_jsxs","StyledDropdownMenuSection","_objectSpread","_jsx","StyledDropdownMenuSectionTitle"],"mappings":";;;;;;;;IAeaA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAC9BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;AACLC,IAAAA,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA,CAAA,CAAA;EAAA,oBAERC,IAAA,CAACC,yBAAyB,EAAAC,aAAA,CAAAA,aAAA,KAAKL,KAAK,CAAA,EAAA,EAAA,EAAA;AAAAD,IAAAA,QAAA,EACjCD,CAAAA,KAAK,iBACJQ,GAAA,CAACC,8BAA8B,EAAA;AAAAR,MAAAA,QAAA,EAAED,KAAAA;KAAsC,CACxE,EACAC,QAAQ,CAAA;AAAA,GAAA,CACgB,CAAC,CAAA;AAAA;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import * as RadixPopover from '@radix-ui/react-popover';
|
|
3
|
-
import type { PopoverContentProps, PopoverProps } from '
|
|
3
|
+
import type { PopoverContentProps, PopoverProps } from '../../Floating/Popover';
|
|
4
4
|
export interface DropdownContentProps extends PopoverContentProps {
|
|
5
5
|
}
|
|
6
6
|
export interface DropdownMenuProps extends PopoverProps {
|
|
@@ -21,7 +21,7 @@ declare const DropdownMenu: import("react").FC<RadixPopover.PopoverProps> & {
|
|
|
21
21
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
22
22
|
Item: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
23
23
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
24
|
-
}>, import("@remember-web/shared/types").ConvertTransientProps<import("
|
|
24
|
+
}>, import("@remember-web/shared/types").ConvertTransientProps<import("../../Floating/DropdownMenu/styles").StyledDropdownMenuItemProps>>, import("../../Floating/DropdownMenu/styles").StyledDropdownMenuItemProps>>;
|
|
25
25
|
};
|
|
26
26
|
export default DropdownMenu;
|
|
27
27
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.cjs.js","sources":["../../../../../src/Floating/DropdownMenu/styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\
|
|
1
|
+
{"version":3,"file":"styles.cjs.js","sources":["../../../../../src/Floating/DropdownMenu/styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport {\n bg200,\n contents000,\n contents200,\n divider,\n getTypographyStyles,\n} from '@remember-web/mixin';\nimport type { ConvertTransientProps } from '@remember-web/shared/types/styles';\n\nimport { StyledPopoverContent } from '../Popover/styles';\n\nexport const dropdownMenuItemCSS = css`\n display: flex;\n align-items: center;\n padding: 8px 12px;\n\n ${getTypographyStyles('Body1')};\n color: ${contents000};\n transition: background-color 0.07s;\n border-radius: unset;\n text-decoration: none;\n`;\n\nexport const DropdownMenuItemHoverCSS = css`\n &:hover,\n &:focus-visible {\n background-color: ${bg200};\n }\n`;\n\nexport const DropdownMenuItemDisabledCSS = css`\n pointer-events: none;\n`;\n\nexport const StyledDropdownMenuSectionTitle = styled.span`\n ${dropdownMenuItemCSS};\n ${getTypographyStyles('Body2_M')};\n color: ${contents200};\n`;\n\nexport type DropdownMenuItemProps =\n ConvertTransientProps<StyledDropdownMenuItemProps>;\n\nexport type StyledDropdownMenuItemProps = {\n $active?: boolean;\n $disabled?: boolean;\n};\n\nexport const getDropdownMenuItemCss = ({\n $active,\n $disabled,\n}: StyledDropdownMenuItemProps) =>\n css(() => [\n dropdownMenuItemCSS,\n !$active && DropdownMenuItemHoverCSS,\n $disabled && DropdownMenuItemDisabledCSS,\n css`\n font-weight: ${$active ? 600 : 400};\n\n &:focus-visible {\n outline: none;\n }\n `,\n ]);\n\nexport const StyledDropdownMenuItem = styled.div.attrs<DropdownMenuItemProps>(\n ({ active, disabled, ...props }) => ({\n tabIndex: active ? -1 : undefined,\n $active: active,\n $disabled: disabled,\n ...props,\n })\n)<StyledDropdownMenuItemProps>(getDropdownMenuItemCss);\n\nexport const StyledDropdownMenuSection = styled.div``;\n\nexport const StyledDropdownMenuContent = styled(StyledPopoverContent)`\n ${StyledDropdownMenuSection} {\n border-bottom: 1px solid ${divider};\n }\n ${StyledDropdownMenuSection}:last-child {\n border-bottom: none;\n }\n`;\nStyledDropdownMenuItem.defaultProps = {};\n"],"names":["dropdownMenuItemCSS","css","_templateObject","_taggedTemplateLiteral","getTypographyStyles","contents000","DropdownMenuItemHoverCSS","_templateObject2","bg200","DropdownMenuItemDisabledCSS","_templateObject3","StyledDropdownMenuSectionTitle","styled","span","_templateObject4","contents200","getDropdownMenuItemCss","_ref","$active","$disabled","_templateObject5","StyledDropdownMenuItem","div","attrs","_ref2","active","disabled","props","_objectWithoutProperties","_excluded","_objectSpread","tabIndex","undefined","StyledDropdownMenuSection","_templateObject6","StyledDropdownMenuContent","StyledPopoverContent","_templateObject7","divider","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;IAYaA,mBAAmB,GAAGC,UAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,uCAAA,gMAKlCC,yBAAmB,CAAC,OAAO,CAAC,EACrBC,iBAAW,EAIrB;AAEYC,IAAAA,wBAAwB,GAAGL,UAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAAJ,uCAAA,CAGnBK,CAAAA,2DAAAA,EAAAA,UAAAA,CAAAA,CAAAA,CAAAA,EAAAA,WAAK,EAE5B;AAEM,IAAMC,2BAA2B,GAAGR,UAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAP,uCAAA,CAE7C,CAAA,6BAAA,CAAA,CAAA,CAAA,EAAA;AAEM,IAAMQ,8BAA8B,GAAGC,uBAAM,CAACC,IAAI,CAAAC,gBAAA,KAAAA,gBAAA,GAAAX,uCAAA,CAAA,CAAA,MAAA,EAAA,OAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA,EACrDH,mBAAmB,EACnBI,yBAAmB,CAAC,SAAS,CAAC,EACvBW,iBAAW,EACrB;IAUYC,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IACjCC,OAAO,GAAAD,IAAA,CAAPC,OAAO;IACPC,SAAS,GAAAF,IAAA,CAATE,SAAS,CAAA;AAAA,EAAA,OAETlB,UAAG,CAAC,YAAA;IAAA,OAAM,CACRD,mBAAmB,EACnB,CAACkB,OAAO,IAAIZ,wBAAwB,EACpCa,SAAS,IAAIV,2BAA2B,EACxCR,UAAG,CAAAmB,gBAAA,KAAAA,gBAAA,GAAAjB,uCAAA,CACce,CAAAA,uBAAAA,EAAAA,qEAAAA,CAAAA,CAAAA,CAAAA,EAAAA,OAAO,GAAG,GAAG,GAAG,GAAG,CAMrC,CAAA,CAAA;GAAC,CAAA,CAAA;AAAA,EAAA;AAEG,IAAMG,sBAAsB,GAAGT,uBAAM,CAACU,GAAG,CAACC,KAAK,CACpD,UAAAC,KAAA,EAAA;AAAA,EAAA,IAAGC,MAAM,GAAAD,KAAA,CAANC,MAAM;IAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,IAAAA,KAAK,GAAAC,yCAAA,CAAAJ,KAAA,EAAAK,SAAA,CAAA,CAAA;AAAA,EAAA,OAAAC,aAAA,CAAA;AAC3BC,IAAAA,QAAQ,EAAEN,MAAM,GAAG,CAAC,CAAC,GAAGO,SAAS;AACjCd,IAAAA,OAAO,EAAEO,MAAM;AACfN,IAAAA,SAAS,EAAEO,QAAAA;AAAQ,GAAA,EAChBC,KAAK,CAAA,CAAA;AAAA,CAEZ,CAAC,CAA8BX,sBAAsB,EAAC;AAEzCiB,IAAAA,yBAAyB,GAAGrB,uBAAM,CAACU,GAAG,CAAAY,gBAAA,KAAAA,gBAAA,GAAA/B,uCAAA,CAAE,CAAA,EAAA,CAAA,CAAA,CAAA,EAAA;IAExCgC,yBAAyB,GAAGvB,uBAAM,CAACwB,2BAAoB,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAlC,uCAAA,CACjE8B,CAAAA,MAAAA,EAAAA,mCAAAA,EAAAA,YAAAA,EAAAA,gDAAAA,CAAAA,CAAAA,CAAAA,EAAAA,yBAAyB,EACEK,aAAO,EAElCL,yBAAyB,EAG5B;AACDZ,sBAAsB,CAACkB,YAAY,GAAG,EAAE;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/Floating/DropdownMenu/styles.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/Floating/DropdownMenu/styles.tsx"],"names":[],"mappings":";AAQA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AAI/E,eAAO,MAAM,mBAAmB,6CAU/B,CAAC;AAEF,eAAO,MAAM,wBAAwB,6CAKpC,CAAC;AAEF,eAAO,MAAM,2BAA2B,6CAEvC,CAAC;AAEF,eAAO,MAAM,8BAA8B,kNAI1C,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAC/B,qBAAqB,CAAC,2BAA2B,CAAC,CAAC;AAErD,MAAM,MAAM,2BAA2B,GAAG;IACxC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,sBAAsB,4BAGhC,2BAA2B,gDAY1B,CAAC;AAEL,eAAO,MAAM,sBAAsB;;sFAOmB,CAAC;AAEvD,eAAO,MAAM,yBAAyB,gNAAe,CAAC;AAEtD,eAAO,MAAM,yBAAyB;;;;kQAOrC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.esm.js","sources":["../../../../../src/Floating/DropdownMenu/styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\
|
|
1
|
+
{"version":3,"file":"styles.esm.js","sources":["../../../../../src/Floating/DropdownMenu/styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport {\n bg200,\n contents000,\n contents200,\n divider,\n getTypographyStyles,\n} from '@remember-web/mixin';\nimport type { ConvertTransientProps } from '@remember-web/shared/types/styles';\n\nimport { StyledPopoverContent } from '../Popover/styles';\n\nexport const dropdownMenuItemCSS = css`\n display: flex;\n align-items: center;\n padding: 8px 12px;\n\n ${getTypographyStyles('Body1')};\n color: ${contents000};\n transition: background-color 0.07s;\n border-radius: unset;\n text-decoration: none;\n`;\n\nexport const DropdownMenuItemHoverCSS = css`\n &:hover,\n &:focus-visible {\n background-color: ${bg200};\n }\n`;\n\nexport const DropdownMenuItemDisabledCSS = css`\n pointer-events: none;\n`;\n\nexport const StyledDropdownMenuSectionTitle = styled.span`\n ${dropdownMenuItemCSS};\n ${getTypographyStyles('Body2_M')};\n color: ${contents200};\n`;\n\nexport type DropdownMenuItemProps =\n ConvertTransientProps<StyledDropdownMenuItemProps>;\n\nexport type StyledDropdownMenuItemProps = {\n $active?: boolean;\n $disabled?: boolean;\n};\n\nexport const getDropdownMenuItemCss = ({\n $active,\n $disabled,\n}: StyledDropdownMenuItemProps) =>\n css(() => [\n dropdownMenuItemCSS,\n !$active && DropdownMenuItemHoverCSS,\n $disabled && DropdownMenuItemDisabledCSS,\n css`\n font-weight: ${$active ? 600 : 400};\n\n &:focus-visible {\n outline: none;\n }\n `,\n ]);\n\nexport const StyledDropdownMenuItem = styled.div.attrs<DropdownMenuItemProps>(\n ({ active, disabled, ...props }) => ({\n tabIndex: active ? -1 : undefined,\n $active: active,\n $disabled: disabled,\n ...props,\n })\n)<StyledDropdownMenuItemProps>(getDropdownMenuItemCss);\n\nexport const StyledDropdownMenuSection = styled.div``;\n\nexport const StyledDropdownMenuContent = styled(StyledPopoverContent)`\n ${StyledDropdownMenuSection} {\n border-bottom: 1px solid ${divider};\n }\n ${StyledDropdownMenuSection}:last-child {\n border-bottom: none;\n }\n`;\nStyledDropdownMenuItem.defaultProps = {};\n"],"names":["dropdownMenuItemCSS","css","_templateObject","_taggedTemplateLiteral","getTypographyStyles","contents000","DropdownMenuItemHoverCSS","_templateObject2","bg200","DropdownMenuItemDisabledCSS","_templateObject3","StyledDropdownMenuSectionTitle","styled","span","_templateObject4","contents200","getDropdownMenuItemCss","_ref","$active","$disabled","_templateObject5","StyledDropdownMenuItem","div","attrs","_ref2","active","disabled","props","_objectWithoutProperties","_excluded","_objectSpread","tabIndex","undefined","StyledDropdownMenuSection","_templateObject6","StyledDropdownMenuContent","StyledPopoverContent","_templateObject7","divider","defaultProps"],"mappings":";;;;;;;;;;;IAYaA,mBAAmB,GAAGC,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,gMAKlCC,mBAAmB,CAAC,OAAO,CAAC,EACrBC,WAAW,EAIrB;AAEYC,IAAAA,wBAAwB,GAAGL,GAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAAJ,sBAAA,CAGnBK,CAAAA,2DAAAA,EAAAA,UAAAA,CAAAA,CAAAA,CAAAA,EAAAA,KAAK,EAE5B;AAEM,IAAMC,2BAA2B,GAAGR,GAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAP,sBAAA,CAE7C,CAAA,6BAAA,CAAA,CAAA,CAAA,EAAA;AAEM,IAAMQ,8BAA8B,GAAGC,MAAM,CAACC,IAAI,CAAAC,gBAAA,KAAAA,gBAAA,GAAAX,sBAAA,CAAA,CAAA,MAAA,EAAA,OAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA,EACrDH,mBAAmB,EACnBI,mBAAmB,CAAC,SAAS,CAAC,EACvBW,WAAW,EACrB;IAUYC,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IACjCC,OAAO,GAAAD,IAAA,CAAPC,OAAO;IACPC,SAAS,GAAAF,IAAA,CAATE,SAAS,CAAA;AAAA,EAAA,OAETlB,GAAG,CAAC,YAAA;IAAA,OAAM,CACRD,mBAAmB,EACnB,CAACkB,OAAO,IAAIZ,wBAAwB,EACpCa,SAAS,IAAIV,2BAA2B,EACxCR,GAAG,CAAAmB,gBAAA,KAAAA,gBAAA,GAAAjB,sBAAA,CACce,CAAAA,uBAAAA,EAAAA,qEAAAA,CAAAA,CAAAA,CAAAA,EAAAA,OAAO,GAAG,GAAG,GAAG,GAAG,CAMrC,CAAA,CAAA;GAAC,CAAA,CAAA;AAAA,EAAA;AAEG,IAAMG,sBAAsB,GAAGT,MAAM,CAACU,GAAG,CAACC,KAAK,CACpD,UAAAC,KAAA,EAAA;AAAA,EAAA,IAAGC,MAAM,GAAAD,KAAA,CAANC,MAAM;IAAEC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;AAAKC,IAAAA,KAAK,GAAAC,wBAAA,CAAAJ,KAAA,EAAAK,SAAA,CAAA,CAAA;AAAA,EAAA,OAAAC,aAAA,CAAA;AAC3BC,IAAAA,QAAQ,EAAEN,MAAM,GAAG,CAAC,CAAC,GAAGO,SAAS;AACjCd,IAAAA,OAAO,EAAEO,MAAM;AACfN,IAAAA,SAAS,EAAEO,QAAAA;AAAQ,GAAA,EAChBC,KAAK,CAAA,CAAA;AAAA,CAEZ,CAAC,CAA8BX,sBAAsB,EAAC;AAEzCiB,IAAAA,yBAAyB,GAAGrB,MAAM,CAACU,GAAG,CAAAY,gBAAA,KAAAA,gBAAA,GAAA/B,sBAAA,CAAE,CAAA,EAAA,CAAA,CAAA,CAAA,EAAA;IAExCgC,yBAAyB,GAAGvB,MAAM,CAACwB,oBAAoB,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAlC,sBAAA,CACjE8B,CAAAA,MAAAA,EAAAA,mCAAAA,EAAAA,YAAAA,EAAAA,gDAAAA,CAAAA,CAAAA,CAAAA,EAAAA,yBAAyB,EACEK,OAAO,EAElCL,yBAAyB,EAG5B;AACDZ,sBAAsB,CAACkB,YAAY,GAAG,EAAE;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { StoryObj } from '@storybook/react';
|
|
3
|
-
import Popover from '
|
|
3
|
+
import Popover from '../../Floating/Popover/index';
|
|
4
4
|
type Story = StoryObj<typeof Popover>;
|
|
5
5
|
declare const meta: {
|
|
6
6
|
title: string;
|
|
@@ -10,7 +10,7 @@ declare const meta: {
|
|
|
10
10
|
Portal: import("react").FC<import("@radix-ui/react-popover").PopoverPortalProps>;
|
|
11
11
|
Close: import("react").ForwardRefExoticComponent<import("@radix-ui/react-popover").PopoverCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
12
12
|
Arrow: import("react").ForwardRefExoticComponent<import("@radix-ui/react-popover").PopoverArrowProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
13
|
-
Content: ({ isInsideCloseable, ...props }: import("
|
|
13
|
+
Content: ({ isInsideCloseable, ...props }: import("../../Floating/Popover/index").PopoverContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
14
14
|
};
|
|
15
15
|
};
|
|
16
16
|
export declare const Default: Story;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
declare const _default: import("react").ForwardRefExoticComponent<Omit<import("react").SelectHTMLAttributes<HTMLSelectElement>, `aria-${string}` | "children"> & {
|
|
3
|
-
children: import("react").ReactElement<import("
|
|
3
|
+
children: import("react").ReactElement<import("../../../Inputs/Select/types").OptionProps<string>, <Value extends import("../../../Inputs/Select/types").SelectValue = string>({ children, disabled, value, }: import("../../../Inputs/Select/types").OptionProps<Value>) => import("react/jsx-runtime").JSX.Element> | import("react").ReactElement<import("../../../Inputs/Select/types").OptionProps<string>, <Value extends import("../../../Inputs/Select/types").SelectValue = string>({ children, disabled, value, }: import("../../../Inputs/Select/types").OptionProps<Value>) => import("react/jsx-runtime").JSX.Element>[];
|
|
4
4
|
width?: string | number | undefined;
|
|
5
5
|
placeholder?: string | undefined;
|
|
6
6
|
} & import("react").RefAttributes<HTMLSelectElement>>;
|
|
@@ -4,11 +4,11 @@ import TextInput from '.';
|
|
|
4
4
|
type Story = StoryObj<typeof TextInput>;
|
|
5
5
|
declare const meta: {
|
|
6
6
|
title: string;
|
|
7
|
-
component: import("react").ForwardRefExoticComponent<import("
|
|
7
|
+
component: import("react").ForwardRefExoticComponent<import("../../Inputs/TextInput/types").InputProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
8
8
|
argTypes: {
|
|
9
9
|
type: {
|
|
10
10
|
control: string;
|
|
11
|
-
options: ("number" | "
|
|
11
|
+
options: ("number" | "text" | "search" | "tel" | "url" | "email" | "date" | "datetime-local" | "password")[];
|
|
12
12
|
};
|
|
13
13
|
hasTogglePasswordVisibilityButton: {
|
|
14
14
|
type: "boolean";
|
|
@@ -36,11 +36,11 @@ declare const meta: {
|
|
|
36
36
|
};
|
|
37
37
|
leftElement: {
|
|
38
38
|
control: string;
|
|
39
|
-
options: ("none" | import("
|
|
39
|
+
options: ("none" | import("../../stories/util").IconWithSizeNameType)[];
|
|
40
40
|
};
|
|
41
41
|
rightElement: {
|
|
42
42
|
control: string;
|
|
43
|
-
options: ("none" | import("
|
|
43
|
+
options: ("none" | import("../../stories/util").IconWithSizeNameType)[];
|
|
44
44
|
};
|
|
45
45
|
label: {
|
|
46
46
|
type: "string";
|
|
@@ -3,7 +3,7 @@ import { RememberLogo } from './index';
|
|
|
3
3
|
type Story = StoryObj<typeof RememberLogo>;
|
|
4
4
|
declare const meta: {
|
|
5
5
|
title: string;
|
|
6
|
-
component: ({ className, color, height, env, customElement, ref, ...props }: import("
|
|
6
|
+
component: ({ className, color, height, env, customElement, ref, ...props }: import("../../Logos/types").RememberLogoProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
args: {
|
|
8
8
|
color: string;
|
|
9
9
|
height: number;
|
|
@@ -3,7 +3,7 @@ import { RememberMobileLogo } from '.';
|
|
|
3
3
|
type Story = StoryObj<typeof RememberMobileLogo>;
|
|
4
4
|
declare const meta: {
|
|
5
5
|
title: string;
|
|
6
|
-
component: ({ className, color, height, customElement, ref, ...props }: import("
|
|
6
|
+
component: ({ className, color, height, customElement, ref, ...props }: import("../../Logos/types").RememberLogoProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
args: {
|
|
8
8
|
color: string;
|
|
9
9
|
height: number;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { RememberLogoProps } from '
|
|
1
|
+
import type { RememberLogoProps } from '../../Logos/types';
|
|
2
2
|
import { GetStyledComponentProps } from '@remember-web/shared/types';
|
|
3
3
|
import { StyledServiceLogoRoot } from './style';
|
|
4
4
|
export type GnbNaviLogoProps<As> = GetStyledComponentProps<typeof StyledServiceLogoRoot, As> & {
|
|
@@ -3,7 +3,7 @@ import { RememberSquareLogo } from '.';
|
|
|
3
3
|
type Story = StoryObj<typeof RememberSquareLogo>;
|
|
4
4
|
declare const meta: {
|
|
5
5
|
title: string;
|
|
6
|
-
component: ({ className, backgroundColor, color, height, customElement, ref, ...props }: import("
|
|
6
|
+
component: ({ className, backgroundColor, color, height, customElement, ref, ...props }: import("../../Logos/types").RememberLogoProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
args: {
|
|
8
8
|
color: string;
|
|
9
9
|
height: number;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remember-web/primitive",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"description": "RUI Primitive Components",
|
|
5
5
|
"homepage": "https://dramancompany.github.io/rui/",
|
|
6
6
|
"author": "Remember",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"@radix-ui/react-switch": "^1",
|
|
44
44
|
"@radix-ui/react-tooltip": "^1.0.7",
|
|
45
45
|
"@remember-web/icon": "^0.1.2",
|
|
46
|
-
"@remember-web/mixin": "^0.1.
|
|
46
|
+
"@remember-web/mixin": "^0.1.8"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@babel/core": "^7.20.12",
|
|
@@ -89,7 +89,7 @@
|
|
|
89
89
|
},
|
|
90
90
|
"peerDependencies": {
|
|
91
91
|
"@remember-web/icon": "^0.1.1",
|
|
92
|
-
"@remember-web/mixin": "^0.1.
|
|
92
|
+
"@remember-web/mixin": "^0.1.8",
|
|
93
93
|
"react": "^18.2.0",
|
|
94
94
|
"react-dom": "^18.2.0",
|
|
95
95
|
"styled-components": ">=6"
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
|
+
import type { GetStyledComponentProps } from '@remember-web/shared/types/styles';
|
|
2
3
|
|
|
3
4
|
import {
|
|
4
5
|
StyledDropdownMenuSectionTitle,
|
|
5
6
|
StyledDropdownMenuSection,
|
|
6
7
|
} from '@/Floating/DropdownMenu/styles';
|
|
7
|
-
import type { GetStyledComponentProps } from '@remember-web/shared/types/styles';
|
|
8
8
|
|
|
9
9
|
type DropdownMenuSectionProps<As> = GetStyledComponentProps<
|
|
10
10
|
typeof StyledDropdownMenuSection,
|
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
import styled, { css } from 'styled-components';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
import {
|
|
3
|
+
bg200,
|
|
4
|
+
contents000,
|
|
5
|
+
contents200,
|
|
6
|
+
divider,
|
|
7
|
+
getTypographyStyles,
|
|
8
|
+
} from '@remember-web/mixin';
|
|
5
9
|
import type { ConvertTransientProps } from '@remember-web/shared/types/styles';
|
|
6
|
-
|
|
10
|
+
|
|
11
|
+
import { StyledPopoverContent } from '../Popover/styles';
|
|
7
12
|
|
|
8
13
|
export const dropdownMenuItemCSS = css`
|
|
9
14
|
display: flex;
|