@yourdash/uikit 0.1.14 → 0.1.16

package/lib/components/heading/heading.module.css

@@ -1,47 +0,0 @@
-@charset "UTF-8";
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-/*!
- * Copyright ©2025 Ewsgit <https://ewsgit.uk> and YourDash <https://yourdash.ewsgit.uk> contributors.
- * YourDash is licensed under the MIT License. (https://mit.ewsgit.uk)
- */
-.component {
-  display: inline-block;
-  text-align: center;
-  margin: 0;
-  line-height: 1;
-}
-
-.h1component {
-  font-size: var(--uthedhe1size);
-  font-weight: var(--uthedhe1wgt);
-}
-
-.h2component {
-  font-size: var(--uthedhe2size);
-  font-weight: var(--uthedhe2wgt);
-}
-
-.h3component {
-  font-size: var(--uthedhe3size);
-  font-weight: var(--uthedhe3wgt);
-}
-
-.h4component {
-  font-size: var(--uthedhe4size);
-  font-weight: var(--uthedhe4wgt);
-}
-
-.h5component {
-  font-size: var(--uthedhe5size);
-  font-weight: var(--uthedhe5wgt);
-}
-
-.h6component {
-  font-size: var(--uthedhe6size);
-  font-weight: var(--uthedhe6wgt);
-}
-
-/*# sourceMappingURL=heading.module.css.map */

package/lib/components/heading/heading.module.css.map

