@redneckz/wildless-cms-uni-blocks 0.2.74 → 0.2.77

package/src/ui-kit/Button/ArrowButton.tsx

@@ -0,0 +1,32 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { Button } from './Button';
+import { ButtonProps } from './ButtonProps';
+import { SVG } from '../SVG';
+
+const ARROW_PATHS = [
+  {
+    d: 'm9 12 4-4-4-4',
+    stroke: 'currentColor',
+    strokeWidth: '2',
+    strokeLinecap: 'round',
+    fill: 'none',
+  },
+  {
+    d: 'M2 9a1 1 0 0 1 0-2v2Zm6-2a1 1 0 0 1 0 2V7ZM2 7h6v2H2V7Z',
+  },
+];
+
+export const ArrowButton = JSX<ButtonProps>(({ className, disabled, ...rest }) => (
+  <Button
+    rounded
+    className={`shadow-[0_4px_25px_rgba(0,0,0,0.07)] w-12 h-12 min-h-12 max-h-12 flex items-center justify-center ${
+      disabled
+        ? 'bg-secondary-light text-secondary-text'
+        : 'bg-white text-primary-text hover:text-primary-main'
+    } ${className || ''}`}
+    disabled={disabled}
+    {...rest}
+  >
+    <SVG paths={ARROW_PATHS} viewBox="0 0 16 16" fill="none" width="16" height="16" />
+  </Button>
+));

package/src/ui-kit/Button/Button.fixture.tsx

@@ -0,0 +1,163 @@
+import '../../setup-fixture';
+
+import { Button } from './Button';
+import { Icon } from '../Icon/Icon';
+
+export default {
+  all: (
+    <div className="font-sans overflow-hidden">
+      <div>
+        <p>Private clients</p>
+        <div className="flex gap-6" data-theme="pc">
+          <Button href="https://www.rshb.ru/" target="_blank" text="Primary" version="primary" />
+          <Button
+            href="https://www.rshb.ru/"
+            target="_blank"
+            text="Secondary"
+            version="secondary"
+          />
+        </div>
+      </div>
+      <div>
+        <p>Business clients</p>
+        <div className="flex gap-6" data-theme="bc">
+          <Button href="https://www.rshb.ru/" target="_blank" text="Primary" version="primary" />
+          <Button
+            href="https://www.rshb.ru/"
+            target="_blank"
+            text="Secondary"
+            version="secondary"
+          />
+        </div>
+      </div>
+      <div>
+        <p>Ecosystem own</p>
+        <div className="flex gap-6" data-theme="eo">
+          <Button href="https://www.rshb.ru/" target="_blank" text="Primary" version="primary" />
+          <Button
+            href="https://www.rshb.ru/"
+            target="_blank"
+            text="Secondary"
+            version="secondary"
+          />
+        </div>
+      </div>
+      <div>
+        <p>Disabled</p>
+        <div className="flex gap-6">
+          <Button
+            href="https://www.rshb.ru/"
+            target="_blank"
+            text="Primary"
+            version="primary"
+            disabled
+          />
+          <Button
+            href="https://www.rshb.ru/"
+            target="_blank"
+            text="Secondary"
+            version="secondary"
+            disabled
+          />
+        </div>
+      </div>
+      <div>
+        <p>With Icon</p>
+        <div className="flex gap-6" data-theme="pc">
+          <Button
+            href="https://www.rshb.ru/"
+            target="_blank"
+            aboveText="Доступно в"
+            appendLeft={
+              /** Div need for perfect pixel */
+              <div>
+                <Icon name="PlayMarketIcon" width="24" height="24" />
+              </div>
+            }
+            text="Google Play"
+            version="secondary"
+          />
+          <Button
+            href="https://www.rshb.ru/"
+            target="_blank"
+            aboveText="Загрузите в"
+            appendLeft={
+              <div>
+                <Icon name="AppleIcon" width="24" height="24" />
+              </div>
+            }
+            text="App Store"
+            version="secondary"
+          />
+        </div>
+      </div>
+      <div>
+        <p>Rounded with only Icon</p>
+        <div className="flex gap-6" data-theme="pc">
+          <Button
+            rounded
+            href="https://www.rshb.ru/"
+            target="_blank"
+            version="secondary"
+            appendLeft={<Icon name="PlayMarketIcon" width="20" height="21" />}
+          />
+          <Button
+            rounded
+            href="https://www.rshb.ru/"
+            target="_blank"
+            version="secondary"
+            appendLeft={<Icon name="AppleIcon" width="18" height="20" />}
+          />
+        </div>
+      </div>
+    </div>
+  ),
+  'primary (Private clients)': (
+    <div data-theme="pc">
+      <Button href="https://www.rshb.ru/" target="_blank" text="Сайт РСХБ" version="primary" />
+    </div>
+  ),
+  'secondary (Private clients)': (
+    <div data-theme="pc">
+      <Button href="https://www.rshb.ru/" target="_blank" text="Сайт РСХБ" version="secondary" />
+    </div>
+  ),
+  'primary (Business clients)': (
+    <div data-theme="bc">
+      <Button href="https://www.rshb.ru/" target="_blank" text="Сайт РСХБ" version="primary" />
+    </div>
+  ),
+  'secondary (Business clients)': (
+    <div data-theme="bc">
+      <Button href="https://www.rshb.ru/" target="_blank" text="Сайт РСХБ" version="secondary" />
+    </div>
+  ),
+  'primary (Ecosystem own)': (
+    <div data-theme="eo">
+      <Button href="https://www.rshb.ru/" target="_blank" text="Сайт РСХБ" version="primary" />
+    </div>
+  ),
+  'secondary (Ecosystem own)': (
+    <div data-theme="eo">
+      <Button href="https://www.rshb.ru/" target="_blank" text="Сайт РСХБ" version="secondary" />
+    </div>
+  ),
+  'primary (disabled)': (
+    <Button
+      href="https://www.rshb.ru/"
+      target="_blank"
+      text="Сайт РСХБ"
+      version="primary"
+      disabled
+    />
+  ),
+  'secondary (disabled)': (
+    <Button
+      href="https://www.rshb.ru/"
+      target="_blank"
+      text="Сайт РСХБ"
+      version="secondary"
+      disabled
+    />
+  ),
+};

