rbro-tat-uds 1.6.36 → 2.0.1

package/build/cjs/components/Datepicker/helpers_calendar.cjs

@@ -0,0 +1,128 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const THIS_YEAR = +(/* @__PURE__ */ new Date()).getFullYear();
+const THIS_MONTH = +(/* @__PURE__ */ new Date()).getMonth() + 1;
+const WEEK_DAYS = {
+  Monday: "L",
+  Tuesday: "M",
+  Wednesday: "M",
+  Thursday: "J",
+  Friday: "V",
+  Saturday: "S",
+  Sunday: "D"
+};
+const CALENDAR_MONTHS = {
+  January: "Ianuarie",
+  February: "Februarie",
+  March: "Martie",
+  April: "Aprilie",
+  May: "Mai",
+  June: "Iunie",
+  July: "Iulie",
+  August: "August",
+  September: "Septembrie",
+  October: "Octombrie",
+  November: "Noiembrie",
+  December: "Decembrie"
+};
+const CALENDAR_WEEKS = 6;
+const CALENDAR_YEARS = 6;
+const zeroPad = (value, length) => {
+  return `${value}`.padStart(length, "0");
+};
+const getMonthDays = (month = THIS_MONTH, year = THIS_YEAR) => {
+  const months30 = [4, 6, 9, 11];
+  const leapYear = year % 4 === 0;
+  return month === 2 ? leapYear ? 29 : 28 : months30.includes(month) ? 30 : 31;
+};
+const getMonthFirstDay = (month = THIS_MONTH, year = THIS_YEAR) => {
+  return +(/* @__PURE__ */ new Date(`${year}-${zeroPad(month, 2)}-01`)).getDay();
+};
+const isDate = (date) => {
+  const isDate2 = Object.prototype.toString.call(date) === "[object Date]";
+  const isValidDate = date && !Number.isNaN(date.valueOf());
+  return isDate2 && isValidDate;
+};
+const isSameMonth = (date, basedate = /* @__PURE__ */ new Date()) => {
+  if (!(isDate(date) && isDate(basedate))) return false;
+  const basedateMonth = +basedate.getMonth() + 1;
+  const basedateYear = basedate.getFullYear();
+  const dateMonth = +date.getMonth() + 1;
+  const dateYear = date.getFullYear();
+  return +basedateMonth === +dateMonth && +basedateYear === +dateYear;
+};
+const isSameDay = (date, basedate = /* @__PURE__ */ new Date()) => {
+  if (!(isDate(date) && isDate(basedate))) return false;
+  const basedateDate = basedate.getDate();
+  const basedateMonth = +basedate.getMonth() + 1;
+  const basedateYear = basedate.getFullYear();
+  const dateDate = date.getDate();
+  const dateMonth = +date.getMonth() + 1;
+  const dateYear = date.getFullYear();
+  return +basedateDate === +dateDate && +basedateMonth === +dateMonth && +basedateYear === +dateYear;
+};
+const getDateISO = (date = /* @__PURE__ */ new Date()) => {
+  if (!isDate(date)) return null;
+  return [
+    date.getFullYear(),
+    zeroPad(+date.getMonth() + 1, 2),
+    zeroPad(+date.getDate(), 2)
+  ].join("-");
+};
+const getPreviousMonth = (month, year) => {
+  const prevMonth = month > 1 ? month - 1 : 12;
+  const prevMonthYear = month > 1 ? year : year - 1;
+  return { month: prevMonth, year: prevMonthYear };
+};
+const getNextMonth = (month, year) => {
+  const nextMonth = month < 12 ? month + 1 : 1;
+  const nextMonthYear = month < 12 ? year : year + 1;
+  return { month: nextMonth, year: nextMonthYear };
+};
+var calendar = (month = THIS_MONTH, year = THIS_YEAR) => {
+  const monthDays = getMonthDays(month, year);
+  const monthFirstDay = getMonthFirstDay(month, year);
+  const daysFromPrevMonth = monthFirstDay === 0 ? 7 - 1 : monthFirstDay - 1;
+  const daysFromNextMonth = CALENDAR_WEEKS * 7 - (daysFromPrevMonth + monthDays);
+  const { month: prevMonth, year: prevMonthYear } = getPreviousMonth(
+    month,
+    year
+  );
+  const { month: nextMonth, year: nextMonthYear } = getNextMonth(month, year);
+  const prevMonthDays = getMonthDays(prevMonth, prevMonthYear);
+  const prevMonthDates = [...new Array(daysFromPrevMonth)].map((_, index) => {
+    const day = index + 1 + (prevMonthDays - daysFromPrevMonth);
+    return [prevMonthYear, zeroPad(prevMonth, 2), zeroPad(day, 2)];
+  });
+  const thisMonthDates = [...new Array(monthDays)].map((_, index) => {
+    const day = index + 1;
+    return [year, zeroPad(month, 2), zeroPad(day, 2)];
+  });
+  const nextMonthDates = [...new Array(daysFromNextMonth)].map((_, index) => {
+    const day = index + 1;
+    return [nextMonthYear, zeroPad(nextMonth, 2), zeroPad(day, 2)];
+  });
+  return [...prevMonthDates, ...thisMonthDates, ...nextMonthDates];
+};
+
+exports.CALENDAR_MONTHS = CALENDAR_MONTHS;
+exports.CALENDAR_WEEKS = CALENDAR_WEEKS;
+exports.CALENDAR_YEARS = CALENDAR_YEARS;
+exports.THIS_MONTH = THIS_MONTH;
+exports.THIS_YEAR = THIS_YEAR;
+exports.WEEK_DAYS = WEEK_DAYS;
+exports.default = calendar;
+exports.getDateISO = getDateISO;
+exports.getMonthDays = getMonthDays;
+exports.getMonthFirstDay = getMonthFirstDay;
+exports.getNextMonth = getNextMonth;
+exports.getPreviousMonth = getPreviousMonth;
+exports.isDate = isDate;
+exports.isSameDay = isSameDay;
+exports.isSameMonth = isSameMonth;
+exports.zeroPad = zeroPad;

