chore(propsof): move PropsOf before custom types for better discoverability

Author: maiieul

apps/website/src/components/highlight/highlight.tsx

@@ -5,10 +5,9 @@ import {
   useSignal,
   useVisibleTask$,
 } from '@builder.io/qwik';
-import { OmitSignalClass } from '@qwik-ui/utils';
 import { CodeCopy } from '../code-copy/code-copy';
 
-export type HighlightProps = OmitSignalClass<PropsOf<'div'>> & {
+export type HighlightProps = PropsOf<'div'> & {
   code: string;
   copyCodeClass?: ClassList;
   language?: 'tsx' | 'html' | 'css';

apps/website/src/routes/docs/headless/modal/index.mdx

@@ -261,7 +261,7 @@ The current solution across framework ecosystems, is to open the Modal eagerly o
       type: `Qwik`,
       description:
         'A way to configure the modal with all native attributes the HTMLDialog defines.',
-      info: `PropsOf<'dialog']`,
+      info: `PropsOf<'dialog'>`,
     },
     {
       name: 'onHide()$',

packages/kit-headless/src/components/accordion/accordion-item.tsx

@@ -11,9 +11,9 @@ import { accordionItemContextId } from './accordion-context-id';
 
 import { type AccordionItemContext } from './accordion-context.type';
 
-export type AccordionItemProps = {
+export type AccordionItemProps = PropsOf<'div'> & {
   defaultValue?: boolean;
-} & PropsOf<'div'>;
+};
 
 export const AccordionItem = component$(
   ({ defaultValue = false, id, ...props }: AccordionItemProps) => {

packages/kit-headless/src/components/accordion/accordion-root.tsx

@@ -12,14 +12,14 @@ import {
 import { accordionRootContextId } from './accordion-context-id';
 import { type AccordionRootContext } from './accordion-context.type';
 
-export type AccordionRootProps = {
+export type AccordionRootProps = PropsOf<'div'> & {
   behavior?: 'single' | 'multi';
   animated?: boolean;
   enhance?: boolean;
   collapsible?: boolean;
   onSelectedIndexChange$?: (index: number) => void;
   onFocusIndexChange$?: (index: number) => void;
-} & PropsOf<'div'>;
+};
 
 export const AccordionRoot = component$(
   ({

packages/kit-headless/src/components/accordion/accordion-trigger.tsx

@@ -23,9 +23,9 @@ const accordionPreventedKeys = [
   KeyCode.ArrowUp,
 ];
 
-export type AccordionTriggerProps = {
+export type AccordionTriggerProps = PropsOf<'button'> & {
   disabled?: boolean;
-} & PropsOf<'button'>;
+};
 
 export const AccordionTrigger = component$(
   ({ disabled, ...props }: AccordionTriggerProps) => {

packages/kit-headless/src/components/combobox/combobox-icon.tsx

@@ -2,9 +2,9 @@ import { component$, PropsOf, Slot } from '@builder.io/qwik';
 import { JSX } from '@builder.io/qwik/jsx-runtime';
 import { VisuallyHidden } from '../../utils/visually-hidden';
 
-type ComboboxIcon = {
+type ComboboxIcon = PropsOf<'svg'> & {
   svg?: JSX.Element;
-} & PropsOf<'svg'>;
+};
 
 export const ComboboxIcon = component$<ComboboxIcon>(({ svg, ...iconProps }) => {
   if (svg) {

packages/kit-headless/src/components/combobox/combobox-input.tsx

@@ -16,9 +16,9 @@ import {
   getPrevEnabledOptionIndex,
 } from './utils';
 
-export type ComboboxInputProps = {
+export type ComboboxInputProps = PropsOf<'input'> & {
   disableOnBlur?: boolean;
-} & PropsOf<'input'>;
+};
 
 export const ComboboxInput = component$(
   <O extends Option = Option>({

packages/kit-headless/src/components/combobox/combobox-listbox.tsx

@@ -7,11 +7,11 @@ import type { ComboboxContext, Option } from './combobox-context.type';
 import { ResolvedOption } from './combobox';
 import { VisuallyHidden } from '../../utils/visually-hidden';
 
-export type ComboboxListboxProps<O extends Option = Option> = {
+export type ComboboxListboxProps<O extends Option = Option> = PropsOf<'ul'> & {
   optionRenderer$?: QRL<
     (resolved: ResolvedOption<O>, filteredIndex: number) => JSX.Element
   >;
-} & PropsOf<'ul'>;
+};
 
 export const ComboboxListbox = component$(
   <O extends Option = Option>({ optionRenderer$, ...props }: ComboboxListboxProps<O>) => {

packages/kit-headless/src/components/combobox/combobox-option.tsx

@@ -11,10 +11,10 @@ import ComboboxContextId from './combobox-context-id';
 
 import { ResolvedOption } from './combobox';
 
-export type ComboboxOptionProps = {
+export type ComboboxOptionProps = PropsOf<'li'> & {
   index: number;
   resolved: ResolvedOption;
-} & PropsOf<'li'>;
+};
 
 export const ComboboxOption = component$(
   // remove non-li props from props

packages/kit-headless/src/components/combobox/combobox.tsx

@@ -28,7 +28,7 @@ export type ResolvedOption<
   lcLabel?: string;
 };
 
-export type ComboboxProps<O extends Option = Option> = {
+export type ComboboxProps<O extends Option = Option> = PropsOf<'div'> & {
   // user's source of truth
   options: O[];
   filter$?: QRL<
@@ -48,7 +48,7 @@ export type ComboboxProps<O extends Option = Option> = {
   'bind:isInputFocusedSig'?: Signal<boolean | undefined>;
   'bind:inputValueSig'?: Signal<string>;
   'bind:highlightedIndexSig'?: Signal<number>;
-} & PropsOf<'div'>;
+};
 
 export const Combobox = component$(
   <O extends Option = Option>(props: ComboboxProps<O>) => {