package/src/ui-kit/Button/Button.tsx

@@ -0,0 +1,90 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { ButtonVersion } from '../../model/ButtonVersion';
+import type { ButtonInnerProps, ButtonProps } from './ButtonProps';
+
+const buttonStyleMap: Record<ButtonVersion, string> = {
+  primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
+  secondary:
+    'text-primary-main bg-secondary-light hover:bg-secondary-hover active:bg-secondary-active',
+};
+
+const buttonDisabledStyleMap: Record<ButtonVersion, string> = {
+  primary: 'bg-secondary-dark text-secondary-text',
+  secondary: 'bg-secondary-light text-secondary-text',
+};
+
+const styleButton = 'inline-block text-center font-sans select-none';
+
+export const Button = JSX<ButtonProps>(
+  ({
+    className,
+    text,
+    aboveText,
+    appendLeft,
+    href,
+    target,
+    onClick,
+    children,
+    disabled,
+    rounded,
+    version = 'none',
+    ariaLabel,
+    ...rest
+  }) => {
+    const buttonInner = children ?? (
+      <ButtonInner text={text} aboveText={aboveText} appendLeft={appendLeft} rounded={rounded} />
+    );
+
+    if (disabled) {
+      return (
+        <div
+          role="button"
+          aria-disabled="true"
+          aria-label={ariaLabel}
+          tabIndex="-1"
+          className={`${styleButton} ${buttonDisabledStyleMap[version] || ''} ${
+            rounded ? 'rounded-full' : 'rounded-md'
+          } ${className || ''}`}
+        >
+          {buttonInner}
+        </div>
+      );
+    }
+
+    return (
+      <a
+        className={`${styleButton} cursor-pointer no-underline ${buttonStyleMap[version] || ''} ${
+          rounded ? 'rounded-full' : 'rounded-md'
+        } ${className || ''}`}
+        href={href}
+        target={target}
+        onClick={onClick}
+        aria-label={ariaLabel}
+        role={!href ? 'button' : 'link'}
+        {...rest}
+      >
+        {buttonInner}
+      </a>
+    );
+  },
+);
+
+export const ButtonInner = JSX<ButtonInnerProps>(({ text, aboveText, appendLeft, rounded }) => {
+  const withoutText = !text && !aboveText && Boolean(appendLeft);
+
+  const buttonInnerClasses = `flex items-center justify-center ${
+    withoutText ? 'h-12 w-12 min-h-12 min-w-12' : `px-8 gap-2 ${aboveText ? 'py-2' : 'py-[13px]'}`
+  } ${rounded ? 'rounded-full' : ''}`;
+
+  return (
+    <div className={buttonInnerClasses}>
+      {appendLeft ? appendLeft : null}
+      {!withoutText ? (
+        <div>
+          <div className="text-xxs text-left">{aboveText}</div>
+          <div className="text-sm font-medium text-left">{text}</div>
+        </div>
+      ) : null}
+    </div>
+  );
+});

