@x-plat/design-system 0.1.1

package/dist/layout/Grid/FullGrid/index.cjs

@@ -0,0 +1,54 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/Grid/FullGrid/index.ts
+var FullGrid_exports = {};
+__export(FullGrid_exports, {
+  FullGrid: () => FullGrid_default
+});
+module.exports = __toCommonJS(FullGrid_exports);
+
+// node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+
+// src/layout/Grid/FullGrid/FullGrid.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var FullGrid = (props) => {
+  const { children, className } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: clsx_default("lib-xplat-full-grid", className), children });
+};
+FullGrid.displayName = "FullGrid";
+var FullGrid_default = FullGrid;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FullGrid
+});

package/dist/layout/Grid/FullGrid/index.css

@@ -0,0 +1,21 @@
+/* src/layout/Grid/FullGrid/fullgrid.scss */
+.lib-xplat-full-grid {
+  display: grid;
+  flex: 1;
+  grid-template-columns: repeat(12, 1fr);
+}
+@media (min-width: 0px) and (max-width: 768px) {
+  .lib-xplat-full-grid {
+    grid-template-columns: repeat(4, 1fr);
+  }
+}
+@media (min-width: 768px) and (max-width: 1024px) {
+  .lib-xplat-full-grid {
+    grid-template-columns: repeat(8, 1fr);
+  }
+}
+@media (min-width: 1024px) and (max-width: 9999px) {
+  .lib-xplat-full-grid {
+    grid-template-columns: repeat(12, 1fr);
+  }
+}

package/dist/layout/Grid/FullGrid/index.d.cts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface FullGridProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const FullGrid: React.FC<FullGridProps>;
+
+export { FullGrid };

package/dist/layout/Grid/FullGrid/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface FullGridProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const FullGrid: React.FC<FullGridProps>;
+
+export { FullGrid };

package/dist/layout/Grid/FullGrid/index.js

@@ -0,0 +1,27 @@
+// node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+
+// src/layout/Grid/FullGrid/FullGrid.tsx
+import { jsx } from "react/jsx-runtime";
+var FullGrid = (props) => {
+  const { children, className } = props;
+  return /* @__PURE__ */ jsx("div", { className: clsx_default("lib-xplat-full-grid", className), children });
+};
+FullGrid.displayName = "FullGrid";
+var FullGrid_default = FullGrid;
+export {
+  FullGrid_default as FullGrid
+};

package/dist/layout/Grid/FullScreen/index.cjs

@@ -0,0 +1,54 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/Grid/FullScreen/index.ts
+var FullScreen_exports = {};
+__export(FullScreen_exports, {
+  FullScreen: () => FullScreen_default
+});
+module.exports = __toCommonJS(FullScreen_exports);
+
+// node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+
+// src/layout/Grid/FullScreen/FullScreen.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var FullScreen = (props) => {
+  const { children, className } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: clsx_default("lib-xplat-full-screen", className), children });
+};
+FullScreen.displayName = "FullScreen";
+var FullScreen_default = FullScreen;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FullScreen
+});

package/dist/layout/Grid/FullScreen/index.css

@@ -0,0 +1,23 @@
+/* src/layout/Grid/FullScreen/fullscreen.scss */
+.lib-xplat-full-screen {
+  display: grid;
+  flex: 1;
+  height: 100%;
+  overflow: hidden;
+  grid-template-columns: repeat(12, 1fr);
+}
+@media (min-width: 0px) and (max-width: 768px) {
+  .lib-xplat-full-screen {
+    grid-template-columns: repeat(4, 1fr);
+  }
+}
+@media (min-width: 768px) and (max-width: 1024px) {
+  .lib-xplat-full-screen {
+    grid-template-columns: repeat(8, 1fr);
+  }
+}
+@media (min-width: 1024px) and (max-width: 9999px) {
+  .lib-xplat-full-screen {
+    grid-template-columns: repeat(12, 1fr);
+  }
+}

package/dist/layout/Grid/FullScreen/index.d.cts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface FullGridProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const FullScreen: React.FC<FullGridProps>;
+
+export { FullScreen };

