@piedata/pieui 1.1.1 → 1.1.3

package/src/types/index.ts

@@ -1,139 +0,0 @@
-import {ComponentType, ReactNode} from "react";
-
-export type WebAppUser = {
-    id: string
-    username: string
-    photo_url: string
-}
-
-export type MainButtonType = {
-    show: () => void
-    onClick: (callback: () => void) => void
-    offClick: (callback: () => void) => void
-    setText: (text: string) => void
-    hide: () => void
-}
-
-export type BackButtonType = {
-    show: () => void
-    onClick: (callback: () => void) => void
-    hide: () => void
-}
-
-export type WebAppInitData = {
-    user: WebAppUser
-    start_param?: string
-    chat_type?: 'sender' | 'private' | 'group' | 'supergroup' | 'channel'
-    chat_instance?: string
-    auth_date: number
-    hash: string
-}
-
-export type WebApp = {
-    sendData: (data: string) => void
-    showAlert: (message: string) => void
-    MainButton: MainButtonType
-    BackButton: BackButtonType
-    initDataUnsafe: WebAppInitData
-    initData: string
-    ready: () => void
-    close: () => void
-    openLink: (link: string, option: string) => void
-    platform: 'ios' | 'android' | 'web'
-    expand: () => void
-}
-
-export type Telegram = {
-    WebApp: WebApp
-}
-
-export type InitDataUnsafe = {
-    user?: WebAppUser
-}
-
-export type InitData = string
-
-
-export interface UIConfigType {
-    card: string
-    data: any
-    content: UIConfigType | Array<UIConfigType>
-}
-
-export interface UIEventType {
-    name: string
-    data: Record<any, any>
-}
-
-export type SetUiAjaxConfigurationType =
-    | ((content: UIConfigType | null) => void)
-    | ((events: Array<UIEventType> | null) => void)
-
-export interface PieEvent {
-    cardName: string
-    name: string
-    eventName: string
-    data: any
-}
-
-export type PieEventEmitter = (event: PieEvent) => void
-
-declare global {
-    interface Window {
-        sid: string
-        Telegram: Telegram
-    }
-}
-
-
-export interface ComponentMetadata {
-    author?: string
-    version?: string
-    description?: string
-    tags?: string[]
-}
-
-
-export interface PieComplexContainerComponentProps<TData = unknown> {
-    data: TData
-    content: Array<UIConfigType>
-    setUiAjaxConfiguration?: SetUiAjaxConfigurationType
-}
-
-export interface PieContainerComponentProps<TData = unknown> {
-    data: TData
-    content: UIConfigType
-    setUiAjaxConfiguration?: SetUiAjaxConfigurationType
-}
-
-export interface PieComplexComponentProps<TData = unknown> {
-    data: TData
-    setUiAjaxConfiguration?: SetUiAjaxConfigurationType
-}
-
-export interface PieSimpleComponentProps<TData = unknown> {
-    data: TData
-}
-
-export type PieComponentProps<TData = unknown> =
-    | PieSimpleComponentProps<TData>
-    | PieContainerComponentProps<TData>
-    | PieComplexContainerComponentProps<TData>
-
-
-export interface ComponentRegistration<TProps> {
-    name: string
-    component?: ComponentType<TProps>
-    fallback?: ReactNode
-    loader?: () => Promise<{ default: ComponentType<TProps> }>
-    metadata?: ComponentMetadata
-    isLazy?: boolean
-}
-
-
-export interface PieConfig {
-    apiServer: string
-    centrifugeServer?: string
-    enableRenderingLog?: boolean
-    pageProcessor?: string
-}

package/src/util/ajaxCommonUtils.ts