package/src/ui-kit/Button/ButtonProps.ts

@@ -0,0 +1,24 @@
+import type { ButtonVersion } from '../../model/ButtonVersion';
+import type { LinkContent } from '../../model/LinkContent';
+import { IconName } from '../Icon/IconProps';
+
+export interface ButtonInnerProps {
+  text?: string;
+  aboveText?: string;
+  appendLeft?: any;
+  rounded?: boolean;
+}
+
+export interface ButtonProps extends LinkContent, ButtonInnerProps {
+  className?: string;
+  version?: ButtonVersion;
+  disabled?: boolean;
+  rel?: string;
+  ariaLabel?: string;
+  /** @hidden */
+  onClick?: (ev: MouseEvent) => any;
+}
+
+export interface ButtonWithIconProps extends ButtonProps {
+  icon?: IconName;
+}

package/src/ui-kit/Checkbox/Checkbox.tsx

@@ -0,0 +1,36 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { CheckboxProps } from './CheckboxProps';
+import { SVG } from '../SVG';
+
+const CHECK_PATHS = [
+  {
+    d: 'M10.207.793a1 1 0 0 1 0 1.414l-6 6a1 1 0 0 1-1.414 0l-2.5-2.5a1 1 0 0 1 1.414-1.414L3.5 6.086 8.793.793a1 1 0 0 1 1.414 0Z',
+    fillRule: 'evenodd',
+    clipRule: 'evenodd',
+    fill: 'white',
+  },
+];
+
+export const Checkbox = JSX<CheckboxProps>(({ text, checked, onChange, className }) => (
+  <div className={className}>
+    <label className="flex items-center cursor-pointer relative">
+      <input
+        className={`peer appearance-none w-5 h-5 border-solid border rounded border-black checked:bg-primary-main checked:border-primary-main`}
+        type="checkbox"
+        onChange={(e) => {
+          onChange(e.target.checked);
+        }}
+        checked={checked}
+      />
+      <SVG
+        paths={CHECK_PATHS}
+        className="hidden absolute left-2 ml-px peer-checked:block"
+        width="11"
+        height="9"
+        fill="white"
+        viewBox="0 0 11 9"
+      />
+      {text ? <span className="font-sans ml-2 text-sm cursor-pointer">{text}</span> : null}
+    </label>
+  </div>
+));

package/src/ui-kit/Checkbox/CheckboxProps.ts

@@ -0,0 +1,6 @@
+export interface CheckboxProps {
+  text?: string;
+  checked: boolean;
+  onChange: (value: boolean) => void;
+  className?: string;
+}

package/src/ui-kit/HeaderItem/HeaderItem.fixture.tsx

@@ -0,0 +1,8 @@
+import '../../setup-fixture';
+
+import { HeaderItem } from './HeaderItem';
+
+export default {
+  default: <HeaderItem href="https://www.rshb.ru/" target="_blank" text="Россельхозбанк" />,
+  active: <HeaderItem href="https://www.rshb.ru/" target="_blank" text="Россельхозбанк" active />,
+};

package/src/ui-kit/HeaderItem/HeaderItem.tsx

@@ -0,0 +1,25 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { TopItemProps } from '../TopItem/TopItem';
+
+export type HeaderItemProps = TopItemProps;
+
+export const HeaderItem = JSX<HeaderItemProps>(
+  ({ className, text, href, target, active, onClick, children }) => {
+    const textStyle = active ? 'text-primary-main' : 'text-primary-text hover:text-primary-main';
+    return (
+      <a
+        className={`relative inline-block bg-transparent text-center no-underline ${
+          className || ''
+        }`}
+        href={href}
+        target={target}
+        onClick={onClick}
+      >
+        <span className={`font-sans font-normal text-base ${textStyle}`}>{text || children}</span>
+        {active ? (
+          <div className="absolute left-0 -bottom-2 w-full h-[2px] bg-primary-main" />
+        ) : null}
+      </a>
+    );
+  },
+);

