@luscii-healthtech/web-ui 42.13.1 → 42.14.0

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 (12) hide show
  1. package/dist/index.development.js +69 -17
  2. package/dist/index.development.js.map +1 -1
  3. package/dist/index.js +1 -1
  4. package/dist/index.js.map +1 -1
  5. package/dist/src/components/PageWithCenteredContentLayout/PageWithCenteredContentLayout.d.ts +5 -0
  6. package/dist/src/components/RangeCoverage/RangeCoverage.d.ts +13 -5
  7. package/dist/stories/PageWithCenteredContentLayout.stories.d.ts +2 -0
  8. package/dist/stories/RangeCoverage.stories.d.ts +1 -0
  9. package/dist/web-ui-tailwind.css +7 -0
  10. package/dist/web-ui.esm.js +1 -1
  11. package/dist/web-ui.esm.js.map +1 -1
  12. package/package.json +1 -1
package/dist/src/components/PageWithCenteredContentLayout/PageWithCenteredContentLayout.d.ts CHANGED
@@ -16,6 +16,11 @@ type HeaderProps = ComponentProps<typeof Box> & {
16
16
  * A 36x36 slot for an action (usually a SecondaryIconButton) to be placed on the right side of the header.
17
17
  */
18
18
  rightActionSlot?: ReactNode;
19
+ /**
20
+ * In some cases you want the action slots to be aligned differently than centered.
21
+ * @default "center"
22
+ */
23
+ slotsAlignment?: "start" | "center";
19
24
  };
20
25
  declare const Header: FC<HeaderProps>;
21
26
  declare const Main: FC<ComponentProps<typeof Box>>;
package/dist/src/components/RangeCoverage/RangeCoverage.d.ts CHANGED
@@ -33,12 +33,20 @@ export interface Props {
33
33
  */
34
34
  color: Color;
35
35
  }>;
36
+ translations: {
37
+ /**
38
+ * This component doesn't support overlapping sections. If you cannot guarantee that
39
+ * sections won't overlap, you can show this message to the user when the component
40
+ * detects overlapping sections.
41
+ */
42
+ sectionOverlapsMessage: string;
43
+ };
36
44
  }
37
- export declare const COLOR_RED = "var(--ui-color-red-800)";
38
- export declare const COLOR_AMBER = "var(--ui-color-amber-700)";
39
- export declare const COLOR_GREY_DARK = "var(--ui-color-slate-700)";
40
- export declare const COLOR_GREY_LIGHT = "var(--ui-color-slate-300)";
41
- export declare const COLOR_BLUE = "var(--ui-color-blue-200)";
45
+ export declare const COLOR_GREY_LIGHT = "var(--ui-color-background-info-secondary-hovered)";
46
+ export declare const COLOR_GREY_DARK = "var(--ui-color-border-info-secondary-hovered)";
47
+ export declare const COLOR_RED = "var(--ui-color-border-error-primary-default)";
48
+ export declare const COLOR_AMBER = "var(--ui-color-icon-warning-secondary-default)";
49
+ export declare const COLOR_BLUE = "var(--ui-color-background-info-secondary-hovered)";
42
50
  export declare const RangeCoverage: FC<Props> & {
43
51
  Colors: {
44
52
  RED: string;
package/dist/stories/PageWithCenteredContentLayout.stories.d.ts CHANGED
@@ -27,6 +27,7 @@ declare const meta: {
27
27
  } & {
28
28
  leftActionSlot?: import("react").ReactNode;
29
29
  rightActionSlot?: import("react").ReactNode;
30
+ slotsAlignment?: "start" | "center";
30
31
  }>;
31
32
  Main: import("react").FC<Omit<any, "ref"> & Partial<Record<"p" | "m" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "mt" | "mr" | "mb" | "ml" | "mx" | "my", "none" | "s" | "xs" | "xl" | "m" | "xxxxs" | "xxxs" | "xxs" | "l" | "xxl">> & {
32
33
  as?: import("react").ElementType | undefined;
@@ -49,3 +50,4 @@ export default meta;
49
50
  type Story = StoryObj<typeof meta>;
50
51
  export declare const Simple: Story;
51
52
  export declare const Overflow: Story;
53
+ export declare const ActionsAlignment: Story;
package/dist/stories/RangeCoverage.stories.d.ts CHANGED
@@ -22,3 +22,4 @@ type Story = StoryObj<typeof meta>;
22
22
  export declare const Base: Story;
23
23
  export declare const Reversed: Story;
24
24
  export declare const EdgeCases: Story;
25
+ export declare const OverlappingSections: Story;
package/dist/web-ui-tailwind.css CHANGED
@@ -125,6 +125,7 @@
125
125
  --ui-primitive-color-blue-100: #f1f5fc;
126
126
  --ui-primitive-color-blue-300: #d7e3fb;
127
127
  --ui-primitive-color-blue-500: #b3cafc;
128
+ --ui-primitive-color-blue-700: #7c9eea;
128
129
  --ui-primitive-color-orange-500: #ffb300;
129
130
  --ui-primitive-color-orange-700: #f0761e;
130
131
  --ui-primitive-color-orange-900: #8a3d00;
@@ -136,6 +137,12 @@
136
137
  --ui-color-on-surface-variant: var(--ui-color-slate-500);
137
138
  --ui-color-background: var(--ui-color-slate-50);
138
139
  --ui-color-background-info-secondary-default: var(--ui-primitive-color-blue-100);
140
+ --ui-color-background-info-secondary-hovered: var(--ui-primitive-color-blue-300);
141
+ --ui-color-border-neutral-secondary-default: var(--ui-primitive-color-grey-500);
142
+ --ui-color-border-info-secondary-hovered: var(--ui-primitive-color-blue-700);
143
+ --ui-color-border-error-primary-default: var(--ui-primitive-color-red-700);
144
+ --ui-color-text-neutral-secondary-default: var(--ui-primitive-color-grey-800);
145
+ --ui-color-icon-warning-secondary-default: var(--ui-primitive-color-orange-500);
139
146
  --ui-flyout-menu-content-max-height: 600px;
140
147
  }
141
148
  *, ::after, ::before, ::backdrop, ::file-selector-button {