@@ -1,137 +0,0 @@
-import {getApiServer, isRenderingLogEnabled} from './pieConfig'
-import '../types'
-import { SetUiAjaxConfigurationType, UIEventType } from '../types'
-import waitForSidAvailable from './waitForSidAvailable'
-
-
-export const getAjaxSubmit = (
-    setUiAjaxConfiguration?: SetUiAjaxConfigurationType,
-    kwargs: Record<string, any> = {},
-    depsNames: Array<string> = [],
-    pathname?: string,
-) => {
-    const renderingLogEnabled = isRenderingLogEnabled()
-
-    if (renderingLogEnabled) {
-        console.log('Registering AJAX: ', pathname, kwargs, depsNames)
-    }
-
-    if (!pathname || !setUiAjaxConfiguration) {
-        if (renderingLogEnabled) {
-            console.warn('Registration FAILED: pathname or setUiAjaxConfiguration is missing!')
-        }
-        return () => {}
-    }
-
-    return async (extraKwargs: Record<string, any> = {}) => {
-        if (typeof window === 'undefined' || typeof document === 'undefined') {
-            if (renderingLogEnabled) {
-                console.warn('getAjaxSubmit called on server, skipping DOM-dependent logic')
-            }
-            return
-        }
-
-        if (depsNames.includes('sid')) {
-            await waitForSidAvailable()
-        }
-
-        const data = new FormData()
-        for (const [key, value] of Object.entries({ ...kwargs, ...extraKwargs })) {
-            data.append(key, value)
-        }
-
-        for (const depName of depsNames) {
-            if (depName === 'sid') {
-                if (!window.sid) throw new Error("SocketIO isn't initialized properly")
-                data.append('sid', window.sid)
-            } else {
-                const inputs = document.getElementsByName(depName)
-                if (!inputs.length) {
-                    if (renderingLogEnabled) {
-                        console.warn(`No input found with name ${depName}`)
-                    }
-                    continue
-                }
-                const input = inputs[0]
-                if (input instanceof HTMLInputElement) {
-                    if (input.type === 'file' && input.files) {
-                        Array.from(input.files).forEach((file) => data.append(depName, file))
-                    } else {
-                        data.append(depName, input.value)
-                    }
-                } else if (input instanceof HTMLTextAreaElement) {
-                    data.append(depName, input.value)
-                }
-            }
-        }
-
-        const apiEndpoint = getApiServer() + 'api/ajax_content' + pathname
-
-        setUiAjaxConfiguration(null)
-        return await fetch(apiEndpoint, {
-            method: 'POST',
-            body: data,
-        })
-            .then(async (response) => {
-                const contentType = response.headers.get('content-type') || ''
-                const isJson = contentType.includes('application/json')
-                const isStream = !!response.body?.getReader && !isJson
-
-                if (isStream) {
-                    const reader = response.body!.getReader()
-                    const decoder = new TextDecoder()
-                    let buffer = ''
-
-                    // eslint-disable-next-line no-constant-condition
-                    while (true) {
-                        const { done, value } = await reader.read()
-                        if (done) break
-                        buffer += decoder.decode(value, { stream: true })
-
-                        const lines = buffer.split('\n')
-                        buffer = lines.pop() ?? ''
-
-                        for (const line of lines) {
-                            const trimmed = line.trim()
-                            if (!trimmed) continue
-                            try {
-                                const currentEvent = JSON.parse(trimmed) as UIEventType
-                                ;(setUiAjaxConfiguration as (events: UIEventType[]) => void)([
-                                    currentEvent,
-                                ])
-                            } catch (err) {
-                                if (renderingLogEnabled) {
-                                    console.warn('Failed to parse streamed line:', trimmed)
-                                }
-                            }
-                        }
-                    }
-
-                    if (buffer.trim()) {
-                        try {
-                            const currentEvent = JSON.parse(buffer) as UIEventType
-                            ;(setUiAjaxConfiguration as (events: UIEventType[]) => void)([
-                                currentEvent,
-                            ])
-                        } catch (err) {
-                            if (renderingLogEnabled) {
-                                console.warn('Failed to parse final streamed line:', buffer)
-                            }
-                        }
-                    }
-                    return {}
-                } else {
-                    const data = await response.json()
-                    setUiAjaxConfiguration(data)
-                    return data
-                }
-            })
-            .catch((err) => {
-                if (renderingLogEnabled) {
-                    console.error('AJAX request failed:', err)
-                }
-                setUiAjaxConfiguration(null)
-                return err
-            })
-    }
-}

package/src/util/centrifuge.ts

@@ -1,33 +0,0 @@
-import { createContext } from 'react'
-import { Centrifuge } from 'centrifuge'
-
-
-export const getCentrifuge = (apiServer: string, centrifugeServer?: string) => {
-
-    async function getToken() {
-        const res = await fetch(apiServer + 'api/centrifuge/gen_token')
-        if (!res.ok) {
-            if (res.status === 403) {
-                throw new Centrifuge.UnauthorizedError('Backend is not answering')
-            }
-            throw new Error(`Unexpected status code ${res.status}`)
-        }
-        const data = await res.json()
-        return data.token
-    }
-
-    return centrifugeServer ?
-        new Centrifuge(centrifugeServer || '', {
-            getToken,
-        }): null
-}
-
-
-// export const centrifuge =
-//     getCentrifugeServer() ?
-//     new Centrifuge(getCentrifugeServer() || '', {
-//         getToken,
-//     }): null
-
-const CentrifugeIOContext = createContext<Centrifuge | null>(null)
-export default CentrifugeIOContext

package/src/util/fallback.tsx

@@ -1,6 +0,0 @@
-import {createContext, ReactNode} from "react";
-
-
-const FallbackContext = createContext<ReactNode>(<></>)
-
-export default FallbackContext