package/dist/layout/Grid/FullScreen/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+
+interface FullGridProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const FullScreen: React.FC<FullGridProps>;
+
+export { FullScreen };

package/dist/layout/Grid/FullScreen/index.js

@@ -0,0 +1,27 @@
+// node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+
+// src/layout/Grid/FullScreen/FullScreen.tsx
+import { jsx } from "react/jsx-runtime";
+var FullScreen = (props) => {
+  const { children, className } = props;
+  return /* @__PURE__ */ jsx("div", { className: clsx_default("lib-xplat-full-screen", className), children });
+};
+FullScreen.displayName = "FullScreen";
+var FullScreen_default = FullScreen;
+export {
+  FullScreen_default as FullScreen
+};

package/dist/layout/Grid/GapGrid/index.cjs

@@ -0,0 +1,32 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/Grid/GapGrid/index.tsx
+var GapGrid_exports = {};
+__export(GapGrid_exports, {
+  default: () => GapGrid_default
+});
+module.exports = __toCommonJS(GapGrid_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var GapGrid = (props) => {
+  const { children } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children });
+};
+GapGrid.displayName = "GapGrid";
+var GapGrid_default = GapGrid;

package/dist/layout/Grid/GapGrid/index.d.cts

@@ -0,0 +1,12 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+
+interface CenterGridProps {
+    children: React.ReactNode;
+}
+declare const GapGrid: {
+    (props: CenterGridProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+export { GapGrid as default };

package/dist/layout/Grid/GapGrid/index.d.ts

@@ -0,0 +1,12 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+
+interface CenterGridProps {
+    children: React.ReactNode;
+}
+declare const GapGrid: {
+    (props: CenterGridProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+export { GapGrid as default };

package/dist/layout/Grid/GapGrid/index.js

@@ -0,0 +1,11 @@
+// src/layout/Grid/GapGrid/index.tsx
+import { jsx } from "react/jsx-runtime";
+var GapGrid = (props) => {
+  const { children } = props;
+  return /* @__PURE__ */ jsx("div", { children });
+};
+GapGrid.displayName = "GapGrid";
+var GapGrid_default = GapGrid;
+export {
+  GapGrid_default as default
+};

package/dist/layout/Grid/Item/index.cjs

@@ -0,0 +1,71 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/Grid/Item/index.ts
+var Item_exports = {};
+__export(Item_exports, {
+  GridItem: () => Item_default
+});
+module.exports = __toCommonJS(Item_exports);
+
+// src/tokens/breakpoints.ts
+var BREAKPOINT_KEYS_ORDERED = ["laptop", "tablet", "mobile"];
+
+// node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+
+// src/layout/Grid/Item/Item.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var calculateSpans = (column) => {
+  const spans = {};
+  let inherited = column.default;
+  for (const key of BREAKPOINT_KEYS_ORDERED) {
+    inherited = column[key] ?? inherited;
+    spans[key] = inherited;
+  }
+  return spans;
+};
+var GridItem = ({ column, children, className }) => {
+  const spans = calculateSpans(column);
+  const style = {};
+  style["--column-default"] = spans[BREAKPOINT_KEYS_ORDERED[0]];
+  Object.entries(spans).forEach(([key, value]) => {
+    style[`--column-${key}`] = value;
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: clsx_default("lib-xplat-grid-item", className), style, children });
+};
+GridItem.displayName = "GridItem";
+var Item_default = GridItem;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GridItem
+});

package/dist/layout/Grid/Item/index.css

@@ -0,0 +1,19 @@
+/* src/layout/Grid/Item/item.scss */
+.lib-xplat-grid-item {
+  grid-column: span var(--column-default);
+}
+@media (min-width: 0px) and (max-width: 768px) {
+  .lib-xplat-grid-item {
+    grid-column: span var(--column-mobile);
+  }
+}
+@media (min-width: 768px) and (max-width: 1024px) {
+  .lib-xplat-grid-item {
+    grid-column: span var(--column-tablet);
+  }
+}
+@media (min-width: 1024px) and (max-width: 9999px) {
+  .lib-xplat-grid-item {
+    grid-column: span var(--column-laptop);
+  }
+}

package/dist/layout/Grid/Item/index.d.cts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { b as GridColumnConfig } from '../../../breakpoints-DsXkJgdl.cjs';
+
+/**
+ * Grid column span — 브레이크포인트별 컬럼 수.
+ * 상위 브레이크에만 값을 주면, 설정 없는 하위 브레이크는 그 값을 상속한다.
+ * 각 값은 브레이크 최대를 넘을 수 없음 (mobile ≤4, tablet ≤8, laptop/default ≤12).
+ *
+ * @example
+ * { default: 12, laptop: 6 }  → laptop 6, tablet 6, mobile 6
+ * { default: 12, tablet: 8 }  → laptop 12, tablet 8, mobile 8
+ */
+interface GridItemProps {
+    column: GridColumnConfig;
+    children?: React.ReactNode;
+    className?: string;
+}
+declare const GridItem: React.FC<GridItemProps>;
+
+export { GridItem };

package/dist/layout/Grid/Item/index.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { b as GridColumnConfig } from '../../../breakpoints-DsXkJgdl.js';
+
+/**
+ * Grid column span — 브레이크포인트별 컬럼 수.
+ * 상위 브레이크에만 값을 주면, 설정 없는 하위 브레이크는 그 값을 상속한다.
+ * 각 값은 브레이크 최대를 넘을 수 없음 (mobile ≤4, tablet ≤8, laptop/default ≤12).
+ *
+ * @example
+ * { default: 12, laptop: 6 }  → laptop 6, tablet 6, mobile 6
+ * { default: 12, tablet: 8 }  → laptop 12, tablet 8, mobile 8
+ */
+interface GridItemProps {
+    column: GridColumnConfig;
+    children?: React.ReactNode;
+    className?: string;
+}
+declare const GridItem: React.FC<GridItemProps>;
+
+export { GridItem };

package/dist/layout/Grid/Item/index.js

@@ -0,0 +1,44 @@
+// src/tokens/breakpoints.ts
+var BREAKPOINT_KEYS_ORDERED = ["laptop", "tablet", "mobile"];
+
+// node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+
+// src/layout/Grid/Item/Item.tsx
+import { jsx } from "react/jsx-runtime";
+var calculateSpans = (column) => {
+  const spans = {};
+  let inherited = column.default;
+  for (const key of BREAKPOINT_KEYS_ORDERED) {
+    inherited = column[key] ?? inherited;
+    spans[key] = inherited;
+  }
+  return spans;
+};
+var GridItem = ({ column, children, className }) => {
+  const spans = calculateSpans(column);
+  const style = {};
+  style["--column-default"] = spans[BREAKPOINT_KEYS_ORDERED[0]];
+  Object.entries(spans).forEach(([key, value]) => {
+    style[`--column-${key}`] = value;
+  });
+  return /* @__PURE__ */ jsx("div", { className: clsx_default("lib-xplat-grid-item", className), style, children });
+};
+GridItem.displayName = "GridItem";
+var Item_default = GridItem;
+export {
+  Item_default as GridItem
+};

package/dist/layout/Grid/index.cjs

@@ -0,0 +1,95 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/Grid/index.ts
+var Grid_exports = {};
+__export(Grid_exports, {
+  BREAKPOINT_KEYS_ORDERED: () => BREAKPOINT_KEYS_ORDERED,
+  FullGrid: () => FullGrid_default,
+  FullScreen: () => FullScreen_default,
+  GridItem: () => Item_default
+});
+module.exports = __toCommonJS(Grid_exports);
+
+// node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+
+// src/layout/Grid/FullGrid/FullGrid.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var FullGrid = (props) => {
+  const { children, className } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: clsx_default("lib-xplat-full-grid", className), children });
+};
+FullGrid.displayName = "FullGrid";
+var FullGrid_default = FullGrid;
+
+// src/layout/Grid/FullScreen/FullScreen.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var FullScreen = (props) => {
+  const { children, className } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: clsx_default("lib-xplat-full-screen", className), children });
+};
+FullScreen.displayName = "FullScreen";
+var FullScreen_default = FullScreen;
+
+// src/tokens/breakpoints.ts
+var BREAKPOINT_KEYS_ORDERED = ["laptop", "tablet", "mobile"];
+
+// src/layout/Grid/Item/Item.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var calculateSpans = (column) => {
+  const spans = {};
+  let inherited = column.default;
+  for (const key of BREAKPOINT_KEYS_ORDERED) {
+    inherited = column[key] ?? inherited;
+    spans[key] = inherited;
+  }
+  return spans;
+};
+var GridItem = ({ column, children, className }) => {
+  const spans = calculateSpans(column);
+  const style = {};
+  style["--column-default"] = spans[BREAKPOINT_KEYS_ORDERED[0]];
+  Object.entries(spans).forEach(([key, value]) => {
+    style[`--column-${key}`] = value;
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: clsx_default("lib-xplat-grid-item", className), style, children });
+};
+GridItem.displayName = "GridItem";
+var Item_default = GridItem;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BREAKPOINT_KEYS_ORDERED,
+  FullGrid,
+  FullScreen,
+  GridItem
+});

