@hellboy/ds 0.1.2 → 0.2.7

package/dist/components/floating-bar.css

@@ -0,0 +1,17 @@
+/* src/style/components/floating-bar/floating-bar.css */
+.floating-bar {
+  position: sticky;
+  width: 100%;
+  z-index: var(--z-floating-base);
+}
+.floating-bar--top {
+  top: 0;
+  margin-bottom: 0;
+}
+.floating-bar--bottom {
+  bottom: -1px;
+  margin-top: 0;
+}
+.floating-bar__content {
+  padding: 0;
+}

package/dist/components/floating-bar.d.mts

@@ -0,0 +1,25 @@
+import React__default from 'react';
+
+type FloatingBarPosition = 'top' | 'bottom';
+interface FloatingBarProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Position of the floating bar
+     * @default 'bottom'
+     */
+    position?: FloatingBarPosition;
+    /**
+     * Content of the floating bar
+     */
+    children: React__default.ReactNode;
+    /**
+     * Additional CSS classes
+     */
+    className?: string;
+}
+/**
+ * FloatingBar Component
+ * A floating bar that sticks to the top or bottom within the main layout container
+ */
+declare const FloatingBar: React__default.FC<FloatingBarProps>;
+
+export { FloatingBar, type FloatingBarPosition, type FloatingBarProps };

package/dist/components/floating-bar.d.ts

@@ -0,0 +1,25 @@
+import React__default from 'react';
+
+type FloatingBarPosition = 'top' | 'bottom';
+interface FloatingBarProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Position of the floating bar
+     * @default 'bottom'
+     */
+    position?: FloatingBarPosition;
+    /**
+     * Content of the floating bar
+     */
+    children: React__default.ReactNode;
+    /**
+     * Additional CSS classes
+     */
+    className?: string;
+}
+/**
+ * FloatingBar Component
+ * A floating bar that sticks to the top or bottom within the main layout container
+ */
+declare const FloatingBar: React__default.FC<FloatingBarProps>;
+
+export { FloatingBar, type FloatingBarPosition, type FloatingBarProps };

package/dist/components/floating-bar.js

@@ -0,0 +1,52 @@
+"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/components/floating-bar/index.ts
+var floating_bar_exports = {};
+__export(floating_bar_exports, {
+  FloatingBar: () => FloatingBar
+});
+module.exports = __toCommonJS(floating_bar_exports);
+
+// src/components/floating-bar/floating-bar.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var FloatingBar = ({
+  position = "bottom",
+  children,
+  className = "",
+  ...props
+}) => {
+  const classes = [
+    "floating-bar",
+    `floating-bar--${position}`,
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: classes,
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "floating-bar__content", children })
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FloatingBar
+});

package/dist/components/floating-bar.mjs

@@ -0,0 +1,25 @@
+// src/components/floating-bar/floating-bar.tsx
+import { jsx } from "react/jsx-runtime";
+var FloatingBar = ({
+  position = "bottom",
+  children,
+  className = "",
+  ...props
+}) => {
+  const classes = [
+    "floating-bar",
+    `floating-bar--${position}`,
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: classes,
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: "floating-bar__content", children })
+    }
+  );
+};
+export {
+  FloatingBar
+};

package/dist/components/footer.css

@@ -0,0 +1,40 @@
+/* src/style/components/footer/footer.css */
+.footer {
+  background-color: var(--color-bg-3);
+  border-top: 2px solid var(--color-foreground-5);
+  box-shadow: 0 0 0 6px var(--color-bg-2);
+  margin-top: auto;
+  padding: var(--spacing-5) var(--spacing-4);
+  font-size: var(--font-size-sm);
+  position: relative;
+  z-index: 1;
+}
+.footer__container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 var(--spacing-4);
+}
+.footer__bottom {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-2);
+  text-align: center;
+}
+.footer__copyright {
+  margin: 0;
+  font-size: var(--font-size-sm);
+  color: var(--color-foreground-3);
+  line-height: var(--line-height-base);
+}
+@media (max-width: 768px) {
+  .footer {
+    padding: var(--spacing-4) 0;
+  }
+  .footer__content {
+    grid-template-columns: 1fr;
+    gap: var(--spacing-4);
+  }
+  .footer__bottom {
+    flex-direction: column;
+  }
+}

package/dist/components/footer.d.mts

@@ -0,0 +1,8 @@
+import React__default from 'react';
+
+interface FooterProps extends React__default.HTMLAttributes<HTMLElement> {
+    children?: React__default.ReactNode;
+}
+declare const Footer: React__default.FC<FooterProps>;
+
+export { Footer, type FooterProps };

package/dist/components/footer.d.ts

@@ -0,0 +1,8 @@
+import React__default from 'react';
+
+interface FooterProps extends React__default.HTMLAttributes<HTMLElement> {
+    children?: React__default.ReactNode;
+}
+declare const Footer: React__default.FC<FooterProps>;
+
+export { Footer, type FooterProps };

package/dist/components/footer.js

@@ -0,0 +1,44 @@
+"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/components/footer/index.ts
+var footer_exports = {};
+__export(footer_exports, {
+  Footer: () => Footer
+});
+module.exports = __toCommonJS(footer_exports);
+
+// src/components/footer/footer.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Footer = ({ className = "", children, ...props }) => {
+  const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("footer", { className: `footer ${className}`.trim(), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "footer__container", children: children ? children : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "footer__bottom", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "footer__copyright", children: [
+    "\xA9 ",
+    currentYear,
+    " ",
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: "HellboyDS" }),
+    " is a design system package published on npm by user ",
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: "@hellboy" }),
+    ". This project is not affiliated with any comic book, film, television, or other artistic works."
+  ] }) }) }) }) });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Footer
+});

