@yakad/ui 1.2.73-beta → 1.2.74-beta

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.
@@ -5,6 +5,7 @@
5
5
  box-sizing: border-box;
6
6
  width: 100%;
7
7
  height: 5rem;
8
+ gap: 1rem;
8
9
  padding: 0 2rem;
9
10
  border-bottom: 0.1rem solid #7d7d7d40;
10
11
  background: rgb(var(--surfaceContainerColor, 243 237 247));
@@ -1,13 +1,12 @@
1
1
  import React from "react";
2
2
  interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
3
- loading?: boolean;
4
3
  size?: "small" | "medium" | "large";
5
4
  variant?: "text" | "outlined" | "filled" | "filledtonal" | "tonal" | "elevated" | "link" | "fab";
6
5
  borderStyle?: "none" | "semi" | "rounded";
7
6
  icon?: JSX.Element;
8
7
  iconPosition?: "start" | "end";
9
8
  loadingPosition?: "default" | "center";
10
- loadingVariant?: "scaleOut" | "dots" | "spinner";
9
+ loading?: false | "scaleOut" | "dots" | "spinner";
11
10
  disabled?: boolean;
12
11
  }
13
12
  declare function Button(props: ButtonProps): JSX.Element;
package/button/button.js CHANGED
@@ -1,25 +1,25 @@
1
1
  import React from "react";
2
2
  import { joinClassNames } from "@yakad/lib";
3
- import styles from "./button.module.css";
4
3
  import SvgIcon from "../svgIcon/svgIcon";
5
4
  import Loading from "../loading/loading";
6
- const svgSizeMaps = {
5
+ import styles from "./button.module.css";
6
+ const iconSizeMaps = {
7
7
  small: 2,
8
8
  medium: 2.4,
9
- large: 3,
9
+ large: 3.2,
10
10
  };
11
11
  function Button(props) {
12
- const startChildren = props.iconPosition === "end";
12
+ const startWithChildren = props.iconPosition === "end";
13
13
  const centerLoading = !props.icon || (props.loading && props.loadingPosition === "center");
14
- const joinedClassNames = joinClassNames(styles.button, props.loading ? styles.loading : "", props.variant ? styles[props.variant] : styles.text, props.loading && centerLoading ? styles.loadingPositionCenter : "", props.size ? styles[props.size] : styles.medium, props.borderStyle ? styles[props.borderStyle] : styles.rounded, props.icon && !props.children ? styles.iconButton : "", props.className);
14
+ const joinedClassNames = joinClassNames(styles.button, props.variant ? styles[props.variant] : styles.text, props.loading ? styles.loading : "", props.loading && centerLoading ? styles.loadingPositionCenter : "", props.size ? styles[props.size] : styles.medium, props.borderStyle ? styles[props.borderStyle] : styles.rounded, props.icon && !props.children ? styles.iconButton : "", props.className);
15
15
  return (React.createElement("button", { ...props, className: joinedClassNames },
16
- startChildren ? props.children : null,
16
+ startWithChildren ? props.children : null,
17
17
  props.loading ? (React.createElement("div", { className: joinClassNames(centerLoading ? styles.positionCenter : "", styles.displayOnDisabled) },
18
- React.createElement(Loading, { size: props.size, variant: props.loadingVariant }))) : null,
18
+ React.createElement(Loading, { size: props.size, variant: props.loading }))) : null,
19
19
  props.icon ? (React.createElement(SvgIcon, { className: styles.hideOnDisabled, size: props.size
20
- ? svgSizeMaps[props.size]
21
- : svgSizeMaps.medium }, props.icon)) : null,
22
- !startChildren ? props.children : null));
20
+ ? iconSizeMaps[props.size]
21
+ : iconSizeMaps.medium }, props.icon)) : null,
22
+ !startWithChildren ? props.children : null));
23
23
  }
24
24
  export default Button;