package/dist/layout/Grid/index.css

@@ -0,0 +1,65 @@
+/* src/layout/Grid/FullGrid/fullgrid.scss */
+.lib-xplat-full-grid {
+  display: grid;
+  flex: 1;
+  grid-template-columns: repeat(12, 1fr);
+}
+@media (min-width: 0px) and (max-width: 768px) {
+  .lib-xplat-full-grid {
+    grid-template-columns: repeat(4, 1fr);
+  }
+}
+@media (min-width: 768px) and (max-width: 1024px) {
+  .lib-xplat-full-grid {
+    grid-template-columns: repeat(8, 1fr);
+  }
+}
+@media (min-width: 1024px) and (max-width: 9999px) {
+  .lib-xplat-full-grid {
+    grid-template-columns: repeat(12, 1fr);
+  }
+}
+
+/* src/layout/Grid/FullScreen/fullscreen.scss */
+.lib-xplat-full-screen {
+  display: grid;
+  flex: 1;
+  height: 100%;
+  overflow: hidden;
+  grid-template-columns: repeat(12, 1fr);
+}
+@media (min-width: 0px) and (max-width: 768px) {
+  .lib-xplat-full-screen {
+    grid-template-columns: repeat(4, 1fr);
+  }
+}
+@media (min-width: 768px) and (max-width: 1024px) {
+  .lib-xplat-full-screen {
+    grid-template-columns: repeat(8, 1fr);
+  }
+}
+@media (min-width: 1024px) and (max-width: 9999px) {
+  .lib-xplat-full-screen {
+    grid-template-columns: repeat(12, 1fr);
+  }
+}
+
+/* src/layout/Grid/Item/item.scss */
+.lib-xplat-grid-item {
+  grid-column: span var(--column-default);
+}
+@media (min-width: 0px) and (max-width: 768px) {
+  .lib-xplat-grid-item {
+    grid-column: span var(--column-mobile);
+  }
+}
+@media (min-width: 768px) and (max-width: 1024px) {
+  .lib-xplat-grid-item {
+    grid-column: span var(--column-tablet);
+  }
+}
+@media (min-width: 1024px) and (max-width: 9999px) {
+  .lib-xplat-grid-item {
+    grid-column: span var(--column-laptop);
+  }
+}

package/dist/layout/Grid/index.d.cts

@@ -0,0 +1,5 @@
+export { FullGrid } from './FullGrid/index.cjs';
+export { FullScreen } from './FullScreen/index.cjs';
+export { GridItem } from './Item/index.cjs';
+export { B as BREAKPOINT_KEYS_ORDERED, a as BreakpointKey, b as GridColumnConfig, G as GridSpanFor } from '../../breakpoints-DsXkJgdl.cjs';
+import 'react';