package/dist/components/footer.mjs

@@ -0,0 +1,17 @@
+// src/components/footer/footer.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var Footer = ({ className = "", children, ...props }) => {
+  const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+  return /* @__PURE__ */ jsx("footer", { className: `footer ${className}`.trim(), ...props, children: /* @__PURE__ */ jsx("div", { className: "footer__container", children: children ? children : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { className: "footer__bottom", children: /* @__PURE__ */ jsxs("p", { className: "footer__copyright", children: [
+    "\xA9 ",
+    currentYear,
+    " ",
+    /* @__PURE__ */ jsx("strong", { children: "HellboyDS" }),
+    " is a design system package published on npm by user ",
+    /* @__PURE__ */ jsx("strong", { children: "@hellboy" }),
+    ". This project is not affiliated with any comic book, film, television, or other artistic works."
+  ] }) }) }) }) });
+};
+export {
+  Footer
+};

package/dist/components/grid.css

@@ -0,0 +1,47 @@
+/* src/style/components/grid/grid.css */
+.grid {
+  display: grid;
+  gap: var(--grid-gap, 1rem);
+}
+.grid--auto-fit {
+  grid-template-columns: repeat(auto-fit, minmax(var(--grid-min-width, 250px), 1fr));
+}
+.grid--auto-fill {
+  grid-template-columns: repeat(auto-fill, minmax(var(--grid-min-width, 250px), 1fr));
+}
+.grid--cols-1 {
+  grid-template-columns: repeat(1, 1fr);
+}
+.grid--cols-2 {
+  grid-template-columns: repeat(2, 1fr);
+}
+.grid--cols-3 {
+  grid-template-columns: repeat(3, 1fr);
+}
+.grid--cols-4 {
+  grid-template-columns: repeat(4, 1fr);
+}
+.grid--cols-5 {
+  grid-template-columns: repeat(5, 1fr);
+}
+.grid--cols-6 {
+  grid-template-columns: repeat(6, 1fr);
+}
+.grid--cols-7 {
+  grid-template-columns: repeat(7, 1fr);
+}
+.grid--cols-8 {
+  grid-template-columns: repeat(8, 1fr);
+}
+.grid--cols-9 {
+  grid-template-columns: repeat(9, 1fr);
+}
+.grid--cols-10 {
+  grid-template-columns: repeat(10, 1fr);
+}
+.grid--cols-11 {
+  grid-template-columns: repeat(11, 1fr);
+}
+.grid--cols-12 {
+  grid-template-columns: repeat(12, 1fr);
+}

package/dist/components/grid.d.mts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+
+type GridColumns = number | "auto-fit" | "auto-fill";
+interface GridProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Number of columns or auto-fit/auto-fill
+     * @default "auto-fit"
+     */
+    columns?: GridColumns;
+    /**
+     * Minimum width for each column (when using auto-fit/auto-fill)
+     * @default "250px"
+     */
+    minWidth?: string;
+    /**
+     * Gap between grid items
+     * @default "1rem"
+     */
+    gap?: string;
+    /**
+     * Maximum number of columns (when columns is a number)
+     */
+    maxColumns?: number;
+}
+declare const Grid: React.FC<GridProps>;
+
+export { Grid, type GridColumns, type GridProps };

package/dist/components/grid.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+
+type GridColumns = number | "auto-fit" | "auto-fill";
+interface GridProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Number of columns or auto-fit/auto-fill
+     * @default "auto-fit"
+     */
+    columns?: GridColumns;
+    /**
+     * Minimum width for each column (when using auto-fit/auto-fill)
+     * @default "250px"
+     */
+    minWidth?: string;
+    /**
+     * Gap between grid items
+     * @default "1rem"
+     */
+    gap?: string;
+    /**
+     * Maximum number of columns (when columns is a number)
+     */
+    maxColumns?: number;
+}
+declare const Grid: React.FC<GridProps>;
+
+export { Grid, type GridColumns, type GridProps };

package/dist/components/grid.js

@@ -0,0 +1,52 @@
+"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/components/grid/index.ts
+var grid_exports = {};
+__export(grid_exports, {
+  Grid: () => Grid
+});
+module.exports = __toCommonJS(grid_exports);
+
+// src/components/grid/Grid.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Grid = ({
+  columns = "auto-fit",
+  minWidth = "250px",
+  gap = "1rem",
+  maxColumns,
+  className = "",
+  children,
+  ...props
+}) => {
+  const gridClass = [
+    "grid",
+    typeof columns === "number" ? `grid--cols-${Math.min(columns, maxColumns || columns)}` : `grid--${columns}`,
+    className
+  ].filter(Boolean).join(" ");
+  const style = {
+    "--grid-min-width": minWidth,
+    "--grid-gap": gap
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: gridClass, style, ...props, children });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Grid
+});

package/dist/components/grid.mjs

@@ -0,0 +1,25 @@
+// src/components/grid/Grid.tsx
+import { jsx } from "react/jsx-runtime";
+var Grid = ({
+  columns = "auto-fit",
+  minWidth = "250px",
+  gap = "1rem",
+  maxColumns,
+  className = "",
+  children,
+  ...props
+}) => {
+  const gridClass = [
+    "grid",
+    typeof columns === "number" ? `grid--cols-${Math.min(columns, maxColumns || columns)}` : `grid--${columns}`,
+    className
+  ].filter(Boolean).join(" ");
+  const style = {
+    "--grid-min-width": minWidth,
+    "--grid-gap": gap
+  };
+  return /* @__PURE__ */ jsx("div", { className: gridClass, style, ...props, children });
+};
+export {
+  Grid
+};