package/build/cjs/components/Datepicker/index.cjs

@@ -0,0 +1,12 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Datepicker = require('./Datepicker.cjs');
+
+
+
+exports.default = Datepicker.default;

package/build/cjs/components/Divider/Divider.cjs

@@ -0,0 +1,29 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+require('react');
+var styled = require('styled-components');
+var utils = require('../../utils');
+
+const StyledDivider = styled.div`
+  width: 100%;
+  margin: ${(props) => props.$margin && typeof props.$margin === "string" ? props.$margin : "0px 0px"};
+  border-bottom-width: ${(props) => props.$weight && typeof props.$weight ? props.$weight + "px" : "1px"};
+  border-bottom-style: solid;
+  border-bottom-color: ${(props) => props.$color && typeof props.$color === "string" && Object.keys(utils.colors).includes(props.$color) && utils.colors[props.$color]};
+`;
+const Divider = ({
+  color = "gray_1000_10",
+  margin = "0px 0px",
+  weight = 1,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(StyledDivider, { $color: color, $margin: margin, $weight: weight, ...rest });
+};
+
+exports.default = Divider;

package/build/cjs/components/Divider/index.cjs

@@ -0,0 +1,12 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Divider = require('./Divider.cjs');
+
+
+
+exports.default = Divider.default;

package/build/cjs/components/DonutGraph/DonutGraph.cjs

@@ -0,0 +1,81 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+
+const DonutGraph = ({
+  items = [{ value: 1, color: "blue" }],
+  size = 100,
+  innerSize = 30
+}) => {
+  const total = React.useMemo(() => {
+    return Math.max(
+      1,
+      items.reduce((acc, item) => acc + item.value, 0)
+    );
+  }, [items]);
+  const isSingleItem = React.useMemo(() => {
+    return items.length === 1 || items.some((item) => item.value > 0);
+  }, [items]);
+  let startAngle = 0;
+  const calculateInRadians = (angleDegrees) => {
+    const totalCircleInRadians = Math.PI * 2;
+    const totalCirclesInDegrees = 360;
+    const angleInRadians = (angleDegrees - 90) * totalCircleInRadians / totalCirclesInDegrees;
+    return angleInRadians;
+  };
+  const computePath = React.useCallback(
+    (startAngle2, endAngle) => {
+      const startInRadians = calculateInRadians(startAngle2);
+      const endInRadians = calculateInRadians(endAngle);
+      const startOuter = {
+        x: size + size * Math.cos(endInRadians),
+        y: size + size * Math.sin(endInRadians)
+      };
+      const endOuter = {
+        x: size + size * Math.cos(startInRadians),
+        y: size + size * Math.sin(startInRadians)
+      };
+      const startInner = {
+        x: size + innerSize * Math.cos(startInRadians),
+        y: size + innerSize * Math.sin(startInRadians)
+      };
+      const endInner = {
+        x: size + innerSize * Math.cos(endInRadians),
+        y: size + innerSize * Math.sin(endInRadians)
+      };
+      const isLargeArc = endAngle - startAngle2 > 180 ? 1 : 0;
+      return `
+      M ${startOuter.x} ${startOuter.y}
+      A ${size} ${size} 0 ${isLargeArc} 0 ${endOuter.x} ${endOuter.y}
+      L ${startInner.x} ${startInner.y}
+      A ${innerSize} ${innerSize} 0 ${isLargeArc} 1 ${endInner.x} ${endInner.y}
+      Z
+    `;
+    },
+    [size, innerSize]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      width: size * 2,
+      height: size * 2,
+      viewBox: `0 0 ${size * 2} ${size * 2}`,
+      preserveAspectRatio: "xMidYMid meet",
+      children: items.map((item, index) => {
+        const calculateAngleItemInDegrees = item.value / total * 360;
+        const endAngle = startAngle + calculateAngleItemInDegrees - (isSingleItem ? 9e-4 : 0);
+        const d = computePath(startAngle, endAngle);
+        startAngle = endAngle;
+        return /* @__PURE__ */ jsxRuntime.jsx("path", { fill: item.color, d }, index);
+      })
+    }
+  );
+};
+
+exports.default = DonutGraph;