package/src/ui-kit/Icon/Icon.fixture.tsx

@@ -0,0 +1,22 @@
+import '../../setup-fixture';
+import { Icon } from './Icon';
+
+import { IconMap } from './IconProps';
+import type { IconName } from './IconProps';
+
+export default {
+  all: (
+    <div className="w-[1280px]">
+      <div className="grid grid-cols-6 gap-8">
+        {(Object.keys(IconMap) as Array<IconName>)
+          .filter((v) => isNaN(Number(v)))
+          .map((icon, i) => (
+            <div key={String(i)} className="flex flex-col items-center gap-3">
+              <div>{icon}</div>
+              <Icon name={icon} width="64" />
+            </div>
+          ))}
+      </div>
+    </div>
+  ),
+};

package/src/ui-kit/Icon/Icon.tsx

@@ -0,0 +1,15 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { projectSettings } from '../../ProjectSettings';
+import type { IconProps } from './IconProps';
+
+export const Icon = JSX<IconProps>(
+  ({ className, name, alt = `Icon ${name}`, title = alt, ...imgProps }) => (
+    <img
+      className={className}
+      src={`${projectSettings.CDN || ''}icons/${name}.svg`}
+      alt={alt}
+      title={title}
+      {...imgProps}
+    />
+  ),
+);

package/src/ui-kit/InputRange/InputRange.tsx

@@ -0,0 +1,63 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { InputRangeProps } from './InputRangeProps';
+
+export const InputRange = JSX<InputRangeProps>(
+  ({ className, title, items = [], min = 1, max = 100, step = 1, value = min, onChange }) => {
+    const handleChange = (value: string) => {
+      if (!onChange) return;
+
+      const sanitizedValue = Number(value.replace(/\D/g, ''));
+      onChange(sanitizedValue);
+    };
+
+    const inputStyle = {
+      backgroundSize: `${(value * 100) / max - 1}% 100%`,
+    };
+
+    const handleBlur = () => {
+      if (!onChange) return;
+
+      if (value < min) onChange(min);
+      if (value > max) onChange(max);
+    };
+
+    return (
+      <div className={className}>
+        <div className="relative">
+          {title ? (
+            <span className="absolute text-xs text-secondary-text top-1 mt-0.5 pl-4 ml-0.5">
+              {title}
+            </span>
+          ) : null}
+          <input
+            className={`m-0 font-sans text-sm w-full h-12 border-2 border-solid border-main-divider rounded-md outline-none p-0 pl-4 m-0 box-border text-primary-text ${
+              title ? 'pt-4' : ''
+            }`}
+            value={String(value).replace(/\B(?=(\d{3})+(?!\d))/g, ' ')}
+            onChange={(e) => handleChange(e.target.value)}
+            onBlur={handleBlur}
+          />
+          <div className="absolute inset-x-0 mt-0.5 top-8 px-4">
+            <input
+              className="box-border w-full m-0 cursor-pointer slider"
+              type="range"
+              min={min}
+              max={max}
+              step={step}
+              value={value}
+              onChange={(e) => handleChange(e.target.value)}
+              style={inputStyle}
+            />
+          </div>
+        </div>
+        <div className="flex justify-between mt-3 mb-4">
+          {items.map((item, i) => (
+            <span key={String(i)} className="text-xs text-secondary-text pl-4">
+              {item}
+            </span>
+          ))}
+        </div>
+      </div>
+    );
+  },
+);

package/src/ui-kit/InputRange/InputRangeProps.ts

@@ -0,0 +1,10 @@
+export interface InputRangeProps {
+  className?: string;
+  items?: string[];
+  min?: number;
+  max?: number;
+  step?: number;
+  value?: number;
+  title?: string;
+  onChange?: (value: number) => void;
+}

package/src/ui-kit/Logo/Logo.fixture.tsx

@@ -0,0 +1,5 @@
+import '../../setup-fixture';
+
+import { Logo } from './Logo';
+
+export default <Logo href="https://www.rshb.ru/" />;

package/src/ui-kit/Logo/Logo.tsx

