@conduction/components 2.0.0 → 2.0.3

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.
Files changed (9) hide show
  1. package/README.md +3 -0
  2. package/lib/components/container/Container.module.css +2 -2
  3. package/lib/components/formFields/select/select.d.ts +1 -0
  4. package/lib/components/formFields/select/select.js +2 -2
  5. package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.js +1 -1
  6. package/package.json +1 -1
  7. package/src/components/container/Container.module.css +2 -2
  8. package/src/components/formFields/select/select.tsx +6 -1
  9. package/src/components/topNav/secondaryTopNav/SecondaryTopNav.tsx +1 -1
package/README.md CHANGED
@@ -4,6 +4,9 @@
4
4
 
5
5
  - **Version 2**
6
6
 
7
+ - 2.0.3: Bugfix: --conduction-container typo removed;
8
+ - 2.0.2: Refactor SelectSingle formField with optional props;
9
+ - 2.0.1: Refactor SecondaryTopNav css module import;
7
10
  - 2.0.0: components are now dependent on `--skeleton` design tokens, currently found [here](https://github.com/OpenCatalogi/web-app/blob/development/pwa/src/styling/design-tokens/skeleton-design-tokens.css).
8
11
 
9
12
  - **Version 1**
package/lib/components/container/Container.module.css CHANGED
@@ -1,9 +1,9 @@
1
1
  :root {
2
- --condution-container-max-width: 1024px;
2
+ --conduction-container-max-width: 1024px;
3
3
  }
4
4
 
5
5
  .container {
6
6
  width: 100%;
7
7
  margin-inline: auto;
8
- max-width: var(--condution-container-max-width);
8
+ max-width: var(--conduction-container-max-width);
9
9
  }
package/lib/components/formFields/select/select.d.ts CHANGED
@@ -10,6 +10,7 @@ interface ISelectProps {
10
10
  name: string;
11
11
  defaultValue?: any;
12
12
  disabled?: boolean;
13
+ isClearable?: boolean;
13
14
  }
14
15
  export declare const SelectMultiple: React.FC<ISelectProps & IReactHookFormProps>;
15
16
  export declare const SelectSingle: React.FC<ISelectProps & IReactHookFormProps>;
package/lib/components/formFields/select/select.js CHANGED
@@ -7,8 +7,8 @@ export const SelectMultiple = ({ name, options, errors, control, validation, def
7
7
  return (_jsx(ReactSelect, { className: styles.select, isMulti: true, isDisabled: disabled, ...{ options, value, onChange, errors, defaultValue } }));
8
8
  } }));
9
9
  };
10
- export const SelectSingle = ({ name, options, errors, control, validation, }) => {
10
+ export const SelectSingle = ({ name, options, errors, control, validation, isClearable, defaultValue, }) => {
11
11
  return (_jsx(Controller, { ...{ control, name }, rules: validation, render: ({ field: { onChange, value } }) => {
12
- return _jsx(ReactSelect, { className: styles.select, ...{ options, onChange, value, errors }, isClearable: true });
12
+ return (_jsx(ReactSelect, { className: styles.select, ...{ options, onChange, value, errors, isClearable, defaultValue } }));
13
13
  } }));
14
14
  };
package/lib/components/topNav/secondaryTopNav/SecondaryTopNav.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import * as styles from "./SecondaryTopnav.module.css";
2
+ import * as styles from "./SecondaryTopNav.module.css";
3
3
  import { Link } from "@gemeente-denhaag/components-react";
4
4
  import clsx from "clsx";
5
5
  export const SecondaryTopNav = ({ items, layoutClassName }) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@conduction/components",
3
- "version": "2.0.0",
3
+ "version": "2.0.3",
4
4
  "description": "React (Gatsby) components used within the Conduction Skeleton Application (and its implementations)",
5
5
  "main": "lib/index.js",
6
6
  "scripts": {
package/src/components/container/Container.module.css CHANGED
@@ -1,9 +1,9 @@
1
1
  :root {
2
- --condution-container-max-width: 1024px;
2
+ --conduction-container-max-width: 1024px;
3
3
  }
4
4
 
5
5
  .container {
6
6
  width: 100%;
7
7
  margin-inline: auto;
8
- max-width: var(--condution-container-max-width);
8
+ max-width: var(--conduction-container-max-width);
9
9
  }
package/src/components/formFields/select/select.tsx CHANGED
@@ -10,6 +10,7 @@ interface ISelectProps {
10
10
  name: string;
11
11
  defaultValue?: any;
12
12
  disabled?: boolean;
13
+ isClearable?: boolean;
13
14
  }
14
15
 
15
16
  export const SelectMultiple: React.FC<ISelectProps & IReactHookFormProps> = ({
@@ -45,13 +46,17 @@ export const SelectSingle: React.FC<ISelectProps & IReactHookFormProps> = ({
45
46
  errors,
46
47
  control,
47
48
  validation,
49
+ isClearable,
50
+ defaultValue,
48
51
  }) => {
49
52
  return (
50
53
  <Controller
51
54
  {...{ control, name }}
52
55
  rules={validation}
53
56
  render={({ field: { onChange, value } }) => {
54
- return <ReactSelect className={styles.select} {...{ options, onChange, value, errors }} isClearable />;
57
+ return (
58
+ <ReactSelect className={styles.select} {...{ options, onChange, value, errors, isClearable, defaultValue }} />
59
+ );
55
60
  }}
56
61
  />
57
62
  );
package/src/components/topNav/secondaryTopNav/SecondaryTopNav.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- import * as styles from "./SecondaryTopnav.module.css";
2
+ import * as styles from "./SecondaryTopNav.module.css";
3
3
  import { Link } from "@gemeente-denhaag/components-react";
4
4
  import clsx from "clsx";
5
5