25
25
  //# sourceMappingURL=button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"button.js","sourceRoot":"","sources":["button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,MAAM,MAAM,qBAAqB,CAAC;AACzC,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,OAAO,MAAM,oBAAoB,CAAC;AA4BzC,MAAM,WAAW,GAAe;IAC5B,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,CAAC;CACX,CAAC;AAEF,SAAS,MAAM,CAAC,KAAkB;IAC9B,MAAM,aAAa,GAAG,KAAK,CAAC,YAAY,KAAK,KAAK,CAAC;IACnD,MAAM,aAAa,GACf,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,eAAe,KAAK,QAAQ,CAAC,CAAC;IAEzE,MAAM,gBAAgB,GAAG,cAAc,CACnC,MAAM,CAAC,MAAM,EACb,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EACnC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EACnD,KAAK,CAAC,OAAO,IAAI,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAClE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,EAC/C,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,EAC9D,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EACtD,KAAK,CAAC,SAAU,CACnB,CAAC;IAEF,OAAO,CACH,mCAAY,KAAK,EAAE,SAAS,EAAE,gBAAgB;QACzC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI;QACrC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CACb,6BACI,SAAS,EAAE,cAAc,CACrB,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAC1C,MAAM,CAAC,iBAAiB,CAC3B;YAED,oBAAC,OAAO,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,cAAc,GAAI,CAC1D,CACT,CAAC,CAAC,CAAC,IAAI;QACP,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CACV,oBAAC,OAAO,IACJ,SAAS,EAAE,MAAM,CAAC,cAAc,EAChC,IAAI,EACA,KAAK,CAAC,IAAI;gBACN,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC;gBACzB,CAAC,CAAC,WAAW,CAAC,MAAM,IAG3B,KAAK,CAAC,IAAI,CACL,CACb,CAAC,CAAC,CAAC,IAAI;QACP,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAClC,CACZ,CAAC;AACN,CAAC;AAED,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"button.js","sourceRoot":"","sources":["button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,MAAM,MAAM,qBAAqB,CAAC;AA2BzC,MAAM,YAAY,GAAgB;IAC9B,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;CACb,CAAC;AAEF,SAAS,MAAM,CAAC,KAAkB;IAC9B,MAAM,iBAAiB,GAAG,KAAK,CAAC,YAAY,KAAK,KAAK,CAAC;IACvD,MAAM,aAAa,GACf,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,eAAe,KAAK,QAAQ,CAAC,CAAC;IAEzE,MAAM,gBAAgB,GAAG,cAAc,CACnC,MAAM,CAAC,MAAM,EACb,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EACnD,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EACnC,KAAK,CAAC,OAAO,IAAI,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAClE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,EAC/C,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,EAC9D,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EACtD,KAAK,CAAC,SAAU,CACnB,CAAC;IAEF,OAAO,CACH,mCAAY,KAAK,EAAE,SAAS,EAAE,gBAAgB;QACzC,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI;QACzC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CACb,6BACI,SAAS,EAAE,cAAc,CACrB,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAC1C,MAAM,CAAC,iBAAiB,CAC3B;YAED,oBAAC,OAAO,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,GAAI,CACnD,CACT,CAAC,CAAC,CAAC,IAAI;QACP,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CACV,oBAAC,OAAO,IACJ,SAAS,EAAE,MAAM,CAAC,cAAc,EAChC,IAAI,EACA,KAAK,CAAC,IAAI;gBACN,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC;gBAC1B,CAAC,CAAC,YAAY,CAAC,MAAM,IAG5B,KAAK,CAAC,IAAI,CACL,CACb,CAAC,CAAC,CAAC,IAAI;QACP,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CACtC,CACZ,CAAC;AACN,CAAC;AAED,eAAe,MAAM,CAAC"}
package/button/button.tsx CHANGED
@@ -1,11 +1,10 @@
1
1
  import React from "react";
2
2
  import { joinClassNames } from "@yakad/lib";
3
- import styles from "./button.module.css";
4
3
  import SvgIcon from "../svgIcon/svgIcon";
5
4
  import Loading from "../loading/loading";
5
+ import styles from "./button.module.css";
6
6
 
7
7
  interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
8
- loading?: boolean;
9
8
  size?: "small" | "medium" | "large";
10
9
  variant?:
11
10
  | "text"
@@ -20,31 +19,31 @@ interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
20
19
  icon?: JSX.Element;
21
20
  iconPosition?: "start" | "end";
22
21
  loadingPosition?: "default" | "center";
23
- loadingVariant?: "scaleOut" | "dots" | "spinner";
22
+ loading?: false | "scaleOut" | "dots" | "spinner";
24
23
  disabled?: boolean;
25
24
  }
26
25
 
