@dbcdk/react-components 0.0.169 → 0.0.171

package/dist/styles.css

@@ -0,0 +1,377 @@
+@import './css-helper-classes/spacing.css';
+@import './css-helper-classes/flex.css';
+@import './css-helper-classes/typography.css';
+
+@font-face {
+  font-family: 'Roboto';
+  src: url('./fonts/Roboto/Roboto-Regular.ttf') format('truetype');
+  font-weight: 400;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Roboto';
+  src: url('./fonts/Roboto/Roboto-Medium.ttf') format('truetype');
+  font-weight: 500;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Roboto';
+  src: url('./fonts/Roboto/Roboto-Bold.ttf') format('truetype');
+  font-weight: 700;
+  font-style: normal;
+}
+
+* {
+  font-family: var(--font-family);
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  color: var(--color-fg-default);
+  background-color: var(--color-bg-page);
+  font-size: var(--font-size-sm);
+  margin: 0;
+}
+
+@media (min-height: 500px) {
+  body {
+    overflow-y: scroll;
+  }
+}
+
+h1 {
+  font-size: var(--font-size-xl);
+}
+
+h2 {
+  font-size: var(--font-size-lg);
+}
+
+h3 {
+  font-size: var(--font-size-md);
+}
+
+h4 {
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-medium);
+}
+
+body.dbc-app {
+  max-width: 1600px;
+}
+
+.dbc-overflow-auto {
+  overflow: auto;
+}
+
+.dbc-font-mono {
+  font-family: monospace;
+}
+
+/* ==========================================================================
+   Tables
+   ========================================================================== */
+
+.dbc-table {
+  --card-label-width: 260px;
+
+  border-collapse: collapse;
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-normal);
+}
+
+/* Default compact table cell padding.
+   This applies to the first row too, avoiding uneven first-row spacing. */
+.dbc-table th,
+.dbc-table td {
+  padding-block: var(--spacing-xxs);
+  padding-inline: var(--spacing-xxs);
+  vertical-align: baseline;
+}
+
+.dbc-table th {
+  white-space: nowrap;
+  text-align: left;
+  max-width: var(--card-label-width);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-size: var(--font-size-xs);
+  line-height: var(--line-height-table-header);
+  color: var(--table-header-fg);
+  letter-spacing: var(--letter-spacing-wide);
+  font-weight: normal;
+}
+
+.dbc-table td {
+  min-width: 0;
+  margin: 0;
+  font-size: var(--font-size-sm);
+  color: var(--color-fg-default);
+  font-weight: var(--font-weight-default);
+  word-break: break-word;
+}
+
+/* Larger vertical padding (default is --spacing-xxs) */
+.dbc-table--md th,
+.dbc-table--md td {
+  padding-block: var(--spacing-xs);
+}
+
+/* --hover can go on the <table> (every row hovers) or directly on a <tr>
+   (opt in only specific rows, leaving the rest unaffected). */
+.dbc-table--hover tbody tr:hover,
+tr.dbc-table--hover:hover {
+  background-color: var(--color-bg-contextual);
+  cursor: pointer;
+}
+
+/* Round the hovered row's leading/trailing edge (tr itself can't take a
+   border-radius reliably in table layout) — same token as Menu.item's
+   hover background. */
+.dbc-table--hover tbody tr:hover th:first-child,
+.dbc-table--hover tbody tr:hover td:first-child,
+tr.dbc-table--hover:hover th:first-child,
+tr.dbc-table--hover:hover td:first-child {
+  border-top-left-radius: var(--border-radius-md);
+  border-bottom-left-radius: var(--border-radius-md);
+}
+
+.dbc-table--hover tbody tr:hover th:last-child,
+.dbc-table--hover tbody tr:hover td:last-child,
+tr.dbc-table--hover:hover th:last-child,
+tr.dbc-table--hover:hover td:last-child {
+  border-top-right-radius: var(--border-radius-md);
+  border-bottom-right-radius: var(--border-radius-md);
+}
+
+.dbc-table--clickableRow tbody tr:hover {
+  background-color: var(--color-bg-contextual);
+  cursor: pointer;
+}
+
+.dbc-table--striped tbody tr:nth-child(even) {
+  background-color: var(--table-row-bg-alt);
+}
+
+.dbc-table--striped.dbc-table--hover tbody tr:hover,
+.dbc-table--striped tr.dbc-table--hover:hover {
+  background-color: var(--table-row-bg-hover);
+}
+
+.dbc-full-width {
+  width: 100%;
+}
+
+/* Bordered table */
+
+.dbc-table--bordered {
+  width: auto;
+  border: var(--border-width-thin) solid var(--color-border-default);
+  border-collapse: collapse;
+}
+
+.dbc-table--bordered th,
+.dbc-table--bordered td {
+  border: var(--border-width-thin) solid var(--color-border-default);
+  padding: var(--spacing-xs) var(--spacing-sm);
+}
+
+.dbc-table--bordered thead th {
+  background-color: var(--color-bg-surface);
+}
+
+/* Alignment modifier */
+
+.dbc-table--align-middle,
+.dbc-table--align-middle th,
+.dbc-table--align-middle td {
+  vertical-align: middle;
+}
+
+/* Per-cell text alignment. Apply directly to a th/td to right-align that
+   column's header/content. */
+.dbc-table th.dbc-table--align-right,
+.dbc-table td.dbc-table--align-right {
+  text-align: right;
+}
+
+/* ==========================================================================
+   Text / utility classes
+   ========================================================================== */
+
+.dbc-highlight {
+  color: var(--color-highlight-fg, inherit);
+  background-color: var(--color-highlight-bg, var(--color-status-warning-bg));
+  font-family: inherit;
+  font-size: inherit;
+  border-radius: var(--border-radius-sm);
+  box-decoration-break: clone;
+  -webkit-box-decoration-break: clone;
+}
+
+.dbc-code {
+  color: var(--color-code-fg, inherit);
+  background-color: var(--color-code-bg, var(--color-bg-contextual));
+  border-radius: var(--border-radius-sm);
+  padding-inline: var(--spacing-xxs);
+  font-family: var(--font-family-mono);
+  font-size: 0.9em;
+  box-decoration-break: clone;
+  -webkit-box-decoration-break: clone;
+}
+
+.dbc-muted-text {
+  color: var(--color-fg-subtle);
+}
+
+.dbc-tabular-nums {
+  font-variant-numeric: tabular-nums;
+}
+
+.dbc-sm-text {
+  font-size: var(--font-size-xs);
+}
+
+.dbc-md-text {
+  font-size: var(--font-size-md);
+}
+
+.dbc-lg-text {
+  font-size: var(--font-size-lg);
+}
+
+.dbc-medium-text {
+  font-weight: var(--font-weight-medium);
+}
+
+.dbc-bold-text {
+  font-weight: var(--font-weight-bold);
+}
+
+/* ==========================================================================
+   Layout utilities
+   ========================================================================== */
+
+@media screen and (min-height: 400px) {
+  body.dbc-app {
+    overflow: hidden;
+  }
+}
+
+.grow-container {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: auto;
+}
+
+.hideScrollBar {
+  scrollbar-width: none;
+}
+
+.hideScrollBar::-webkit-scrollbar {
+  display: none;
+}
+
+.fitContent {
+  white-space: nowrap !important;
+  width: 1% !important;
+  min-width: 1% !important;
+  max-width: 1% !important;
+}
+
+.dbc-full-height {
+  height: 100%;
+}
+
+.dbc-offset-height {
+  transform: translateY(-8vh);
+}
+
+/* ==========================================================================
+   Scrollbars
+   ========================================================================== */
+
+::-webkit-scrollbar {
+  width: 10px;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: var(--color-border-strong);
+  border-radius: 4px;
+  border: 2px solid var(--color-bg-surface);
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: var(--color-fg-subtle);
+}
+
+/* ==========================================================================
+   Animations
+   ========================================================================== */
+
+.animate--expand {
+  animation: expand 0.15s ease-in-out forwards;
+}
+
+.animate--collapse {
+  animation: collapse 0.15s ease-in-out forwards;
+}
+
+.spin {
+  display: inline-block;
+  animation: spin 2s linear infinite;
+}
+
+@keyframes expand {
+  0% {
+    max-height: 0;
+  }
+
+  100% {
+    max-height: 100vh;
+  }
+}
+
+@keyframes collapse {
+  0% {
+    max-height: 100vh;
+  }
+
+  100% {
+    max-height: 0;
+  }
+}
+
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* ==========================================================================
+   Accessibility
+   ========================================================================== */
+
+.srOnly {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  border: 0;
+}

