@maestro-js/agent-skills 1.0.0-alpha.2 → 1.0.0-alpha.21

package/skills/maestro-examples/references/cadence/cadence-web/app/utils/compose-refs.ts

@@ -0,0 +1,35 @@
+// From @maestro-js/components
+// Install with: pnpm maestro components:add compose-refs --directory app
+
+import React from 'react'
+
+type PossibleRef<T> = React.Ref<T> | undefined
+
+/**
+ * Set a given ref to a given value
+ * This utility takes care of different types of refs: callback refs and RefObject(s)
+ */
+function setRef<T>(ref: PossibleRef<T>, value: T) {
+  if (typeof ref === 'function') {
+    ref(value)
+  } else if (ref !== null && ref !== undefined) {
+    ;(ref as React.MutableRefObject<T>).current = value
+  }
+}
+
+/**
+ * A utility to compose multiple refs together
+ * Accepts callback refs and RefObject(s)
+ */
+export function composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T> {
+  return (node: T) => refs.forEach((ref) => setRef(ref, node))
+}
+
+/**
+ * A custom hook that composes multiple refs
+ * Accepts callback refs and RefObject(s)
+ */
+export function useComposedRefs<T>(...refs: PossibleRef<T>[]) {
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  return React.useCallback(composeRefs(...refs), refs)
+}

package/skills/maestro-examples/references/cadence/cadence-web/app/utils/format-date.ts

@@ -0,0 +1,10 @@
+import { dateFns, dateTimeFns, type Iso } from 'iso-fns'
+
+export function formatDate(dateStr: string | null): string {
+  if (!dateStr) return '--'
+  return dateFns.format(dateStr.slice(0, 10) as Iso.Date, 'MMM d, yyyy')
+}
+
+export function formatDateTime(dateStr: string): string {
+  return dateTimeFns.format(dateStr.slice(0, 19) as Iso.DateTime, 'MMM d, yyyy, h:mm a')
+}

package/skills/maestro-examples/references/cadence/cadence-web/app/utils/overridable-component-helper.ts

@@ -0,0 +1,31 @@
+import type { JSX } from 'react'
+
+type __ = '1D45E01E-AF44-47C4-988A-19A94EBAF55C'
+type ReactTag = keyof JSX.IntrinsicElements | React.JSXElementConstructor<any>
+type PropsOf<TTag extends ReactTag> = TTag extends React.ElementType ? React.ComponentProps<TTag> : never
+type PropsWeControl = 'as' | 'children' | 'refName' | 'className'
+type CleanProps<TTag extends ReactTag, TOmitableProps extends PropertyKey = __> = TOmitableProps extends __
+  ? Omit<PropsOf<TTag>, PropsWeControl>
+  : Omit<PropsOf<TTag>, TOmitableProps | PropsWeControl>
+declare type OurProps<TTag extends ReactTag, TSlot> = {
+  as?: TTag
+  children?: React.ReactNode | ((bag: TSlot) => React.ReactNode)
+  refName?: string
+}
+declare type HasProperty<T extends object, K extends PropertyKey> = T extends never
+  ? never
+  : K extends keyof T
+    ? true
+    : never
+declare type ClassNameOverride<TTag extends ReactTag, TSlot = {}> =
+  true extends HasProperty<PropsOf<TTag>, 'className'>
+    ? {
+        className?: PropsOf<TTag>['className'] | ((bag: TSlot) => string)
+      }
+    : {}
+export type OverrideComponentProps<TTag extends ReactTag, TSlot = {}, TOmitableProps extends PropertyKey = __> = CleanProps<
+  TTag,
+  TOmitableProps
+> &
+  OurProps<TTag, TSlot> &
+  ClassNameOverride<TTag, TSlot>

package/skills/maestro-examples/references/cadence/cadence-web/app/utils/sanitize-html.ts

@@ -0,0 +1,16 @@
+import sanitize from 'sanitize-html'
+
+const config: sanitize.IOptions = {
+  allowedTags: [
+    'p', 'strong', 'em', 's',
+    'h1', 'h2', 'h3',
+    'ul', 'ol', 'li',
+    'blockquote', 'pre', 'code',
+    'hr', 'br', 'a'
+  ],
+  allowedAttributes: { a: ['href'] }
+}
+
+export function sanitizeHtml(html: string): string {
+  return sanitize(html, config)
+}

package/skills/maestro-examples/references/cadence/cadence-web/app/utils/tw.ts

@@ -0,0 +1,16 @@
+// From @maestro-js/components
+// Install with: pnpm maestro components:add tw --directory app
+
+import { twMerge } from 'tailwind-merge'
+import { composeRenderProps } from 'react-aria-components'
+
+export function tw(...inputs: unknown[]) {
+  return twMerge(inputs.flat(Infinity).filter(Boolean).join(' '))
+}
+
+export function composeTailwindRenderProps<T>(
+  className: string | ((renderProps: T) => string) | undefined,
+  tailwind: string
+): string | ((renderProps: T) => string) {
+  return composeRenderProps(className, (prev) => tw(tailwind, prev))
+}

package/skills/maestro-examples/references/cadence/cadence-web/app/utils/use-hydrated.ts

@@ -0,0 +1,12 @@
+import React from 'react'
+
+export function useHydrated() {
+  return React.useSyncExternalStore(
+    subscribe,
+    () => true,
+    () => false
+  )
+}
+function subscribe() {
+  return () => {}
+}

package/skills/maestro-examples/references/cadence/cadence-web/app/utils/use-prevent-default.ts

@@ -0,0 +1,30 @@
+// From @maestro-js/components
+// Install with: pnpm maestro components:add use-prevent-default --directory app
+
+import React from 'react'
+import { useStableAccessor } from './use-stable-accessor'
+
+export function usePreventDefault<E extends React.SyntheticEvent<any>>(
+  eventHandler: React.EventHandler<E> | undefined,
+  preventDefault: boolean
+): React.EventHandler<E> {
+  const getShouldPreventDefault = useStableAccessor(preventDefault)
+  const getEventHandler = useStableAccessor(eventHandler)
+
+  const myEventHandler = React.useCallback(
+    (event: E) => {
+      if (getShouldPreventDefault()) {
+        event.preventDefault()
+        event.stopPropagation()
+        return
+      } else {
+        const eventHandler = getEventHandler()
+        if (eventHandler) {
+          return eventHandler(event)
+        }
+      }
+    },
+    [getEventHandler, getShouldPreventDefault]
+  )
+  return myEventHandler
+}