package/src/util/initializeComponents.ts

@@ -1,84 +0,0 @@
-import { registerPieComponent } from './registry'
-
-// Import all components that need registration
-import SequenceCard from '../components/Containers/SequenceCard/ui/SequenceCard'
-import UnionCard from '../components/Containers/UnionCard/ui/UnionCard'
-import AjaxGroupCard from '../components/Containers/AjaxGroupCard/ui/AjaxGroupCard'
-
-import AjaxButtonCard from '../components/Buttons/AjaxButtonCard/ui/AjaxButtonCard'
-
-import ChatCard from '../components/Chats/ChatCard/ui/ChatCard'
-
-let initialized = false
-
-/**
- * Initialize all PieUI components by registering them in the component registry.
- * This function should be called once before using PieRoot or any dynamic components.
- *
- * @example
- * ```typescript
- * import { initializePieComponents } from 'pieui'
- *
- * // Call this once in your app initialization
- * initializePieComponents()
- * ```
- */
-export function initializePieComponents(): void {
-    if (initialized) {
-        return
-    }
-
-    // Register all built-in components
-    registerPieComponent({
-        name: 'SequenceCard',
-        component: SequenceCard,
-        metadata: {
-            author: "PieData",
-            description: "Simple div with styles joining few components"
-        }
-    })
-
-    registerPieComponent({
-        name: 'UnionCard',
-        component: UnionCard,
-        metadata: {
-            author: "PieData",
-            description: "Renders one of many components"
-        }
-    })
-
-    registerPieComponent({
-        name: 'AjaxGroupCard',
-        component: AjaxGroupCard,
-        metadata: {
-            author: "PieData",
-            description: "Group card with AJAX support"
-        }
-    })
-
-    registerPieComponent({
-        name: 'AjaxButtonCard',
-        component: AjaxButtonCard,
-        metadata: {
-            author: "PieData",
-            description: "Button with AJAX support"
-        }
-    })
-
-    registerPieComponent({
-        name: 'ChatCard',
-        component: ChatCard,
-        metadata: {
-            author: "PieData",
-        }
-    })
-
-    initialized = true
-}
-
-/**
- * Check if PieUI components have been initialized
- */
-export function isPieComponentsInitialized(): boolean {
-    return initialized
-}

package/src/util/lazy.ts

@@ -1,25 +0,0 @@
-import { lazy, ComponentType, LazyExoticComponent } from 'react'
-
-const moduleCache = new Map<string, any>()
-
-export function trackLazy<T extends ComponentType<any>>(
-    loader: () => Promise<{ default: T }>,
-    name: string,
-): LazyExoticComponent<T> {
-    return lazy(() => {
-        if (moduleCache.has(name)) {
-            return moduleCache.get(name)!
-        }
-        const promise = loader().then((mod) => mod)
-        moduleCache.set(name, promise)
-        return promise
-    })
-}
-
-export const preloadComponent = async (name: string, loader?: () => Promise<any>) => {
-    if (!loader) return
-    if (moduleCache.has(name)) return moduleCache.get(name)
-    const promise = loader().then((mod) => mod)
-    moduleCache.set(name, promise)
-    return promise
-}

package/src/util/mitt.ts

@@ -1,11 +0,0 @@
-import mitt from 'mitt'
-import { createContext } from 'react'
-
-export const emitter = mitt()
-export type MittEvents = {
-    [key: string]: any
-}
-
-const MittContext = createContext(emitter)
-
-export default MittContext

package/src/util/pieConfig.ts

@@ -1,43 +0,0 @@
-import {createContext, useContext} from "react";
-import {PieConfig} from "../types";
-
-
-export const PieConfigContext = createContext<PieConfig | null>(null)
-
-export const usePieConfig = () => {
-    const context = useContext(PieConfigContext)
-    if (!context) {
-        throw new Error('usePieConfig must be used within PieConfigProvider')
-    }
-    return context
-}
-
-// Helper functions that match the old API
-export const useApiServer = () => {
-    const { apiServer } = usePieConfig()
-    return apiServer
-}
-
-export const getApiServer = useApiServer
-
-
-export const useCentrifugeServer = () => {
-    const { centrifugeServer } = usePieConfig()
-    return centrifugeServer
-}
-
-export const getCentrifugeServer = useCentrifugeServer
-
-export const useIsRenderingLogEnabled = () => {
-    const { enableRenderingLog } = usePieConfig()
-    return enableRenderingLog
-}
-
-export const isRenderingLogEnabled = useIsRenderingLogEnabled
-
-export const usePageProcessor = () => {
-    const { pageProcessor } = usePieConfig()
-    return pageProcessor
-}
-
-export const getPageProcessor = usePageProcessor