package/dist/tanstack.cjs

@@ -0,0 +1,26 @@
+'use strict';
+
+var TanstackTable = require('./components/table/TanstackTable');
+var TableSettings = require('./components/table/components/table-settings/TableSettings');
+var useTableSettings = require('./hooks/useTableSettings');
+
+
+
+Object.keys(TanstackTable).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return TanstackTable[k]; }
+	});
+});
+Object.keys(TableSettings).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return TableSettings[k]; }
+	});
+});
+Object.keys(useTableSettings).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return useTableSettings[k]; }
+	});
+});

package/dist/tanstack.d.ts

@@ -0,0 +1,3 @@
+export * from './components/table/TanstackTable';
+export * from './components/table/components/table-settings/TableSettings';
+export * from './hooks/useTableSettings';

package/dist/tanstack.js

@@ -0,0 +1,3 @@
+export * from './components/table/TanstackTable';
+export * from './components/table/components/table-settings/TableSettings';
+export * from './hooks/useTableSettings';

package/dist/themes/dbc.css

@@ -0,0 +1,3 @@
+@import '../styles/themes/dbc/base.css';
+@import '../styles/themes/dbc/colors.css';
+@import '../index.css';

package/dist/themes/filmstriben-budget.css

@@ -0,0 +1,3 @@
+@import '../styles/themes/dbc/base.css';
+@import '../styles/themes/filmstriben-budget/theme.css';
+@import '../index.css';

