@redneckz/wildless-cms-uni-blocks 0.2.46 → 0.2.49

package/src/ui-kit/TopItem.tsx

@@ -0,0 +1,37 @@
+import { JSX } from '@redneckz/uni-jsx';
+import type { LinkContent } from '../types';
+
+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-3xl' : '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/useLink.ts

@@ -0,0 +1,28 @@
+import { HandlerDecorator, Router } from './ContentPageContext';
+import type { LinkContent } from './types';
+import { isURL, toRelativeHref } from './utils/url';
+
+const defaultHandlerDecorator: HandlerDecorator = (handler, targetContent) => handler;
+
+export function useLink(
+  {
+    router,
+    handlerDecorator = defaultHandlerDecorator,
+  }: { router: Router; handlerDecorator?: HandlerDecorator },
+  link: Partial<LinkContent>,
+) {
+  const href = toRelativeHref(link.href, router.href);
+  return {
+    ...link,
+    href,
+    ariaLabel: link.text,
+    onClick: handlerDecorator((ev: MouseEvent) => {
+      const isLocalHref = href && !isURL(href);
+      const isLocalTarget = !link.target || link.target === '_self';
+      if (isLocalHref && isLocalTarget) {
+        ev.preventDefault();
+        router.push(href);
+      }
+    }, link),
+  };
+}

package/src/useSitemap.ts

@@ -0,0 +1,17 @@
+import type { AsyncDataHook } from './ContentPageContext';
+import type { HeaderContent } from './Header/index';
+import { projectSettings } from './ProjectSettings';
+
+export function useSitemap(useAsyncData: AsyncDataHook): HeaderContent {
+  const { data } = useAsyncData(sitemapURL(), fetchSitemap);
+  return data || {};
+}
+
+async function fetchSitemap(): Promise<HeaderContent> {
+  const response = await fetch(sitemapURL());
+  return await response.json();
+}
+
+function sitemapURL() {
+  return `/wcms-resources/${projectSettings.SITEMAP || 'sitemap'}.json`;
+}

package/src/utils/joinList.ts

@@ -0,0 +1,7 @@
+export function joinList<E>(sep: E): (list: E[]) => E[] {
+  return (list) =>
+    list.reduce(
+      (acc, el, i) => (acc.length ? acc.concat({ ...sep, key: i }, el) : [el]),
+      [] as E[],
+    );
+}

package/src/utils/url.ts

@@ -0,0 +1,22 @@
+export const isURL = (href?: string) => href?.includes('//');
+
+export const withoutQuery = (href?: string) => (href || '').replace(/\/?\?.*/, '');
+
+export const getOrigin = (href?: string) => {
+  if (isURL(href)) {
+    const url = href!;
+    const protoSeparator = '://';
+    const endOfProto = url.indexOf(protoSeparator);
+    const endOfOrigin = url.indexOf('/', endOfProto + protoSeparator.length);
+    return endOfOrigin !== -1 ? url.substring(0, endOfOrigin) : url;
+  }
+  return undefined;
+};
+
+export const toRelativeHref = (href?: string, baseURL?: string) => {
+  if (!href) {
+    return href;
+  }
+  const origin = getOrigin(baseURL);
+  return origin ? href.replace(origin, '') || '/' : href;
+};