@lightsparkdev/ui 1.0.7 → 1.0.8

package/dist/{chunk-UACBVBBE.js → chunk-QQTZ6DZL.js}

@@ -3,17 +3,17 @@ import {
 } from "./chunk-EDN2QDCB.js";
 import {
   icons_exports
-} from "./chunk-Y6Q37DGW.js";
+} from "./chunk-QQLUKKYZ.js";
 import {
   invertFillColor,
   invertStrokeColor
 } from "./chunk-VI6WTKMV.js";
 import {
   rootFontSizePx
-} from "./chunk-GMM3LRXY.js";
+} from "./chunk-APUV4UN4.js";
 import {
   getFontColor
-} from "./chunk-I4NIA4SD.js";
+} from "./chunk-W5I53DTZ.js";
 
 // src/components/Icon/Icon.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-WONQPE5P.js → chunk-QU7VRXE6.js}

@@ -3,23 +3,28 @@ import {
 } from "./chunk-YMNSXZ5D.js";
 import {
   toNonTypographicReactNodes
-} from "./chunk-J2NLRI2M.js";
+} from "./chunk-UC6SP4KJ.js";
+import {
+  typographyStyles
+} from "./chunk-EGOOSBGG.js";
 import {
   applyTypography
-} from "./chunk-L3BNIBK3.js";
+} from "./chunk-GHXNMLAB.js";
 
 // src/components/typography/Headline.tsx
 import styled from "@emotion/styled";
 import { jsx } from "@emotion/react/jsx-runtime";
 var headlineElements = ["h1", "h2", "h3", "h4", "h5", "h6"];
 var Headline = ({
-  content,
-  color,
-  size = "Medium",
+  block = false,
   children,
+  color,
+  content,
+  display,
   heading = "h1",
+  hideOverflow = false,
   id,
-  display = "block"
+  size = "Medium"
 }) => {
   let reactNodes = children || null;
   if (content) {
@@ -29,21 +34,19 @@ var Headline = ({
     StyledHeadline,
     {
       as: heading,
-      id,
-      size,
+      block,
       colorProp: color,
       displayProp: display,
+      hideOverflow,
+      id,
+      size,
       children: reactNodes
     }
   );
 };
 var StyledHeadline = styled.span`
-  /* Margins should always be set in display contexts eg Article */
-  margin: 0;
-
-  display: ${({ displayProp }) => displayProp};
-
   ${({ theme, size, colorProp }) => applyTypography(theme, "Headline", size, colorProp)}
+  ${typographyStyles}
 `;
 function headlineSelector(heading) {
   return `${heading}${select(StyledHeadline)}`;

package/dist/{chunk-FQWU3AUO.cjs → chunk-RKBBY43D.cjs}

@@ -3,30 +3,50 @@
 var _chunk6VA4SAHQcjs = require('./chunk-6VA4SAHQ.cjs');
 
 
-var _chunkHKSBGUB7cjs = require('./chunk-HKSBGUB7.cjs');
+var _chunkAZRC3MXCcjs = require('./chunk-AZRC3MXC.cjs');
 
 
-var _chunkIXV57HL7cjs = require('./chunk-IXV57HL7.cjs');
+var _chunkG5HBO2FIcjs = require('./chunk-G5HBO2FI.cjs');
+
+
+var _chunkZBBVZQKJcjs = require('./chunk-ZBBVZQKJ.cjs');
 
 // src/components/typography/Display.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
 var _jsxruntime = require('@emotion/react/jsx-runtime');
 var displayElements = ["h1", "h2", "h3", "h4", "h5", "h6"];
 var Display = ({
-  content,
+  block = false,
   children,
   color,
+  content,
+  display,
+  hideOverflow = false,
+  id,
   size = "Medium",
-  element = "h1"
+  tag = "h1"
 }) => {
   let reactNodes = children || null;
   if (content) {
-    reactNodes = _chunkHKSBGUB7cjs.toNonTypographicReactNodes.call(void 0, content);
+    reactNodes = _chunkAZRC3MXCcjs.toNonTypographicReactNodes.call(void 0, content);
   }
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledDisplay, { as: element, size, colorProp: color, children: reactNodes });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    StyledDisplay,
+    {
+      as: tag,
+      block,
+      colorProp: color,
+      displayProp: display,
+      hideOverflow,
+      id,
+      size,
+      children: reactNodes
+    }
+  );
 };
 var StyledDisplay = _styled2.default.span`
-  ${({ theme, size, colorProp }) => _chunkIXV57HL7cjs.applyTypography.call(void 0, theme, "Display", size, colorProp)}
+  ${({ theme, size, colorProp }) => _chunkZBBVZQKJcjs.applyTypography.call(void 0, theme, "Display", size, colorProp)}
+  ${_chunkG5HBO2FIcjs.typographyStyles}
 `;
 function displaySelector(element) {
   return `${element}${_chunk6VA4SAHQcjs.select.call(void 0, StyledDisplay)}`;

package/dist/{chunk-7GCXP2EW.js → chunk-RT4SDUU6.js}

@@ -1,6 +1,6 @@
 import {
   Icon
-} from "./chunk-UACBVBBE.js";
+} from "./chunk-QQTZ6DZL.js";
 
 // src/components/Loading.tsx
 import { useTheme } from "@emotion/react";

package/dist/{chunk-OGJLMW37.js → chunk-RZMG2TID.js}

@@ -1,16 +1,16 @@
 import {
   applyTypography
-} from "./chunk-L3BNIBK3.js";
+} from "./chunk-GHXNMLAB.js";
 import {
   z
 } from "./chunk-55OQPFLF.js";
 import {
   standardBorderRadius,
   subtext
-} from "./chunk-GMM3LRXY.js";
+} from "./chunk-APUV4UN4.js";
 import {
   themeOr
-} from "./chunk-I4NIA4SD.js";
+} from "./chunk-W5I53DTZ.js";
 
 // src/styles/fields.tsx
 import { css } from "@emotion/react";
