@wistia/ui 0.2.1 → 0.3.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.
- package/dist/index.cjs +5 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +5 -5
- package/dist/index.d.ts +5 -5
- package/dist/index.mjs +5 -3
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -359,6 +359,8 @@ declare const Badge: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
|
|
|
359
359
|
label: string;
|
|
360
360
|
} & react.RefAttributes<HTMLDivElement>>;
|
|
361
361
|
|
|
362
|
+
type Spacings = 'space-01' | 'space-02' | 'space-03' | 'space-04' | 'space-05' | 'space-06' | 'space-07' | 'space-08' | 'space-09' | 'space-10' | 'space-11';
|
|
363
|
+
|
|
362
364
|
type JustifyContentType = 'center' | 'flex-end' | 'flex-start' | 'space-around' | 'space-between' | 'space-evenly';
|
|
363
365
|
type AlignContentType = 'center' | 'flex-end' | 'flex-start' | 'space-around' | 'space-between' | 'stretch';
|
|
364
366
|
type AlignItemsType = 'baseline' | 'center' | 'flex-end' | 'flex-start' | 'stretch';
|
|
@@ -366,8 +368,8 @@ type AlignSelfType = 'auto' | 'baseline' | 'center' | 'flex-end' | 'flex-start'
|
|
|
366
368
|
type DirectionType = 'column-reverse' | 'column' | 'row-reverse' | 'row';
|
|
367
369
|
type FillType = boolean | 'horizontal' | 'vertical';
|
|
368
370
|
type Gap = {
|
|
369
|
-
column:
|
|
370
|
-
row:
|
|
371
|
+
column: Spacings;
|
|
372
|
+
row: Spacings;
|
|
371
373
|
};
|
|
372
374
|
/**
|
|
373
375
|
* CSS property => Box prop:
|
|
@@ -427,7 +429,7 @@ type BoxProps = ComponentPropsWithoutRef<'div'> & {
|
|
|
427
429
|
/**
|
|
428
430
|
* Specifies the gaps (gutters) between rows and columns
|
|
429
431
|
*/
|
|
430
|
-
gap?: Gap |
|
|
432
|
+
gap?: Gap | Spacings;
|
|
431
433
|
/**
|
|
432
434
|
* Specifies what amount of space inside the flex container the item should take up
|
|
433
435
|
*
|
|
@@ -1822,8 +1824,6 @@ declare const ScreenReaderOnly: {
|
|
|
1822
1824
|
displayName: string;
|
|
1823
1825
|
};
|
|
1824
1826
|
|
|
1825
|
-
type Spacings = 'space-01' | 'space-02' | 'space-03' | 'space-04' | 'space-05' | 'space-06' | 'space-07' | 'space-08' | 'space-09' | 'space-10' | 'space-11';
|
|
1826
|
-
|
|
1827
1827
|
type StackProps = {
|
|
1828
1828
|
/**
|
|
1829
1829
|
* Optional children
|
package/dist/index.d.ts
CHANGED
|
@@ -359,6 +359,8 @@ declare const Badge: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
|
|
|
359
359
|
label: string;
|
|
360
360
|
} & react.RefAttributes<HTMLDivElement>>;
|
|
361
361
|
|
|
362
|
+
type Spacings = 'space-01' | 'space-02' | 'space-03' | 'space-04' | 'space-05' | 'space-06' | 'space-07' | 'space-08' | 'space-09' | 'space-10' | 'space-11';
|
|
363
|
+
|
|
362
364
|
type JustifyContentType = 'center' | 'flex-end' | 'flex-start' | 'space-around' | 'space-between' | 'space-evenly';
|
|
363
365
|
type AlignContentType = 'center' | 'flex-end' | 'flex-start' | 'space-around' | 'space-between' | 'stretch';
|
|
364
366
|
type AlignItemsType = 'baseline' | 'center' | 'flex-end' | 'flex-start' | 'stretch';
|
|
@@ -366,8 +368,8 @@ type AlignSelfType = 'auto' | 'baseline' | 'center' | 'flex-end' | 'flex-start'
|
|
|
366
368
|
type DirectionType = 'column-reverse' | 'column' | 'row-reverse' | 'row';
|
|
367
369
|
type FillType = boolean | 'horizontal' | 'vertical';
|
|
368
370
|
type Gap = {
|
|
369
|
-
column:
|
|
370
|
-
row:
|
|
371
|
+
column: Spacings;
|
|
372
|
+
row: Spacings;
|
|
371
373
|
};
|
|
372
374
|
/**
|
|
373
375
|
* CSS property => Box prop:
|
|
@@ -427,7 +429,7 @@ type BoxProps = ComponentPropsWithoutRef<'div'> & {
|
|
|
427
429
|
/**
|
|
428
430
|
* Specifies the gaps (gutters) between rows and columns
|
|
429
431
|
*/
|
|
430
|
-
gap?: Gap |
|
|
432
|
+
gap?: Gap | Spacings;
|
|
431
433
|
/**
|
|
432
434
|
* Specifies what amount of space inside the flex container the item should take up
|
|
433
435
|
*
|
|
@@ -1822,8 +1824,6 @@ declare const ScreenReaderOnly: {
|
|
|
1822
1824
|
displayName: string;
|
|
1823
1825
|
};
|
|
1824
1826
|
|
|
1825
|
-
type Spacings = 'space-01' | 'space-02' | 'space-03' | 'space-04' | 'space-05' | 'space-06' | 'space-07' | 'space-08' | 'space-09' | 'space-10' | 'space-11';
|
|
1826
|
-
|
|
1827
1827
|
type StackProps = {
|
|
1828
1828
|
/**
|
|
1829
1829
|
* Optional children
|
package/dist/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.
|
|
3
|
+
* @license @wistia/ui v0.3.0
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -5881,9 +5881,11 @@ var propsForFlexChildren = /* @__PURE__ */ new Set(["alignSelf", "basis", "grow"
|
|
|
5881
5881
|
var getGapStyle = (gap) => {
|
|
5882
5882
|
if (isNotNil6(gap)) {
|
|
5883
5883
|
if (isRecord2(gap)) {
|
|
5884
|
-
return Object.entries(gap).map(([key, value]) =>
|
|
5884
|
+
return Object.entries(gap).map(([key, value]) => {
|
|
5885
|
+
return `${key}-gap: var(--wui-${value})};`;
|
|
5886
|
+
}).join("");
|
|
5885
5887
|
}
|
|
5886
|
-
return `gap:
|
|
5888
|
+
return `gap: var(--wui-${gap.toString()})};`;
|
|
5887
5889
|
}
|
|
5888
5890
|
return void 0;
|
|
5889
5891
|
};
|