@@ -0,0 +1,35 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { SVG } from '../SVG';
+
+export interface LogoProps {
+  className: string;
+  href: string;
+  targetBlank: boolean;
+}
+
+const LOGO_PATHS = [
+  'm13.72 25.51 4.42-4.33v-2.95l-4.42 4.32v2.96Zm0-10.98 4.42-4.35V7.41l-4.42 4.31v2.8Zm0 3.63 4.42-4.33v-2.78l-4.42 4.32v2.8ZM12.46 7.44l-.6-.56V0h-.66v6.22l-.58-.57V0h-.67v5l-.59-.58V0H8.7v6.56l4.44 4.33V0h-.67v7.44Zm1.26 14.35 4.42-4.33v-2.78L13.72 19v2.8Zm-5.03-.61 4.44 4.33v-2.96l-4.44-4.32v2.95Zm8.79-16.76-.59.58V0h-.66v5.66l-.6.56V0h-.66v6.87l-.58.57V0h-.67v10.9l4.42-4.34V0h-.66v4.42Zm-8.79 5.76 4.44 4.35v-2.8L8.69 7.4v2.77Zm0 3.65 4.44 4.33v-2.8l-4.44-4.3v2.77Zm0 3.63 4.44 4.33V19l-4.44-4.31v2.78Zm26.37 2.29H24.3a2.25 2.25 0 0 0 .36-1.22 2.32 2.32 0 0 0-2.33-2.31 2.32 2.32 0 0 0-2.31 2.31c0 .5.16.96.43 1.34a.74.74 0 0 0-.33.61c0 .26.14.49.33.62a2.32 2.32 0 0 0-.43 1.34 2.31 2.31 0 0 0 2.31 2.31 2.32 2.32 0 0 0 2.33-2.31c0-.45-.13-.87-.36-1.22h8.01v.49h-.8v.68h.8v.7h-.8v1.3h.8v-.58h1.17v.58h.79v-1.3h-.79v-.7h.79v-.68h-.79v-.5h1.58a.56.56 0 0 0 .56-.56v-.34a.57.57 0 0 0-.56-.56Zm-11.53 2.7a1.2 1.2 0 0 1-2.4 0c0-.24.08-.47.2-.66l.34-.56a.97.97 0 0 1-.34-.75c0-.3.13-.56.33-.74l-.32-.56a1.13 1.13 0 0 1-.2-.66 1.2 1.2 0 0 1 2.4 0c0 .49-.56 1.65-.56 1.65v.62c-.01.01.55 1.17.55 1.66ZM4.67 18.34v2.89c0 2.75 1.2 4.53 1.9 5.21l4.58 4.5c1.28 1.25 1.5 1.66 1.79 2.37v-3.2c0-2.84-1.44-3.94-2.19-4.67-1.73-1.68-2.89-2.8-3.82-3.73a8.98 8.98 0 0 1-2.26-3.37Zm6.08 14.24c-1.73-1.7-2.89-2.8-3.82-3.73a10 10 0 0 1-2.25-2.98v2.49a7.87 7.87 0 0 0 1.89 5.24l4.58 4.47c1.28 1.25 1.5 1.85 1.79 2.55v-3.37c0-2.85-1.45-3.95-2.19-4.67Z',
+  'M19.88 5.34c-.32 0-.64 0-.96.02V6.7a18.5 18.5 0 1 1 .95 36.94A18.5 18.5 0 0 1 1.35 25.17c0-5.67 2.55-10.73 6.58-14.13V9.32A19.78 19.78 0 0 0 0 25.17C0 36.12 8.9 45 19.88 45a19.85 19.85 0 0 0 19.86-19.83c0-10.95-8.9-19.83-19.87-19.83Z',
+  'M33.93 35.53c.3-.41.6-.85.87-1.3v-2.66h-.87v3.96Zm2.54-4.92c.12-.4.24-.78.34-1.16h-2.88v.7h.43c.77-.02 1.63-.03 2.11.46Zm-19.19-1.27h-.78v7.91h.78v-7.9Z',
+  'M14.7 27.83h2.58c.67 0 1.14.14 1.4.4.27.25.4.72.4 1.38v7.4c0 .66-.12 1.12-.4 1.38-.4.41-1.16.41-1.78.41l-.4-.01v3.5l.78.14v-2.88c1.2 0 1.97-.4 2.34-1.22v4.29h.26l.5-.01V29.74c0-.68.13-1.16.4-1.43.25-.27.72-.4 1.37-.4.67 0 1.65-.1 2.16.4.26.27.38.76.38 1.43v3.8h-1.77v-4.06h-.77v12.99c.26-.03.5-.07.77-.12V34.3h1.77v7.64c.36-.1.72-.21 1.08-.34v-7c0-.8.19-1.4 1-1.67l-.9-4.87h1.8l.3 5.31h.22l.3-5.31h1.88l-1.01 4.87c.84.3 1.01.81 1.01 1.66v4.53a16.63 16.63 0 0 0 1.5-1.27v-9.83h5.25l.1-.72H24.93l.17.89c-.38-.72-1.12-1.08-2.2-1.08h-.77c-1.3 0-2.1.52-2.4 1.55-.27-1.08-1.1-1.62-2.46-1.62h-3.36v14.52c.26.09.52.18.78.25V27.84Zm16.29 5.58-.85-.8.85-4.37v5.17Z',
+  'M27.66 40.79c.27-.14.55-.28.8-.43v-5.98h-.8v6.4Z',
+];
+
+export const Logo = JSX<Partial<LogoProps>>(({ className, href, children, targetBlank }) => {
+  return (
+    <a
+      className={`inline-flex items-center font-sans no-underline ${className || ''}`}
+      href={href || 'https://rshb.ru/'}
+      target={targetBlank ? '_blank' : '_self'}
+    >
+      <SVG
+        className="text-primary-main w-10"
+        viewBox="0 0 40 45"
+        paths={LOGO_PATHS.map((d) => ({ d }))}
+      />
+      <span className="text-black text-base font-medium ml-2.5">
+        {children || 'Россельхозбанк'}
+      </span>
+    </a>
+  );
+});