package/dist/types/a11y-props.types.cjs

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/types/a11y-props.types.d.ts

@@ -0,0 +1,8 @@
+export type A11yProps = {
+    'aria-label'?: string;
+    'aria-describedby'?: string;
+    'aria-controls'?: string;
+    'aria-current'?: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false';
+    'aria-hidden'?: boolean;
+    title?: string;
+};

package/dist/types/a11y-props.types.js

@@ -0,0 +1 @@
+

package/dist/types/assets.d.cjs

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/types/assets.d.js

@@ -0,0 +1 @@
+

package/dist/types/css.d.cjs

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/types/css.d.js

@@ -0,0 +1 @@
+

package/dist/types/sizes.types.cjs

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/types/sizes.types.d.ts

@@ -0,0 +1,2 @@
+export type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type SizeVariable = 'var(--component-size-xs)' | 'var(--component-size-sm)' | 'var(--component-size-md)' | 'var(--component-size-lg)' | 'var(--component-size-xl)';

package/dist/types/sizes.types.js

@@ -0,0 +1 @@
+

package/dist/utils/arrays/nested-filtering.cjs

@@ -0,0 +1,40 @@
+'use strict';
+
+const normalize = (s) => s.normalize("NFKC").toLowerCase().trim();
+const toTerms = (q) => (Array.isArray(q) ? q : q.split(/\s+/)).map(normalize).filter(Boolean);
+const valueToSearchable = (value) => typeof value === "string" ? value : Array.isArray(value) || typeof value === "object" ? JSON.stringify(value) : value == null ? "" : String(value);
+const itemMatches = (item, keys, terms, mode) => {
+  if (terms.length === 0) return true;
+  const haystack = keys.map((k) => valueToSearchable(item[k])).join(" ").toString();
+  const h = normalize(haystack);
+  const hit = (t) => h.includes(t);
+  return mode === "AND" ? terms.every(hit) : terms.some(hit);
+};
+function nestedFiltering(items, opts) {
+  const { keys, query, includeParents = true, childrenKey, mode = "AND" } = opts;
+  const ck = childrenKey != null ? childrenKey : "children";
+  const terms = toTerms(query);
+  const searchNested = (list) => {
+    const out = [];
+    for (const item of list) {
+      const children = item[ck] || [];
+      const filteredChildren = searchNested(children);
+      const matchedSelf = itemMatches(item, keys, terms, mode);
+      if (matchedSelf) {
+        const clone = { ...item, [ck]: filteredChildren };
+        out.push(clone);
+      } else if (filteredChildren.length) {
+        if (includeParents) {
+          const clone = { ...item, [ck]: filteredChildren };
+          out.push(clone);
+        } else {
+          out.push(...filteredChildren);
+        }
+      }
+    }
+    return out;
+  };
+  return searchNested(items);
+}
+
+exports.nestedFiltering = nestedFiltering;

package/dist/utils/arrays/nested-filtering.d.ts

@@ -0,0 +1,9 @@
+type Mode = 'AND' | 'OR';
+export declare function nestedFiltering<T extends Record<string, any>>(items: T[], opts: {
+    keys: (keyof T)[];
+    query: string | string[];
+    includeParents?: boolean;
+    childrenKey?: keyof T;
+    mode?: Mode;
+}): T[];
+export {};

package/dist/utils/arrays/nested-filtering.js

