@croquiscom/pds 0.22.0 → 0.23.0

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @croquiscom/pds
 
+## 0.23.0
+
+### Minor Changes
+
+- ddf084e: Input, Textarea, Dropdown 컴포넌트 스타일 변경
+- 5497c25: Button, IconButton variant 및 스타일 변경
+
+  ## BreakPoint
+
+  Button variant가 다음과 같이 변경되었습니다.
+
+  - variant => kind
+  - variant 제거
+    - brand
+    - negative
+    - outlined_primary
+    - outlined_black
+    - outlined_white
+    - outlined_negative
+    - dotted
+
+  IconButton variant가 다음과 같이 변경되었습니다.
+
+  - variant => kind
+
 ## 0.22.0
 
 ### Minor Changes

package/dist/button/Button.d.ts

@@ -1,19 +1,19 @@
 import React, { ButtonHTMLAttributes, ReactElement } from 'react';
-import { ButtonSize, ButtonVariant } from './types';
+import { ButtonSize, ButtonKind } from './types';
 import { IconProps } from '../icons/generated';
 export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'type'> {
     fill?: boolean;
     /** @default secondary */
-    variant?: ButtonVariant;
+    kind?: ButtonKind;
     /** @default medium */
     size?: ButtonSize;
     /** @default button */
     type?: ButtonHTMLAttributes<HTMLButtonElement>['type'];
     /** @default false */
     loading?: boolean;
-    /** 좌측 영역에 렌더링 될 아이콘 요소 */
+    /** @desc 좌측 영역에 렌더링 될 아이콘 요소 */
     startIcon?: ReactElement<IconProps>;
-    /** 우측 영역에 렌더링 될 아이콘 요소 */
+    /** @desc 우측 영역에 렌더링 될 아이콘 요소 */
     endIcon?: ReactElement<IconProps>;
 }
 export interface ButtonIconProps {

package/dist/button/Button.stories.d.ts

@@ -2,17 +2,11 @@ import React from 'react';
 import { ComponentMeta } from '@storybook/react';
 declare const _default: ComponentMeta<React.ForwardRefExoticComponent<import("./Button").ButtonProps & React.RefAttributes<HTMLButtonElement>>>;
 export default _default;
-export declare const Brand: any;
 export declare const Primary: any;
 export declare const Secondary: any;
 export declare const Black: any;
-export declare const Negative: any;
-export declare const OutlinedPrimary: any;
-export declare const OutlinedNegative: any;
-export declare const OutlinedBlack: any;
-export declare const OutlinedWhite: any;
-export declare const Dotted: any;
 export declare const StartIcon: any;
 export declare const EndIcon: any;
 export declare const Loading: any;
+export declare const FullWidth: any;
 export declare const Focus: () => JSX.Element;

package/dist/button/IconButton.d.ts

@@ -1,11 +1,16 @@
 import React, { ReactElement } from 'react';
-import { ButtonShape, IconButtonVariant } from './types';
+import { ButtonShape, IconButtonKind } from './types';
 import { ButtonProps } from './Button';
 import { IconProps } from '../icons/generated';
-export interface IconButtonProps extends Omit<ButtonProps, 'size' | 'loading' | 'startIcon' | 'endIcon'> {
-    /** @default secondary */
-    variant?: IconButtonVariant;
-    /** 렌더링 될 아이콘 요소 */
+export interface IconButtonProps extends Omit<ButtonProps, 'size' | 'loading' | 'startIcon' | 'endIcon' | 'kind'> {
+    /**
+     * @desc shape 'circle'의 경우 적용되지 않습니다.
+     * @default outlined_secondary
+     */
+    kind?: IconButtonKind;
+    /**
+     * @desc 렌더링 될 아이콘 요소
+     */
     icon?: ReactElement<IconProps>;
     /** @default rectangle */
     shape?: ButtonShape;

package/dist/button/IconButton.stories.d.ts

@@ -1,8 +1,6 @@
 import React from 'react';
-declare const _default: {
-    title: string;
-    component: React.ForwardRefExoticComponent<import("./IconButton").IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
-};
+import { ComponentMeta } from '@storybook/react';
+declare const _default: ComponentMeta<React.ForwardRefExoticComponent<import("./IconButton").IconButtonProps & React.RefAttributes<HTMLButtonElement>>>;
 export default _default;
 export declare const Rectangle: any;
 export declare const Circle: any;

package/dist/button/TextButton.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ButtonProps } from './Button';
 import { TextButtonKind, TextButtonSize } from './types';
-export interface TextButtonProps extends Omit<ButtonProps, 'loading' | 'variant'> {
+export interface TextButtonProps extends Omit<ButtonProps, 'loading' | 'kind'> {
     /** @default text */
     kind?: TextButtonKind;
     /** @default false */

package/dist/button/styles.d.ts

@@ -1,6 +1,6 @@
-import { ButtonSize, ButtonVariant, ButtonShape, TextButtonKind, TextButtonSize } from './types';
+import { ButtonSize, ButtonKind, ButtonShape, TextButtonKind, TextButtonSize, IconButtonKind } from './types';
 export declare const button_base_css: import("@emotion/utils").SerializedStyles;
-export declare const getButtonVariant: (variant?: ButtonVariant) => import("@emotion/utils").SerializedStyles;
+export declare const getButtonKind: (kind?: ButtonKind | IconButtonKind) => import("@emotion/utils").SerializedStyles;
 export declare const button_size_css: Record<ButtonSize, string>;
 export declare const button_icon_size_css: Record<ButtonSize, number>;
 export declare const text_button_icon_size_css: Record<TextButtonSize, number>;

package/dist/button/types.d.ts

@@ -1,6 +1,6 @@
-export declare type ButtonVariant = 'brand' | 'primary' | 'secondary' | 'black' | 'negative' | 'outlined_primary' | 'outlined_black' | 'outlined_white' | 'outlined_negative' | 'dotted';
+export declare type ButtonKind = 'primary' | 'secondary' | 'black';
 export declare type ButtonSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
 export declare type ButtonShape = 'rectangle' | 'circle';
-export declare type IconButtonVariant = 'secondary' | 'outlined_primary' | 'outlined_negative';
+export declare type IconButtonKind = 'outlined_secondary' | 'outlined_primary' | 'outlined_negative';
 export declare type TextButtonKind = 'text' | 'link';
 export declare type TextButtonSize = Exclude<ButtonSize, 'xsmall' | 'xlarge'>;

package/dist/dropdown/styles.d.ts

@@ -1,27 +1,20 @@
 export declare const dropdown_label_base_css: import("@emotion/utils").SerializedStyles;
-export declare const dropdown_label_expanded_style: {
-    border: string;
-    '&:hover': {
-        border: string;
-    };
-};
 export declare const dropdown_label_selected_style: {
     color: string;
 };
 export declare const dropdown_item_group_css: import("@emotion/utils").SerializedStyles;
 export declare const dropdown_item_base_css: import("@emotion/utils").SerializedStyles;
 export declare const dropdown_item_disabled_style: {
-    backgroundColor: string;
     color: string;
     cursor: string;
-};
-export declare const dropdown_item_selected_style: {
-    backgroundColor: string;
-    color: string;
     '&:hover, &:focus': {
         backgroundColor: string;
     };
 };
+export declare const dropdown_item_selected_style: {
+    color: string;
+    backgroundColor: string;
+};
 export declare const dropdown_item_focused_style: {
     backgroundColor: string;
 };