27
- interface svgSizeMap {
26
+ interface iconSizeMap {
28
27
  small: number;
29
28
  medium: number;
30
29
  large: number;
31
30
  }
32
31
 
33
- const svgSizeMaps: svgSizeMap = {
32
+ const iconSizeMaps: iconSizeMap = {
34
33
  small: 2,
35
34
  medium: 2.4,
36
- large: 3,
35
+ large: 3.2,
37
36
  };
38
37
 
39
38
  function Button(props: ButtonProps) {
40
- const startChildren = props.iconPosition === "end";
39
+ const startWithChildren = props.iconPosition === "end";
41
40
  const centerLoading =
42
41
  !props.icon || (props.loading && props.loadingPosition === "center");
43
42
 
44
43
  const joinedClassNames = joinClassNames(
45
44
  styles.button,
46
- props.loading ? styles.loading : "",
47
45
  props.variant ? styles[props.variant] : styles.text,
46
+ props.loading ? styles.loading : "",
48
47
  props.loading && centerLoading ? styles.loadingPositionCenter : "",
49
48
  props.size ? styles[props.size] : styles.medium,
50
49
  props.borderStyle ? styles[props.borderStyle] : styles.rounded,
@@ -54,7 +53,7 @@ function Button(props: ButtonProps) {
54
53
 
55
54
  return (
56
55
  <button {...props} className={joinedClassNames}>
57
- {startChildren ? props.children : null}
56
+ {startWithChildren ? props.children : null}
58
57
  {props.loading ? (
59
58
  <div
60
59
  className={joinClassNames(
@@ -62,7 +61,7 @@ function Button(props: ButtonProps) {
62
61
  styles.displayOnDisabled
63
62
  )}
64
63
  >
65
- <Loading size={props.size} variant={props.loadingVariant} />
64
+ <Loading size={props.size} variant={props.loading} />
66
65
  </div>
67
66
  ) : null}
68
67
  {props.icon ? (
@@ -70,14 +69,14 @@ function Button(props: ButtonProps) {
70
69
  className={styles.hideOnDisabled}
71
70
  size={
72
71
  props.size
73
- ? svgSizeMaps[props.size]
74
- : svgSizeMaps.medium
72
+ ? iconSizeMaps[props.size]
73
+ : iconSizeMaps.medium
75
74
  }
76
75
  >
77
76
  {props.icon}
78
77
  </SvgIcon>
79
78
  ) : null}
80
- {!startChildren ? props.children : null}
79
+ {!startWithChildren ? props.children : null}
81
80
  </button>
82
81
  );
83
82
  }
@@ -0,0 +1 @@
1
+ declare module "*.module.css";
@@ -6,7 +6,7 @@ interface InputFieldProps extends React.HTMLAttributes<HTMLInputElement> {
6
6
  disabled?: boolean;
7
7
  name?: string;
8
8
  value?: string;
9
- required?: string;
9
+ required?: boolean;
10
10
  }
11
11
  declare function InputField(props: InputFieldProps): JSX.Element;
12
12
  export default InputField;
@@ -1 +1 @@
1
- {"version":3,"file":"inputField.js","sourceRoot":"","sources":["inputField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAY7C,SAAS,UAAU,CAAC,KAAsB;IACtC,MAAM,gBAAgB,GAAG,cAAc,CACnC,MAAM,CAAC,KAAK,EACZ,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,EACvD,KAAK,CAAC,SAAU,CACnB,CAAC;IAEF,OAAO,CACJ,+BAAO,SAAS,EAAE,MAAM,CAAC,KAAK;QAC/B,kCACM,KAAK,EACT,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,WAAW,EAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,SAAS,EAAE,gBAAgB,GAC3B;QACF,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,KAAK,CAAC,WAAW,CAAQ,CAClD,CACP,CAAC;AACN,CAAC;AAED,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"inputField.js","sourceRoot":"","sources":["inputField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAY7C,SAAS,UAAU,CAAC,KAAsB;IACtC,MAAM,gBAAgB,GAAG,cAAc,CACnC,MAAM,CAAC,KAAK,EACZ,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,EACvD,KAAK,CAAC,SAAU,CACnB,CAAC;IAEF,OAAO,CACH,+BAAO,SAAS,EAAE,MAAM,CAAC,KAAK;QAC1B,kCACQ,KAAK,EACT,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,WAAW,EAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,SAAS,EAAE,gBAAgB,GAC7B;QACF,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,KAAK,CAAC,WAAW,CAAQ,CACpD,CACX,CAAC;AACN,CAAC;AAED,eAAe,UAAU,CAAC"}
@@ -9,7 +9,7 @@ interface InputFieldProps extends React.HTMLAttributes<HTMLInputElement> {
9
9
  disabled?: boolean;
10
10
  name?: string;
11
11
  value?: string;
12
- required?: string;
12
+ required?: boolean;
13
13
  }
14
14
 
15
15
  function InputField(props: InputFieldProps) {
@@ -20,18 +20,18 @@ function InputField(props: InputFieldProps) {
20
20
  );
21
21
 
22
22
  return (
23
- <label className={styles.label}>
24
- <input
25
- {...props}
26
- name={props.name}
27
- disabled={props.disabled}
28
- placeholder=" "
29
- type={props.type}
30
- value={props.value}
31
- className={joinedClassNames}
32
- />
33
- <span className={styles.span}>{props.placeholder}</span>
34
- </label>
23
+ <label className={styles.label}>
24
+ <input
25
+ {...props}
26
+ name={props.name}
27
+ disabled={props.disabled}
28
+ placeholder=" "
29
+ type={props.type}
30
+ value={props.value}
31
+ className={joinedClassNames}
32
+ />
33
+ <span className={styles.span}>{props.placeholder}</span>
34
+ </label>
35
35
  );
36
36
  }
37
37
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yakad/ui",
3
- "version": "1.2.73-beta",
3
+ "version": "1.2.74-beta",
4
4
  "description": "",
5
5
  "main": "./src/index.js",
6
6
  "scripts": {