aronmal/jg-eucs
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Prettier: formatted documents

Browse source
This commit is contained in:
aronmal 2023-10-20 15:23:05 +02:00
parent 85f1ce262a
commit b23c2a24ea
Signed by: aronmal
GPG key ID: 816B7707426FC612
15 changed files with 1803 additions and 328 deletions
Download patch file Download diff file Expand all files Collapse all files

56
src/components/FontAwesomeIcon.tsx
View file

@ -1,7 +1,20 @@
import { FaSymbol, FlipProp, IconDefinition, IconProp, PullProp, RotateProp, SizeProp, Transform } from "@fortawesome/fontawesome-svg-core";
import {
FaSymbol,
FlipProp,
IconDefinition,
IconProp,
PullProp,
RotateProp,
SizeProp,
Transform,
} from "@fortawesome/fontawesome-svg-core";
import { Show, type JSX } from "solid-js";
export interface FontAwesomeIconProps extends Omit<JSX.SvgSVGAttributes<SVGSVGElement>, "children" | "mask" | "transform"> {
export interface FontAwesomeIconProps
extends Omit<
JSX.SvgSVGAttributes<SVGSVGElement>,
"children" | "mask" | "transform"
> {
icon: IconDefinition;
mask?: IconProp;
maskId?: string;
@ -61,13 +74,17 @@ function Path(props: { d: string | string[] }) {
}
export function FontAwesomeIcon(props: FontAwesomeIconProps) {
const titleId = () => (props.title ? "svg-inline--fa-title-".concat(props.titleId || nextUniqueId()) : undefined);
const titleId = () =>
props.title
? "svg-inline--fa-title-".concat(props.titleId || nextUniqueId())
: undefined;
// Get CSS class list from the props object
function attributes() {
const defaultClasses = {
"svg-inline--fa": true,
[`fa-${props.icon.iconName}`]: true,
[props.class ?? ""]: typeof props.class !== "undefined" && props.class !== null,
[props.class ?? ""]:
typeof props.class !== "undefined" && props.class !== null,
...props.classList,
};
@ -88,15 +105,36 @@ export function FontAwesomeIcon(props: FontAwesomeIconProps) {
"fa-border": props.border,
"fa-li": props.listItem,
"fa-flip": typeof props.flip !== "undefined" && props.flip !== null,
"fa-flip-horizontal": props.flip === "horizontal" || props.flip === "both",
"fa-flip-horizontal":
props.flip === "horizontal" || props.flip === "both",
"fa-flip-vertical": props.flip === "vertical" || props.flip === "both",
[`fa-${props.size}`]: typeof props.size !== "undefined" && props.size !== null,
[`fa-rotate-${props.rotation}`]: typeof props.rotation !== "undefined" && props.size !== null,
[`fa-pull-${props.pull}`]: typeof props.pull !== "undefined" && props.pull !== null,
[`fa-${props.size}`]:
typeof props.size !== "undefined" && props.size !== null,
[`fa-rotate-${props.rotation}`]:
typeof props.rotation !== "undefined" && props.size !== null,
[`fa-pull-${props.pull}`]:
typeof props.pull !== "undefined" && props.pull !== null,
"fa-swap-opacity": props.swapOpacity,
};
const attributes = { focusable: !!props.title, "aria-hidden": !props.title, role: "img", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": titleId(), "data-prefix": props.icon.prefix, "data-icon": props.icon.iconName, "data-fa-transform": props.transform, "data-fa-mask": props.mask, "data-fa-mask-id": props.maskId, "data-fa-symbol": props.symbol, tabIndex: props.tabIndex, classList: { ...defaultClasses, ...faClasses }, color: props.color, style: props.style, viewBox: `0 0 ${props.icon.icon[0]} ${props.icon.icon[1]}` } as const;
const attributes = {
focusable: !!props.title,
"aria-hidden": !props.title,
role: "img",
xmlns: "http://www.w3.org/2000/svg",
"aria-labelledby": titleId(),
"data-prefix": props.icon.prefix,
"data-icon": props.icon.iconName,
"data-fa-transform": props.transform,
"data-fa-mask": props.mask,
"data-fa-mask-id": props.maskId,
"data-fa-symbol": props.symbol,
tabIndex: props.tabIndex,
classList: { ...defaultClasses, ...faClasses },
color: props.color,
style: props.style,
viewBox: `0 0 ${props.icon.icon[0]} ${props.icon.icon[1]}`,
} as const;
// return the complete class list
return attributes;

21
src/components/Reference.tsx
View file

@ -1,4 +1,8 @@
import { faArrowUpRightFromSquare, faBookOpen, faHashtag } from "@fortawesome/pro-regular-svg-icons";
import {
faArrowUpRightFromSquare,
faBookOpen,
faHashtag,
} from "@fortawesome/pro-regular-svg-icons";
import { JSXElement, Show, createMemo } from "solid-js";
import { A } from "solid-start";
import { FontAwesomeIcon } from "./FontAwesomeIcon";
@ -12,7 +16,12 @@ const types = {
/**
* References to local and external resouces
*/
function R(props: { href: string; children: JSXElement; class?: string; id?: string }) {
function R(props: {
href: string;
children: JSXElement;
class?: string;
id?: string;
}) {
const type = createMemo((): keyof typeof types => {
switch (true) {
case props.href.startsWith("http"):
@ -27,7 +36,13 @@ function R(props: { href: string; children: JSXElement; class?: string; id?: str
}
});
return (
<A href={props.href} target={type() === "external" ? "_blank" : ""} rel={type() === "external" ? "noreferrer noopener" : ""} id={props.id} class={props.class}>
<A
href={props.href}
target={type() === "external" ? "_blank" : ""}
rel={type() === "external" ? "noreferrer noopener" : ""}
id={props.id}
class={props.class}
>
<Show when={type() === "id"}>
<FontAwesomeIcon class="left" icon={types["id"]} />
</Show>