@alto-avios/alto-ui 2.3.0 → 2.3.2
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/dist/assets/CardSection.css +1 -1
- package/dist/components/CardSection/CardSection.js +7 -7
- package/dist/components/Heading/Heading.d.ts +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +2 -0
- package/dist/components/index.js.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/utils/backgroundColour/backgroundColour.d.ts +1 -1
- package/dist/utils/border/border.d.ts +3 -3
- package/dist/utils/fgColour/fgColor.d.ts +1 -1
- package/dist/utils/flex/flex.d.ts +3 -3
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._cardSection_97jhf_1{align-items:center;background:var(--alto-sem-color-bg-layer1-default);box-sizing:border-box;display:flex;flex-direction:column;padding:var(--alto-section-padding-vertical-default) var(--alto-section-padding-horizontal-default);width:100vw}._cardContainer_97jhf_11{align-self:stretch;background:var(--alto-sem-color-bg-layer2-default);border-radius:var(--alto-card-radius);display:flex;flex-direction:column;justify-content:flex-end;margin:auto;max-width:var(--alto-section-container-max-width);width:100%}._cardGrid_97jhf_23{-moz-column-gap:var(--alto-grid-gutter-default);column-gap:var(--alto-grid-gutter-default);display:grid;grid-template-areas:"content" "media";grid-template-columns:repeat(12,[col-start] 1fr)}._contentCell_97jhf_33{display:grid;grid-area:content;grid-column:col-start/span 12;padding:var(--alto-sem-space-2xl) 0}._contentBox_97jhf_40{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column;gap:var(--alto-sem-space-lg);margin:auto;max-width:628px;padding:0 var(--alto-section-padding-horizontal-default)}._mediaCell_97jhf_51{display:grid;grid-area:media;grid-column:col-start/span 12;margin:0}._mediaCell_97jhf_51 img{border-radius:var(--alto-card-radius);height:100%;-o-object-fit:cover;object-fit:cover;width:100%}._isReversed_97jhf_65 ._cardGrid_97jhf_23{grid-template-areas:"media" "content"}@media screen and (min-width:768px){._contentCell_97jhf_33{grid-column:2/11;padding:var(--alto-sem-space-3xl) 0}._contentBox_97jhf_40{padding:0}}@media screen and (min-width:1024px){._cardContainer_97jhf_11{align-items:flex-end;flex-direction:row;gap:var(--alto-grid-gutter-default);max-width:var(--alto-section-container-max-width)}._cardGrid_97jhf_23{grid-template-areas:"content media"}._contentCell_97jhf_33{grid-column:2/span 5;padding:var(--alto-sem-space-2xl) 0}._mediaCell_97jhf_51{grid-column:8/span 5}._isReversed_97jhf_65 ._cardGrid_97jhf_23{grid-template-areas:"media content"}._isReversed_97jhf_65 ._contentCell_97jhf_33{grid-column:7/span 5}._isReversed_97jhf_65 ._mediaCell_97jhf_51{grid-column:1/span 5}}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { c as cva } from "../../index-Bi3v_EjJ.js";
|
|
3
3
|
import { forwardRef } from "react";
|
|
4
|
-
import '../../assets/CardSection.css';const cardSection$1 = "
|
|
5
|
-
const cardContainer = "
|
|
6
|
-
const cardGrid = "
|
|
7
|
-
const contentCell = "
|
|
8
|
-
const contentBox = "
|
|
9
|
-
const mediaCell = "
|
|
10
|
-
const isReversed = "
|
|
4
|
+
import '../../assets/CardSection.css';const cardSection$1 = "_cardSection_97jhf_1";
|
|
5
|
+
const cardContainer = "_cardContainer_97jhf_11";
|
|
6
|
+
const cardGrid = "_cardGrid_97jhf_23";
|
|
7
|
+
const contentCell = "_contentCell_97jhf_33";
|
|
8
|
+
const contentBox = "_contentBox_97jhf_40";
|
|
9
|
+
const mediaCell = "_mediaCell_97jhf_51";
|
|
10
|
+
const isReversed = "_isReversed_97jhf_65";
|
|
11
11
|
const styles = {
|
|
12
12
|
cardSection: cardSection$1,
|
|
13
13
|
cardContainer,
|
|
@@ -2,7 +2,7 @@ import { default as React } from 'react';
|
|
|
2
2
|
import { VariantProps } from 'class-variance-authority';
|
|
3
3
|
import { fgColorVariants } from '../../utils/fgColour/fgColor';
|
|
4
4
|
declare const heading: (props?: ({
|
|
5
|
-
size?: "lg" | "sm" | "xs" | "md" | "
|
|
5
|
+
size?: "lg" | "sm" | "xs" | "md" | "xl" | "xxs" | null | undefined;
|
|
6
6
|
textAlign?: "start" | "center" | "end" | null | undefined;
|
|
7
7
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
8
|
type HeadingVariants = VariantProps<typeof heading>;
|
package/dist/components/index.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import '../assets/global.css';/* empty css */
|
|
2
2
|
import { Badge } from "./Badge/Badge.js";
|
|
3
|
+
import { Box } from "./Box/Box.js";
|
|
3
4
|
import { Button } from "./Button/Button.js";
|
|
4
5
|
import { ButtonGroup } from "./ButtonGroup/ButtonGroup.js";
|
|
5
6
|
import { default as default2 } from "./CardSection/CardSection.js";
|
|
@@ -31,6 +32,7 @@ import { default as default7 } from "./ToggleIconButton/ToggleIconButton.js";
|
|
|
31
32
|
import { Tooltip } from "./Tooltip/Tooltip.js";
|
|
32
33
|
export {
|
|
33
34
|
Badge,
|
|
35
|
+
Box,
|
|
34
36
|
Button,
|
|
35
37
|
ButtonGroup,
|
|
36
38
|
default2 as CardSection,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import './assets/global.css';/* empty css */
|
|
2
2
|
import { Badge } from "./components/Badge/Badge.js";
|
|
3
|
+
import { Box } from "./components/Box/Box.js";
|
|
3
4
|
import { Button } from "./components/Button/Button.js";
|
|
4
5
|
import { ButtonGroup } from "./components/ButtonGroup/ButtonGroup.js";
|
|
5
6
|
import { default as default2 } from "./components/CardSection/CardSection.js";
|
|
@@ -31,6 +32,7 @@ import { default as default7 } from "./components/ToggleIconButton/ToggleIconBut
|
|
|
31
32
|
import { Tooltip } from "./components/Tooltip/Tooltip.js";
|
|
32
33
|
export {
|
|
33
34
|
Badge,
|
|
35
|
+
Box,
|
|
34
36
|
Button,
|
|
35
37
|
ButtonGroup,
|
|
36
38
|
default2 as CardSection,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
2
|
import { InputType } from 'storybook/internal/types';
|
|
3
3
|
export declare const backgroundColorVariants: (props?: ({
|
|
4
|
-
backgroundColour?: "
|
|
4
|
+
backgroundColour?: "transparent" | "base" | "layer1" | "layer2" | "layer3" | "accentVibrant" | "accentSubtle" | "accentDeep" | "criticalVibrant" | "criticalSubtle" | "warningVibrant" | "warningSubtle" | "cautionVibrant" | "cautionSubtle" | "successVibrant" | "successSubtle" | "informationVibrant" | "informationSubtle" | "inverseVibrant" | "inverseSubtle" | "whiteVibrant" | "whiteSubtle" | "disabledVibrant" | "disabledSubtle" | "saleVibrant" | null | undefined;
|
|
5
5
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
6
6
|
export type BackgroundVariants = VariantProps<typeof backgroundColorVariants>;
|
|
7
7
|
export declare const backgroundColourOptions: BackgroundVariants["backgroundColour"][];
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
2
|
import { InputType } from 'storybook/internal/types';
|
|
3
3
|
export declare const borderVariants: (props?: ({
|
|
4
|
-
borderRadius?: "lg" | "sm" | "xs" | "none" | "md" | "
|
|
4
|
+
borderRadius?: "lg" | "sm" | "xs" | "none" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "6xs" | "circle" | null | undefined;
|
|
5
5
|
borderWidth?: "lg" | "sm" | "xs" | "none" | "md" | "xl" | null | undefined;
|
|
6
|
-
borderStyle?: "none" | "
|
|
7
|
-
borderColour?: "none" | "white" | "critical" | "warning" | "caution" | "success" | "
|
|
6
|
+
borderStyle?: "none" | "solid" | "dashed" | null | undefined;
|
|
7
|
+
borderColour?: "none" | "white" | "critical" | "warning" | "caution" | "success" | "secondary" | "tertiary" | "accent" | "information" | "inverse" | null | undefined;
|
|
8
8
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
9
9
|
export type BorderVariants = VariantProps<typeof borderVariants>;
|
|
10
10
|
export declare const borderArgTypes: Record<string, InputType>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
2
|
export declare const fgColorVariants: (props?: ({
|
|
3
|
-
fgColor?: "default" | "
|
|
3
|
+
fgColor?: "default" | "secondary" | "accentPrimary" | "accentSecondary" | "criticalPrimary" | "whitePrimary" | "accentOnVibrant" | "accentOnVibrantAccent" | "accentOnSubtle" | "accentOnDeep" | "criticalOnVibrant" | "criticalOnSubtle" | "warningPrimary" | "warningOnVibrant" | "warningOnSubtle" | "cautionPrimary" | "cautionOnVibrant" | "cautionOnSubtle" | "successPrimary" | "successOnVibrant" | "successOnSubtle" | "informationPrimary" | "informationOnVibrant" | "informationOnSubtle" | "inversePrimary" | "inverseOnVibrant" | "inverseOnSubtle" | "whiteOnVibrant" | "whiteOnSubtle" | "disabledPrimary" | "disabledOnVibrant" | "disabledOnSubtle" | "salePrimary" | "saleOnVibrant" | null | undefined;
|
|
4
4
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
5
5
|
export type FgColorVariants = VariantProps<typeof fgColorVariants>;
|
|
@@ -2,11 +2,11 @@ import { VariantProps } from 'class-variance-authority';
|
|
|
2
2
|
export declare const flexVariants: (props?: ({
|
|
3
3
|
display?: "flex" | "inline-flex" | null | undefined;
|
|
4
4
|
justifyContent?: "start" | "center" | "end" | null | undefined;
|
|
5
|
-
flexWrap?: "
|
|
5
|
+
flexWrap?: "wrap" | "nowrap" | null | undefined;
|
|
6
6
|
flexGrow?: 0 | 1 | null | undefined;
|
|
7
7
|
flexShrink?: 0 | 1 | null | undefined;
|
|
8
|
-
flexDirection?: "row" | "
|
|
8
|
+
flexDirection?: "row" | "row-reverse" | "column" | "column-reverse" | null | undefined;
|
|
9
9
|
alignItems?: "start" | "center" | "end" | null | undefined;
|
|
10
|
-
gap?: "lg" | "sm" | "xs" | "md" | "
|
|
10
|
+
gap?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
|
|
11
11
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
12
12
|
export type FlexVariants = VariantProps<typeof flexVariants>;
|