@ukic/canary-react 3.0.0-canary.15 → 3.0.0-canary.17
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/README.md +23 -1
- package/dist/core/core.css +14 -8
- package/package.json +8 -8
package/README.md
CHANGED
@@ -38,7 +38,7 @@ Add the following into the top level CSS file for your project.
|
|
38
38
|
|
39
39
|
In order to be rendered consistently across browsers and in line with modern standards, each of the ICDS components uses styles from a global CSS file based on [Normalize.css](https://necolas.github.io/normalize.css/).
|
40
40
|
|
41
|
-
If you would like to import these styles to apply them to the rest of your project and slotted elements used within any of the ICDS components, add the following into the top level CSS file as well.
|
41
|
+
If you would like to import these styles in order to apply them to the rest of your project and slotted elements used within any of the ICDS components, add the following into the top level CSS file as well.
|
42
42
|
|
43
43
|
```css
|
44
44
|
@import "@ukic/canary-react/dist/core/normalize.css";
|
@@ -58,6 +58,28 @@ The `@ukic/canary-react` package will need to be transformed before you can use
|
|
58
58
|
|
59
59
|
Add a `transformIgnorePatterns` field with the value `["/node_modules/(?!@ukic/canary-react)"]` to your Jest config.
|
60
60
|
|
61
|
+
## Typescript
|
62
|
+
|
63
|
+
If your project is making use of Typescript, you can import the custom types used in the ICDS component library. For details on the types implemented in each component, refer to the Props table on the Code page for each Component on the [Design System Guidance site](https://design.sis.gov.uk/components/select/code)
|
64
|
+
|
65
|
+
Types can be imported from the @ukic/canary-web-components package as per the below example.
|
66
|
+
|
67
|
+
> [!NOTE]
|
68
|
+
> You do not have to install this package into your project, it is already installed as a dependency of @ukic/canary-react.
|
69
|
+
|
70
|
+
```ts
|
71
|
+
import { IcPaginationBarOptions } from '@ukic/canary-web-components';
|
72
|
+
|
73
|
+
let paginationConfig: IcPaginationBarOptions = {
|
74
|
+
itemsPerPageOptions: [
|
75
|
+
{ label: "5", value: "5" },
|
76
|
+
{ label: "10", value: "10" },
|
77
|
+
],
|
78
|
+
showItemsPerPageControl: true,
|
79
|
+
selectedItemsPerPage: 5,
|
80
|
+
}
|
81
|
+
```
|
82
|
+
|
61
83
|
## Security
|
62
84
|
|
63
85
|
If you've found a vulnerability, we want to know so that we can fix it. [Our security policy](https://github.com/mi6/ic-ui-kit/blob/main/SECURITY.md) tells you how to do this.
|
package/dist/core/core.css
CHANGED
@@ -190,7 +190,7 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
190
190
|
);--ic-button-secondary-text:var(--ic-color-text-action-light);--ic-button-secondary-text-monochrome:var(--ic-color-text-primary);--ic-button-secondary-text-active:var(--ic-color-text-action-light);--ic-button-secondary-text-hover-active:var(
|
191
191
|
--ic-color-text-action-hover-light
|
192
192
|
);--ic-button-secondary-text-pressed-active:var(
|
193
|
-
--ic-color-text-action-pressed
|
193
|
+
--ic-color-text-action-pressed-light
|
194
194
|
);--ic-button-secondary-text-disabled:var(--ic-color-text-disabled-mid);--ic-button-secondary-text-disabled-monochrome:var(
|
195
195
|
--ic-color-text-disabled-mid
|
196
196
|
);--ic-button-secondary-text-hover-monochrome:var(
|
@@ -397,6 +397,8 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
397
397
|
--ic-atoms-input-select-content-text-cursor
|
398
398
|
);--ic-skeleton-background:var(--ic-state-layer-neutral-light);--ic-skeleton-background-secondary:var(--ic-state-layer-neutral-default);--ic-skip-link-background:var(--ic-color-background-primary);--ic-status-tag-text:var(--ic-color-text-inverted);--ic-status-tag-text-inverted:var(--ic-color-text-primary-light);--ic-status-tag-success:var(--ic-status-success-default);--ic-status-tag-outlined-background-success:var(--ic-status-success-light);--ic-status-tag-outlined-success:var(--ic-status-success-default);--ic-status-tag-error:var(--ic-status-error-default);--ic-status-tag-outlined-background-error:var(--ic-status-error-light);--ic-status-tag-outlined-error:var(--ic-status-error-default);--ic-status-tag-warning:var(--ic-status-warning-contrast);--ic-status-tag-outlined-background-warning:var(--ic-status-warning-light);--ic-status-tag-outlined-warning:var(--ic-status-warning-dark);--ic-status-tag-neutral:var(--ic-status-unknown-mid);--ic-status-tag-outlined-background-neutral:var(
|
399
399
|
--ic-status-unknown-outlined
|
400
|
+
);--ic-status-tag-outlined-background-neutral-contrast:var(
|
401
|
+
--ic-status-unknown-outlined
|
400
402
|
);--ic-status-tag-outlined-neutral:var(--ic-status-unknown-mid);--ic-status-tag-filled-warning-text:var(--ic-status-tag-text-inverted);--ic-step-title:var(--ic-color-text-primary);--ic-step-title-current:var(--ic-status-info-default);--ic-step-title-success:var(--ic-status-success-default);--ic-step-title-active:var(--ic-color-text-primary);--ic-step-title-disabled:var(--ic-color-text-disabled-mid);--ic-step-title-status-text-current:var(--ic-color-text-primary);--ic-step-title-status-text-inactive:var(--ic-color-text-secondary);--ic-step-title-status-text-disabled:var(--ic-color-text-disabled-mid);--ic-stepper-connector-success:var(--ic-status-success-default);--ic-stepper-connector-current-status:var(--ic-status-info-default);--ic-stepper-connector-remaining-status:var(
|
401
403
|
--ic-color-border-neutral-hover-light
|
402
404
|
);--ic-stepper-connector-disabled:var(--ic-color-border-neutral-disabled);--ic-step-number-background-active:var(--ic-status-info-default);--ic-step-number-background-success:var(--ic-status-success-default);--ic-step-number-text-current:var(--ic-color-text-inverted);--ic-step-number-text-inactive:var(--ic-color-text-primary);--ic-step-number-text-disabled:var(--ic-color-text-disabled-mid);--ic-step-number-icon-success:var(--ic-color-icon-brand);--ic-step-number-inactive:var(--ic-color-background-primary);--ic-step-number-disabled:var(--ic-color-text-disabled-mid);--ic-step-number-inactive-outline:var(
|
@@ -438,11 +440,11 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
438
440
|
);--ic-toggle-button-unselected-border-pressed:var(
|
439
441
|
--ic-color-border-action-pressed
|
440
442
|
);--ic-toggle-button-unselected-text-pressed:var(
|
441
|
-
--ic-color-text-action-pressed
|
443
|
+
--ic-color-text-action-pressed-light
|
442
444
|
);--ic-toggle-button-unselected-icon-pressed:var(
|
443
445
|
--ic-color-icon-action-pressed
|
444
446
|
);--ic-toggle-button-unselected-background-pressed:var(
|
445
|
-
--ic-action-default-bg-
|
447
|
+
--ic-action-default-bg-pressed
|
446
448
|
);--ic-toggle-button-loading-bar:var(--ic-color-icon-brand);--ic-toggle-button-unselected-text-disabled:var(
|
447
449
|
--ic-color-text-disabled-mid
|
448
450
|
);--ic-toggle-button-unselected-icon-disabled:var(
|
@@ -913,6 +915,8 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
913
915
|
--ic-status-warning-dark-dm
|
914
916
|
);--ic-status-tag-outlined-warning:var(--ic-status-warning-outlined);--ic-status-tag-neutral:var(--ic-status-unknown-contrast);--ic-status-tag-outlined-background-neutral:var(
|
915
917
|
--ic-status-unknown-dark-dm
|
918
|
+
);--ic-status-tag-outlined-background-neutral-contrast:var(
|
919
|
+
--ic-status-unknown-contrast-dm
|
916
920
|
);--ic-status-tag-outlined-neutral:var(--ic-status-unknown-default);--ic-status-tag-filled-warning-text:var(--ic-status-tag-text);--ic-step-title:var(--ic-color-text-primary-dark);--ic-step-title-current:var(--ic-status-info-contrast);--ic-step-title-success:var(--ic-status-success-contrast);--ic-step-title-active:var(--ic-color-text-primary-dark);--ic-step-title-disabled:var(--ic-color-text-disabled-dark);--ic-step-title-status-text-current:var(--ic-color-text-primary-dark);--ic-step-title-status-text-inactive:var(--ic-color-text-secondary-dark);--ic-step-title-status-text-disabled:var(--ic-color-text-disabled-dark);--ic-stepper-connector-success:var(--ic-status-success-contrast);--ic-stepper-connector-current-status:var(--ic-status-info-contrast);--ic-stepper-connector-remaining-status:var(
|
917
921
|
--ic-color-border-neutral-pressed-default
|
918
922
|
);--ic-stepper-connector-disabled:var(--ic-color-border-neutral-disabled);--ic-step-number-background-active:var(--ic-status-info-contrast);--ic-step-number-background-success:var(--ic-status-success-contrast);--ic-step-number-text-current:var(--ic-color-text-primary-light);--ic-step-number-text-inactive:var(--ic-color-text-primary-dark);--ic-step-number-text-disabled:var(--ic-color-text-disabled-dark);--ic-step-number-icon-success:var(--ic-color-icon-neutral);--ic-step-number-inactive:var(--ic-color-background-neutral);--ic-step-number-disabled:var(--ic-color-text-disabled-dark);--ic-step-number-inactive-outline:var(--ic-color-border-neutral-grey-dark);--ic-step-number-current-outer-fill:var(
|
@@ -980,7 +984,7 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
980
984
|
);--ic-toggle-button-unselected-icon-pressed:var(
|
981
985
|
--ic-color-icon-action-pressed-dark
|
982
986
|
);--ic-toggle-button-unselected-background-pressed:var(
|
983
|
-
--ic-action-default-bg-
|
987
|
+
--ic-action-default-bg-pressed
|
984
988
|
);--ic-toggle-button-loading-bar:var(--ic-color-icon-neutral);--ic-toggle-button-unselected-text-disabled:var(
|
985
989
|
--ic-color-text-disabled-dark
|
986
990
|
);--ic-toggle-button-unselected-icon-disabled:var(
|
@@ -1391,7 +1395,9 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
1391
1395
|
--ic-atoms-input-field-label-subtitle-disabled
|
1392
1396
|
);--ic-select-input-field-text-cursor:var(
|
1393
1397
|
--ic-atoms-input-select-content-text-cursor
|
1394
|
-
);--ic-skeleton-background:var(--ic-state-layer-neutral-dark);--ic-skeleton-background-secondary:var(--ic-state-layer-neutral-darker);--ic-skip-link-background:var(--ic-color-background-primary);--ic-status-tag-text:var(--ic-color-text-primary-light);--ic-status-tag-text-inverted:var(--ic-color-text-inverted);--ic-status-tag-success:var(--ic-status-success-contrast);--ic-status-tag-outlined-background-success:var(--ic-status-success-dark-dm);--ic-status-tag-outlined-success:var(--ic-status-success-contrast);--ic-status-tag-error:var(--ic-status-error-contrast);--ic-status-tag-outlined-background-error:var(--ic-status-error-dark-dm);--ic-status-tag-outlined-error:var(--ic-status-error-outlined);--ic-status-tag-warning:var(--ic-status-warning-contrast);--ic-status-tag-outlined-background-warning:var(--ic-status-warning-dark-dm);--ic-status-tag-outlined-warning:var(--ic-status-warning-outlined);--ic-status-tag-neutral:var(--ic-status-unknown-contrast);--ic-status-tag-outlined-background-neutral:var(--ic-status-unknown-dark-dm);--ic-status-tag-outlined-neutral
|
1398
|
+
);--ic-skeleton-background:var(--ic-state-layer-neutral-dark);--ic-skeleton-background-secondary:var(--ic-state-layer-neutral-darker);--ic-skip-link-background:var(--ic-color-background-primary);--ic-status-tag-text:var(--ic-color-text-primary-light);--ic-status-tag-text-inverted:var(--ic-color-text-inverted);--ic-status-tag-success:var(--ic-status-success-contrast);--ic-status-tag-outlined-background-success:var(--ic-status-success-dark-dm);--ic-status-tag-outlined-success:var(--ic-status-success-contrast);--ic-status-tag-error:var(--ic-status-error-contrast);--ic-status-tag-outlined-background-error:var(--ic-status-error-dark-dm);--ic-status-tag-outlined-error:var(--ic-status-error-outlined);--ic-status-tag-warning:var(--ic-status-warning-contrast);--ic-status-tag-outlined-background-warning:var(--ic-status-warning-dark-dm);--ic-status-tag-outlined-warning:var(--ic-status-warning-outlined);--ic-status-tag-neutral:var(--ic-status-unknown-contrast);--ic-status-tag-outlined-background-neutral:var(--ic-status-unknown-dark-dm);--ic-status-tag-outlined-background-neutral-contrast:var(
|
1399
|
+
--ic-status-unknown-contrast-dm
|
1400
|
+
);--ic-status-tag-outlined-neutral:var(--ic-status-unknown-default);--ic-status-tag-filled-warning-text:var(--ic-status-tag-text);--ic-step-title:var(--ic-color-text-primary-dark);--ic-step-title-current:var(--ic-status-info-contrast);--ic-step-title-success:var(--ic-status-success-contrast);--ic-step-title-active:var(--ic-color-text-primary-dark);--ic-step-title-disabled:var(--ic-color-text-disabled-dark);--ic-step-title-status-text-current:var(--ic-color-text-primary-dark);--ic-step-title-status-text-inactive:var(--ic-color-text-secondary-dark);--ic-step-title-status-text-disabled:var(--ic-color-text-disabled-dark);--ic-stepper-connector-success:var(--ic-status-success-contrast);--ic-stepper-connector-current-status:var(--ic-status-info-contrast);--ic-stepper-connector-remaining-status:var(
|
1395
1401
|
--ic-color-border-neutral-pressed-default
|
1396
1402
|
);--ic-stepper-connector-disabled:var(--ic-color-border-neutral-disabled);--ic-step-number-background-active:var(--ic-status-info-contrast);--ic-step-number-background-success:var(--ic-status-success-contrast);--ic-step-number-text-current:var(--ic-color-text-primary-light);--ic-step-number-text-inactive:var(--ic-color-text-primary-dark);--ic-step-number-text-disabled:var(--ic-color-text-disabled-dark);--ic-step-number-icon-success:var(--ic-color-icon-neutral);--ic-step-number-inactive:var(--ic-color-background-neutral);--ic-step-number-disabled:var(--ic-color-text-disabled-dark);--ic-step-number-inactive-outline:var(--ic-color-border-neutral-grey-dark);--ic-step-number-current-outer-fill:var(--ic-color-background-primary-dark);--ic-step-number-current-outline:var(--ic-status-info-contrast);--ic-step-indicator-status-current:var(--ic-status-info-contrast);--ic-step-indicator-text-current:var(--ic-status-info-contrast);--ic-step-indicator-status-remaining:var(
|
1397
1403
|
--ic-color-border-neutral-pressed-default
|
@@ -1446,7 +1452,7 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
1446
1452
|
);--ic-toggle-button-unselected-icon-pressed:var(
|
1447
1453
|
--ic-color-icon-action-pressed-dark
|
1448
1454
|
);--ic-toggle-button-unselected-background-pressed:var(
|
1449
|
-
--ic-action-default-bg-
|
1455
|
+
--ic-action-default-bg-pressed
|
1450
1456
|
);--ic-toggle-button-loading-bar:var(--ic-color-icon-neutral);--ic-toggle-button-unselected-text-disabled:var(
|
1451
1457
|
--ic-color-text-disabled-dark
|
1452
1458
|
);--ic-toggle-button-unselected-icon-disabled:var(
|
@@ -1533,7 +1539,7 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
1533
1539
|
);--ic-status-error-pressed:rgb(
|
1534
1540
|
calc(var(--ic-status-error-r) * 0.6) calc(var(--ic-status-error-g) * 0.6)
|
1535
1541
|
calc(var(--ic-status-error-b) * 0.6) / var(--ic-status-error-a)
|
1536
|
-
);--ic-status-info-default:var(--ic-blue-900);--ic-status-info-default-dm:var(--ic-blue-900);--ic-status-info-light:var(--ic-blue-0);--ic-status-info-light-dm:var(--ic-blue-100);--ic-status-info-dark:var(--ic-blue-1600);--ic-status-info-dark-dm:var(--ic-blue-1700);--ic-status-info-contrast:var(--ic-blue-400);--ic-status-info-contrast-dm:var(--ic-blue-400);--ic-status-anomalous-default:var(--ic-purple-1400);--ic-status-anomalous-default-dm:var(--ic-purple-500);--ic-status-anomalous-light:var(--ic-purple-50);--ic-status-anomalous-light-dm:var(--ic-purple-50);--ic-status-anomalous-dark:var(--ic-purple-1800);--ic-status-anomalous-dark-dm:var(--ic-purple-1800);--ic-status-anomalous-contrast:var(--ic-purple-400);--ic-status-anomalous-contrast-dm:var(--ic-purple-400);--ic-status-unknown-default:var(--ic-architectural-500);--ic-status-unknown-default-dm:var(--ic-architectural-300);--ic-status-unknown-mid:var(--ic-architectural-700);--ic-status-unknown-light:var(--ic-architectural-40);--ic-status-unknown-light-dm:var(--ic-architectural-100);--ic-status-unknown-dark:var(--ic-architectural-800);--ic-status-unknown-dark-dm:var(--ic-architectural-850);--ic-status-unknown-outlined:var(--ic-architectural-200);--ic-status-unknown-contrast:var(--ic-architectural-300);--ic-status-unknown-contrast-dm:var(--ic-architectural-300);--ic-color-brand-text:var(--ic-architectural-20);--ic-color-text-primary-light:var(--ic-architectural-950);--ic-color-text-primary-dark:var(--ic-architectural-40);--ic-color-text-secondary-light:var(--ic-architectural-700);--ic-color-text-secondary-dark:var(--ic-architectural-100);--ic-color-text-tertiary-light:var(--ic-architectural-500);--ic-color-text-tertiary-dark:var(--ic-architectural-200);--ic-color-text-inverted:var(--ic-architectural-white);--ic-color-text-disabled-mid:var(--ic-architectural-300);--ic-color-text-disabled-light:var(--ic-architectural-200);--ic-color-text-disabled-dark:var(--ic-architectural-600);--ic-color-text-inactive:var(--ic-architectural-400);--ic-color-text-action-light:var(--ic-blue-800);--ic-color-text-action-dark:var(--ic-blue-400);--ic-color-text-action-hover-light:var(--ic-blue-1100);--ic-color-text-action-hover-dark:var(--ic-blue-200);--ic-color-text-action-pressed-light:var(--ic-blue-1300);--ic-color-text-action-pressed-dark:var(--ic-blue-100);--ic-color-text-error-light:var(--ic-red-400);--ic-color-text-error-dark:var(--ic-red-800);--ic-color-background-primary-light:var(--ic-architectural-white);--ic-color-background-primary-dark:var(--ic-architectural-850);--ic-color-background-secondary-light:var(--ic-architectural-20);--ic-color-background-secondary-40:var(--ic-architectural-40);--ic-color-background-secondary-dark:var(--ic-architectural-700);--ic-color-background-neutral-light:var(--ic-architectural-800);--ic-color-background-neutral-dark:var(--ic-architectural-950);--ic-color-background-active-light:var(--ic-blue-800);--ic-color-background-active-dark:var(--ic-blue-400);--ic-color-background-hover-default:var(--ic-blue-1100);--ic-color-background-hover-light:var(--ic-architectural-200);--ic-color-background-hover-dark:var(--ic-architectural-800);--ic-color-background-active-hover-light:var(--ic-blue-1100);--ic-color-background-active-hover-dark:var(--ic-blue-200);--ic-color-background-pressed-default:var(--ic-blue-1300);--ic-color-background-pressed-light:var(--ic-architectural-300);--ic-color-background-pressed-dark:var(--ic-architectural-700);--ic-color-background-active-pressed-light:var(--ic-blue-1300);--ic-color-background-active-pressed-dark:var(--ic-blue-600);--ic-color-background-disabled-default:var(--ic-architectural-200);--ic-color-background-disabled-light:var(--ic-architectural-80);--ic-color-background-disabled-dark:var(--ic-architectural-300);--ic-color-background-disabled-mid:var(--ic-architectural-400);--ic-color-background-disabled-darkest:var(--ic-architectural-600);--ic-color-background-disabled-selected:var(--ic-blue-1500);--ic-color-background-selected:var(--ic-architectural-white);--ic-color-background-clear-icon-hover:var(--ic-architectural-100);--ic-color-background-elevation-level-1:var(--ic-architectural-950);--ic-color-background-elevation-level-2:var(--ic-architectural-900);--ic-color-background-elevation-level-3:var(--ic-architectural-850);--ic-color-background-elevation-level-4:var(--ic-architectural-800);--ic-color-background-success-light:var(--ic-green-1400);--ic-color-background-success-dark:var(--ic-green-300);--ic-color-background-warning-light:var(--ic-yellow-400);--ic-color-background-warning-dark:var(--ic-yellow-300);--ic-color-background-destructive-light:var(--ic-red-800);--ic-color-background-destructive-dark:var(--ic-red-600);--ic-color-background-destructive-hover-light:var(--ic-red-1100);--ic-color-background-destructive-hover-dark:var(--ic-red-400);--ic-color-background-destructive-pressed-light:var(--ic-red-1300);--ic-color-background-destructive-pressed-dark:var(--ic-red-200);--ic-color-background-solid:var(--ic-architectural-white);--ic-color-background-solid-disabled:var(--ic-architectural-100);--ic-color-background-solid-hover:var(--ic-blue-50);--ic-color-background-solid-pressed:var(--ic-blue-100);--ic-color-background-solid-mono:var(--ic-architectural-black);--ic-color-background-solid-mono-disabled:var(--ic-architectural-100);--ic-color-background-solid-mono-hover:var(--ic-architectural-800);--ic-color-background-solid-mono-pressed:var(--ic-architectural-600);--ic-color-border-neutral-default:var(--ic-architectural-300);--ic-color-border-neutral-default-dark:var(--ic-architectural-500);--ic-color-border-neutral-black:var(--ic-architectural-black);--ic-color-border-neutral-white:var(--ic-architectural-white);--ic-color-border-neutral-grey-light:var(--ic-architectural-40);--ic-color-border-neutral-grey-dark:var(--ic-architectural-400);--ic-color-border-neutral-pressed-default:var(--ic-architectural-600);--ic-color-border-neutral-pressed-light:var(--ic-architectural-200);--ic-color-border-neutral-pressed-dark:var(--ic-architectural-200);--ic-color-border-neutral-hover-default:var(--ic-architectural-500);--ic-color-border-neutral-hover-light:var(--ic-architectural-200);--ic-color-border-neutral-hover-dark:var(--ic-architectural-300);--ic-color-border-neutral-disabled-light:var(--ic-architectural-200);--ic-color-border-neutral-disabled-mid:var(--ic-architectural-300);--ic-color-border-neutral-disabled-dark:var(--ic-architectural-600);--ic-color-border-success-default:var(--ic-green-1400);--ic-color-border-success-default-dark:var(--ic-green-1000);--ic-color-border-success-hover-light:var(--ic-green-1600);--ic-color-border-success-hover-dark:var(--ic-green-800);--ic-color-border-success-pressed-light:var(--ic-green-1700);--ic-color-border-success-pressed-dark:var(--ic-green-700);--ic-color-border-warning-default:var(--ic-yellow-900);--ic-color-border-warning-default-dark:var(--ic-yellow-800);--ic-color-border-warning-hover-light:var(--ic-yellow-1100);--ic-color-border-warning-hover-dark:var(--ic-yellow-600);--ic-color-border-warning-pressed-light:var(--ic-yellow-1200);--ic-color-border-warning-pressed-dark:var(--ic-yellow-500);--ic-color-border-error-default:var(--ic-red-800);--ic-color-border-error-default-dark:var(--ic-red-900);--ic-color-border-error-hover-light:var(--ic-red-1000);--ic-color-border-error-hover-dark:var(--ic-red-700);--ic-color-border-error-pressed-light:var(--ic-red-1100);--ic-color-border-error-pressed-dark:var(--ic-red-600);--ic-color-border-action-default:var(--ic-blue-800);--ic-color-border-action-default-dark:var(--ic-blue-400);--ic-color-border-action-hover-light:var(--ic-blue-1100);--ic-color-border-action-hover-dark:var(--ic-blue-200);--ic-color-border-action-pressed-light:var(--ic-blue-1300);--ic-color-border-action-pressed-dark:var(--ic-blue-100);--ic-action-default-light:var(--ic-blue-800);--ic-action-default-dark:var(--ic-blue-400);--ic-action-default-hover-light:var(--ic-blue-1100);--ic-action-default-hover-dark:var(--ic-blue-200);--ic-action-default-pressed-light:var(--ic-blue-1300);--ic-action-default-pressed-dark:var(--ic-blue-100);--ic-action-default-selected-light:var(--ic-blue-800-state-layer-10);--ic-action-default-selected-dark:var(--ic-blue-900);--ic-action-default-disabled:var(--ic-blue-50);--ic-action-default-active-alpha:var(--ic-blue-800-state-layer-50);--ic-action-default-bg-hover:var(--ic-blue-800-state-layer-10);--ic-action-default-bg-hover-24:var(--ic-blue-800-state-layer-24);--ic-action-default-bg-pressed-30:var(--ic-blue-800-state-layer-30);--ic-action-default-bg-pressed-hover-34:var(--ic-blue-800-state-layer-34);--ic-action-default-bg-pressed:var(--ic-blue-800-state-layer-20);--ic-action-default-bg-hover-no-alpha:#e7eef8;--ic-action-default-bg-pressed-no-alpha:#d0def2;--ic-action-destructive-light:var(--ic-red-800);--ic-action-destructive-dark:var(--ic-red-600);--ic-action-destructive-hover-light:var(--ic-red-1100);--ic-action-destructive-hover-dark:var(--ic-red-400);--ic-action-destructive-pressed-light:var(--ic-red-1300);--ic-action-destructive-pressed-dark:var(--ic-red-200);--ic-action-light-bg-hover:var(--ic-state-layer-lighten-10);--ic-action-light-bg-hover-24:var(--ic-architectural-white-state-layer-24);--ic-action-light-bg-pressed:var(--ic-state-layer-lighten-20);--ic-action-light-bg-pressed-34:var(--ic-architectural-white-state-layer-34);--ic-action-dark-bg-hover:var(--ic-architectural-700-state-layer-10);--ic-action-dark-bg-pressed:var(--ic-architectural-700-state-layer-20);--ic-action-dark-bg-hover-no-alpha:#ececed;--ic-action-dark-bg-active-no-alpha:#d9dadb;--ic-action-neutral-light:var(--ic-architectural-100);--ic-action-neutral-dark:var(--ic-architectural-800);--ic-action-monochrome:var(--ic-architectural-40);--ic-action-monochrome-dark:var(--ic-architectural-950);--ic-action-monochrome-hover:var(--ic-architectural-200);--ic-action-monochrome-hover-dark:var(--ic-architectural-800);--ic-action-monochrome-pressed:var(--ic-architectural-300);--ic-action-monochrome-pressed-dark:var(--ic-architectural-700);--ic-brand-blue-primary:#1b3c79;--ic-brand-blue-primary-r:27;--ic-brand-blue-primary-g:60;--ic-brand-blue-primary-b:121;--ic-brand-blue-primary-a:1;--ic-brand-darken-20:var(--ic-state-layer-darken-20);--ic-brand-darken-30:var(--ic-state-layer-darken-30);--ic-brand-darken-40:var(--ic-state-layer-darken-40);--ic-brand-lighten-20:var(--ic-state-layer-lighten-20);--ic-brand-lighten-40:var(--ic-state-layer-lighten-40);--ic-brand-color-primary-r:var(--ic-brand-blue-primary-r);--ic-brand-color-primary-g:var(--ic-brand-blue-primary-g);--ic-brand-color-primary-b:var(--ic-brand-blue-primary-b);--ic-brand-color-primary-a:var(--ic-brand-blue-primary-a);--ic-brand-color-primary:rgb(
|
1542
|
+
);--ic-status-info-default:var(--ic-blue-900);--ic-status-info-default-dm:var(--ic-blue-900);--ic-status-info-light:var(--ic-blue-0);--ic-status-info-light-dm:var(--ic-blue-100);--ic-status-info-dark:var(--ic-blue-1600);--ic-status-info-dark-dm:var(--ic-blue-1700);--ic-status-info-contrast:var(--ic-blue-400);--ic-status-info-contrast-dm:var(--ic-blue-400);--ic-status-anomalous-default:var(--ic-purple-1400);--ic-status-anomalous-default-dm:var(--ic-purple-500);--ic-status-anomalous-light:var(--ic-purple-50);--ic-status-anomalous-light-dm:var(--ic-purple-50);--ic-status-anomalous-dark:var(--ic-purple-1800);--ic-status-anomalous-dark-dm:var(--ic-purple-1800);--ic-status-anomalous-contrast:var(--ic-purple-400);--ic-status-anomalous-contrast-dm:var(--ic-purple-400);--ic-status-unknown-default:var(--ic-architectural-500);--ic-status-unknown-default-dm:var(--ic-architectural-300);--ic-status-unknown-mid:var(--ic-architectural-700);--ic-status-unknown-light:var(--ic-architectural-40);--ic-status-unknown-light-dm:var(--ic-architectural-100);--ic-status-unknown-dark:var(--ic-architectural-800);--ic-status-unknown-dark-dm:var(--ic-architectural-850);--ic-status-unknown-outlined:var(--ic-architectural-200);--ic-status-unknown-contrast:var(--ic-architectural-300);--ic-status-unknown-contrast-dm:var(--ic-architectural-300);--ic-color-brand-text:var(--ic-architectural-20);--ic-color-text-primary-light:var(--ic-architectural-950);--ic-color-text-primary-dark:var(--ic-architectural-40);--ic-color-text-secondary-light:var(--ic-architectural-700);--ic-color-text-secondary-dark:var(--ic-architectural-100);--ic-color-text-tertiary-light:var(--ic-architectural-500);--ic-color-text-tertiary-dark:var(--ic-architectural-200);--ic-color-text-inverted:var(--ic-architectural-white);--ic-color-text-disabled-mid:var(--ic-architectural-300);--ic-color-text-disabled-light:var(--ic-architectural-200);--ic-color-text-disabled-dark:var(--ic-architectural-600);--ic-color-text-inactive:var(--ic-architectural-400);--ic-color-text-action-light:var(--ic-blue-800);--ic-color-text-action-dark:var(--ic-blue-400);--ic-color-text-action-hover-light:var(--ic-blue-1100);--ic-color-text-action-hover-dark:var(--ic-blue-200);--ic-color-text-action-pressed-light:var(--ic-blue-1300);--ic-color-text-action-pressed-dark:var(--ic-blue-100);--ic-color-text-error-light:var(--ic-red-400);--ic-color-text-error-dark:var(--ic-red-800);--ic-color-background-primary-light:var(--ic-architectural-white);--ic-color-background-primary-dark:var(--ic-architectural-850);--ic-color-background-secondary-light:var(--ic-architectural-20);--ic-color-background-secondary-40:var(--ic-architectural-40);--ic-color-background-secondary-dark:var(--ic-architectural-700);--ic-color-background-neutral-light:var(--ic-architectural-800);--ic-color-background-neutral-dark:var(--ic-architectural-950);--ic-color-background-active-light:var(--ic-blue-800);--ic-color-background-active-dark:var(--ic-blue-400);--ic-color-background-hover-default:var(--ic-blue-1100);--ic-color-background-hover-light:var(--ic-architectural-200);--ic-color-background-hover-dark:var(--ic-architectural-800);--ic-color-background-active-hover-light:var(--ic-blue-1100);--ic-color-background-active-hover-dark:var(--ic-blue-200);--ic-color-background-pressed-default:var(--ic-blue-1300);--ic-color-background-pressed-light:var(--ic-architectural-300);--ic-color-background-pressed-dark:var(--ic-architectural-700);--ic-color-background-active-pressed-light:var(--ic-blue-1300);--ic-color-background-active-pressed-dark:var(--ic-blue-100);--ic-color-background-disabled-default:var(--ic-architectural-200);--ic-color-background-disabled-light:var(--ic-architectural-80);--ic-color-background-disabled-dark:var(--ic-architectural-300);--ic-color-background-disabled-mid:var(--ic-architectural-400);--ic-color-background-disabled-darkest:var(--ic-architectural-600);--ic-color-background-disabled-selected:var(--ic-blue-1500);--ic-color-background-selected:var(--ic-architectural-white);--ic-color-background-clear-icon-hover:var(--ic-architectural-100);--ic-color-background-elevation-level-1:var(--ic-architectural-950);--ic-color-background-elevation-level-2:var(--ic-architectural-900);--ic-color-background-elevation-level-3:var(--ic-architectural-850);--ic-color-background-elevation-level-4:var(--ic-architectural-800);--ic-color-background-success-light:var(--ic-green-1400);--ic-color-background-success-dark:var(--ic-green-300);--ic-color-background-warning-light:var(--ic-yellow-400);--ic-color-background-warning-dark:var(--ic-yellow-300);--ic-color-background-destructive-light:var(--ic-red-800);--ic-color-background-destructive-dark:var(--ic-red-600);--ic-color-background-destructive-hover-light:var(--ic-red-1100);--ic-color-background-destructive-hover-dark:var(--ic-red-400);--ic-color-background-destructive-pressed-light:var(--ic-red-1300);--ic-color-background-destructive-pressed-dark:var(--ic-red-200);--ic-color-background-solid:var(--ic-architectural-white);--ic-color-background-solid-disabled:var(--ic-architectural-100);--ic-color-background-solid-hover:var(--ic-blue-50);--ic-color-background-solid-pressed:var(--ic-blue-100);--ic-color-background-solid-mono:var(--ic-architectural-black);--ic-color-background-solid-mono-disabled:var(--ic-architectural-100);--ic-color-background-solid-mono-hover:var(--ic-architectural-800);--ic-color-background-solid-mono-pressed:var(--ic-architectural-600);--ic-color-border-neutral-default:var(--ic-architectural-300);--ic-color-border-neutral-default-dark:var(--ic-architectural-500);--ic-color-border-neutral-black:var(--ic-architectural-black);--ic-color-border-neutral-white:var(--ic-architectural-white);--ic-color-border-neutral-grey-light:var(--ic-architectural-40);--ic-color-border-neutral-grey-dark:var(--ic-architectural-400);--ic-color-border-neutral-pressed-default:var(--ic-architectural-600);--ic-color-border-neutral-pressed-light:var(--ic-architectural-200);--ic-color-border-neutral-pressed-dark:var(--ic-architectural-200);--ic-color-border-neutral-hover-default:var(--ic-architectural-500);--ic-color-border-neutral-hover-light:var(--ic-architectural-200);--ic-color-border-neutral-hover-dark:var(--ic-architectural-300);--ic-color-border-neutral-disabled-light:var(--ic-architectural-200);--ic-color-border-neutral-disabled-mid:var(--ic-architectural-300);--ic-color-border-neutral-disabled-dark:var(--ic-architectural-600);--ic-color-border-success-default:var(--ic-green-1400);--ic-color-border-success-default-dark:var(--ic-green-1000);--ic-color-border-success-hover-light:var(--ic-green-1600);--ic-color-border-success-hover-dark:var(--ic-green-800);--ic-color-border-success-pressed-light:var(--ic-green-1700);--ic-color-border-success-pressed-dark:var(--ic-green-700);--ic-color-border-warning-default:var(--ic-yellow-900);--ic-color-border-warning-default-dark:var(--ic-yellow-800);--ic-color-border-warning-hover-light:var(--ic-yellow-1100);--ic-color-border-warning-hover-dark:var(--ic-yellow-600);--ic-color-border-warning-pressed-light:var(--ic-yellow-1200);--ic-color-border-warning-pressed-dark:var(--ic-yellow-500);--ic-color-border-error-default:var(--ic-red-800);--ic-color-border-error-default-dark:var(--ic-red-900);--ic-color-border-error-hover-light:var(--ic-red-1000);--ic-color-border-error-hover-dark:var(--ic-red-700);--ic-color-border-error-pressed-light:var(--ic-red-1100);--ic-color-border-error-pressed-dark:var(--ic-red-600);--ic-color-border-action-default:var(--ic-blue-800);--ic-color-border-action-default-dark:var(--ic-blue-400);--ic-color-border-action-hover-light:var(--ic-blue-1100);--ic-color-border-action-hover-dark:var(--ic-blue-200);--ic-color-border-action-pressed-light:var(--ic-blue-1300);--ic-color-border-action-pressed-dark:var(--ic-blue-100);--ic-action-default-light:var(--ic-blue-800);--ic-action-default-dark:var(--ic-blue-400);--ic-action-default-hover-light:var(--ic-blue-1100);--ic-action-default-hover-dark:var(--ic-blue-200);--ic-action-default-pressed-light:var(--ic-blue-1300);--ic-action-default-pressed-dark:var(--ic-blue-100);--ic-action-default-selected-light:var(--ic-blue-800-state-layer-10);--ic-action-default-selected-dark:var(--ic-blue-900);--ic-action-default-disabled:var(--ic-blue-50);--ic-action-default-active-alpha:var(--ic-blue-800-state-layer-50);--ic-action-default-bg-hover:var(--ic-blue-800-state-layer-10);--ic-action-default-bg-hover-24:var(--ic-blue-800-state-layer-24);--ic-action-default-bg-pressed-30:var(--ic-blue-800-state-layer-30);--ic-action-default-bg-pressed-hover-34:var(--ic-blue-800-state-layer-34);--ic-action-default-bg-pressed:var(--ic-blue-800-state-layer-20);--ic-action-default-bg-hover-no-alpha:#e7eef8;--ic-action-default-bg-pressed-no-alpha:#d0def2;--ic-action-destructive-light:var(--ic-red-800);--ic-action-destructive-dark:var(--ic-red-600);--ic-action-destructive-hover-light:var(--ic-red-1100);--ic-action-destructive-hover-dark:var(--ic-red-400);--ic-action-destructive-pressed-light:var(--ic-red-1300);--ic-action-destructive-pressed-dark:var(--ic-red-200);--ic-action-light-bg-hover:var(--ic-state-layer-lighten-10);--ic-action-light-bg-hover-24:var(--ic-architectural-white-state-layer-24);--ic-action-light-bg-pressed:var(--ic-state-layer-lighten-20);--ic-action-light-bg-pressed-34:var(--ic-architectural-white-state-layer-34);--ic-action-dark-bg-hover:var(--ic-architectural-700-state-layer-10);--ic-action-dark-bg-pressed:var(--ic-architectural-700-state-layer-20);--ic-action-dark-bg-hover-no-alpha:#ececed;--ic-action-dark-bg-active-no-alpha:#d9dadb;--ic-action-neutral-light:var(--ic-architectural-100);--ic-action-neutral-dark:var(--ic-architectural-800);--ic-action-monochrome:var(--ic-architectural-40);--ic-action-monochrome-dark:var(--ic-architectural-950);--ic-action-monochrome-hover:var(--ic-architectural-200);--ic-action-monochrome-hover-dark:var(--ic-architectural-800);--ic-action-monochrome-pressed:var(--ic-architectural-300);--ic-action-monochrome-pressed-dark:var(--ic-architectural-700);--ic-brand-blue-primary:#1b3c79;--ic-brand-blue-primary-r:27;--ic-brand-blue-primary-g:60;--ic-brand-blue-primary-b:121;--ic-brand-blue-primary-a:1;--ic-brand-darken-20:var(--ic-state-layer-darken-20);--ic-brand-darken-30:var(--ic-state-layer-darken-30);--ic-brand-darken-40:var(--ic-state-layer-darken-40);--ic-brand-lighten-20:var(--ic-state-layer-lighten-20);--ic-brand-lighten-40:var(--ic-state-layer-lighten-40);--ic-brand-color-primary-r:var(--ic-brand-blue-primary-r);--ic-brand-color-primary-g:var(--ic-brand-blue-primary-g);--ic-brand-color-primary-b:var(--ic-brand-blue-primary-b);--ic-brand-color-primary-a:var(--ic-brand-blue-primary-a);--ic-brand-color-primary:rgb(
|
1537
1543
|
var(--ic-brand-color-primary-r) var(--ic-brand-color-primary-g)
|
1538
1544
|
var(--ic-brand-color-primary-b) / var(--ic-brand-color-primary-a)
|
1539
1545
|
);--ic-brand-color-secondary:rgb(
|
@@ -1771,4 +1777,4 @@ html{font-family:var(--ic-font-body-family);color:var(--ic-color-text-primary)}a
|
|
1771
1777
|
inset 0 0 0 8px var(--ic-architectural-black);--ic-border-hc:var(--ic-space-1px) solid transparent;--ic-border-keyline-darken:1px solid var(--ic-color-keyline-darken);--ic-border-keyline-lighten:1px solid var(--ic-color-keyline-lighten)}:root{--ic-elevation-raised:0 0 2px rgb(0 0 0 / 50%);--ic-elevation-overlay:0 2px 8px rgb(0 0 0 / 20%);--ic-elevation-modal:0 4px 16px rgb(0 0 0 / 25%);--ic-elevation-inset:inset 0 4px 16px rgb(0 0 0 / 25%),
|
1772
1778
|
inset 0 -4px 16px rgb(0 0 0 / 25%);--ic-easing-transition-fast:var(--ic-transition-duration-fast)
|
1773
1779
|
cubic-bezier(0.165, 0.84, 0.44, 1);--ic-easing-transition-slow:var(--ic-transition-duration-slow)
|
1774
|
-
cubic-bezier(0.165, 0.84, 0.44, 1);--ic-transition-duration-fast:100ms;--ic-transition-duration-slow:300ms;--ic-breakpoint-xs:0;--ic-breakpoint-sm:576px;--ic-breakpoint-md:768px;--ic-breakpoint-lg:992px;--ic-breakpoint-xl:1200px;--ic-space-1px:0.063rem;--ic-space-xxxs:0.125rem;--ic-space-xxs:0.25rem;--ic-space-xs:0.5rem;--ic-space-sm:0.75rem;--ic-space-md:1rem;--ic-space-lg:1.5rem;--ic-space-xl:2rem;--ic-space-xxl:3rem;--ic-z-index-base-value:0;--ic-z-index-page-header:calc(var(--ic-z-index-base-value) + 10);--ic-z-index-back-to-top:calc(var(--ic-z-index-base-value) + 20);--ic-z-index-skip-link:calc(var(--ic-z-index-base-value) + 20);--ic-z-index-popover:calc(var(--ic-z-index-base-value) + 50);--ic-z-index-sticky-page-header:calc(var(--ic-z-index-base-value) + 60);--ic-z-index-date-picker:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-navigation-item:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-navigation-menu:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-menu:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-side-navigation:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-dialog:calc(var(--ic-z-index-base-value) + 100);--ic-z-index-toast:calc(var(--ic-z-index-base-value) + 110);--ic-z-index-tooltip:calc(var(--ic-z-index-base-value) + 110);--ic-z-index-classification-banner:calc(var(--ic-z-index-base-value) + 200)}
|
1780
|
+
cubic-bezier(0.165, 0.84, 0.44, 1);--ic-transition-duration-fast:100ms;--ic-transition-duration-slow:300ms;--ic-breakpoint-xs:0;--ic-breakpoint-sm:576px;--ic-breakpoint-md:768px;--ic-breakpoint-lg:992px;--ic-breakpoint-xl:1200px;--ic-space-1px:0.063rem;--ic-space-xxxs:0.125rem;--ic-space-xxs:0.25rem;--ic-space-xs:0.5rem;--ic-space-sm:0.75rem;--ic-space-md:1rem;--ic-space-lg:1.5rem;--ic-space-xl:2rem;--ic-space-xxl:3rem;--ic-z-index-base-value:0;--ic-z-index-page-header:calc(var(--ic-z-index-base-value) + 10);--ic-z-index-back-to-top:calc(var(--ic-z-index-base-value) + 20);--ic-z-index-skip-link:calc(var(--ic-z-index-base-value) + 20);--ic-z-index-popover:calc(var(--ic-z-index-base-value) + 50);--ic-z-index-sticky-page-header:calc(var(--ic-z-index-base-value) + 60);--ic-z-index-date-picker:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-navigation-item:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-navigation-menu:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-menu:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-side-navigation:calc(var(--ic-z-index-base-value) + 70);--ic-z-index-dialog:calc(var(--ic-z-index-base-value) + 100);--ic-z-index-toast:calc(var(--ic-z-index-base-value) + 110);--ic-z-index-tooltip:calc(var(--ic-z-index-base-value) + 110);--ic-z-index-classification-banner:calc(var(--ic-z-index-base-value) + 200)}
|
package/package.json
CHANGED
@@ -3,7 +3,7 @@
|
|
3
3
|
"sideEffects": [
|
4
4
|
"*.css"
|
5
5
|
],
|
6
|
-
"version": "3.0.0-canary.
|
6
|
+
"version": "3.0.0-canary.17",
|
7
7
|
"description": "React-wrapped web components compiled using StencilJS",
|
8
8
|
"scripts": {
|
9
9
|
"build": "npm run clean && npm run compile && npm run copy:core-css && npm run copy:normalize-css",
|
@@ -38,9 +38,9 @@
|
|
38
38
|
"email": "icds@gchq.gov.uk"
|
39
39
|
},
|
40
40
|
"dependencies": {
|
41
|
-
"@ukic/canary-web-components": "^3.0.0-canary.
|
42
|
-
"@ukic/react": "^3.
|
43
|
-
"@ukic/web-components": "^3.
|
41
|
+
"@ukic/canary-web-components": "^3.0.0-canary.17",
|
42
|
+
"@ukic/react": "^3.2.0",
|
43
|
+
"@ukic/web-components": "^3.2.0"
|
44
44
|
},
|
45
45
|
"devDependencies": {
|
46
46
|
"@babel/core": "^7.16.0",
|
@@ -90,9 +90,9 @@
|
|
90
90
|
"webpack": "^5.76.0"
|
91
91
|
},
|
92
92
|
"peerDependencies": {
|
93
|
-
"@ukic/fonts": "^
|
94
|
-
"react": "^16.7.0 || ^17.0.2 || ^18.2.0",
|
95
|
-
"react-dom": "^16.7.0 || ^17.0.2 || ^18.2.0"
|
93
|
+
"@ukic/fonts": "^3.1.0",
|
94
|
+
"react": "^16.7.0 || ^17.0.2 || ^18.2.0 || ^19.0.0",
|
95
|
+
"react-dom": "^16.7.0 || ^17.0.2 || ^18.2.0 || ^19.0.0"
|
96
96
|
},
|
97
97
|
"jest": {
|
98
98
|
"preset": "ts-jest",
|
@@ -104,5 +104,5 @@
|
|
104
104
|
},
|
105
105
|
"license": "MIT",
|
106
106
|
"packageManager": "^npm@10.9.2",
|
107
|
-
"gitHead": "
|
107
|
+
"gitHead": "e084fa80621797c35c5a59446ea6a3e97486a552"
|
108
108
|
}
|