@hortiview/shared-components 0.0.1

package/dist/main.d.ts

@@ -0,0 +1,13 @@
+export { BaseView } from './components/BaseView/BaseView';
+export { BasicHeading } from './components/BasicHeading/BasicHeading';
+export { BlockView } from './components/BlockView/BlockView';
+export { EmptyView } from './components/EmptyView/EmptyView';
+export { HashTabView } from './components/HashTabView/HashTabView';
+export { Iconify } from './components/Iconify/Iconify';
+export { ListArea } from './components/ListArea/ListArea';
+export { SearchBar } from './components/SearchBar/SearchBar';
+export { VerticalDivider } from './components/VerticalDivider/VerticalDivider';
+export { AvailableCustomIcons } from './enums/AvailableCustomIcons';
+export { useBreakpoints } from './hooks/useBreakpoint';
+export type { ListElement, BaseListElement } from './types/ListElement';
+export type { HashTab } from './types/HashTab';

package/dist/main.js

@@ -0,0 +1,24 @@
+import { BaseView as e } from "./components/BaseView/BaseView.js";
+import { BasicHeading as a } from "./components/BasicHeading/BasicHeading.js";
+import { BlockView as m } from "./components/BlockView/BlockView.js";
+import { EmptyView as f } from "./components/EmptyView/EmptyView.js";
+import { HashTabView as s } from "./components/HashTabView/HashTabView.js";
+import { Iconify as B } from "./components/Iconify/Iconify.js";
+import { ListArea as l } from "./components/ListArea/ListArea.js";
+import { SearchBar as w } from "./components/SearchBar/SearchBar.js";
+import { VerticalDivider as b } from "./components/VerticalDivider/VerticalDivider.js";
+import { AvailableCustomIcons as h } from "./enums/AvailableCustomIcons.js";
+import { u as v } from "./useBreakpoint-DyAmuka7.js";
+export {
+  h as AvailableCustomIcons,
+  e as BaseView,
+  a as BasicHeading,
+  m as BlockView,
+  f as EmptyView,
+  s as HashTabView,
+  B as Iconify,
+  l as ListArea,
+  w as SearchBar,
+  b as VerticalDivider,
+  v as useBreakpoints
+};

package/dist/services/BlockService.d.ts

@@ -0,0 +1,8 @@
+import { Block } from '../types/internal/Block';
+/**
+ * Returns the block number by the given block and columns
+ * @param block
+ * @param columns
+ * @returns block number
+ */
+export declare const getBlockNumberByDto: (block: Block, columns: number) => number;

package/dist/services/BlockService.js

@@ -0,0 +1,4 @@
+const i = (o, t) => o.position ? t * (o.position.row - 1) + o.position.column : 0;
+export {
+  i as getBlockNumberByDto
+};

package/dist/types/HashTab.d.ts

@@ -0,0 +1,25 @@
+/**
+ * HashTab type
+ */
+export type HashTab = {
+    /**
+     * title of the tab
+     */
+    title: string;
+    /**
+     * component to be rendered when the tab is active
+     */
+    component: JSX.Element;
+    /**
+     * hash of the tab, used in url to navigate to the tab
+     */
+    hash?: string;
+    /**
+     * leading icon of the tab, should be a string {@see https://fonts.google.com/icons?selected=Material+Icons+Outlined:search:&icon.platform=web&icon.set=Material+Icons }
+     */
+    leadingIcon?: string;
+    /**
+     * trailing icon of the tab, a JSX.Element
+     */
+    trailingIcon?: JSX.Element;
+};

package/dist/types/HashTab.js

@@ -0,0 +1 @@
+

package/dist/types/ListElement.d.ts

