@salesmind-ai/design-system 0.1.8 → 0.1.10

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.
@@ -234,20 +234,30 @@ var Z_INDEX = {
234
234
 
235
235
  // src/tokens/breakpoints.ts
236
236
  var BREAKPOINTS = {
237
+ "3xs": 320,
238
+ "2xs": 375,
237
239
  xs: 480,
238
240
  sm: 640,
239
241
  md: 768,
240
242
  lg: 1024,
241
243
  xl: 1280,
242
- "2xl": 1536
244
+ "2xl": 1536,
245
+ "3xl": 1920,
246
+ "4xl": 2560,
247
+ "5xl": 3840
243
248
  };
244
249
  var MEDIA_QUERIES = {
250
+ "3xs": `(min-width: ${BREAKPOINTS["3xs"]}px)`,
251
+ "2xs": `(min-width: ${BREAKPOINTS["2xs"]}px)`,
245
252
  xs: `(min-width: ${BREAKPOINTS.xs}px)`,
246
253
  sm: `(min-width: ${BREAKPOINTS.sm}px)`,
247
254
  md: `(min-width: ${BREAKPOINTS.md}px)`,
248
255
  lg: `(min-width: ${BREAKPOINTS.lg}px)`,
249
256
  xl: `(min-width: ${BREAKPOINTS.xl}px)`,
250
- "2xl": `(min-width: ${BREAKPOINTS["2xl"]}px)`
257
+ "2xl": `(min-width: ${BREAKPOINTS["2xl"]}px)`,
258
+ "3xl": `(min-width: ${BREAKPOINTS["3xl"]}px)`,
259
+ "4xl": `(min-width: ${BREAKPOINTS["4xl"]}px)`,
260
+ "5xl": `(min-width: ${BREAKPOINTS["5xl"]}px)`
251
261
  };
252
262
  var STORAGE_KEY = "void-appearance-settings";
253
263
  var DEFAULT_SETTINGS = {
@@ -3347,15 +3357,22 @@ var Stack = React38.forwardRef(
3347
3357
  }
3348
3358
  );
3349
3359
  Stack.displayName = "Stack";
3360
+ var MAX_RESPONSIVE_COLS = 6;
3350
3361
  var Grid = React38.forwardRef(
3351
- ({ columns, rows, align, justify, className, style, ...props }, ref) => {
3362
+ ({ columns, rows, align, justify, fixed, className, style, ...props }, ref) => {
3363
+ const useColClass = typeof columns === "number" && columns >= 1 && columns <= MAX_RESPONSIVE_COLS;
3352
3364
  return /* @__PURE__ */ jsxRuntime.jsx(
3353
3365
  Box,
3354
3366
  {
3355
3367
  ref,
3356
- className: clsx27__default.default("ds-grid", className),
3368
+ className: clsx27__default.default(
3369
+ "ds-grid",
3370
+ useColClass && `ds-grid--cols-${columns}`,
3371
+ fixed && "ds-grid--fixed",
3372
+ className
3373
+ ),
3357
3374
  style: {
3358
- gridTemplateColumns: typeof columns === "number" ? `repeat(${columns}, 1fr)` : columns,
3375
+ gridTemplateColumns: useColClass ? void 0 : typeof columns === "number" ? `repeat(${columns}, 1fr)` : columns,
3359
3376
  gridTemplateRows: typeof rows === "number" ? `repeat(${rows}, 1fr)` : rows,
3360
3377
  alignItems: align,
3361
3378
  justifyItems: justify,
@@ -3386,7 +3403,7 @@ var Container = React38.forwardRef(
3386
3403
  } else if (size) {
3387
3404
  resolvedMaxWidth = CONTAINER_SIZE_MAP[size];
3388
3405
  } else {
3389
- resolvedMaxWidth = maxWidth || "1200px";
3406
+ resolvedMaxWidth = maxWidth || "var(--container-default-max, 1200px)";
3390
3407
  }
3391
3408
  return /* @__PURE__ */ jsxRuntime.jsx(
3392
3409
  Box,
@@ -4199,5 +4216,5 @@ exports.useNumberFormat = useNumberFormat;
4199
4216
  exports.useRelativeTime = useRelativeTime;
4200
4217
  exports.useTextDirection = useTextDirection;
4201
4218
  exports.useToast = useToast;
4202
- //# sourceMappingURL=index.cjs.map
4219
+ //# sourceMappingURL=out.js.map
4203
4220
  //# sourceMappingURL=index.cjs.map