@lightsparkdev/ui 0.0.8 → 0.0.11

package/dist/styles/type.js

@@ -1,151 +1,15 @@
 "use client";
 import {
-  firstChild,
-  pxToRems
-} from "../chunk-2YB7653N.js";
-import "../chunk-HNVQIY5U.js";
+  Heading,
+  headingWithDefaults,
+  headings
+} from "../chunk-P3EUPXFA.js";
+import "../chunk-FCZJILMW.js";
+import "../chunk-JK4BP73A.js";
 import "../chunk-2VBDEO6M.js";
 import "../chunk-E4EXM4SY.js";
-import {
-  bp
-} from "../chunk-JSGRNWSB.js";
-import {
-  __spreadValues
-} from "../chunk-CIGAQ47A.js";
-
-// src/styles/type.tsx
-import { css, useTheme } from "@emotion/react";
-import styled from "@emotion/styled";
-import { jsx } from "@emotion/react/jsx-runtime";
-var defaultHeadingSizes = {
-  h1: {
-    size: 32,
-    sizeSm: 21
-  },
-  h2: {
-    size: 24,
-    sizeSm: 18
-  },
-  h3: {
-    size: 21,
-    sizeSm: 18
-  },
-  h4: {
-    size: 14,
-    sizeSm: 14
-  }
-};
-var defaultHeadingMargins = {
-  h1: {
-    mt: 24,
-    mb: 24,
-    mtSm: 24,
-    mbSm: 24
-  },
-  h2: {
-    mt: 24,
-    mb: 24,
-    mtSm: 24,
-    mbSm: 24
-  },
-  h3: {
-    mt: 24,
-    mb: 24,
-    mtSm: 24,
-    mbSm: 24
-  },
-  h4: {
-    mt: 16,
-    mb: 16,
-    mtSm: 16,
-    mbSm: 16
-  }
-};
-var baseHeading = ({ mt, mb, mtSm, mbSm, theme }) => css`
-  line-height: 1.214em;
-
-  margin-bottom: ${mb}px;
-  margin-top: ${mt}px;
-
-  ${bp.sm(`
-    margin-top: ${mtSm}px;
-    margin-bottom: ${mbSm}px;
-  `)}
-`;
-var firstChildStyles = firstChild(`margin-top: 0;`);
-var headings = {
-  h1: styled.h1`
-    ${(props) => baseHeading(props)}
-    ${firstChildStyles}
-
-    font-size: ${pxToRems(defaultHeadingSizes.h1.size)};
-    font-weight: ${({ light }) => light ? 400 : 800}};
-    ${bp.sm(`
-      font-size: ${pxToRems(defaultHeadingSizes.h1.sizeSm)};
-    `)}
-  `,
-  h2: styled.h2`
-    ${(props) => baseHeading(props)}
-    ${firstChildStyles}
-
-    font-size: ${pxToRems(defaultHeadingSizes.h2.size)};
-    font-weight: ${({ light }) => light ? 400 : 700}};
-    ${bp.sm(`
-      font-size: ${pxToRems(defaultHeadingSizes.h2.sizeSm)};
-    `)}
-  `,
-  h3: styled.h3`
-    ${(props) => baseHeading(props)}
-    ${firstChildStyles}
-
-    font-size: ${pxToRems(defaultHeadingSizes.h3.size)};
-    font-weight: ${({ light }) => light ? 400 : 700}};
-    ${bp.sm(`
-      font-size: ${pxToRems(defaultHeadingSizes.h3.sizeSm)};
-    `)}
-  `,
-  h4: styled.h4`
-    ${(props) => baseHeading(props)}
-    ${firstChildStyles}
-
-    font-size: ${pxToRems(defaultHeadingSizes.h4.size)};
-    font-weight: ${({ light }) => light ? 400 : 600}};
-    ${bp.sm(`
-      font-size: ${pxToRems(defaultHeadingSizes.h4.sizeSm)};
-    `)}
-  `
-};
-function Heading({
-  children,
-  type = "h2",
-  id,
-  mt = defaultHeadingMargins[type].mt,
-  mb = defaultHeadingMargins[type].mb,
-  mtSm = defaultHeadingMargins[type].mtSm,
-  mbSm = defaultHeadingMargins[type].mbSm,
-  m0 = false,
-  light = false
-}) {
-  const StyledHeading = headings[type];
-  const theme = useTheme();
-  const heading = /* @__PURE__ */ jsx(
-    StyledHeading,
-    {
-      id,
-      mt: m0 ? 0 : mt,
-      mb: m0 ? 0 : mb,
-      mtSm: m0 ? 0 : mtSm,
-      mbSm: m0 ? 0 : mbSm,
-      light,
-      theme,
-      children: id ? /* @__PURE__ */ jsx("a", { href: `#${id}`, css: { color: "inherit" }, children }) : children
-    }
-  );
-  return heading;
-}
-function headingWithDefaults(defaultProps) {
-  return (props) => /* @__PURE__ */ jsx(Heading, __spreadValues(__spreadValues({}, defaultProps), props));
-}
+import "../chunk-JSGRNWSB.js";
+import "../chunk-CIGAQ47A.js";
 export {
   Heading,
   headingWithDefaults,

package/dist/styles/utils.cjs

@@ -1276,30 +1276,44 @@ function hexToRGB(hex) {
 // src/styles/common.tsx
 var rootFontSizePx = 12;
 var rootFontSizeRems = rootFontSizePx / 16;
-var standardContentInsetPx = 32;
-var standardContentInsetMdPx = 24;
-var standardContentInsetSmPx = 16;
-var smContentInset = import_react4.css`
-  ${bp.sm(`
-    margin-left: auto;
-    margin-right: auto;
-    width: calc(100% - ${standardContentInsetSmPx * 2}px);
-  `)}
-`;
-var minSmMaxLgContentInset = import_react4.css`
-  ${bp.minSmMaxLg(`
-    width: calc(100% - ${standardContentInsetMdPx * 2}px);
-  `)}
-`;
-var standardContentInset = import_react4.css`
-  margin-left: auto;
-  margin-right: auto;
-  width: calc(100% - ${standardContentInsetPx * 2}px);
-  max-width: 1280px;
-
-  ${smContentInset}
-  ${minSmMaxLgContentInset}
-`;
+function buildStandardContentInset(smPx, minSmMaxLgPx, lgPx) {
+  const smCSS = import_react4.css`
+    ${bp.sm(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${smPx * 2}px);
+    `)}
+  `;
+  const minSmMaxLgCSS = import_react4.css`
+    ${bp.minSmMaxLg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${minSmMaxLgPx * 2}px);
+    `)}
+  `;
+  const lgCSS = import_react4.css`
+    ${bp.lg(`
+      margin-left: auto;
+      margin-right: auto;
+      width: calc(100% - ${lgPx * 2}px);
+      max-width: 1280px;
+    `)}
+  `;
+  return {
+    smPx,
+    minSmMaxLgPx,
+    lgPx,
+    smCSS,
+    minSmMaxLgCSS,
+    lgCSS,
+    css: import_react4.css`
+      ${lgCSS}
+      ${smCSS}
+      ${minSmMaxLgCSS}
+    `
+  };
+}
+var standardContentInset = buildStandardContentInset(16, 24, 32);
 var standardCardShadow = import_react4.css`
   box-shadow:
     0px 4px 10px 0px rgba(0, 0, 0, 0.08),

package/dist/styles/utils.js

@@ -13,8 +13,8 @@ import {
   remsToPx,
   size,
   textCenter
-} from "../chunk-2YB7653N.js";
-import "../chunk-HNVQIY5U.js";
+} from "../chunk-FCZJILMW.js";
+import "../chunk-JK4BP73A.js";
 import "../chunk-2VBDEO6M.js";
 import "../chunk-E4EXM4SY.js";
 import "../chunk-JSGRNWSB.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lightsparkdev/ui",
-  "version": "0.0.8",
+  "version": "0.0.11",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -43,7 +43,7 @@
     "@emotion/css": "^11.11.0",
     "@emotion/react": "^11.11.0",
     "@emotion/styled": "^11.11.0",
-    "@lightsparkdev/core": "1.0.17",
+    "@lightsparkdev/core": "1.0.20",
     "@simbathesailor/use-what-changed": "^2.0.0",
     "gql": "^1.1.2",
     "lodash-es": "^4.17.21",
@@ -55,7 +55,7 @@
   },
   "devDependencies": {
     "@lightsparkdev/eslint-config": "*",
-    "@lightsparkdev/tsconfig": "0.0.0",
+    "@lightsparkdev/tsconfig": "0.0.1",
     "@svgr/plugin-jsx": "^8.1.0",
     "@testing-library/dom": "^9.2.0",
     "@testing-library/jest-dom": "^6.1.2",
@@ -81,5 +81,8 @@
   "files": [
     "dist/*",
     "CHANGELOG.md"
-  ]
+  ],
+  "engines": {
+    "node": ">=18"
+  }
 }