@brilo/base-blocks 0.1.35 → 0.1.37

package/src/blocks/sections/base-section/controls.tsx

@@ -5,6 +5,7 @@ import {
   ButtonGroup,
   PanelBody,
   PanelRow,
+  RangeControl,
   SelectControl,
   TextControl,
   __experimentalToggleGroupControl as ToggleGroupControl,
@@ -14,6 +15,9 @@ import {
 import {__} from '@wordpress/i18n'
 import {useTenantColorPalette} from '~/hooks/useTenantColorPalette'
 import type {
+  BackgroundImage,
+  BackgroundImageFit,
+  BackgroundImagePosition,
   BaseBlockAttributes,
   Decoration,
   DecorationDepth,
@@ -25,6 +29,9 @@ import type {
   FluidDecorationImage,
 } from './types'
 import {
+  BACKGROUND_IMAGE_FITS,
+  BACKGROUND_IMAGE_OVERLAY_OPACITY_DEFAULT,
+  BACKGROUND_IMAGE_POSITIONS,
   DECORATION_DEPTHS,
   DECORATION_MAX_WIDTH_DEFAULT,
   DECORATION_MAX_WIDTH_UNITS,
@@ -217,6 +224,93 @@ function DecorationControl({value, onChange}: DecorationControlProps) {
   )
 }
 
+interface BackgroundImageControlProps {
+  value?: BackgroundImage
+  onChange: (value: BackgroundImage | undefined) => void
+}
+
+function BackgroundImageControl({value, onChange}: BackgroundImageControlProps) {
+  const {paletteColors} = useTenantColorPalette()
+  const img = value?.img
+  const fit = value?.fit ?? 'cover'
+  const position = value?.position ?? 'center center'
+  const overlayColor = value?.overlay?.color
+  const overlayOpacity = value?.overlay?.opacity ?? BACKGROUND_IMAGE_OVERLAY_OPACITY_DEFAULT
+
+  const update = (patch: Partial<BackgroundImage>) => onChange({img, fit, position, overlay: value?.overlay, ...value, ...patch})
+
+  const handleSelect = (media: {id: number; url: string; alt: string; width?: number; height?: number}) => {
+    const nextImg: FluidDecorationImage = {id: media.id, src: media.url, alt: media.alt ?? '', width: media.width, height: media.height}
+    update({img: nextImg})
+  }
+
+  const handleRemove = () => onChange(undefined)
+
+  return (
+    <BaseControl label={__('Obrázek pozadí', 'brilo-blocks')} __nextHasNoMarginBottom>
+      <MediaUploadCheck>
+        <MediaUpload
+          onSelect={handleSelect}
+          allowedTypes={['image']}
+          value={img?.id || 0}
+          render={({open}: {open: () => void}) => (
+            <PanelRow>
+              {img?.src && <img src={img.src} alt={img.alt} style={{maxWidth: 48, maxHeight: 48, objectFit: 'contain'}} />}
+              <Button onClick={open} variant="secondary" size="small">
+                {img?.src ? __('Změnit', 'brilo-blocks') : __('Vybrat obrázek', 'brilo-blocks')}
+              </Button>
+              {!!img?.src && (
+                <Button onClick={handleRemove} variant="tertiary" size="small" isDestructive>
+                  {__('Odebrat', 'brilo-blocks')}
+                </Button>
+              )}
+            </PanelRow>
+          )}
+        />
+      </MediaUploadCheck>
+
+      {!!img?.src && (
+        <>
+          <ToggleGroupControl
+            label={__('Přizpůsobení', 'brilo-blocks')}
+            value={fit}
+            onChange={(next) => update({fit: next as BackgroundImageFit})}
+            isBlock
+          >
+            {BACKGROUND_IMAGE_FITS.map((f) => (
+              <ToggleGroupControlOption key={f.value} value={f.value} label={f.label} />
+            ))}
+          </ToggleGroupControl>
+
+          <SelectControl<string>
+            label={__('Pozice', 'brilo-blocks')}
+            value={position}
+            options={[...BACKGROUND_IMAGE_POSITIONS]}
+            onChange={(next) => update({position: next as BackgroundImagePosition})}
+          />
+
+          <BaseControl label={__('Překryv barvou', 'brilo-blocks')} __nextHasNoMarginBottom help={__('Ztmavení/zabarvení obrázku pro lepší čitelnost textu.', 'brilo-blocks')}>
+            <ColorPalette
+              colors={paletteColors}
+              value={overlayColor || undefined}
+              onChange={(next) => update({overlay: {color: next ?? undefined, opacity: overlayOpacity}})}
+            />
+            {!!overlayColor && (
+              <RangeControl
+                label={__('Krytí překryvu', 'brilo-blocks')}
+                value={overlayOpacity}
+                min={0}
+                max={100}
+                onChange={(next) => update({overlay: {color: overlayColor, opacity: next ?? BACKGROUND_IMAGE_OVERLAY_OPACITY_DEFAULT}})}
+              />
+            )}
+          </BaseControl>
+        </>
+      )}
+    </BaseControl>
+  )
+}
+
 type SpacingPosition = BaseBlockAttributes['spacing']['position']
 type SpacingSize = BaseBlockAttributes['spacing']['size']
 
@@ -227,7 +321,7 @@ interface BaseControlsProps {
 }
 
 export function BaseControls({attributes, setAttributes, exclude}: BaseControlsProps) {
-  const {id, spacing, background, textColor, decoration, decorations} = attributes
+  const {id, spacing, background, textColor, decoration, decorations, backgroundImage} = attributes
   const {paletteColors, resolveHex} = useTenantColorPalette()
   const fluid = decorations?.fluid ?? {}
 
@@ -277,6 +371,12 @@ export function BaseControls({attributes, setAttributes, exclude}: BaseControlsP
         </PanelBody>
       )}
 
+      {!exclude.includes('backgroundImage') && (
+        <PanelBody title={__('Obrázek pozadí', 'brilo-blocks')} initialOpen={false}>
+          <BackgroundImageControl value={backgroundImage} onChange={(value) => setAttributes({backgroundImage: value ?? {}})} />
+        </PanelBody>
+      )}
+
       {!exclude.includes('decoration') && (
         <PanelBody title={__('Dekorace', 'brilo-blocks')} initialOpen={false}>
           <DecorationControl value={decoration} onChange={(value) => setAttributes({decoration: value ?? {}})} />

package/src/blocks/sections/base-section/edit.tsx

@@ -1,5 +1,6 @@
 import {InspectorControls, useBlockProps, useInnerBlocksProps} from '@wordpress/block-editor'
 import type {BlockEditProps} from '@wordpress/blocks'
+import type {CSSProperties} from 'react'
 import type {BaseBlockAttributes, BaseSectionOptions} from './types'
 import {BaseControls} from './controls'
 
@@ -8,13 +9,28 @@ export function createBaseSectionEdit<TExtra extends Record<string, unknown> = R
 
   return function Edit(props: BlockEditProps<BaseBlockAttributes & TExtra>) {
     const {attributes, setAttributes} = props
-    const {background, textColor, gradient} = attributes as BaseBlockAttributes & {gradient?: string}
+    const {background, textColor, gradient, backgroundImage} = attributes as BaseBlockAttributes & {gradient?: string}
+    const bgImageSrc = backgroundImage?.img?.src
+    // A plain background-color/gradient always paints behind an image, so it can never tint it. To preview a
+    // translucent color/gradient sitting on top of the image (matching frontend), stack it as its own layer
+    // in front of the `url(...)` layer instead of setting backgroundColor separately.
+    const tintLayer = background ? `linear-gradient(${background}, ${background})` : gradient
     const blockProps = useBlockProps({
       className: options.blockClassName,
       style: {
-        ...(background ? {backgroundColor: background, padding: '16px'} : {}),
-        ...(gradient ? {background: gradient, padding: '16px'} : {}),
+        position: 'relative' as CSSProperties['position'],
+        ...(background && !bgImageSrc ? {backgroundColor: background, padding: '16px'} : {}),
+        ...(gradient && !bgImageSrc ? {background: gradient, padding: '16px'} : {}),
         ...(textColor ? {color: textColor} : {}),
+        ...(bgImageSrc
+          ? {
+              backgroundImage: [tintLayer, `url(${bgImageSrc})`].filter(Boolean).join(', '),
+              backgroundSize: [tintLayer ? '100% 100%' : null, backgroundImage?.fit ?? 'cover'].filter(Boolean).join(', '),
+              backgroundPosition: [tintLayer ? 'center center' : null, backgroundImage?.position ?? 'center center'].filter(Boolean).join(', '),
+              backgroundRepeat: 'no-repeat',
+              padding: '16px',
+            }
+          : {}),
       },
     })
     const innerBlocksProps = useInnerBlocksProps({className: options.containerClassName}, {

package/src/blocks/sections/base-section/types.ts

@@ -31,6 +31,25 @@ export interface Decoration {
   offsetY?: string
 }
 
+export type BackgroundImageFit = 'cover' | 'contain'
+
+export type BackgroundImagePosition =
+  | 'left top' | 'center top' | 'right top'
+  | 'left center' | 'center center' | 'right center'
+  | 'left bottom' | 'center bottom' | 'right bottom'
+
+export interface BackgroundImageOverlay {
+  color?: string
+  opacity?: number
+}
+
+export interface BackgroundImage {
+  img?: FluidDecorationImage
+  fit?: BackgroundImageFit
+  position?: BackgroundImagePosition
+  overlay?: BackgroundImageOverlay
+}
+
 export interface BaseBlockAttributes extends Record<string, unknown> {
   id: string
   spacing: {
@@ -46,9 +65,10 @@ export interface BaseBlockAttributes extends Record<string, unknown> {
       bottom?: FluidDecoration
     }
   }
+  backgroundImage: BackgroundImage
 }
 
-export type ExcludableBaseAttr = 'spacing' | 'background' | 'id' | 'decorations' | 'decoration'
+export type ExcludableBaseAttr = 'spacing' | 'background' | 'id' | 'decorations' | 'decoration' | 'backgroundImage'
 
 export interface BaseSectionOptions<TExtra extends Record<string, unknown> = Record<string, never>> extends BriloBlockType {
   supports?: BlockConfiguration['supports']

package/src/components/Event/EntitySelectModal.tsx

@@ -0,0 +1,249 @@
+import apiFetch from '@wordpress/api-fetch'
+import {Button, Card, CardBody, __experimentalHStack as HStack, Modal, __experimentalVStack as VStack} from '@wordpress/components'
+import {DataViews, type Field, type View} from '@wordpress/dataviews/wp'
+import {__} from '@wordpress/i18n'
+import {arrowDown, arrowUp, close, plusCircle} from '@wordpress/icons'
+// biome-ignore lint/correctness/noUnusedImports: required in scope for classic JSX transform
+import React, {useEffect, useMemo, useState} from 'react'
+import type {SelectControlProps} from '~/types'
+
+type EntityRecord = {id: number}
+
+// `DataViews`' own prop type makes `getItemId` conditionally optional based on whether
+// `Item extends {id: string}`, which TS can't resolve for an unresolved generic `T` — so
+// re-type it here for a numeric-id `T`, where `getItemId` is always required.
+type TypedDataViewsProps<T extends EntityRecord> = {
+  data: T[]
+  fields: Field<T>[]
+  view: View
+  onChangeView: (view: View) => void
+  paginationInfo: {totalItems: number; totalPages: number}
+  isLoading: boolean
+  defaultLayouts: {table: object}
+  getItemId: (item: T) => string
+  selection: string[]
+  onChangeSelection: (ids: string[]) => void
+  actions: Array<{
+    id: string
+    label: (items: T[]) => string
+    supportsBulk: boolean
+    callback: (items: T[]) => void
+  }>
+}
+
+const TypedDataViews = DataViews as unknown as <T extends EntityRecord>(props: TypedDataViewsProps<T>) => JSX.Element
+
+export type EntitySelectModalConfig<T extends EntityRecord> = {
+  endpoint: string
+  fields: Field<T>[]
+  defaultView: View
+  getItemLabel: (item: T) => string
+  matchesSearch: (item: T, needle: string) => boolean
+  sortValue: (item: T, field: string) => string | number
+  buttonLabel: string
+  modalTitle: string
+  emptyLabel: string
+  className?: string
+}
+
+function useEntities<T extends EntityRecord>(endpoint: string) {
+  const [entities, setEntities] = useState<T[]>([])
+  const [isLoading, setIsLoading] = useState(true)
+
+  useEffect(() => {
+    setIsLoading(true)
+    apiFetch<T[]>({path: endpoint})
+      .then((result) => setEntities(result))
+      .catch(() => setEntities([]))
+      .finally(() => setIsLoading(false))
+  }, [endpoint])
+
+  return {entities, isLoading}
+}
+
+function SelectedOrderList<T extends EntityRecord>({
+  items,
+  getItemLabel,
+  onChange,
+  onRemove,
+  emptyLabel,
+}: {
+  items: T[]
+  getItemLabel: (item: T) => string
+  onChange: (ids: number[]) => void
+  onRemove: (id: number) => void
+  emptyLabel: string
+}) {
+  if (0 === items.length) {
+    return <p className="i-event-select-modal__empty">{emptyLabel}</p>
+  }
+
+  const move = (index: number, direction: -1 | 1) => {
+    const target = index + direction
+
+    if (target < 0 || target >= items.length) {
+      return
+    }
+
+    const next = [...items]
+    ;[next[index], next[target]] = [next[target], next[index]]
+    onChange(next.map((item) => item.id))
+  }
+
+  return (
+    <VStack spacing={2}>
+      {items.map((item, index) => (
+        <Card size="small" className="i-event-select-modal__item" key={item.id}>
+          <CardBody>
+            <HStack alignment="center">
+              <span
+                className="i-event-select-modal__item-title"
+                style={{
+                  flexGrow: 1,
+                  minWidth: 0,
+                  textAlign: 'left',
+                  overflow: 'hidden',
+                  textOverflow: 'ellipsis',
+                  whiteSpace: 'nowrap',
+                }}
+              >
+                {getItemLabel(item) || __('(bez názvu)', 'brilo-blocks')}
+              </span>
+
+              <HStack expanded={false} spacing={1}>
+                <Button
+                  size="small"
+                  icon={arrowUp}
+                  label={__('Posunout výš', 'brilo-blocks')}
+                  onClick={() => move(index, -1)}
+                  disabled={0 === index}
+                />
+                <Button
+                  size="small"
+                  icon={arrowDown}
+                  label={__('Posunout níž', 'brilo-blocks')}
+                  onClick={() => move(index, 1)}
+                  disabled={index === items.length - 1}
+                />
+                <Button size="small" icon={close} isDestructive label={__('Odebrat', 'brilo-blocks')} onClick={() => onRemove(item.id)} />
+              </HStack>
+            </HStack>
+          </CardBody>
+        </Card>
+      ))}
+    </VStack>
+  )
+}
+
+/**
+ * Generic table-view entity picker built on @wordpress/dataviews (search, sort,
+ * checkbox selection, reorderable selection list). Feed it a REST endpoint +
+ * DataViews field config to get an `EventSelectModal`/`EventTermSelectModal`-style
+ * component without duplicating the DataViews wiring per entity type.
+ */
+export function createEntitySelectModal<T extends EntityRecord>(config: EntitySelectModalConfig<T>) {
+  return function EntitySelectModal({selectedItems, onChange}: SelectControlProps) {
+    const {entities, isLoading} = useEntities<T>(config.endpoint)
+    const [isOpen, setIsOpen] = useState(false)
+    const [view, setView] = useState<View>(config.defaultView)
+
+    const selectedEntities = useMemo(
+      () => selectedItems.map((id) => entities.find((entity) => entity.id === id)).filter((entity): entity is T => undefined !== entity),
+      [selectedItems, entities],
+    )
+
+    const {data, paginationInfo} = useMemo(() => {
+      let filtered = entities
+
+      if (view.search) {
+        const needle = view.search.toLowerCase()
+        filtered = filtered.filter((entity) => config.matchesSearch(entity, needle))
+      }
+
+      if (view.sort?.field) {
+        const {field, direction} = view.sort
+        const sorted = [...filtered]
+
+        sorted.sort((a, b) => {
+          const valueA = config.sortValue(a, field)
+          const valueB = config.sortValue(b, field)
+          const result =
+            typeof valueA === 'number' && typeof valueB === 'number' ? valueA - valueB : String(valueA).localeCompare(String(valueB))
+
+          return 'desc' === direction ? -result : result
+        })
+
+        filtered = sorted
+      }
+
+      const perPage = view.perPage ?? 20
+      const page = view.page ?? 1
+      const start = (page - 1) * perPage
+
+      return {
+        data: filtered.slice(start, start + perPage),
+        paginationInfo: {totalItems: filtered.length, totalPages: Math.ceil(filtered.length / perPage) || 1},
+      }
+    }, [entities, view])
+
+    const toggleSelected = (id: number) => {
+      onChange(selectedItems.includes(id) ? selectedItems.filter((itemId) => itemId !== id) : [...selectedItems, id])
+    }
+
+    return (
+      <VStack spacing={3} className={config.className ?? 'i-event-select-modal'}>
+        <Button variant="secondary" icon={plusCircle} onClick={() => setIsOpen(true)}>
+          {config.buttonLabel}
+        </Button>
+
+        <SelectedOrderList
+          items={selectedEntities}
+          getItemLabel={config.getItemLabel}
+          emptyLabel={config.emptyLabel}
+          onChange={onChange}
+          onRemove={(id) => onChange(selectedItems.filter((itemId) => itemId !== id))}
+        />
+
+        {isOpen && (
+          <Modal title={config.modalTitle} onRequestClose={() => setIsOpen(false)} size="fill">
+            <VStack spacing={4} style={{height: '100%'}}>
+              <div style={{flexGrow: 1, minHeight: 0}}>
+                <TypedDataViews<T>
+                  data={data}
+                  fields={config.fields}
+                  view={view}
+                  onChangeView={setView}
+                  paginationInfo={paginationInfo}
+                  isLoading={isLoading}
+                  defaultLayouts={{table: {}}}
+                  getItemId={(item) => String(item.id)}
+                  selection={selectedItems.map(String)}
+                  onChangeSelection={(ids) => onChange(ids.map(Number))}
+                  actions={[
+                    {
+                      id: 'toggle',
+                      label: (items) =>
+                        items.length && selectedItems.includes(items[0].id) ? __('Odebrat', 'brilo-blocks') : __('Přidat', 'brilo-blocks'),
+                      supportsBulk: true,
+                      callback: (items) => {
+                        items.forEach((item) => {
+                          toggleSelected(item.id)
+                        })
+                      },
+                    },
+                  ]}
+                />
+              </div>
+
+              <HStack justify="flex-end">
+                <Button variant="primary" onClick={() => setIsOpen(false)}>
+                  {__('Hotovo', 'brilo-blocks')}
+                </Button>
+              </HStack>
+            </VStack>
+          </Modal>
+        )}
+      </VStack>
+    )
+  }
+}

package/src/components/Event/EventSelectModal.tsx

@@ -0,0 +1,51 @@
+import type {View} from '@wordpress/dataviews/wp'
+import {__} from '@wordpress/i18n'
+import {createEntitySelectModal} from './EntitySelectModal'
+
+type EventRecord = {
+  id: number
+  title: {rendered: string}
+  date: string
+}
+
+const DEFAULT_VIEW: View = {
+  type: 'table',
+  search: '',
+  filters: [],
+  page: 1,
+  perPage: 20,
+  sort: {field: 'title', direction: 'asc'},
+  fields: ['date'],
+  titleField: 'title',
+}
+
+/**
+ * Manual brilo_event picker (table view, search, sort, checkbox selection,
+ * reorderable selection list) with title/date columns. See `EntitySelectModal`
+ * for the shared DataViews wiring.
+ */
+export const EventSelectModal = createEntitySelectModal<EventRecord>({
+  endpoint: '/wp/v2/brilo_event?per_page=100&orderby=title&order=asc&_fields=id,title,date',
+  defaultView: DEFAULT_VIEW,
+  buttonLabel: __('Vybrat události', 'brilo-blocks'),
+  modalTitle: __('Vybrat události', 'brilo-blocks'),
+  emptyLabel: __('Nevybrány žádné události.', 'brilo-blocks'),
+  getItemLabel: (item) => item.title.rendered,
+  matchesSearch: (item, needle) => item.title.rendered.toLowerCase().includes(needle),
+  sortValue: (item, field) => ('title' === field ? item.title.rendered : ((item as never)[field] ?? '')),
+  fields: [
+    {
+      id: 'title',
+      label: __('Název', 'brilo-blocks'),
+      enableHiding: false,
+      enableSorting: true,
+      render: ({item}: {item: EventRecord}) => item.title.rendered || __('(bez názvu)', 'brilo-blocks'),
+    },
+    {
+      id: 'date',
+      label: __('Datum', 'brilo-blocks'),
+      enableSorting: true,
+      render: ({item}: {item: EventRecord}) => (item.date ? new Date(item.date).toLocaleDateString() : '—'),
+    },
+  ],
+})

package/src/components/Event/EventTermSelectModal.tsx

@@ -0,0 +1,58 @@
+import type {View} from '@wordpress/dataviews/wp'
+import {__} from '@wordpress/i18n'
+import {createEntitySelectModal} from './EntitySelectModal'
+
+type EventCategoryRecord = {
+  id: number
+  name: string
+  slug: string
+  count?: number
+}
+
+const DEFAULT_VIEW: View = {
+  type: 'table',
+  search: '',
+  filters: [],
+  page: 1,
+  perPage: 20,
+  sort: {field: 'name', direction: 'asc'},
+  fields: ['slug', 'count'],
+  titleField: 'name',
+}
+
+/**
+ * Manual brilo_event_category picker (table view, search, sort, checkbox
+ * selection, reorderable selection list) with name/slug/count columns. See
+ * `EntitySelectModal` for the shared DataViews wiring.
+ */
+export const EventTermSelectModal = createEntitySelectModal<EventCategoryRecord>({
+  endpoint: '/wp/v2/brilo_event_category?per_page=100&orderby=name&order=asc&_fields=id,name,slug,count',
+  defaultView: DEFAULT_VIEW,
+  buttonLabel: __('Vybrat kategorie', 'brilo-blocks'),
+  modalTitle: __('Vybrat kategorie', 'brilo-blocks'),
+  emptyLabel: __('Nevybrány žádné kategorie.', 'brilo-blocks'),
+  getItemLabel: (item) => item.name,
+  matchesSearch: (item, needle) => item.name.toLowerCase().includes(needle) || item.slug.toLowerCase().includes(needle),
+  sortValue: (item, field) => (item as Record<string, unknown>)[field] as string | number,
+  fields: [
+    {
+      id: 'name',
+      label: __('Název', 'brilo-blocks'),
+      enableHiding: false,
+      enableSorting: true,
+      render: ({item}: {item: EventCategoryRecord}) => item.name || __('(bez názvu)', 'brilo-blocks'),
+    },
+    {
+      id: 'slug',
+      label: __('Slug', 'brilo-blocks'),
+      enableSorting: true,
+      render: ({item}: {item: EventCategoryRecord}) => item.slug || '—',
+    },
+    {
+      id: 'count',
+      label: __('Počet', 'brilo-blocks'),
+      enableSorting: true,
+      render: ({item}: {item: EventCategoryRecord}) => (undefined !== item.count ? String(item.count) : '—'),
+    },
+  ],
+})

package/src/editor.scss

@@ -36,6 +36,8 @@
 @forward "./blocks/usp/usp-item/editor";
 @forward "./blocks/person/person-group/editor";
 @forward "./blocks/person/person-item/editor";
+@forward "./blocks/event/event-calendar-group/editor";
+@forward "./blocks/event/event-list-group/editor";
 @forward "./blocks/responsive-grid/responsive-grid-item/editor";
 @forward "./blocks/layout/layout-aside/editor";
 @forward "./blocks/layout/layout-content/editor";

package/src/index.ts

@@ -166,6 +166,42 @@ export type {ContentAttributes, ContentOptions} from './blocks/layout/layout-con
 export {createContentBlock, contentDefaults} from './blocks/layout/layout-content'
 export type {AsideAttributes, AsideOptions} from './blocks/layout/layout-aside'
 export {createAsideBlock, asideDefaults} from './blocks/layout/layout-aside'
+export type {
+  EventCalendarGroupAttributes,
+  EventCalendarGroupOptions,
+} from './blocks/event/event-calendar-group'
+export {
+  createEventCalendarGroupBlock,
+  eventCalendarGroupDefaults,
+} from './blocks/event/event-calendar-group'
+export type {
+  EventListGroupAttributes,
+  EventListGroupMode,
+  EventListGroupOptions,
+} from './blocks/event/event-list-group'
+export type {
+  EventDetailHeaderAttributes,
+  EventDetailHeaderOptions,
+} from './blocks/event/event-detail-header'
+export {
+  createEventDetailHeaderBlock,
+  eventDetailHeaderDefaults,
+} from './blocks/event/event-detail-header'
+export type {
+  EventDetailContentAttributes,
+  EventDetailContentOptions,
+} from './blocks/event/event-detail-content'
+export {
+  createEventDetailContentBlock,
+  eventDetailContentDefaults,
+} from './blocks/event/event-detail-content'
+export {
+  createEventListGroupBlock,
+  eventListGroupDefaults,
+  EVENT_LIST_GROUP_MODES,
+  EventSelectModal,
+  EventTermSelectModal,
+} from './blocks/event/event-list-group'
 export type {
   JobPositionGroupAttributes,
   JobPositionGroupOptions,

package/src/types.ts

@@ -17,6 +17,11 @@ export interface Icon {
   media: Media
 }
 
+export interface SelectControlProps {
+  selectedItems: number[]
+  onChange: (ids: number[]) => void
+}
+
 export type OptionArray = ReadonlyArray<{value: string; label: string}>
 export type NumberArray = ReadonlyArray<number>
 export type StringArray = ReadonlyArray<string>