package/build/cjs/components/DonutGraph/index.cjs

@@ -0,0 +1,12 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var DonutGraph = require('./DonutGraph.cjs');
+
+
+
+exports.default = DonutGraph.default;

package/build/cjs/components/Dropdown/Dropdown.cjs

@@ -0,0 +1,301 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var styled = require('styled-components');
+var Icon = require('../Icon/Icon.cjs');
+var utils = require('../../utils');
+
+const sizesClasses = {
+  small: styled.css`
+    height: 32px;
+    padding: 0px 30px 0px 12px;
+  `,
+  medium: styled.css`
+    height: 40px;
+    padding: 0px 38px 0px 12px;
+  `,
+  large: styled.css`
+    height: 48px;
+    padding: 0px 42px 0px 16px;
+  `
+};
+const DropdownWraperStyled = styled.div`
+  position: relative;
+  width: 100%;
+
+  & > div:first-of-type {
+    position: absolute;
+    right: 10px;
+    top: 0;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    pointer-events: none;
+  }
+
+  & > input {
+    border-radius: 8px;
+    border: none;
+    outline: none;
+    appearance: none;
+    cursor: pointer;
+    background-color: ${utils.colors.gray_100};
+    color: ${utils.colors.gray_950};
+    width: 100%;
+    font-size: ${({ $size }) => $size && ["small", "medium", "large"].includes($size) ? $size === "small" ? "14px" : $size === "medium" ? "14px" : "16px" : "14px"};
+    font-weight: 400;
+    line-height: 120%;
+
+    ${({ $intent }) => $intent === "danger" && styled.css`
+        outline: 2px solid ${utils.colors.danger_500};
+      `}
+
+    ${({ $size }) => $size && ["small", "medium", "large"].includes($size) ? sizesClasses[$size] : sizesClasses.medium};
+
+    &:placeholder {
+      color: ${utils.colors.gray_600};
+    }
+
+    ${({ $isOpen }) => $isOpen && styled.css`
+        outline: 2px solid ${utils.colors.accent_600};
+      `}
+
+    ${({ $disabled }) => $disabled && styled.css`
+        background-color: ${utils.colors.gray_30};
+        color:${utils.colors.gray_600}
+
+        &:placeholder {
+          color:${utils.colors.gray_500}
+        }
+      `}
+  }
+`;
+const DropdownContentStyled = styled.div`
+  background-color: ${utils.colors.white};
+  position: absolute;
+  z-index: 100;
+  margin-top: 16px;
+  top: 100%;
+  left: 0;
+  width: ${({ $dropdownContentWidth }) => $dropdownContentWidth && typeof $dropdownContentWidth === "string" ? $dropdownContentWidth : "100%"};
+  box-shadow: 0px 6px 20px 0px rgba(19, 20, 22, 0.2),
+    0px 2px 6px 0px rgba(19, 20, 22, 0.15);
+  border-radius: 16px;
+
+  ${({ $searchInput }) => $searchInput && styled.css`
+      & > div:first-of-type {
+        padding: 12px 12px 12px 12px;
+        border-bottom: 1px solid ${utils.colors.gray_150};
+
+        & > div {
+          position: relative;
+          width: 100%;
+
+          & > input {
+            width: 100%;
+            appearance: none;
+            outline: none;
+            border: none;
+            background-color: ${utils.colors.gray_100};
+            border-radius: 8px;
+            padding-right: 10px;
+            padding-left: 40px;
+            height: 40px;
+            font-size: 14px;
+            font-weight: 400;
+            line-height: 120%;
+            color: ${utils.colors.gray_950};
+
+            &::placeholder {
+              color: ${utils.colors.gray_600};
+            }
+          }
+
+          & > div {
+            position: absolute;
+            height: 100%;
+            left: 12px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
+        }
+      }
+    `}
+
+  & > div:last-of-type {
+    padding-right: 4px;
+    div {
+      padding: 12px 8px 12px 12px;
+      width: 100%;
+      overflow-y: scroll;
+      max-height: ${({ $maxHeight }) => $maxHeight && typeof $maxHeight === "string" ? $maxHeight : "336px"};
+
+      &::-webkit-scrollbar-track-piece {
+        margin: 15px;
+      }
+      &::-webkit-scrollbar {
+        width: 8px;
+      }
+      &::-webkit-scrollbar-thumb {
+        background-color: ${utils.colors.gray_300};
+        border-radius: 999px;
+        width: 8px;
+      }
+
+      & > div > span {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      & > div {
+        height: 42px;
+        display: flex;
+        align-items: center;
+        justify-content: flex-start;
+        padding: 12px;
+        cursor: pointer;
+        font-size: 14px;
+        width: 100%;
+        font-weight: 400;
+        line-height: 120%;
+        color: ${utils.colors.gray_950};
+
+        &:hover {
+          border-radius: 8px;
+          background-color: ${utils.colors.info_100};
+        }
+      }
+    }
+  }
+`;
+const Dropdown = ({
+  id,
+  name,
+  placeholder = "Selecteaza",
+  value,
+  setValue,
+  size = "medium",
+  intent = "default",
+  disabled,
+  maxHeight = "336px",
+  searchInput,
+  defaultOpen = false,
+  data = [{ label: "", value: "" }],
+  dropdownContentWidth = "100%",
+  ...rest
+}) => {
+  const [isOpen, setIsOpen] = React.useState(defaultOpen);
+  const wrapper_reference = React.useRef(null);
+  const [filteredItems, setFilteredItems] = React.useState(data);
+  const [searchField, setSearchField] = React.useState("");
+  const handleSearchItem = React.useCallback(
+    (e) => {
+      const searchTerm = e.target.value;
+      setSearchField(searchTerm);
+      const filtered = data.filter(
+        (item) => item.label.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+      setFilteredItems(filtered);
+    },
+    [data]
+  );
+  const handleDropdown = React.useCallback(
+    (item) => {
+      setValue(item.value);
+      setIsOpen(false);
+      setSearchField("");
+      setFilteredItems(data);
+    },
+    [data, setValue]
+  );
+  const labeled = React.useMemo(() => {
+    if (data && value) {
+      return data.find((item) => item.value === value)?.label || "";
+    }
+    return "";
+  }, [value, data]);
+  React.useEffect(() => {
+    const handleClickOutside = (event) => {
+      if (wrapper_reference.current && !wrapper_reference.current.contains(event.target)) {
+        setIsOpen(false);
+        setSearchField("");
+        setFilteredItems(data);
+      }
+    };
+    if (isOpen) {
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => {
+        document.removeEventListener("mousedown", handleClickOutside);
+      };
+    }
+  }, [wrapper_reference, isOpen, data]);
+  React.useEffect(() => {
+    setIsOpen(defaultOpen);
+  }, [defaultOpen]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    DropdownWraperStyled,
+    {
+      ref: wrapper_reference,
+      $size: size,
+      $intent: intent,
+      $disabled: disabled,
+      $isOpen: isOpen,
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            readOnly: true,
+            placeholder,
+            id,
+            type: "text",
+            name,
+            value: labeled,
+            onClick: () => !disabled && setIsOpen(!isOpen),
+            onChange: (e) => e.preventDefault()
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
+          Icon.default,
+          {
+            icon: "select-open-down",
+            size: 20,
+            color: disabled ? utils.colors.info_500_40 : utils.colors.info_700
+          }
+        ) }),
+        isOpen && /* @__PURE__ */ jsxRuntime.jsxs(
+          DropdownContentStyled,
+          {
+            $maxHeight: maxHeight,
+            $searchInput: searchInput,
+            $dropdownContentWidth: dropdownContentWidth,
+            children: [
+              searchInput && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Icon.default, { icon: "search", size: 20, color: utils.colors.gray_500 }) }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "input",
+                  {
+                    onChange: handleSearchItem,
+                    value: searchField,
+                    type: "text"
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: filteredItems.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { onClick: () => handleDropdown(item), children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.label }) }, index)) }) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+
+exports.default = Dropdown;

package/build/cjs/components/Dropdown/index.cjs

@@ -0,0 +1,12 @@
+"use strict";
+"use client";
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Dropdown = require('./Dropdown.cjs');
+
+
+
+exports.default = Dropdown.default;