package/src/ui-kit/SearchBar.tsx

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { UniBlockProps } from '../types';
-import { Icon } from './Icon';
+import { Icon } from './Icon/Icon';
 
 export const SearchBar = JSX<UniBlockProps>(({ className, context }) => {
   const { term, setTerm } = context.useSearch();

package/src/ui-kit/TopItem/TopItem.fixture.tsx

@@ -0,0 +1,8 @@
+import '../../setup-fixture';
+
+import { TopItem } from './TopItem';
+
+export default {
+  default: <TopItem href="https://www.rshb.ru/" target="_blank" text="Экосистема Своё" />,
+  active: <TopItem href="https://www.rshb.ru/" target="_blank" text="Экосистема Своё" active />,
+};

package/src/ui-kit/TopItem/TopItem.tsx

@@ -0,0 +1,37 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { LinkContent } from '../../model/LinkContent';
+
+export interface TopItemContent extends LinkContent {
+  active?: boolean;
+}
+
+export interface TopItemProps extends TopItemContent {
+  className?: string;
+  flat?: boolean;
+  ariaLabel?: string;
+  onClick?: (ev: MouseEvent) => any;
+}
+
+export const TopItem = JSX<TopItemProps>(
+  ({ className, text, href, target, active, flat, onClick, children, ariaLabel }) => {
+    const linkStyle = active ? 'border-primary-main rounded-md' : 'border-transparent';
+    const textStyle = active
+      ? 'text-primary-main'
+      : `${flat ? 'text-primary-text' : 'text-secondary-text'} hover:text-primary-main`;
+
+    return (
+      <a
+        className={`inline-block border border-solid bg-transparent text-center no-underline ${
+          flat ? '' : 'px-4 py-2'
+        } ${linkStyle} ${className || ''}`}
+        href={href}
+        target={target}
+        onClick={onClick}
+        rel="noopener noreferrer"
+        aria-label={ariaLabel}
+      >
+        <span className={`font-sans font-normal text-sm ${textStyle}`}>{text || children}</span>
+      </a>
+    );
+  },
+);

package/src/utils/clamp.ts

@@ -0,0 +1,2 @@
+export const clamp = (value: number, min: number, max: number) =>
+  Math.max(min, Math.min(value, max));

package/dist/BaseTile.d.ts

@@ -1,5 +0,0 @@
-import type { BaseTileContent } from './BaseTileContent';
-import type { UniBlockProps } from './types';
-export interface BaseTileProps extends BaseTileContent, UniBlockProps {
-}
-export declare const BaseTile: (props: import("@redneckz/uni-jsx").PropsWithChildren<BaseTileProps, any>, context?: any) => any;