@@ -0,0 +1,94 @@
+/**
+ * The basic list element to use with BaseView and ListArea
+ */
+export type BaseListElement = {
+    /**
+     * the icon of the list element
+     */
+    icon?: JSX.Element | string;
+    /**
+     * the type of the icon
+     */
+    iconType?: 'avatar' | 'badge' | 'checkbox' | 'icon' | 'image' | 'lgImage' | 'meta' | 'radio' | 'switch' | 'thumbnail';
+    /**
+     * the base view normally show the icon in the detail view, if you want to hide it set this to true
+     */
+    hideIconInDetail?: boolean;
+    /**
+     * the trailing icon of the list element
+     */
+    trailingIcon?: JSX.Element | string;
+    /**
+     * the type of the trailing icon
+     */
+    trailingIconType?: 'avatar' | 'badge' | 'checkbox' | 'icon' | 'image' | 'lgImage' | 'meta' | 'radio' | 'switch' | 'thumbnail';
+    /**
+     * the id of the list element
+     */
+    id: string;
+    /**
+     * the title of the list element
+     */
+    title: string;
+    /**
+     * the baseview normally show the title in the detail view, if you want to show a different title set this
+     */
+    detailTitle?: string;
+    /**
+     * the subtitle of the list element
+     */
+    subTitle?: string;
+    /**
+     * the route of the list element
+     */
+    route?: string;
+    /**
+     * the component showing in the details, when the list element is selected
+     */
+    component: JSX.Element;
+    /**
+     * the action button of the list element, it is used in the trailing block of the list element
+     */
+    actionButton?: React.ReactNode;
+    /**
+     * the height of the list item
+     */
+    listItemHeight?: string;
+    /**
+     * the list element acts as a navigation link, if noNavigation is set to true the list element has no link behaivour
+     */
+    noNavigation?: boolean;
+    /**
+     * the onClick function of the list element
+     */
+    onClick?: (value: string) => void;
+    /**
+     * the value of the list element
+     */
+    value?: string;
+    /**
+     * the list element is disabled if this is true
+     */
+    disabled?: boolean;
+    /**
+     * an additonal action element shown in the detail section of the base view behind the detail heading
+     */
+    detailAction?: JSX.Element;
+};
+/**
+ * The list element to use with BaseView and ListArea, it is an extension of the BaseListElement to handle grouped lists
+ */
+export type ListElement = Omit<BaseListElement, 'component'> & {
+    /**
+     * the group name of multiple list elements
+     */
+    groupName?: string | JSX.Element;
+    /**
+     * the list elements of the group
+     */
+    items?: ListElement[];
+    /**
+     * will be rendered instead of title and subtitle
+     */
+    customTitle?: JSX.Element;
+};

package/dist/types/ListElement.js

@@ -0,0 +1 @@
+

package/dist/types/internal/Block.d.ts

@@ -0,0 +1,9 @@
+/**
+ * internal used Block type
+ */
+export type Block = {
+    position?: {
+        row: number;
+        column: number;
+    };
+};

package/dist/types/internal/Block.js

@@ -0,0 +1 @@
+

package/dist/types/internal/ReactRouterTypes.d.ts

@@ -0,0 +1,28 @@
+/**
+ * the types are copied from react-router-dom
+ */
+export type RelativeRoutingType = 'route' | 'path';
+/**
+ * the types are copied from react-router-dom
+ */
+export interface Path {
+    pathname: string;
+    search: string;
+    hash: string;
+}
+/**
+ * the types are copied from react-router-dom
+ */
+export interface LinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> {
+    reloadDocument?: boolean;
+    replace?: boolean;
+    state?: any;
+    preventScrollReset?: boolean;
+    relative?: RelativeRoutingType;
+    to: To;
+    unstable_viewTransition?: boolean;
+}
+/**
+ * the types are copied from react-router-dom
+ */
+export type To = string | Partial<Path>;

package/dist/types/internal/ReactRouterTypes.js

@@ -0,0 +1 @@
+

package/dist/useBreakpoint-DyAmuka7.js

@@ -0,0 +1,35 @@
+import { useState as r, useEffect as c } from "react";
+function t(e) {
+  const [s, a] = r(!1);
+  return c(
+    () => {
+      const i = window.matchMedia(e);
+      a(i.matches);
+      const n = (o) => a(o.matches);
+      return i.addEventListener("change", n), () => i.removeEventListener("change", n);
+    },
+    [s]
+    // Empty array ensures effect is only run on mount and unmount
+  ), s;
+}
+function d() {
+  const e = {
+    isXs: t("(max-width: 640px)"),
+    isSm: t("(min-width: 641px) and (max-width: 768px)"),
+    isMd: t("(min-width: 769px) and (max-width: 839px)"),
+    isLg: t("(min-width: 840px)"),
+    isXlg: t("(min-width: 1280px)"),
+    active: ""
+  };
+  return e.isXs && (e.active = "xs"), e.isSm && (e.active = "sm"), e.isMd && (e.active = "md"), e.isLg && (e.active = "lg"), e;
+}
+const u = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  useBreakpoints: d,
+  useMediaQuery: t
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  u as a,
+  t as b,
+  d as u
+};