@@ -76,11 +76,12 @@ var textInputStyle = ({
   hasError,
   paddingLeftPx,
   paddingRightPx,
-  typography
+  typography,
+  borderRadius
 }) => {
   var _a;
   return css`
-  border-radius: ${textInputBorderRadiusPx}px;
+  border-radius: ${borderRadius === "round" ? "999" : textInputBorderRadiusPx}px;
   background-color: ${disabled ? theme.vlcNeutral : theme.inputBackground};
   cursor: ${disabled ? "not-allowed" : "auto"};
   box-sizing: border-box;

package/dist/{chunk-E42IFW4E.cjs → chunk-SEJXEWOJ.cjs}

@@ -1,30 +1,48 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkHKSBGUB7cjs = require('./chunk-HKSBGUB7.cjs');
+var _chunkAZRC3MXCcjs = require('./chunk-AZRC3MXC.cjs');
 
 
-var _chunkIXV57HL7cjs = require('./chunk-IXV57HL7.cjs');
+var _chunkG5HBO2FIcjs = require('./chunk-G5HBO2FI.cjs');
+
+
+var _chunkZBBVZQKJcjs = require('./chunk-ZBBVZQKJ.cjs');
 
 // src/components/typography/Body.tsx
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
 var _jsxruntime = require('@emotion/react/jsx-runtime');
 var Body = ({
-  content,
+  block = false,
+  children,
   color,
+  content,
+  display,
+  hideOverflow = false,
+  id,
   size = "Medium",
-  children,
-  block = false,
   tag = "span"
 }) => {
   let reactNodes = children || null;
   if (content) {
-    reactNodes = _chunkHKSBGUB7cjs.toNonTypographicReactNodes.call(void 0, content);
+    reactNodes = _chunkAZRC3MXCcjs.toNonTypographicReactNodes.call(void 0, content);
   }
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledBody, { size, colorProp: color, block, as: tag, children: reactNodes });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    StyledBody,
+    {
+      as: tag,
+      block,
+      colorProp: color,
+      displayProp: display,
+      hideOverflow,
+      id,
+      size,
+      children: reactNodes
+    }
+  );
 };
 var StyledBody = _styled2.default.span`
-  ${({ theme, size, colorProp }) => _chunkIXV57HL7cjs.applyTypography.call(void 0, theme, "Body", size, colorProp)}
-  ${({ block }) => block ? "display: block;" : ""}
+  ${({ theme, size, colorProp }) => _chunkZBBVZQKJcjs.applyTypography.call(void 0, theme, "Body", size, colorProp)}
+  ${_chunkG5HBO2FIcjs.typographyStyles}
 `;
 
 

package/dist/{chunk-4ZEUQBJZ.js → chunk-SI63PJGM.js}

@@ -1,16 +1,16 @@
 import {
   setDefaultReactNodesTypography,
   toReactNodes
-} from "./chunk-XCEI3WIL.js";
+} from "./chunk-JZJQOZEN.js";
 import {
   Icon
-} from "./chunk-UACBVBBE.js";
+} from "./chunk-QQTZ6DZL.js";
 import {
   standardBorderRadius
-} from "./chunk-GMM3LRXY.js";
+} from "./chunk-APUV4UN4.js";
 import {
   getColor
-} from "./chunk-I4NIA4SD.js";
+} from "./chunk-W5I53DTZ.js";
 
 // src/components/Badge.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-AWTA3QRN.js → chunk-SXY5KR2T.js}

@@ -1,6 +1,6 @@
 import {
   pxToRems
-} from "./chunk-JQV6H76U.js";
+} from "./chunk-DNRHVCOE.js";
 
 // src/components/StatusIndicator.tsx
 import styled from "@emotion/styled";

package/dist/{chunk-WI6IO34N.cjs → chunk-T7PTO2D2.cjs}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunk3O67L2QOcjs = require('./chunk-3O67L2QO.cjs');
+var _chunkNNTGGG2Ccjs = require('./chunk-NNTGGG2C.cjs');
 
 
-var _chunkQR6XKKRKcjs = require('./chunk-QR6XKKRK.cjs');
+var _chunkKLC2OBTGcjs = require('./chunk-KLC2OBTG.cjs');
 
 
 
@@ -241,7 +241,7 @@ function CodeInput({
     const inputId = getInputId(i);
     inputs.push(
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunk3O67L2QOcjs.SingleCodeInput,
+        _chunkNNTGGG2Ccjs.SingleCodeInput,
         {
           value: inputState[inputId].value,
           id: inputId,
@@ -316,7 +316,7 @@ var CodeInputGroup = _styled2.default.div`
 var CodeInputGroupSeparator = _styled2.default.div`
   width: ${separatorWidth}px;
   height: 4px;
-  background-color: ${_chunkQR6XKKRKcjs.textInputBorderColor};
+  background-color: ${_chunkKLC2OBTGcjs.textInputBorderColor};
   border-radius: 2px;
   margin: 0 ${separatorMargin}px;
 `;