@@ -1 +0,0 @@
-{"version":3,"sourceRoot":"","sources":["heading.module.scss","../../theme/themeValues.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;ADOA;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA","file":"heading.module.css"}

package/lib/components/heading/heading.module.scss

@@ -1,43 +0,0 @@
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-@use "../../theme/themeValues.scss" as *;
-
-.component {
-  display: inline-block;
-  text-align: center;
-  margin: 0;
-  line-height: 1;
-}
-
-.h1component {
-  font-size: var(#{$theme}#{$heading}#{$h1}#{$size});
-  font-weight: var(#{$theme}#{$heading}#{$h1}#{$weight});
-}
-
-.h2component {
-  font-size: var(#{$theme}#{$heading}#{$h2}#{$size});
-  font-weight: var(#{$theme}#{$heading}#{$h2}#{$weight});
-}
-
-.h3component {
-  font-size: var(#{$theme}#{$heading}#{$h3}#{$size});
-  font-weight: var(#{$theme}#{$heading}#{$h3}#{$weight});
-}
-
-.h4component {
-  font-size: var(#{$theme}#{$heading}#{$h4}#{$size});
-  font-weight: var(#{$theme}#{$heading}#{$h4}#{$weight});
-}
-
-.h5component {
-  font-size: var(#{$theme}#{$heading}#{$h5}#{$size});
-  font-weight: var(#{$theme}#{$heading}#{$h5}#{$weight});
-}
-
-.h6component {
-  font-size: var(#{$theme}#{$heading}#{$h6}#{$size});
-  font-weight: var(#{$theme}#{$heading}#{$h6}#{$weight});
-}

package/lib/components/icon/UKIcon.tsx

@@ -1,42 +0,0 @@
-/*
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-import styles from "./icon.module.scss";
-import { type FC, useEffect, useState } from "react";
-import ServerErrorIcon from "../../core/icons/server-error.svg";
-import { UKIconType } from "../../core/iconDictionary.ts";
-
-const UKIcon: FC<{
-  // noinspection TypeScriptDuplicateUnionOrIntersectionType
-  icon: UKIconType;
-  size?: string;
-  color?: string;
-  preserveColor?: boolean;
-  className?: string;
-}> = (props) => {
-  const [icon, setIcon] = useState(ServerErrorIcon);
-
-  useEffect(() => {
-    if (typeof props.icon === "function") {
-      props.icon().then((val) => {
-        setIcon(val.default);
-      });
-    }
-  }, [props.icon]);
-
-  return (
-    <div
-      className={`${styles.component} ${props.className} ${props.preserveColor ? styles.preserveColor : ""}`}
-      style={{
-        "--icon": `url("${icon}")`,
-        ...(!props.preserveColor ? { "--color": props.color } : {}),
-        // @ts-ignore
-        "--size": props.size,
-      }}
-    />
-  );
-};
-
-export default UKIcon;

package/lib/components/icon/icon.module.scss

@@ -1,26 +0,0 @@
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-.component {
-  aspect-ratio: 1 / 1;
-  width: var(--size);
-
-  background-color: var(--color, currentColor);
-  -webkit-mask-image: var(--icon);
-  -webkit-mask-position: center;
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-size: cover;
-  mask-image: var(--icon);
-  mask-position: center;
-  mask-repeat: no-repeat;
-  mask-size: cover;
-}
-
-.preserveColor {
-  background-image: var(--icon);
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: cover;
-}

package/lib/components/iconButton/UKIconButton.tsx

@@ -1,36 +0,0 @@
-/*
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-import clippy from "../../core/clippy.ts";
-import UKIcon from "../icon/UKIcon.tsx";
-import { UKIcons } from "../../core/iconDictionary.ts";
-import styles from "./iconButton.module.scss";
-import React, { FC } from "react";
-
-const UKIconButton: FC<{
-  icon: (typeof UKIcons)[keyof typeof UKIcons];
-  accessibleLabel: string;
-  onClick: () => void;
-  style?: React.CSSProperties;
-  className?: string;
-  preserveColor?: boolean;
-}> = (props) => {
-  return (
-    <button
-      style={props.style}
-      onClick={props.onClick}
-      aria-label={props.accessibleLabel}
-      className={clippy(styles.component, props.className)}
-    >
-      <UKIcon
-        size={"1.25rem"}
-        preserveColor={props.preserveColor}
-        icon={props.icon}
-      />
-    </button>
-  );
-};
-
-export default UKIconButton;

package/lib/components/iconButton/iconButton.module.css

@@ -1,42 +0,0 @@
-@charset "UTF-8";
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-/*!
- * Copyright ©2025 Ewsgit <https://ewsgit.uk> and YourDash <https://yourdash.ewsgit.uk> contributors.
- * YourDash is licensed under the MIT License. (https://mit.ewsgit.uk)
- */
-.component {
-  font-family: var(--utfontfam);
-  text-align: center;
-  aspect-ratio: 1/1;
-  color: var(--utbtncol);
-  border: var(--utbtnbrd);
-  border-radius: var(--utbtnrad);
-  background: var(--utbtnbgn);
-  transition: var(--utbtntrans);
-  height: var(--utinphei);
-  width: max-content;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0;
-  cursor: pointer;
-}
-.component:hover {
-  color: var(--utbtnhvrcol);
-  border: var(--utbtnhvrbrd);
-  border-radius: var(--utbtnhvrrad);
-  background: var(--utbtnhvrbgn);
-  transition: var(--utbtnhvrtrans);
-}
-.component:active {
-  color: var(--utbtnatvcol);
-  border: var(--utbtnatvbrd);
-  border-radius: var(--utbtnatvrad);
-  background: var(--utbtnatvbgn);
-  transition: var(--utbtnatvtrans);
-}
-
-/*# sourceMappingURL=iconButton.module.css.map */

package/lib/components/iconButton/iconButton.module.css.map

@@ -1 +0,0 @@
-{"version":3,"sourceRoot":"","sources":["iconButton.module.scss","../../theme/themeValues.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;ADOA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA","file":"iconButton.module.css"}

package/lib/components/iconButton/iconButton.module.scss

@@ -1,40 +0,0 @@
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-@use "../../theme/themeValues.scss" as *;
-
-.component {
-  font-family: var(#{$theme}#{$font}#{$family});
-  text-align: center;
-  aspect-ratio: 1 / 1;
-  color: rgb(var(#{$theme}#{$button}#{$color}));
-  border: var(#{$theme}#{$button}#{$border});
-  border-radius: var(#{$theme}#{$button}#{$radius});
-  background: rgb(var(#{$theme}#{$button}#{$background}));
-  transition: var(#{$theme}#{$button}#{$transition});
-  height: var(#{$theme+$input+$height});
-  width: max-content;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0;
-  cursor: pointer;
-
-  &:hover {
-    color: rgb(var(#{$theme}#{$button}#{$hover}#{$color}));
-    border: var(#{$theme}#{$button}#{$hover}#{$border});
-    border-radius: var(#{$theme}#{$button}#{$hover}#{$radius});
-    background: rgb(var(#{$theme}#{$button}#{$hover}#{$background}));
-    transition: var(#{$theme}#{$button}#{$hover}#{$transition});
-  }
-
-  &:active {
-    color: rgb(var(#{$theme}#{$button}#{$active}#{$color}));
-    border: var(#{$theme}#{$button}#{$active}#{$border});
-    border-radius: var(#{$theme}#{$button}#{$active}#{$radius});
-    background: rgb(var(#{$theme}#{$button}#{$active}#{$background}));
-    transition: var(#{$theme}#{$button}#{$active}#{$transition});
-  }
-}

package/lib/components/image/UKImage.tsx

@@ -1,111 +0,0 @@
-/*
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-import { UKIcons } from "../../core/iconDictionary.ts";
-import styles from "./image.module.scss";
-import React, { FC, useEffect, useRef, useState } from "react";
-import clippy from "../../core/clippy.ts";
-import UKIcon from "../icon/UKIcon.tsx";
-import { useLevel, useLevelClass } from "../../core/level.tsx";
-
-const UKImage: FC<{
-  src: string;
-  accessibleLabel: string;
-  containerClassName?: string;
-  className?: string;
-  disableLazyLoading?: boolean;
-  noRounding?: boolean;
-  width?: number;
-  height?: number;
-  style?: React.CSSProperties;
-  onClick?: () => void;
-
-}> = (props) => {
-  const ref = useRef<HTMLDivElement>(null);
-  const level= useLevel()
-  const [src, setSrc] = useState<string>(props.src);
-  const [loaded, setLoaded] = useState<boolean>(false);
-  const [hasFailed, setHasFailed] = useState<boolean>(false);
-  const [backgroundSize, setBackgroundSize] = useState<number>(0);
-  const attempts = useRef<number>(0);
-
-  useEffect(() => {
-    const rc = ref.current;
-
-    if (!rc) {
-      return;
-    }
-
-    setTimeout(() => {
-      const bounds = rc.getBoundingClientRect();
-
-      setBackgroundSize(bounds.height > bounds.width ? bounds.height : bounds.width);
-    }, 20);
-  }, [src]);
-
-  useEffect(() => {
-    setHasFailed(false);
-    setLoaded(false);
-  }, [src]);
-
-  useEffect(() => {
-    if (props.src !== src) {
-      setSrc(props.src);
-    }
-  }, [props.src]);
-
-  return (
-    <div
-      data-src={src}
-      ref={ref}
-      onClick={props.onClick}
-      className={clippy(styles.componentContainer, props.containerClassName, !loaded && styles.loading, hasFailed && styles.serverError)}
-      style={{
-        // @ts-ignore
-        "--background-size": backgroundSize + "px",
-        ...props.style,
-      }}
-    >
-      {!hasFailed ? (
-        <img
-          className={clippy(styles.component, useLevelClass(level), props.className, loaded && styles.loaded, props.noRounding && styles.noRounding)}
-          draggable={false}
-          width={props.width}
-          height={props.height}
-          onError={() => {
-            setHasFailed(true);
-            attempts.current++;
-
-            setTimeout(() => {
-              if (attempts.current && attempts.current <= 3) {
-                setSrc((old) => {
-                  if (old.includes("?refresh=")) {
-                    return old.slice(0, old.indexOf("?refresh=")) + "?refresh=" + Date.now();
-                  }
-
-                  return `${old}?refresh=${Date.now()}`;
-                });
-              }
-            }, 500);
-          }}
-          loading={props.disableLazyLoading ? "eager" : "lazy"}
-          alt={props.accessibleLabel}
-          onLoad={(e) => {
-            setLoaded(e.currentTarget.complete);
-            attempts.current = 0;
-          }}
-          onLoadStart={() => {
-            setLoaded(false);
-          }}
-          src={src ?? "/assets/branding/yourdash256.png"}
-        />
-      ) : (
-        <UKIcon icon={UKIcons.ServerError} />
-      )}
-    </div>
-  );
-};
-
-export default UKImage;

package/lib/components/image/image.module.css

@@ -1,76 +0,0 @@
-@charset "UTF-8";
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-/*!
- * Copyright ©2025 Ewsgit <https://ewsgit.uk> and YourDash <https://yourdash.ewsgit.uk> contributors.
- * YourDash is licensed under the MIT License. (https://mit.ewsgit.uk)
- */
-.componentContainer {
-  position: relative;
-}
-
-.component {
-  border-radius: var(--utrad);
-  opacity: 0;
-  max-width: 100%;
-  max-height: 100%;
-  min-width: 2rem;
-  min-height: 2rem;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  pointer-events: none;
-}
-.component.noRounding {
-  border-radius: 0;
-}
-
-.loaded {
-  transition: opacity 750ms linear;
-  opacity: 1;
-}
-
-@keyframes loading {
-  from {
-    background-position: calc(var(--background-size) * -1) calc(var(--background-size) * -1);
-  }
-  to {
-    background-position: var(--background-size) var(--background-size);
-  }
-}
-.loading {
-  background: linear-gradient(to bottom right, transparent 12.5%, #bbbbbb, #ffffff 25%, transparent 12.5%, transparent 12.5%, #bbbbbb, #ffffff 25%, transparent 12.5%);
-  background-repeat: no-repeat;
-  background-size: calc(var(--background-size) * 4) calc(var(--background-size) * 4);
-  animation: loading 1.25s infinite forwards cubic-bezier(0.25, 0.5, 0.5, 0.25);
-  box-shadow: inset 0 0 0.5rem rgba(0, 0, 0, 0.2);
-}
-
-.serverError {
-  --size: 4rem;
-}
-@keyframes fail {
-  0% {
-    background-size: var(--background-size) var(--background-size);
-  }
-  50% {
-    background-size: calc(var(--background-size) * 4) calc(var(--background-size) * 4);
-  }
-  100% {
-    background-size: var(--background-size) var(--background-size);
-  }
-}
-.serverError {
-  background: radial-gradient(transparent, #ff0000);
-  background-repeat: no-repeat;
-  background-size: var(--background-size) var(--background-size);
-  background-position: center center;
-  animation: fail 1s infinite forwards cubic-bezier(0.4, 0, 0.2, 1);
-  box-shadow: 0 0 1rem #fff;
-  border-radius: 0;
-}
-
-/*# sourceMappingURL=image.module.css.map */

package/lib/components/image/image.module.css.map

@@ -1 +0,0 @@
-{"version":3,"sourceRoot":"","sources":["image.module.scss","../../theme/themeValues.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;ADOA;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;;;AAIA;EACE;IACE;;EAGF;IACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;;AAIJ;EACE;;AAEA;EACE;IACE;;EAGF;IACE;;EAGF;IACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"image.module.css"}

package/lib/components/image/image.module.scss

@@ -1,81 +0,0 @@
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-@use "../../theme/themeValues.scss" as *;
-
-.componentContainer {
-  position: relative;
-}
-
-.component {
-  border-radius: $UKRadius;
-  opacity: 0;
-  width: 100%;
-  height: 100%;
-  min-width: 2rem;
-  min-height: 2rem;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-  pointer-events: none;
-
-  &.noRounding {
-    border-radius: 0;
-  }
-}
-
-.loaded {
-  transition: opacity 250ms ease-out;
-  opacity: 1;
-}
-
-.loading {
-  @keyframes loading {
-    from {
-      background-position: calc(var(--background-size) * -1) calc(var(--background-size) * -1);
-    }
-
-    to {
-      background-position: var(--background-size) var(--background-size);
-    }
-  }
-
-  & {
-    background: linear-gradient(to bottom right, transparent 12.5%, #bbbbbb, #ffffff 25%, transparent 12.5%, transparent 12.5%, #bbbbbb, #ffffff 25%, transparent 12.5%);
-    background-repeat: no-repeat;
-    background-size: calc(var(--background-size) * 4) calc(var(--background-size) * 4);
-    animation: loading 1.25s infinite forwards cubic-bezier(0.25, 0.5, 0.5, 0.25);
-    box-shadow: inset 0 0 0.5rem #0003;
-  }
-}
-
-.serverError {
-  --size: 4rem;
-
-  @keyframes fail {
-    0% {
-      background-size: var(--background-size) var(--background-size);
-    }
-
-    50% {
-      background-size: calc(var(--background-size) * 4) calc(var(--background-size) * 4);
-    }
-
-    100% {
-      background-size: var(--background-size) var(--background-size);
-    }
-  }
-
-  & {
-    background: radial-gradient(transparent, #ff0000);
-    background-repeat: no-repeat;
-    background-size: var(--background-size) var(--background-size);
-    background-position: center center;
-    animation: fail 1s infinite forwards cubic-bezier(0.4, 0, 0.2, 1);
-    box-shadow: 0 0 1rem #fff;
-    border-radius: 0;
-  }
-}

package/lib/components/link/UKLink.tsx

@@ -1,29 +0,0 @@
-/*
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-import clippy from "../../core/clippy.ts";
-import UKIcon from "../icon/UKIcon.tsx";
-import { UKIcons } from "../../core/iconDictionary.ts";
-import styles from "./link.module.scss";
-import { FC } from "react";
-
-const UKLink: FC<{ text: string; to: string; className?: string; hideLinkIcon?: boolean }> = (props) => {
-  return (
-    <a
-      href={props.to}
-      className={clippy(styles.component, props.className)}
-    >
-      {props.text}
-      {!props.hideLinkIcon && (
-        <UKIcon
-          icon={UKIcons.Link}
-          className={styles.icon}
-        />
-      )}
-    </a>
-  );
-};
-
-export default UKLink;

package/lib/components/link/link.module.css

@@ -1,33 +0,0 @@
-@charset "UTF-8";
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-/*!
- * Copyright ©2025 Ewsgit <https://ewsgit.uk> and YourDash <https://yourdash.ewsgit.uk> contributors.
- * YourDash is licensed under the MIT License. (https://mit.ewsgit.uk)
- */
-.component {
-  display: inline-block;
-  cursor: pointer;
-  text-decoration: underline;
-  font-weight: var(--utfontwgt);
-  font-size: var(--utfontsize);
-  font-family: var(--utfontfam);
-  color: var(--utacn);
-  transition: var(--utbtntrans);
-}
-.component:hover {
-  text-decoration: none;
-  color: var(--utacn);
-  opacity: 0.8;
-  transition: var(--utbtnhvrtrans);
-}
-.component:active {
-  text-decoration: none;
-  color: var(--utacn);
-  opacity: 1;
-  transition: var(--utbtnatvtrans);
-}
-
-/*# sourceMappingURL=link.module.css.map */

package/lib/components/link/link.module.css.map

@@ -1 +0,0 @@
-{"version":3,"sourceRoot":"","sources":["link.module.scss","../../theme/themeValues.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;ADOA;EACE;EACA;EACE;EAEF;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA","file":"link.module.css"}

package/lib/components/link/link.module.scss

@@ -1,36 +0,0 @@
-/*!
- * Copyright ©2025 Ewsgit<https://github.com/ewsgit> and YourDash<https://github.com/yourdash> contributors.
- * YourDash is licensed under the MIT License. (https://ewsgit.mit-license.org)
- */
-
-@use "../../theme/themeValues.scss" as *;
-
-.component {
-  display: inline-block;
-  cursor: pointer;
-    text-decoration: underline;
-
-  font-weight: var(#{$theme+$font+$weight});
-  font-size: var(#{$theme+$font+$size});
-  font-family: var(#{$theme+$font+$family});
-  color: rgb(var(#{$theme+$accent}));
-  transition: var(#{$theme+$button+$transition});
-
-  &:hover {
-    text-decoration: none;
-    color: rgb(var(#{$theme+$accent}));
-    opacity: 0.8;
-    transition: var(#{$theme+$button+$hover+$transition});
-  }
-
-  &:active {
-    text-decoration: none;
-    color: rgb(var(#{$theme+$accent}));
-    opacity: 1;
-    transition: var(#{$theme+$button+$active+$transition});
-  }
-}
-
-.icon {
-
-}