@@ -0,0 +1,38 @@
+const normalize = (s) => s.normalize("NFKC").toLowerCase().trim();
+const toTerms = (q) => (Array.isArray(q) ? q : q.split(/\s+/)).map(normalize).filter(Boolean);
+const valueToSearchable = (value) => typeof value === "string" ? value : Array.isArray(value) || typeof value === "object" ? JSON.stringify(value) : value == null ? "" : String(value);
+const itemMatches = (item, keys, terms, mode) => {
+  if (terms.length === 0) return true;
+  const haystack = keys.map((k) => valueToSearchable(item[k])).join(" ").toString();
+  const h = normalize(haystack);
+  const hit = (t) => h.includes(t);
+  return mode === "AND" ? terms.every(hit) : terms.some(hit);
+};
+function nestedFiltering(items, opts) {
+  const { keys, query, includeParents = true, childrenKey, mode = "AND" } = opts;
+  const ck = childrenKey != null ? childrenKey : "children";
+  const terms = toTerms(query);
+  const searchNested = (list) => {
+    const out = [];
+    for (const item of list) {
+      const children = item[ck] || [];
+      const filteredChildren = searchNested(children);
+      const matchedSelf = itemMatches(item, keys, terms, mode);
+      if (matchedSelf) {
+        const clone = { ...item, [ck]: filteredChildren };
+        out.push(clone);
+      } else if (filteredChildren.length) {
+        if (includeParents) {
+          const clone = { ...item, [ck]: filteredChildren };
+          out.push(clone);
+        } else {
+          out.push(...filteredChildren);
+        }
+      }
+    }
+    return out;
+  };
+  return searchNested(items);
+}
+
+export { nestedFiltering };

package/dist/utils/cookie.utils.cjs

@@ -0,0 +1,44 @@
+'use strict';
+
+const ONE_YEAR_SECONDS = 60 * 60 * 24 * 365;
+function isBrowser() {
+  return typeof document !== "undefined";
+}
+function readCookie(name) {
+  if (!isBrowser()) return void 0;
+  try {
+    const match = document.cookie.split("; ").find((row) => row.startsWith(`${name}=`));
+    if (match == null) return void 0;
+    const raw = decodeURIComponent(match.slice(name.length + 1));
+    try {
+      return JSON.parse(raw);
+    } catch {
+      return raw;
+    }
+  } catch {
+    return void 0;
+  }
+}
+function writeCookie(name, value, maxAgeSeconds = ONE_YEAR_SECONDS) {
+  if (!isBrowser()) return;
+  try {
+    if (value === void 0) {
+      removeCookie(name);
+      return;
+    }
+    const raw = typeof value === "string" ? value : JSON.stringify(value);
+    document.cookie = `${name}=${encodeURIComponent(raw)}; path=/; max-age=${maxAgeSeconds}`;
+  } catch {
+  }
+}
+function removeCookie(name) {
+  if (!isBrowser()) return;
+  try {
+    document.cookie = `${name}=; path=/; max-age=0`;
+  } catch {
+  }
+}
+
+exports.readCookie = readCookie;
+exports.removeCookie = removeCookie;
+exports.writeCookie = writeCookie;

package/dist/utils/cookie.utils.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Safely read from a cookie.
+ * - Returns undefined if not in browser or the cookie is missing
+ * - Returns parsed JSON if the value is JSON
+ * - Returns plain string if not JSON
+ * - Never throws
+ */
+export declare function readCookie<T = unknown>(name: string): T | string | undefined;
+/**
+ * Safely write a cookie.
+ * - Automatically JSON.stringifies objects/arrays/booleans/numbers
+ * - Stores plain strings as-is
+ * - Never throws
+ */
+export declare function writeCookie(name: string, value: unknown, maxAgeSeconds?: number): void;
+/**
+ * Remove a cookie safely
+ */
+export declare function removeCookie(name: string): void;

package/dist/utils/cookie.utils.js

@@ -0,0 +1,40 @@
+const ONE_YEAR_SECONDS = 60 * 60 * 24 * 365;
+function isBrowser() {
+  return typeof document !== "undefined";
+}
+function readCookie(name) {
+  if (!isBrowser()) return void 0;
+  try {
+    const match = document.cookie.split("; ").find((row) => row.startsWith(`${name}=`));
+    if (match == null) return void 0;
+    const raw = decodeURIComponent(match.slice(name.length + 1));
+    try {
+      return JSON.parse(raw);
+    } catch {
+      return raw;
+    }
+  } catch {
+    return void 0;
+  }
+}
+function writeCookie(name, value, maxAgeSeconds = ONE_YEAR_SECONDS) {
+  if (!isBrowser()) return;
+  try {
+    if (value === void 0) {
+      removeCookie(name);
+      return;
+    }
+    const raw = typeof value === "string" ? value : JSON.stringify(value);
+    document.cookie = `${name}=${encodeURIComponent(raw)}; path=/; max-age=${maxAgeSeconds}`;
+  } catch {
+  }
+}
+function removeCookie(name) {
+  if (!isBrowser()) return;
+  try {
+    document.cookie = `${name}=; path=/; max-age=0`;
+  } catch {
+  }
+}
+
+export { readCookie, removeCookie, writeCookie };