@knkcs/anker 1.10.1 → 1.10.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knkcs/anker",
-  "version": "1.10.1",
+  "version": "1.10.2",
   "description": "UI component library for the knk software group",
   "repository": {
     "type": "git",

package/dist/chunk-ELQTHWXC.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/atoms/datetime/utils/relative-date-time-utils.ts","../src/atoms/status-badge/status-badge.tsx"],"names":[],"mappings":";;;;;;;;;AAKA,KAAA,CAAM,OAAO,SAAS,CAAA;AACtB,KAAA,CAAM,OAAO,YAAY,CAAA;AACzB,KAAA,CAAM,OAAO,cAAc,CAAA;AAmBpB,SAAS,sBAAA,CACf,IAAA,EACA,QAAA,mBAAqB,IAAI,MAAK,EAC7B;AACD,EAAA,OAAO,KAAA,CAAM,IAAI,CAAA,CAAE,IAAA,CAAK,QAAQ,CAAA;AACjC;AAmBO,SAAS,mCAAA,CACf,IAAA,EACA,QAAA,mBAAqB,IAAI,MAAK,EAC7B;AACD,EAAA,MAAM,UAAU,KAAA,CAAM,IAAI,CAAA,CAAE,MAAA,CAAO,UAAU,KAAK,CAAA;AAElD,EAAA,IAAI,CAAC,OAAA,EAAS;AAGb,IAAA,OAAO,KAAA,CAAM,IAAI,CAAA,CAAE,QAAA,CAAS,QAAA,EAAU;AAAA,MACrC,QAAA,EAAU;AAAA,KACV,CAAA;AAAA,EACF;AAGA,EAAA,OAAO,sBAAA,CAAuB,MAAM,QAAQ,CAAA;AAC7C;ACtDO,IAAM,WAAA,GAA0C,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM,EAAE,KAAA,EAAO,KAAA,EAAM,GAAI,KAAA;AAEzB,EAAA,MAAM,SAAA,GAAY,QAAQ,MAAM;AAC/B,IAAA,IAAI;AACH,MAAA,OAAO,cAAc,KAAK,CAAA;AAAA,IAC3B,CAAA,CAAA,MAAQ;AACP,MAAA,OAAO,OAAA;AAAA,IACR;AAAA,EACD,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,uBACC,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACA,EAAA,EAAI,KAAA;AAAA,MACJ,KAAA,EAAO,SAAA;AAAA,MACP,OAAA,EAAQ,MAAA;AAAA,MACR,EAAA,EAAI,CAAA;AAAA,MACJ,iBAAA,EAAmB,CAAA;AAAA,MAElB,QAAA,EAAA;AAAA;AAAA,GACF;AAEF;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"chunk-ELQTHWXC.js","sourcesContent":["import dayjs from \"dayjs\";\nimport calendarPlugin from \"dayjs/plugin/calendar.js\";\nimport relativeTime from \"dayjs/plugin/relativeTime.js\";\nimport utcPlugin from \"dayjs/plugin/utc.js\";\n\ndayjs.extend(utcPlugin);\ndayjs.extend(relativeTime);\ndayjs.extend(calendarPlugin);\n\nimport type { DateType } from \"../types\";\n\n/**\n * A function that will return a string with how far a given date is in the past or future,\n * using a baseDate as reference. If the baseDate is not passed, the function will use today as reference.\n *\n * @param date - the date to be formatted\n * @param baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n *\n * @example\n * // Considering today as 18.08.2021\n * formatRelativeDateTime('2021-08-17T15:45:00') // returns \"a day ago\"\n *\n * @example\n * formatRelativeDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"in a day\"\n */\nexport function formatRelativeDateTime(\n\tdate: DateType,\n\tbaseDate: DateType = new Date(),\n) {\n\treturn dayjs(date).from(baseDate);\n}\n\n/**\n * A function that formats a date relative to Today or to the `baseDate` if passed.\n * If the date is not today, it will return a string with \"Yesterday ...\", \"Tomorrow ...\", etc\n * If the date is not in the current week, it return a string with \"DD MMM YYYY\" format\n * If the date is today, it will return a string with \"... ago\" or \"in ...\"\n *\n * @param date - the date to be formatted\n * @param baseDate - the date that should be used as a reference (default is \"today\")\n * @returns a relative date\n *\n * @example\n * // Considering today as 18.08.2021\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00') // returns \"Yesterday at 3:45 PM\"\n *\n * @example\n * formatRelativeToCurrentWeekDateTime('2021-08-17T15:45:00', '2021-08-16') // returns \"Tomorrow at 3:45 PM\"\n */\nexport function formatRelativeToCurrentWeekDateTime(\n\tdate: DateType,\n\tbaseDate: DateType = new Date(),\n) {\n\tconst isToday = dayjs(date).isSame(baseDate, \"day\");\n\n\tif (!isToday) {\n\t\t// if the date is not today, we display it with \"Yesterday\", \"Tomorrow\", etc.\n\t\t// and if the date is not in the current week then it will display \"17 Aug 2021\"\n\t\treturn dayjs(date).calendar(baseDate, {\n\t\t\tsameElse: \"DD MMM YYYY\",\n\t\t});\n\t}\n\n\t// returns \"... ago\"\n\treturn formatRelativeDateTime(date, baseDate);\n}\n","import { readableColor } from \"color2k\";\nimport type React from \"react\";\nimport { useMemo } from \"react\";\nimport { Badge } from \"../../primitives/badge\";\n\nexport interface StatusBadgeProps {\n\t/** The display label for the badge */\n\tlabel: string;\n\t/** The background color for the badge (hex format, e.g. \"#ff0000\") */\n\tcolor: string;\n}\n\nexport const StatusBadge: React.FC<StatusBadgeProps> = (props) => {\n\tconst { label, color } = props;\n\n\tconst textColor = useMemo(() => {\n\t\ttry {\n\t\t\treturn readableColor(color);\n\t\t} catch {\n\t\t\treturn \"black\";\n\t\t}\n\t}, [color]);\n\n\treturn (\n\t\t<Badge\n\t\t\tbg={color}\n\t\t\tcolor={textColor}\n\t\t\trounded=\"base\"\n\t\t\tpx={2}\n\t\t\tmarginInlineStart={1}\n\t\t>\n\t\t\t{label}\n\t\t</Badge>\n\t);\n};\n\nStatusBadge.displayName = \"StatusBadge\";\n"]}