@wistia/ui 0.0.14 → 0.0.15
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 +96 -7
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.mjs +96 -7
- package/dist/index.mjs.map +1 -1
- package/package.json +6 -4
package/dist/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.0.
|
|
3
|
+
* @license @wistia/ui v0.0.15
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2024, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -503,6 +503,48 @@ var lightGlobalTokens = import_styled_components3.css`
|
|
|
503
503
|
--gray-alpha-10: #0000117d;
|
|
504
504
|
--gray-alpha-11: #00000a9c;
|
|
505
505
|
--gray-alpha-12: #000005de;
|
|
506
|
+
--vendor-hubspot-1: #fefcfb;
|
|
507
|
+
--vendor-hubspot-2: #fff5f2;
|
|
508
|
+
--vendor-hubspot-3: #ffe9e2;
|
|
509
|
+
--vendor-hubspot-4: #ffd7c9;
|
|
510
|
+
--vendor-hubspot-5: #ffc8b7;
|
|
511
|
+
--vendor-hubspot-6: #ffb8a3;
|
|
512
|
+
--vendor-hubspot-7: #ffa48d;
|
|
513
|
+
--vendor-hubspot-8: #f68a70;
|
|
514
|
+
--vendor-hubspot-9: #ff5c36;
|
|
515
|
+
--vendor-hubspot-10: #f24d25;
|
|
516
|
+
--vendor-hubspot-11: #d93a0f;
|
|
517
|
+
--vendor-hubspot-12: #5b2a1e;
|
|
518
|
+
--vendor-hubspot-surface: #fff3efcc;
|
|
519
|
+
--vendor-hubspot-contrast: #ffffff;
|
|
520
|
+
--vendor-marketo-1: #fdfdff;
|
|
521
|
+
--vendor-marketo-2: #f7f8ff;
|
|
522
|
+
--vendor-marketo-3: #eff2ff;
|
|
523
|
+
--vendor-marketo-4: #e3e8ff;
|
|
524
|
+
--vendor-marketo-5: #d5ddff;
|
|
525
|
+
--vendor-marketo-6: #c5cfff;
|
|
526
|
+
--vendor-marketo-7: #b0bcfa;
|
|
527
|
+
--vendor-marketo-8: #93a0f2;
|
|
528
|
+
--vendor-marketo-9: #4c50cc;
|
|
529
|
+
--vendor-marketo-10: #4040bb;
|
|
530
|
+
--vendor-marketo-11: #4f55c7;
|
|
531
|
+
--vendor-marketo-12: #252a62;
|
|
532
|
+
--vendor-marketo-surface: #f5f6ffcc;
|
|
533
|
+
--vendor-marketo-contrast: #ffffff;
|
|
534
|
+
--vendor-pardot-1: #fafdff;
|
|
535
|
+
--vendor-pardot-2: #f3fafe;
|
|
536
|
+
--vendor-pardot-3: #e1f5ff;
|
|
537
|
+
--vendor-pardot-4: #ceeeff;
|
|
538
|
+
--vendor-pardot-5: #bae5ff;
|
|
539
|
+
--vendor-pardot-6: #a4d9fa;
|
|
540
|
+
--vendor-pardot-7: #85c9f1;
|
|
541
|
+
--vendor-pardot-8: #4fb3e8;
|
|
542
|
+
--vendor-pardot-9: #00a1e0;
|
|
543
|
+
--vendor-pardot-10: #0094cf;
|
|
544
|
+
--vendor-pardot-11: #0079b5;
|
|
545
|
+
--vendor-pardot-12: #0c3a51;
|
|
546
|
+
--vendor-pardot-surface: #f0f9fecc;
|
|
547
|
+
--vendor-pardot-contrast: #ffffff;
|
|
506
548
|
`;
|
|
507
549
|
var darkGlobalTokens = import_styled_components3.css`
|
|
508
550
|
--app-background: #101629;
|
|
@@ -792,6 +834,48 @@ var darkGlobalTokens = import_styled_components3.css`
|
|
|
792
834
|
--gray-alpha-10: #a4bffe96;
|
|
793
835
|
--gray-alpha-11: #b4caffde;
|
|
794
836
|
--gray-alpha-12: #e4eeff;
|
|
837
|
+
--vendor-hubspot-1: #1d1513;
|
|
838
|
+
--vendor-hubspot-2: #231815;
|
|
839
|
+
--vendor-hubspot-3: #3b1a12;
|
|
840
|
+
--vendor-hubspot-4: #511609;
|
|
841
|
+
--vendor-hubspot-5: #601d0d;
|
|
842
|
+
--vendor-hubspot-6: #702a1a;
|
|
843
|
+
--vendor-hubspot-7: #883a27;
|
|
844
|
+
--vendor-hubspot-8: #af4a33;
|
|
845
|
+
--vendor-hubspot-9: #ff5c36;
|
|
846
|
+
--vendor-hubspot-10: #f14f28;
|
|
847
|
+
--vendor-hubspot-11: #ff9578;
|
|
848
|
+
--vendor-hubspot-12: #ffd5ca;
|
|
849
|
+
--vendor-hubspot-surface: #361a0280;
|
|
850
|
+
--vendor-hubspot-contrast: #ffffff;
|
|
851
|
+
--vendor-marketo-1: #141621;
|
|
852
|
+
--vendor-marketo-2: #161827;
|
|
853
|
+
--vendor-marketo-3: #1f234a;
|
|
854
|
+
--vendor-marketo-4: #262a66;
|
|
855
|
+
--vendor-marketo-5: #2f3476;
|
|
856
|
+
--vendor-marketo-6: #383f83;
|
|
857
|
+
--vendor-marketo-7: #444c97;
|
|
858
|
+
--vendor-marketo-8: #515ab4;
|
|
859
|
+
--vendor-marketo-9: #4c50cc;
|
|
860
|
+
--vendor-marketo-10: #4040bb;
|
|
861
|
+
--vendor-marketo-11: #9faeff;
|
|
862
|
+
--vendor-marketo-12: #dae1ff;
|
|
863
|
+
--vendor-marketo-surface: #1c1a2680;
|
|
864
|
+
--vendor-marketo-contrast: #ffffff;
|
|
865
|
+
--vendor-pardot-1: #0e191f;
|
|
866
|
+
--vendor-pardot-2: #111d24;
|
|
867
|
+
--vendor-pardot-3: #092c3d;
|
|
868
|
+
--vendor-pardot-4: #003752;
|
|
869
|
+
--vendor-pardot-5: #004463;
|
|
870
|
+
--vendor-pardot-6: #055274;
|
|
871
|
+
--vendor-pardot-7: #15648a;
|
|
872
|
+
--vendor-pardot-8: #197ba9;
|
|
873
|
+
--vendor-pardot-9: #00a1e0;
|
|
874
|
+
--vendor-pardot-10: #0095d3;
|
|
875
|
+
--vendor-pardot-11: #62c3f8;
|
|
876
|
+
--vendor-pardot-12: #bfe7ff;
|
|
877
|
+
--vendor-pardot-surface: #12242080;
|
|
878
|
+
--vendor-pardot-contrast: #ffffff;
|
|
795
879
|
`;
|
|
796
880
|
|
|
797
881
|
// src/css/designTokens/colorAlias.tsx
|
|
@@ -1575,7 +1659,10 @@ var colorSchemeOptions = [
|
|
|
1575
1659
|
"orange",
|
|
1576
1660
|
"pink",
|
|
1577
1661
|
"purple",
|
|
1578
|
-
"yellow"
|
|
1662
|
+
"yellow",
|
|
1663
|
+
"vendor-hubspot",
|
|
1664
|
+
"vendor-marketo",
|
|
1665
|
+
"vendor-pardot"
|
|
1579
1666
|
];
|
|
1580
1667
|
var StyledColorSchemeWrapper = import_styled_components11.default.div`
|
|
1581
1668
|
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
@@ -1771,8 +1858,8 @@ var import_react7 = require("react");
|
|
|
1771
1858
|
var import_styled_components14 = __toESM(require("styled-components"));
|
|
1772
1859
|
var import_type_guards8 = require("@wistia/type-guards");
|
|
1773
1860
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
1774
|
-
var isDev = process.env["NODE_ENV"] === "development";
|
|
1775
|
-
var
|
|
1861
|
+
var isDev = process.env["NODE_ENV"] === "development" || process.env["NODE_ENV"] === "test";
|
|
1862
|
+
var propsForFlexChildren = /* @__PURE__ */ new Set(["alignSelf", "basis", "grow", "order", "shrink"]);
|
|
1776
1863
|
var getGapStyle = (gap) => {
|
|
1777
1864
|
if ((0, import_type_guards8.isNotNil)(gap)) {
|
|
1778
1865
|
if ((0, import_type_guards8.isRecord)(gap)) {
|
|
@@ -1862,7 +1949,7 @@ var Box = ({
|
|
|
1862
1949
|
}) => {
|
|
1863
1950
|
if (isDev && !hasBoxParent) {
|
|
1864
1951
|
Object.keys(otherProps).forEach((prop) => {
|
|
1865
|
-
if (
|
|
1952
|
+
if (propsForFlexChildren.has(prop)) {
|
|
1866
1953
|
console.warn(`${prop} only has an effect on <Box> instances that are children of a <Box>`);
|
|
1867
1954
|
}
|
|
1868
1955
|
});
|
|
@@ -5597,7 +5684,7 @@ var getAlignment = (align) => {
|
|
|
5597
5684
|
if (align === "right") {
|
|
5598
5685
|
return "flex-end";
|
|
5599
5686
|
}
|
|
5600
|
-
return
|
|
5687
|
+
return "flex-start";
|
|
5601
5688
|
};
|
|
5602
5689
|
var ButtonGroupComponent = import_styled_components20.default.div`
|
|
5603
5690
|
display: flex;
|
|
@@ -6016,11 +6103,12 @@ var disabledStyle = import_styled_components26.css`
|
|
|
6016
6103
|
`;
|
|
6017
6104
|
var SPACE_BETWEEN_LABEL_AND_INPUT = "var(--space-02)";
|
|
6018
6105
|
var StyledLabel = import_styled_components26.default.label`
|
|
6019
|
-
display: block;
|
|
6106
|
+
display: inline-block;
|
|
6020
6107
|
font-size: var(--typography-label-1-size);
|
|
6021
6108
|
font-weight: var(--typography-label-1-weight);
|
|
6022
6109
|
line-height: var(--typography-label-1-line-height);
|
|
6023
6110
|
margin-bottom: ${SPACE_BETWEEN_LABEL_AND_INPUT};
|
|
6111
|
+
cursor: inherit;
|
|
6024
6112
|
width: 100%;
|
|
6025
6113
|
|
|
6026
6114
|
/* if label is wrapping an input this ensures it appears beneath the label with a nice margin */
|
|
@@ -6050,6 +6138,7 @@ var Label = ({
|
|
|
6050
6138
|
StyledLabel,
|
|
6051
6139
|
{
|
|
6052
6140
|
disabled,
|
|
6141
|
+
htmlFor,
|
|
6053
6142
|
required,
|
|
6054
6143
|
screenReaderOnly,
|
|
6055
6144
|
...otherProps,
|