package/src/util/registry.ts

@@ -1,81 +0,0 @@
-import {ComponentMetadata, ComponentRegistration} from '../types'
-import {trackLazy} from './lazy'
-import {ComponentType} from 'react'
-
-const registry = new Map<string, ComponentRegistration<any>>()
-
-
-const normalizeRegistration = <TProps,>(
-    registration: ComponentRegistration<TProps>
-): ComponentRegistration<TProps> => {
-    if (!registration.name) {
-        throw new Error('Component registration requires a name')
-    }
-
-    if (!registration.component && !registration.loader) {
-        throw new Error(`Component "${registration.name}" requires component or loader`)
-    }
-
-    const entry: ComponentRegistration<TProps> = {
-        name: registration.name,
-        component: registration.component,
-        loader: registration.loader,
-        metadata: registration.metadata,
-        fallback: registration.fallback,
-        isLazy: false,
-    }
-
-    if (!entry.component && entry.loader) {
-        entry.component = trackLazy(
-            entry.loader,
-            registration.name
-        ) as ComponentType<TProps>
-        entry.loader = undefined
-        entry.isLazy = true
-    }
-
-    return entry
-}
-
-
-export function registerPieComponent<TProps>(
-    registration: ComponentRegistration<TProps>
-): ComponentType<TProps> | undefined {
-    const entry = normalizeRegistration(registration)
-    registry.set(entry.name, entry)
-    return entry.component
-}
-
-
-export const registerMultipleComponents = (
-    components: ComponentRegistration<any>[]
-) => {
-    components.forEach((component) => registerPieComponent(component))
-}
-
-export const unregisterComponent = (name: string) => {
-    registry.delete(name)
-}
-
-export const hasComponent = (name: string) => {
-    return registry.has(name)
-}
-
-export const getComponentMeta = (name: string): ComponentMetadata | undefined => {
-    return registry.get(name)?.metadata
-}
-
-
-export const getRegistryEntry = (
-    name: string
-): ComponentRegistration<any> | undefined => {
-    return registry.get(name)
-}
-
-export const getAllRegisteredComponents = (): string[] => {
-    return Array.from(registry.keys())
-}
-
-export const getRegistrySize = (): number => {
-    return registry.size
-}

package/src/util/socket.ts

@@ -1,24 +0,0 @@
-import {io, Socket} from 'socket.io-client'
-import { createContext } from 'react'
-
-// export const socket = io(getApiServer(), {
-//     autoConnect: false,
-//     transports: ['websocket'],
-// })
-
-export const getSocket = (apiServer: string) => io(apiServer, {
-    autoConnect: false,
-    transports: ['websocket'],
-})
-
-/*
-const onPieInitEvent = (event) => {
-    window.sid = event.sid
-    console.log(`Connected: ${window.sid}`)
-}
-socket.on(`pieinit`, onPieInitEvent)
-*/
-
-const SocketIOContext = createContext<Socket | null>(null)
-
-export default SocketIOContext

package/src/util/sx2radium.ts

@@ -1,15 +0,0 @@
-import { CSSProperties } from 'react'
-import Radium from 'radium'
-
-export function sx2radium(sx: Record<string, any> | CSSProperties | undefined): CSSProperties {
-    if (!sx) {
-        return {}
-    }
-
-    const copy = { ...sx }
-    if ('animationName' in copy && typeof copy.animationName === 'object') {
-        const uniqueAnimationName = 'radiumAnimation_' + Math.random().toString(36).substring(2, 8)
-        copy.animationName = Radium.keyframes(copy.animationName, uniqueAnimationName)
-    }
-    return copy
-}

package/src/util/tailwindCommonUtils.ts

@@ -1,6 +0,0 @@
-import { clsx, type ClassValue } from 'clsx'
-import { twMerge } from 'tailwind-merge'
-
-export function cn(...inputs: ClassValue[]) {
-    return twMerge(clsx(inputs))
-}

package/src/util/useIsSupported.ts

@@ -1,17 +0,0 @@
-import { useEffect, useState } from 'react'
-
-export function useIsSupported(apiServer: string, name: string): boolean | null {
-    const [isSupported, setIsSupported] = useState<boolean | null>(null)
-    const [supportIsRequested, setSupportIsRequested] = useState(false)
-    useEffect(() => {
-        if (!supportIsRequested) {
-            setSupportIsRequested(true)
-            fetch(apiServer + `api/support/${name}`, { method: 'GET' })
-                .then((res) => res.json())
-                .then((res) => {
-                    setIsSupported(res)
-                })
-        }
-    }, [])
-    return isSupported
-}