diff --git a/.github/workflows/cd.yml b/.github/workflows/cd.yml index 29952c2258..9607ee97ca 100644 --- a/.github/workflows/cd.yml +++ b/.github/workflows/cd.yml @@ -122,6 +122,7 @@ jobs: semcore/illustration/**/*.js semcore/illustration/**/*.mjs semcore/illustration/**/*.d.ts + semcore/*/tsconfig.tsbuildinfo key: build-${{ hashFiles('**/pnpm-lock.yaml', '**/CHANGELOG.md') }}-6 enableCrossOsArchive: true - name: Install dependencies @@ -167,6 +168,7 @@ jobs: semcore/illustration/**/*.js semcore/illustration/**/*.mjs semcore/illustration/**/*.d.ts + semcore/*/tsconfig.tsbuildinfo key: build-${{ hashFiles('**/pnpm-lock.yaml', '**/CHANGELOG.md') }}-6 enableCrossOsArchive: true - name: Install dependencies diff --git a/.gitignore b/.gitignore index ff193c4677..61118bc957 100644 --- a/.gitignore +++ b/.gitignore @@ -81,3 +81,6 @@ allure-report storybook-static *storybook.log + +# TS +**/*.tsbuildinfo diff --git a/package.json b/package.json index 2ef55a6a2e..61902846f7 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "scripts": { "dev": "pnpm storybook", "start": "pnpm storybook", + "watch-semcore": "tsc -b semcore --emitDeclarationOnly --watch", "build": "pnpm run clean && pnpm --filter @semcore/theme run build && pnpm --filter @semcore/core run build && pnpm build:icons && pnpm build:illustration && pnpm --filter @semcore/base-components run build && pnpm --filter @semcore/dropdown run build && pnpm --filter @semcore/* --filter !@semcore/icon --filter !@semcore/core --filter !@semcore/base-components --filter !@semcore/illustration --filter !@semcore/dropdown --filter !@semcore/ui run build", "process-theme": "pnpm --filter @semcore/theme build", "install-n-test": "pnpm install && pnpm test", @@ -28,7 +29,9 @@ "clean:illustration": "pnpm --filter @semcore/illustration run clean", "format": "biome format ./semcore ./tools ./website ./stories ./.ci --config-path . --write", "lint:es": "npx eslint", - "lint:ts": "tsc --noEmit && cd website && tsc --noEmit", + "lint:ts": "pnpm lint:ts:semcore && tsc --noEmit && pnpm lint:ts:website", + "lint:ts:semcore": "tsc -b semcore --emitDeclarationOnly --verbose", + "lint:ts:website": "cd website && tsc --noEmit", "lint:css": "stylelint **/*.css", "lint:docs": "vale README.md CONTRIBUTING.md semcore/*/README.md semcore/*/CHANGELOG.md tools/*/README.md tools/*/CHANGELOG.md website/docs", "prepare": "husky install", diff --git a/playground/entries/Spin.tsx b/playground/entries/Spin.tsx index 5a8128a33b..36710998d6 100644 --- a/playground/entries/Spin.tsx +++ b/playground/entries/Spin.tsx @@ -1,4 +1,4 @@ -import type { FlexProps } from '@semcore/ui/base-components'; +import type { NSFlex } from '@semcore/ui/base-components'; import { Flex } from '@semcore/ui/base-components'; import type { NSSpin } from '@semcore/ui/spin'; import Spin from '@semcore/ui/spin'; @@ -38,7 +38,7 @@ const textSize: { [key in SpinJSXProps['size']]: NSText.Props['size'] } = { xxl: 200, }; -const textPlacement: { [key in SpinJSXProps['textPlacement']]: FlexProps['direction'] } = { +const textPlacement: { [key in SpinJSXProps['textPlacement']]: NSFlex.Props['direction'] } = { right: 'row', bottom: 'column', }; diff --git a/semcore/accordion/.npmignore b/semcore/accordion/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/accordion/.npmignore +++ b/semcore/accordion/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/accordion/src/Accordion.type.ts b/semcore/accordion/src/Accordion.type.ts index 822bce476d..2be5d9b678 100644 --- a/semcore/accordion/src/Accordion.type.ts +++ b/semcore/accordion/src/Accordion.type.ts @@ -1,4 +1,4 @@ -import type { BoxProps, FlexProps, Flex } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { Text } from '@semcore/typography'; import type { Property } from 'csstype'; @@ -6,7 +6,7 @@ import type { Property } from 'csstype'; declare namespace NSAccordion { // TODO: It looks like the value isn't accurate. Revise and align it with the component's logic. type Value = null | number | string | Array; - type Props = FlexProps & { + type Props = NSFlex.Props & { /** Value for the active tab. Can be set as stroke, number, null or as array. * @type NSAccordion.Value * */ @@ -59,17 +59,17 @@ declare namespace NSAccordion { selected?: boolean; }; namespace Toggle { - type Props = BoxProps & { + type Props = NSBox.Props & { tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'; }; type Component = Intergalactic.Component; } namespace ToggleButton { type Props = {}; - type Component = Intergalactic.Component; + type Component = Intergalactic.Component; } namespace Chevron { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Chevron size * @default m @@ -81,7 +81,7 @@ declare namespace NSAccordion { } namespace Collapse { - type Props = BoxProps & { + type Props = NSBox.Props & { /** Animation titles */ keyframes?: [string, string]; /** Enables animation on first rendering diff --git a/semcore/accordion/tsconfig.json b/semcore/accordion/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/accordion/tsconfig.json +++ b/semcore/accordion/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/add-filter/.npmignore b/semcore/add-filter/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/add-filter/.npmignore +++ b/semcore/add-filter/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/add-filter/src/AddFilter.types.ts b/semcore/add-filter/src/AddFilter.types.ts index 5145e64bc7..2bd5d9e6e7 100644 --- a/semcore/add-filter/src/AddFilter.types.ts +++ b/semcore/add-filter/src/AddFilter.types.ts @@ -1,4 +1,4 @@ -import type { FlexProps } from '@semcore/base-components'; +import type { NSFlex } from '@semcore/base-components'; import type { FilterTrigger } from '@semcore/base-trigger'; import type { ButtonLink } from '@semcore/button'; import type { Intergalactic } from '@semcore/core'; @@ -13,7 +13,7 @@ import type { LocalizedMessages } from './translations/__intergalactic-dynamic-l declare namespace NSAddFilter { type Key = string; type Data = Record; - type Props = FlexProps & { + type Props = NSFlex.Props & { /** * Action to perform on `Clear filters` button click. */ diff --git a/semcore/add-filter/tsconfig.json b/semcore/add-filter/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/add-filter/tsconfig.json +++ b/semcore/add-filter/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/badge/.npmignore b/semcore/badge/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/badge/.npmignore +++ b/semcore/badge/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/badge/src/Badge.tsx b/semcore/badge/src/Badge.tsx index a5844e3449..e97c496e35 100644 --- a/semcore/badge/src/Badge.tsx +++ b/semcore/badge/src/Badge.tsx @@ -1,4 +1,3 @@ -import type { BoxProps } from '@semcore/base-components'; import { Box } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import { createComponent, Component, Root, sstyled } from '@semcore/core'; diff --git a/semcore/badge/tsconfig.json b/semcore/badge/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/badge/tsconfig.json +++ b/semcore/badge/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/base-components/.npmignore b/semcore/base-components/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/base-components/.npmignore +++ b/semcore/base-components/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/base-components/src/components/animation/Animation.tsx b/semcore/base-components/src/components/animation/Animation.tsx index e3c484799a..b886410097 100644 --- a/semcore/base-components/src/components/animation/Animation.tsx +++ b/semcore/base-components/src/components/animation/Animation.tsx @@ -1,23 +1,18 @@ +import type { Intergalactic } from '@semcore/core'; import { createComponent, sstyled, Root, Component } from '@semcore/core'; import contextEnhance from '@semcore/core/lib/utils/enhances/contextEnhance'; import React from 'react'; import { Box } from '../flex-box'; -import type { AnimationContext, AnimationProps, Animation as AnimationComponent, AnimationDefaultProps } from './Animation.types'; +import type { NSAnimation } from './Animation.types'; import style from './style/animate.shadow.css'; -type State = { - animationRunning: boolean; - render: AnimationProps['visible'] | AnimationProps['preserveNode']; - wasInvisible: AnimationProps['visible']; -}; - function propToArray(prop: any) { return Array.isArray(prop) ? prop : [prop, prop]; } const makeAnimationContextValue = () => { - const context: AnimationContext = { + const context: NSAnimation.Ctx = { onAnimationStartSubscribers: [], onAnimationStart: (callback) => { context.onAnimationStartSubscribers.push(callback); @@ -31,19 +26,19 @@ const makeAnimationContextValue = () => { }; return context; }; -export const animationContext = React.createContext(null); +export const animationContext = React.createContext(null); class Animation extends Component< - AnimationProps, + Intergalactic.InternalTypings.InferComponentProps, typeof Animation.enhance, {}, - { parentAnimationContext: AnimationContext }, - State, - AnimationDefaultProps + { parentAnimationContext: NSAnimation.Ctx }, + NSAnimation.State, + NSAnimation.DefaultProps > { static displayName = 'Animation'; static style = style; - static defaultProps: AnimationDefaultProps = { + static defaultProps: NSAnimation.DefaultProps = { visible: false, duration: 0, delay: 0, @@ -55,7 +50,7 @@ class Animation extends Component< static enhance = [contextEnhance(animationContext, 'parentAnimationContext')]; - static getDerivedStateFromProps(props: AnimationProps, state: State) { + static getDerivedStateFromProps(props: NSAnimation.Props, state: NSAnimation.State) { const wasInvisible = state.wasInvisible || !props.visible; if (props.visible || props.preserveNode || state.wasInvisible !== wasInvisible) { return { render: true, wasInvisible }; @@ -63,7 +58,7 @@ class Animation extends Component< return state; } - state: State = { + state: NSAnimation.State = { animationRunning: false, render: this.props.visible || this.props.preserveNode, wasInvisible: !this.props.visible, @@ -116,7 +111,7 @@ class Animation extends Component< this.animationEventFallback(); } - componentDidUpdate(prevProps: AnimationProps, prevState: State) { + componentDidUpdate(prevProps: typeof this.asProps, prevState: typeof this.state) { if (prevProps.visible !== this.props.visible || prevState.render !== this.state.render) { this.animationEventFallback(); } @@ -162,4 +157,4 @@ class Animation extends Component< } } -export default createComponent(Animation); +export default createComponent(Animation); diff --git a/semcore/base-components/src/components/animation/Animation.types.ts b/semcore/base-components/src/components/animation/Animation.types.ts index 821d9b4e5f..5c9e01c375 100644 --- a/semcore/base-components/src/components/animation/Animation.types.ts +++ b/semcore/base-components/src/components/animation/Animation.types.ts @@ -1,130 +1,155 @@ -import type { UnknownProperties, Intergalactic } from '@semcore/core'; - -import type { BoxProps } from '../flex-box'; - -type CssTimingFunction = - | 'ease' - | 'ease-in' - | 'ease-out' - | 'ease-in-out' - | 'linear' - | 'step-start' - | 'step-end'; - -export type AnimationProps = BoxProps & { - /** The property is responsible for the visibility of the element */ - visible?: boolean; - /** Animation duration in ms - * @default 0 - */ - duration?: number | [number, number]; - /** Animation delay in ms - * @default 0 - */ - delay?: number | [number, number]; - /** Animation titles */ - keyframes?: [string, string]; - /** If it set to `true`, animated node is persisted in dom even if `visible=false` */ - preserveNode?: boolean; - /** Enables animation on first rendering - * @default false - */ - initialAnimation?: boolean; - /** - * @default ease-out - */ - timingFunction?: CssTimingFunction; - /** - * @default false - */ - animationsDisabled?: boolean; - - /** Animation effects - * @default undefined - * @internal - */ - transformStart?: string; - /** Animation effects - * @default undefined - * @internal - */ - transformEnd?: string; -}; - -export type AnimationDefaultProps = { - visible: false; - duration: 0; - delay: 0; - keyframes: AnimationProps['keyframes']; - initialAnimation: false; - timingFunction: 'ease-out'; - animationsDisabled: false; -}; - -export type CollapseProps = AnimationProps & { - /** - * Add overflow=clip when passing animation - * @default true - * */ - overflowHidden?: boolean; - - /** - * Value for height after animation - * @default auto - */ - defaultHeight?: 'auto' | '100%'; - - /** @deprecated It will be removed in v18. */ - onAnimationStart?: React.AnimationEventHandler; - /** @deprecated It will be removed in v18. */ - onAnimationEnd?: React.AnimationEventHandler; -}; - -export type FadeInOutProps = AnimationProps & {}; - -export type TransformProps = AnimationProps & { - /** Animation effects - * @default [] - */ - transform?: [string, string]; -}; - -export type ScaleProps = AnimationProps & { - /** Placement of appearing block - */ - placement?: - | 'top-start' - | 'top-end' - | 'bottom-start' - | 'bottom-end' - | 'right-start' - | 'right-end' - | 'left-start' - | 'left-end'; -}; - -export type SlideProps = AnimationProps & { - /** Direction from which slide animation will be performed - */ - slideOrigin?: 'top' | 'bottom' | 'left' | 'right'; -}; - -type DisposeSubscription = () => void; - -export type AnimationContext< - AnimationStartCb = (duration: number) => void, - AnimationEndCb = () => void, -> = { - onAnimationStart: (callback: AnimationStartCb) => DisposeSubscription; - onAnimationEnd: (callback: AnimationEndCb) => DisposeSubscription; - onAnimationStartSubscribers: Array; - onAnimationEndSubscribers: Array; -}; - -export type animationContext = React.Context; -export type Animation = Intergalactic.Component<'div', AnimationProps>; -export type Collapse = Intergalactic.Component<'div', CollapseProps>; -export type FadeInOut = Intergalactic.Component<'div', FadeInOutProps>; -export type Transform = Intergalactic.Component<'div', TransformProps>; -export type Scale = Intergalactic.Component<'div', ScaleProps>; -export type Slide = Intergalactic.Component<'div', SlideProps>; +import type { Intergalactic } from '@semcore/core'; + +import type { NSBox } from '../flex-box'; + +declare namespace NSAnimation { + type TimingFunction = 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear' | 'step-start' | 'step-end'; + type StartCb = (duration: number) => void; + type EndCb = () => void; + type Props = NSBox.Props & { + /** The property is responsible for the visibility of the element */ + visible?: boolean; + /** Animation duration in ms + * @default 0 + */ + duration?: number | [number, number]; + /** Animation delay in ms + * @default 0 + */ + delay?: number | [number, number]; + /** Animation titles */ + keyframes?: [string, string]; + /** If it set to `true`, animated node is persisted in dom even if `visible=false` */ + preserveNode?: boolean; + /** Enables animation on first rendering + * @default false + */ + initialAnimation?: boolean; + /** + * @default ease-out + */ + timingFunction?: NSAnimation.TimingFunction; + /** + * @default false + */ + animationsDisabled?: boolean; + + /** Animation effects + * @default undefined + * @internal + */ + transformStart?: string; + /** Animation effects + * @default undefined + * @internal + */ + transformEnd?: string; + }; + type DefaultProps = { + visible: false; + duration: 0; + delay: 0; + keyframes: AnimationProps['keyframes']; + initialAnimation: false; + timingFunction: 'ease-out'; + animationsDisabled: false; + }; + type State = { + animationRunning: boolean; + render: NSAnimation.Props['visible'] | NSAnimation.Props['preserveNode']; + wasInvisible: NSAnimation.Props['visible']; + }; + type Ctx = { + onAnimationStart: (callback: AnimationStartCb) => NSAnimation.EndCb; + onAnimationEnd: (callback: AnimationEndCb) => NSAnimation.EndCb; + onAnimationStartSubscribers: Array; + onAnimationEndSubscribers: Array; + }; + + namespace Collapse { + type Props = NSAnimation.Props & { + /** + * Add overflow=clip when passing animation + * @default true + * */ + overflowHidden?: boolean; + + /** + * Value for height after animation + * @default auto + */ + defaultHeight?: 'auto' | '100%'; + + /** @deprecated It will be removed in v18. */ + onAnimationStart?: React.AnimationEventHandler; + /** @deprecated It will be removed in v18. */ + onAnimationEnd?: React.AnimationEventHandler; + }; + + type Component = Intergalactic.Component<'div', Props>; + } + + namespace FadeInOut { + type Props = NSAnimation.Props; + + type Component = Intergalactic.Component<'div', Props>; + } + + namespace Transform { + type Props = NSAnimation.Props & { + /** Animation effects + * @default [] + */ + transform?: [string, string]; + }; + + type Component = Intergalactic.Component<'div', Props>; + } + + namespace Scale { + type Props = NSAnimation.Props & { + /** Placement of appearing block + */ + placement?: + | 'top-start' + | 'top-end' + | 'bottom-start' + | 'bottom-end' + | 'right-start' + | 'right-end' + | 'left-start' + | 'left-end'; + }; + + type Component = Intergalactic.Component<'div', Props>; + } + + namespace Slide { + type Props = NSAnimation.Props & { + /** Direction from which slide animation will be performed + */ + slideOrigin?: 'top' | 'bottom' | 'left' | 'right'; + }; + + type Component = Intergalactic.Component<'div', Props>; + } + + type Component = Intergalactic.Component<'div', Props>; +} + +/** @deprecated It will be removed in v18. */ +export type AnimationProps = NSAnimation.Props; +/** @deprecated It will be removed in v18. */ +export type AnimationDefaultProps = NSAnimation.DefaultProps; +/** @deprecated It will be removed in v18. */ +export type CollapseProps = NSAnimation.Collapse.Props; +/** @deprecated It will be removed in v18. */ +export type FadeInOutProps = NSAnimation.FadeInOut.Props; +/** @deprecated It will be removed in v18. */ +export type TransformProps = NSAnimation.Transform.Props; +/** @deprecated It will be removed in v18. */ +export type ScaleProps = NSAnimation.Scale.Props; +/** @deprecated It will be removed in v18. */ +export type SlideProps = NSAnimation.Slide.Props; + +export type { NSAnimation }; diff --git a/semcore/base-components/src/components/animation/Collapse.tsx b/semcore/base-components/src/components/animation/Collapse.tsx index 2952f198a2..ce0bad53f2 100644 --- a/semcore/base-components/src/components/animation/Collapse.tsx +++ b/semcore/base-components/src/components/animation/Collapse.tsx @@ -4,13 +4,14 @@ import useEnhancedEffect from '@semcore/core/lib/utils/use/useEnhancedEffect'; import React from 'react'; import Animation from './Animation'; -import type { CollapseProps } from './Animation.types'; +import type { NSAnimation } from './Animation.types'; import style from './style/keyframes.shadow.css'; function Collapse( - { onAnimationStart, onAnimationEnd, overflowHidden = true, defaultHeight = 'auto', ...props }: CollapseProps, + props: Intergalactic.InternalTypings.InferComponentProps, ref: React.Ref, ) { + const { onAnimationStart, onAnimationEnd, overflowHidden = true, defaultHeight = 'auto', ...restProps } = props; const SCollapse = Animation; const overflowRef = React.useRef('initial'); const innerRef = React.useRef(null); @@ -18,16 +19,16 @@ function Collapse( useEnhancedEffect(() => { if (!innerRef.current) return; - if (props.visible) innerRef.current.style.height = `${0}px`; - if (!props.visible) innerRef.current.style.height = `${innerRef.current.scrollHeight}px`; - if (props.visible) innerRef.current.style.animationFillMode = 'none'; - if (!props.visible) innerRef.current.style.animationFillMode = 'both'; - }, [props.visible]); + if (restProps.visible) innerRef.current.style.height = `${0}px`; + if (!restProps.visible) innerRef.current.style.height = `${innerRef.current.scrollHeight}px`; + if (restProps.visible) innerRef.current.style.animationFillMode = 'none'; + if (!restProps.visible) innerRef.current.style.animationFillMode = 'both'; + }, [restProps.visible]); useEnhancedEffect(() => { if (!innerRef.current) return; - if (props.visible) innerRef.current.style.height = defaultHeight; - if (!props.visible) innerRef.current.style.height = `${0}px`; + if (restProps.visible) innerRef.current.style.height = defaultHeight; + if (!restProps.visible) innerRef.current.style.height = `${0}px`; }, []); const handleAnimationStart = React.useCallback( @@ -39,14 +40,14 @@ function Collapse( event.currentTarget.style.overflow = 'clip'; } - if (props.visible) event.currentTarget.style.height = `${event.currentTarget.scrollHeight}px`; - if (!props.visible) event.currentTarget.style.height = `${0}px`; + if (restProps.visible) event.currentTarget.style.height = `${event.currentTarget.scrollHeight}px`; + if (!restProps.visible) event.currentTarget.style.height = `${0}px`; }, - [props.visible], + [restProps.visible], ); - const visibleRef = React.useRef(props.visible); - visibleRef.current = props.visible; + const visibleRef = React.useRef(restProps.visible); + visibleRef.current = restProps.visible; const handleAnimationEnd = React.useCallback((event: React.AnimationEvent) => { if (event.currentTarget !== event.target) return; if (onAnimationEnd) onAnimationEnd(event); @@ -64,8 +65,10 @@ function Collapse( return sstyled(style)( ; - -export default createBaseComponent(Collapse); +export default createBaseComponent(Collapse); diff --git a/semcore/base-components/src/components/animation/FadeInOut.tsx b/semcore/base-components/src/components/animation/FadeInOut.tsx index 83f0af3b1f..020359f907 100644 --- a/semcore/base-components/src/components/animation/FadeInOut.tsx +++ b/semcore/base-components/src/components/animation/FadeInOut.tsx @@ -2,12 +2,14 @@ import { sstyled, createBaseComponent, type Intergalactic } from '@semcore/core' import React from 'react'; import Animation from './Animation'; -import type { FadeInOutProps } from './Animation.types'; +import type { NSAnimation } from './Animation.types'; import style from './style/keyframes.shadow.css'; -function FadeInOut(props: FadeInOutProps, ref: React.Ref) { +function FadeInOut(props: Intergalactic.InternalTypings.InferComponentProps, ref: React.Ref) { return sstyled(style)( ) { FadeInOut.displayName = 'FadeInOut'; -type FadeInOutComponent = Intergalactic.Component<'div', FadeInOutProps>; - -export default createBaseComponent(FadeInOut); +export default createBaseComponent(FadeInOut); diff --git a/semcore/base-components/src/components/animation/Scale.tsx b/semcore/base-components/src/components/animation/Scale.tsx index c540f5333b..06016e7ad1 100644 --- a/semcore/base-components/src/components/animation/Scale.tsx +++ b/semcore/base-components/src/components/animation/Scale.tsx @@ -4,10 +4,10 @@ import { useForkRef } from '@semcore/core/lib/utils/ref'; import React from 'react'; import Animation from './Animation'; -import type { ScaleProps } from './Animation.types'; +import type { NSAnimation } from './Animation.types'; import style from './style/keyframes.shadow.css'; -function Scale(props: ScaleProps, ref: React.Ref) { +function Scale(props: Intergalactic.InternalTypings.InferComponentProps, ref: React.Ref) { const [placement, setPlacement] = React.useState(props.placement ?? ''); const keyframesKey = React.useMemo(() => { if (placement.startsWith('left')) return 'scale-left'; @@ -34,6 +34,8 @@ function Scale(props: ScaleProps, ref: React.Ref) { return sstyled(style)( ) { Scale.displayName = 'Scale'; -type ScaleComponent = Intergalactic.Component<'div', ScaleProps>; - -export default createBaseComponent(Scale); +export default createBaseComponent(Scale); diff --git a/semcore/base-components/src/components/animation/Slide.tsx b/semcore/base-components/src/components/animation/Slide.tsx index ec259ad606..68a9322d99 100644 --- a/semcore/base-components/src/components/animation/Slide.tsx +++ b/semcore/base-components/src/components/animation/Slide.tsx @@ -3,12 +3,14 @@ import { createBaseComponent, sstyled } from '@semcore/core'; import React from 'react'; import Animation from './Animation'; -import type { SlideProps } from './Animation.types'; +import type { NSAnimation } from './Animation.types'; import style from './style/keyframes.shadow.css'; -function Slide(props: SlideProps, ref: React.Ref) { +function Slide(props: Intergalactic.InternalTypings.InferComponentProps, ref: React.Ref) { return sstyled(style)( ) { Slide.displayName = 'Slide'; -type SlideComponent = Intergalactic.Component<'div', SlideProps>; - -export default createBaseComponent(Slide); +export default createBaseComponent(Slide); diff --git a/semcore/base-components/src/components/animation/Transform.tsx b/semcore/base-components/src/components/animation/Transform.tsx index 3a526f5c0b..77613f5e2c 100644 --- a/semcore/base-components/src/components/animation/Transform.tsx +++ b/semcore/base-components/src/components/animation/Transform.tsx @@ -3,14 +3,16 @@ import { createBaseComponent, sstyled } from '@semcore/core'; import React from 'react'; import Animation from './Animation'; -import type { TransformProps } from './Animation.types'; +import type { NSAnimation } from './Animation.types'; import style from './style/keyframes.shadow.css'; -function Transform(props: TransformProps, ref: React.Ref) { +function Transform(props: Intergalactic.InternalTypings.InferComponentProps, ref: React.Ref) { const { transform = [], ...other } = props; return sstyled(style)( ) { Transform.displayName = 'Transform'; -type TransformComponent = Intergalactic.Component<'div', TransformProps>; -export default createBaseComponent(Transform); +export default createBaseComponent(Transform); diff --git a/semcore/base-components/src/components/animation/index.ts b/semcore/base-components/src/components/animation/index.ts index 5438c5e614..ac39cecb55 100644 --- a/semcore/base-components/src/components/animation/index.ts +++ b/semcore/base-components/src/components/animation/index.ts @@ -1,13 +1,8 @@ export { default as Animation, animationContext } from './Animation'; - export { default as Transform } from './Transform'; - export { default as FadeInOut } from './FadeInOut'; - export { default as Collapse } from './Collapse'; - export { default as Scale } from './Scale'; - export { default as Slide } from './Slide'; export type { @@ -16,4 +11,5 @@ export type { CollapseProps, AnimationProps, ScaleProps, + NSAnimation, } from './Animation.types'; diff --git a/semcore/base-components/src/components/breakpoints/Breakpoints.types.ts b/semcore/base-components/src/components/breakpoints/Breakpoints.types.ts deleted file mode 100644 index 7709cd98cd..0000000000 --- a/semcore/base-components/src/components/breakpoints/Breakpoints.types.ts +++ /dev/null @@ -1,39 +0,0 @@ -import type React from 'react'; - -type listenerType = (index: number) => void; -type mediaType = string[]; - -export type Media = { - /** Destroy the subscription to the window.matchMedia */ - destructor(): void; - - /** Get the index from the media list. */ - matches(): number; - - /** Subscribe to index changes in the media list. */ - addListener(listener: listenerType): () => void; - - /** Unsubscribe from changing the index in the media list. */ - removeListener(listener: listenerType): void; -}; - -export type BreakpointsProps = { - children: React.ReactNode; -}; - -type createBreakpointsType = (media: mediaType) => (( - props: BreakpointsProps, -) => React.ReactElement) & { - Context: React.Context; - mediaList: MediaList; -}; - -declare const MediaList: { - prototype: MediaList; - new (media: mediaType, defaultIndex?: number): MediaList; -}; -declare const DEFAULT_MEDIA: mediaType; -declare const createBreakpoints: createBreakpointsType; -declare const defaultBreakpoints: ReturnType; - -export { MediaList, DEFAULT_MEDIA, createBreakpoints, defaultBreakpoints }; diff --git a/semcore/base-components/src/components/ellipsis/Ellipsis.ts b/semcore/base-components/src/components/ellipsis/Ellipsis.ts index 2ae83474e7..e8ee12fb1e 100644 --- a/semcore/base-components/src/components/ellipsis/Ellipsis.ts +++ b/semcore/base-components/src/components/ellipsis/Ellipsis.ts @@ -2,7 +2,7 @@ import type { Intergalactic } from '@semcore/core'; import EventEmitter from '@semcore/core/lib/utils/eventEmitter'; import type { CSSProperties } from 'react'; -import type { Events, EllipsisSettings, TruncateOptions } from './Ellipsis.types'; +import type { NSEllipsis } from './Ellipsis.types'; import { ellipsisManager, isSafari } from './EllipsisManager'; import { Scheduler } from './Scheduler'; import { textMeasurer } from './TextMeasurer'; @@ -12,12 +12,12 @@ import { textMeasurer } from './TextMeasurer'; * * {@link https://developer.semrush.com/intergalactic/utils/ellipsis/ellipsis-code|Examples} */ -export class Ellipsis extends EventEmitter { +export class Ellipsis extends EventEmitter { public readonly element: HTMLElement; public readonly containerElement: HTMLElement | undefined; public textContent: string; - private readonly settings: Intergalactic.InternalTypings.PartialRequired; + private readonly settings: Intergalactic.InternalTypings.PartialRequired; public readonly scheduler = new Scheduler(); @@ -29,7 +29,7 @@ export class Ellipsis extends EventEmitter { private requiredTo = -1; private stylesForRequired: CSSProperties | string | null = null; - constructor(element: HTMLElement, props: EllipsisSettings) { + constructor(element: HTMLElement, props: NSEllipsis.Settings) { super(); this.containerElement = props.containerElement; @@ -77,7 +77,7 @@ export class Ellipsis extends EventEmitter { return this.settings.observeChildrenMutations; } - public getTruncateSize(options?: TruncateOptions): [number, number] { + public getTruncateSize(options?: NSEllipsis.TruncateOptions): [number, number] { const text = options?.text ?? this.textContent; const containerWidth = options?.containerWidth ?? this.getContainerWidth(); const font = options?.font ?? this.getFont(); diff --git a/semcore/base-components/src/components/ellipsis/Ellipsis.types.ts b/semcore/base-components/src/components/ellipsis/Ellipsis.types.ts index 089c1b5973..999b29384f 100644 --- a/semcore/base-components/src/components/ellipsis/Ellipsis.types.ts +++ b/semcore/base-components/src/components/ellipsis/Ellipsis.types.ts @@ -1,61 +1,63 @@ -export type CommonEllipsisSettings = { +declare namespace NSEllipsis { + type CommonCropSettings = { /** * Common container element for few ellipsises for improve performance. */ - containerElement?: HTMLElement; + containerElement?: HTMLElement; - /** + /** * Function for crop or increase a container width. For example, for tables with accordion */ - recalculateContainerWidth?: (width: number) => number; + recalculateContainerWidth?: (width: number) => number; - /** + /** * Flag to enable observing changes in cropped texts. * @default false */ - observeChildrenMutations?: boolean; -}; - -export type MiddleCroppedEllipsisSettings = { + observeChildrenMutations?: boolean; + }; + type MiddleCropSettings = { /** * Crop position * @default end */ - cropPosition: 'middle'; + cropPosition: 'middle'; - maxLine?: never; + maxLine?: never; - /** + /** * Count of last symbols which shouldn't be cropped. */ - lastRequiredSymbols?: number; -}; - -export type EndCroppedEllipsisSettings = { + lastRequiredSymbols?: number; + }; + type EndCropSettings = { /** * Crop position * @default end */ - cropPosition?: 'end'; - /** + cropPosition?: 'end'; + /** * Lines count in multiline Ellipsis. * Applies only for `cropPosition = 'end'` * @default 1 */ - maxLine?: number; - - lastRequiredSymbols?: never; -}; - -export type EllipsisSettings = (EndCroppedEllipsisSettings | MiddleCroppedEllipsisSettings) & CommonEllipsisSettings; - -export type Events = { - isEllipsized: (isEllipsized: boolean) => void; -}; - -export type TruncateOptions = { - text?: string; - containerWidth?: number; - font?: string; - direction?: 'start' | 'end'; -}; + maxLine?: number; + + lastRequiredSymbols?: never; + }; + type Settings = (NSEllipsis.EndCropSettings | NSEllipsis.MiddleCropSettings) & CommonCropSettings; + type Events = { + isEllipsized: (isEllipsized: boolean) => void; + }; + type TruncateOptions = { + text?: string; + containerWidth?: number; + font?: string; + direction?: 'start' | 'end'; + }; +} + +/** @deprecated It will be removed in v18. */ +export type EllipsisSettings = NSEllipsis.Settings; + +export type { NSEllipsis }; diff --git a/semcore/base-components/src/components/ellipsis/index.ts b/semcore/base-components/src/components/ellipsis/index.ts index e699493a6c..4ee1d1bda0 100644 --- a/semcore/base-components/src/components/ellipsis/index.ts +++ b/semcore/base-components/src/components/ellipsis/index.ts @@ -1,9 +1,10 @@ import { Ellipsis } from './Ellipsis'; -import type { EllipsisSettings } from './Ellipsis.types'; +import type { EllipsisSettings, NSEllipsis } from './Ellipsis.types'; export { Ellipsis, }; export type { EllipsisSettings, + NSEllipsis, }; diff --git a/semcore/base-components/src/components/flex-box/Box/index.tsx b/semcore/base-components/src/components/flex-box/Box/Box.tsx similarity index 63% rename from semcore/base-components/src/components/flex-box/Box/index.tsx rename to semcore/base-components/src/components/flex-box/Box/Box.tsx index dc8b89d3e9..67aff54e84 100644 --- a/semcore/base-components/src/components/flex-box/Box/index.tsx +++ b/semcore/base-components/src/components/flex-box/Box/Box.tsx @@ -1,9 +1,10 @@ import { createBaseComponent, type Intergalactic } from '@semcore/core'; import React from 'react'; -import useBox, { type BoxProps } from './useBox'; +import type { NSBox } from './Box.type'; +import useBox from './useBox'; -function Box(props: BoxProps, ref: React.Ref) { +function Box(props: Intergalactic.InternalTypings.InferComponentProps, ref: React.Ref) { const [Tag, boxProps] = useBox(props, ref); if (Array.isArray(Tag)) { const [FirstTag, htmlTag] = Tag; @@ -15,11 +16,9 @@ function Box(props: BoxProps, ref: React.Ref) { Box.displayName = 'Box'; -type BoxComponent = Intergalactic.Component<'div', BoxProps>; - /** * Box * * {@link https://developer.semrush.com/intergalactic/layout/box-system/box-system-api|API} */ -export default createBaseComponent(Box); +export default createBaseComponent(Box); diff --git a/semcore/base-components/src/components/flex-box/Box/Box.type.ts b/semcore/base-components/src/components/flex-box/Box/Box.type.ts new file mode 100644 index 0000000000..9cdd11bc17 --- /dev/null +++ b/semcore/base-components/src/components/flex-box/Box/Box.type.ts @@ -0,0 +1,198 @@ +import type { Intergalactic, IStyledProps } from '@semcore/core'; +import type { Theme, BasicColorKeys, SemanticColorKeys } from '@semcore/theme'; +import type { Property } from 'csstype'; +import type React from 'react'; + +type BorderRadius = `${keyof Theme['semanticTokens']['radii']}-rounded`; + +declare namespace NSBox { + type Props = IStyledProps & { + /** + * HTML class name attribute + */ + className?: string; + /** + * HTML style attribute + */ + style?: React.CSSProperties; + /** + * CSS `display` property + */ + display?: Property.Display; + + /** Sets the `inline-block` property */ + inline?: boolean; + + /** CSS `box-sizing: border-box` property */ + boxSizing?: boolean | 'border-box'; + + /** CSS `flex` property */ + flex?: Property.Flex; + + /** CSS `margin` property */ + m?: number | string; + + /** CSS `margin-top` property */ + mt?: number | string; + + /** CSS `margin-right` property */ + mr?: number | string; + + /** CSS `margin-bottom` property */ + mb?: number | string; + + /** CSS `margin-left` property */ + ml?: number | string; + + /** CSS `margin-left` and `margin-right` property */ + mx?: number | string; + + /** CSS `margin-top` and `margin-bottom` property */ + my?: number | string; + + /** CSS `padding` property */ + p?: number | string; + + /** CSS `padding-top` property */ + pt?: number | string; + + /** CSS `padding-right` property */ + pr?: number | string; + + /** CSS `padding-bottom` property */ + pb?: number | string; + + /** CSS `padding-left` property */ + pl?: number | string; + + /** CSS `padding-left` and `padding-right` property */ + px?: number | string; + + /** CSS `padding-top` and `padding-bottom` property */ + py?: number | string; + + /** + * CSS `width` property. + * If its value is less than 1, is considered as a fraction of 100%. + * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. + */ + w?: number | string; + + /** + * CSS `min-width` property. + * If its value is less than 1, is considered as a fraction of 100%. + * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. + */ + wMin?: number | string; + + /** + * CSS `max-width` property. + * If its value is less than 1, is considered as a fraction of 100%. + * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. + */ + wMax?: number | string; + + /** + * CSS `height` property. + * If its value is less than 1, is considered as a fraction of 100%. + * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. + */ + h?: number | string; + + /** + * CSS `min-height` property. + * If its value is less than 1, is considered as a fraction of 100%. + * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. + */ + hMin?: number | string; + + /** + * CSS `max-height` property. + * If its value is less than 1, is considered as a fraction of 100%. + * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. + */ + hMax?: number | string; + + /** + * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12). + * @default 4 + */ + scaleIndent?: number; + + /** + * Flag for render outline inside box + * @default false + */ + innerOutline?: boolean; + + /** + * Flag for render inverted outline + * @default false + */ + invertOutline?: boolean; + + /** + * Flag for render outline in the ::after element + * @default false + */ + inAfterOutline?: boolean; + /** CSS `position` property */ + position?: Property.Position; + /** CSS `top` property */ + top?: number | string; + /** CSS `left` property */ + left?: number | string; + /** CSS `bottom` property */ + bottom?: number | string; + /** CSS `right` property */ + right?: number | string; + /** CSS `inset` property */ + inset?: string; + /** CSS `z-index` property */ + zIndex?: number; + /** CSS `text-align` property */ + textAlign?: Property.TextAlign; + /** Box content */ + children?: React.ReactNode; + /** Hover cursor */ + hoverCursor?: Property.Cursor; + /** Css `background` property */ + bg?: Property.Background | BasicColorKeys | SemanticColorKeys; + /** Css `border-radius` property */ + borderRadius?: Property.BorderRadius | BorderRadius; + /** Css `border` property */ + border?: Property.Border; + /** Css `resize` property */ + resize?: Property.Resize; + /** Css `overflow` property */ + overflow?: Property.Overflow; + /** + * Old way to add custom style + * @deprecated + */ + css?: any; + /** + * Focus ring offset (top) + */ + focusRingTopOffset?: Property.Top; + /** + * Focus ring offset (left) + */ + focusRingLeftOffset?: Property.Left; + /** + * Focus ring offset (right) + */ + focusRingRightOffset?: Property.Right; + /** + * Focus ring offset (bottom) + */ + focusRingBottomOffset?: Property.Bottom; + }; + + type Component = Intergalactic.Component<'div', Props>; +} + +/** @deprecated It will be removed in v18. */ +export type BoxProps = NSBox.Props; + +export type { NSBox }; diff --git a/semcore/base-components/src/components/flex-box/Box/useBox.tsx b/semcore/base-components/src/components/flex-box/Box/useBox.tsx index 74bf07f838..9252fedf4a 100644 --- a/semcore/base-components/src/components/flex-box/Box/useBox.tsx +++ b/semcore/base-components/src/components/flex-box/Box/useBox.tsx @@ -1,204 +1,16 @@ -import type { Intergalactic, UnknownProperties, IStyledProps } from '@semcore/core'; +import type { Intergalactic } from '@semcore/core'; import { sstyled } from '@semcore/core'; import { getAutoOrScaleIndent, removeUndefinedKeys, getSize } from '@semcore/core/lib/utils/indentStyles'; import propsForElement from '@semcore/core/lib/utils/propsForElement'; import { useColorResolver } from '@semcore/core/lib/utils/use/useColorResolver'; -import type { Theme, BasicColorKeys, SemanticColorKeys } from '@semcore/theme'; import cn from 'classnames'; -import type { Properties, Property } from 'csstype'; +import type { Properties } from 'csstype'; import React from 'react'; +import type { NSBox } from './Box.type'; import style from '../style/use-box.shadow.css'; -type BorderRadius = `${keyof Theme['semanticTokens']['radii']}-rounded`; - -export type BoxProps = IStyledProps & { - /** - * HTML class name attribute - */ - className?: string; - /** - * HTML style attribute - */ - style?: React.CSSProperties; - /** - * CSS `display` property - */ - display?: Property.Display; - - /** Sets the `inline-block` property */ - inline?: boolean; - - /** CSS `box-sizing: border-box` property */ - boxSizing?: boolean | 'border-box'; - - /** CSS `flex` property */ - flex?: Property.Flex; - - /** CSS `margin` property */ - m?: number | string; - - /** CSS `margin-top` property */ - mt?: number | string; - - /** CSS `margin-right` property */ - mr?: number | string; - - /** CSS `margin-bottom` property */ - mb?: number | string; - - /** CSS `margin-left` property */ - ml?: number | string; - - /** CSS `margin-left` and `margin-right` property */ - mx?: number | string; - - /** CSS `margin-top` and `margin-bottom` property */ - my?: number | string; - - /** CSS `padding` property */ - p?: number | string; - - /** CSS `padding-top` property */ - pt?: number | string; - - /** CSS `padding-right` property */ - pr?: number | string; - - /** CSS `padding-bottom` property */ - pb?: number | string; - - /** CSS `padding-left` property */ - pl?: number | string; - - /** CSS `padding-left` and `padding-right` property */ - px?: number | string; - - /** CSS `padding-top` and `padding-bottom` property */ - py?: number | string; - - /** - * CSS `width` property. - * If its value is less than 1, is considered as a fraction of 100%. - * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. - */ - w?: number | string; - - /** - * CSS `min-width` property. - * If its value is less than 1, is considered as a fraction of 100%. - * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. - */ - wMin?: number | string; - - /** - * CSS `max-width` property. - * If its value is less than 1, is considered as a fraction of 100%. - * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. - */ - wMax?: number | string; - - /** - * CSS `height` property. - * If its value is less than 1, is considered as a fraction of 100%. - * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. - */ - h?: number | string; - - /** - * CSS `min-height` property. - * If its value is less than 1, is considered as a fraction of 100%. - * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. - */ - hMin?: number | string; - - /** - * CSS `max-height` property. - * If its value is less than 1, is considered as a fraction of 100%. - * If its value is more than 1, is considered as value in px, if it is a string, is passed as is. - */ - hMax?: number | string; - - /** - * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12). - * @default 4 - */ - scaleIndent?: number; - - /** - * Flag for render outline inside box - * @default false - */ - innerOutline?: boolean; - - /** - * Flag for render inverted outline - * @default false - */ - invertOutline?: boolean; - - /** - * Flag for render outline in the ::after element - * @default false - */ - inAfterOutline?: boolean; - /** CSS `position` property */ - position?: Property.Position; - /** CSS `top` property */ - top?: number | string; - /** CSS `left` property */ - left?: number | string; - /** CSS `bottom` property */ - bottom?: number | string; - /** CSS `right` property */ - right?: number | string; - /** CSS `inset` property */ - inset?: string; - /** CSS `z-index` property */ - zIndex?: number; - /** CSS `text-align` property */ - textAlign?: Property.TextAlign; - /** Box content */ - children?: React.ReactNode; - /** Hover cursor */ - hoverCursor?: Property.Cursor; - /** Css `background` property */ - bg?: Property.Background | BasicColorKeys | SemanticColorKeys; - /** Css `border-radius` property */ - borderRadius?: Property.BorderRadius | BorderRadius; - /** Css `border` property */ - border?: Property.Border; - /** Css `resize` property */ - resize?: Property.Resize; - /** Css `overflow` property */ - overflow?: Property.Overflow; - /** - * Old way to add custom style - * @deprecated - */ - css?: any; - /** - * Focus ring offset (top) - */ - focusRingTopOffset?: Property.Top; - /** - * Focus ring offset (left) - */ - focusRingLeftOffset?: Property.Left; - /** - * Focus ring offset (right) - */ - focusRingRightOffset?: Property.Right; - /** - * Focus ring offset (bottom) - */ - focusRingBottomOffset?: Property.Bottom; -}; - -/** @deprecated */ -export interface IBoxProps extends BoxProps, UnknownProperties {} - -function calculateIndentStyles(props: BoxProps, scaleIndent: number, colorResolver: (color: string) => string) { +function calculateIndentStyles(props: Intergalactic.InternalTypings.InferComponentProps, scaleIndent: number, colorResolver: (color: string) => string) { return removeUndefinedKeys({ display: props['display'], width: getSize(props['w']), @@ -253,7 +65,7 @@ function calculateIndentStyles(props: BoxProps, scaleIndent: number, colorResolv }); } -export default function useBox( +export default function useBox & { tag?: Intergalactic.Tag }>( props: T, ref: React.Ref, ): [React.ElementType | string, any] { diff --git a/semcore/base-components/src/components/flex-box/Flex/index.tsx b/semcore/base-components/src/components/flex-box/Flex/Flex.tsx similarity index 55% rename from semcore/base-components/src/components/flex-box/Flex/index.tsx rename to semcore/base-components/src/components/flex-box/Flex/Flex.tsx index 66c2aa9cca..257b20328c 100644 --- a/semcore/base-components/src/components/flex-box/Flex/index.tsx +++ b/semcore/base-components/src/components/flex-box/Flex/Flex.tsx @@ -1,20 +1,19 @@ import { createBaseComponent, type Intergalactic } from '@semcore/core'; import React from 'react'; -import useFlex, { type FlexProps } from './useFlex'; +import type { NSFlex } from './Flex.type'; +import useFlex from './useFlex'; -function Flex(props: any, ref: any) { +function Flex(props: Intergalactic.InternalTypings.InferComponentProps, ref: React.Ref) { const [Tag, flexProps] = useFlex(props, ref); return ; } Flex.displayName = 'Flex'; -type FlexComponent = Intergalactic.Component<'div', FlexProps>; - /** * Flex * * {@link https://developer.semrush.com/intergalactic/layout/box-system/box-system-api|API} */ -export default createBaseComponent(Flex); +export default createBaseComponent(Flex); diff --git a/semcore/base-components/src/components/flex-box/Flex/Flex.type.ts b/semcore/base-components/src/components/flex-box/Flex/Flex.type.ts new file mode 100644 index 0000000000..e1af1b0826 --- /dev/null +++ b/semcore/base-components/src/components/flex-box/Flex/Flex.type.ts @@ -0,0 +1,62 @@ +import type { Intergalactic } from '@semcore/core'; +import type { Property } from 'csstype'; + +import type { NSBox } from '../Box/Box.type'; + +declare namespace NSFlex { + type Props = NSBox.Props & { + /** + * It manages the `inline-flex` property + */ + inline?: boolean; + /** + * Adds the `reverse` property to `flex-direction` + */ + reverse?: boolean; + /** + * It manages the `flex-wrap` property + */ + flexWrap?: boolean; + /** + * It manages the `flex-direction` property + */ + direction?: Property.FlexDirection; + /** + * It manages the `align-items` property + */ + alignItems?: Property.AlignItems; + /** + * It manages the `align-content` property + */ + alignContent?: Property.AlignContent; + /** + * CSS `justify-content` property + */ + justifyContent?: Property.JustifyContent; + /** + * CSS `gap` property + */ + gap?: Property.Gap; + /** + * CSS `gap` property + */ + rowGap?: Property.RowGap; + /** + * CSS `gap` property + */ + columnGap?: Property.ColumnGap; + + /** + * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12). + * @default 4 + */ + scaleIndent?: number; + }; + + type Component = Intergalactic.Component<'div', Props>; +} + +/** @deprecated It will be removed in v18. */ +export type FlexProps = NSFlex.Props; + +export type { NSFlex }; diff --git a/semcore/base-components/src/components/flex-box/Flex/useFlex.tsx b/semcore/base-components/src/components/flex-box/Flex/useFlex.tsx index 85c04ef4fc..06a2329a78 100644 --- a/semcore/base-components/src/components/flex-box/Flex/useFlex.tsx +++ b/semcore/base-components/src/components/flex-box/Flex/useFlex.tsx @@ -1,62 +1,15 @@ import { sstyled } from '@semcore/core'; +import type { Intergalactic } from '@semcore/core'; import { getAutoOrScaleIndent, removeUndefinedKeys } from '@semcore/core/lib/utils/indentStyles'; import cn from 'classnames'; -import type { Property, Properties } from 'csstype'; +import type { Properties } from 'csstype'; import React from 'react'; -import useBox, { type BoxProps } from '../Box/useBox'; +import type { NSFlex } from './Flex.type'; +import useBox from '../Box/useBox'; import style from '../style/use-flex.shadow.css'; -export type FlexProps = BoxProps & { - /** - * It manages the `inline-flex` property - */ - inline?: boolean; - /** - * Adds the `reverse` property to `flex-direction` - */ - reverse?: boolean; - /** - * It manages the `flex-wrap` property - */ - flexWrap?: boolean; - /** - * It manages the `flex-direction` property - */ - direction?: Property.FlexDirection; - /** - * It manages the `align-items` property - */ - alignItems?: Property.AlignItems; - /** - * It manages the `align-content` property - */ - alignContent?: Property.AlignContent; - /** - * CSS `justify-content` property - */ - justifyContent?: Property.JustifyContent; - /** - * CSS `gap` property - */ - gap?: Property.Gap; - /** - * CSS `gap` property - */ - rowGap?: Property.RowGap; - /** - * CSS `gap` property - */ - columnGap?: Property.ColumnGap; - - /** - * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12). - * @default 4 - */ - scaleIndent?: number; -}; - -function calculateFlexStyles(props: any) { +function calculateFlexStyles(props: Intergalactic.InternalTypings.InferComponentProps) { const DirectionReverse: Record = { row: 'row-reverse', column: 'column-reverse', @@ -69,13 +22,13 @@ function calculateFlexStyles(props: any) { alignContent: props.alignContent, justifyContent: props.justifyContent, flexWrap: props.flexWrap ? `wrap${props.reverse ? '-reverse' : ''}` : undefined, - flexDirection: (props.reverse && DirectionReverse[props.direction]) || props.direction, + flexDirection: props.direction ? (props.reverse && DirectionReverse[props.direction]) || props.direction : undefined, rowGap: getAutoOrScaleIndent(props.rowGap || props.gap, scaleIndent), columnGap: getAutoOrScaleIndent(props.columnGap || props.gap, scaleIndent), }); } -export default function useFlex( +export default function useFlex>( props: T, ref: React.Ref, ): [React.ElementType | string, any] { diff --git a/semcore/base-components/src/components/flex-box/index.tsx b/semcore/base-components/src/components/flex-box/index.tsx index b424eeaabc..b3fdd56443 100644 --- a/semcore/base-components/src/components/flex-box/index.tsx +++ b/semcore/base-components/src/components/flex-box/index.tsx @@ -1,9 +1,10 @@ -export { default as Box } from './Box'; +export { default as Box } from './Box/Box'; export { default as useBox } from './Box/useBox'; -export * from './Box/useBox'; -export { default as Flex } from './Flex'; +export * from './Box/Box.type'; + +export { default as Flex } from './Flex/Flex'; export { default as useFlex } from './Flex/useFlex'; -export * from './Flex/useFlex'; +export * from './Flex/Flex.type'; export { InvalidStateBox } from './invalid-state-box/InvalidStateBox'; export { ScreenReaderOnly } from './screen-reader-only-box/ScreenReaderOnlyBox'; diff --git a/semcore/base-components/src/components/flex-box/invalid-state-box/InvalidStateBox.tsx b/semcore/base-components/src/components/flex-box/invalid-state-box/InvalidStateBox.tsx index 175e67995a..1bf3a5501d 100644 --- a/semcore/base-components/src/components/flex-box/invalid-state-box/InvalidStateBox.tsx +++ b/semcore/base-components/src/components/flex-box/invalid-state-box/InvalidStateBox.tsx @@ -2,9 +2,8 @@ import { createComponent, sstyled, Root } from '@semcore/core'; import React from 'react'; import style from './invalidStateBox.shadow.css'; -import Box from '../Box'; - -type InvalidStatePatternComponent = typeof Box; +import type { NSInvalidStateBox } from './InvalidStateBox.type'; +import Box from '../Box/Box'; function InvalidStatePatternRoot() { const SPattern = Root; @@ -13,7 +12,7 @@ function InvalidStatePatternRoot() { }; export const InvalidStateBox = createComponent< - InvalidStatePatternComponent, + NSInvalidStateBox.Component, typeof InvalidStatePatternRoot >(InvalidStatePatternRoot); diff --git a/semcore/base-components/src/components/flex-box/invalid-state-box/InvalidStateBox.type.ts b/semcore/base-components/src/components/flex-box/invalid-state-box/InvalidStateBox.type.ts new file mode 100644 index 0000000000..7150979d30 --- /dev/null +++ b/semcore/base-components/src/components/flex-box/invalid-state-box/InvalidStateBox.type.ts @@ -0,0 +1,7 @@ +import type { NSBox } from '../Box/Box.type'; + +declare namespace NSInvalidStateBox { + type Component = NSBox.Component; +} + +export type { NSInvalidStateBox }; diff --git a/semcore/base-components/src/components/flex-box/screen-reader-only-box/ScreenReaderOnlyBox.tsx b/semcore/base-components/src/components/flex-box/screen-reader-only-box/ScreenReaderOnlyBox.tsx index 1ff2358845..5c7f191cb4 100644 --- a/semcore/base-components/src/components/flex-box/screen-reader-only-box/ScreenReaderOnlyBox.tsx +++ b/semcore/base-components/src/components/flex-box/screen-reader-only-box/ScreenReaderOnlyBox.tsx @@ -1,17 +1,15 @@ -import { createComponent, sstyled, Root, type Intergalactic } from '@semcore/core'; +import type { Intergalactic } from '@semcore/core'; +import { createComponent, sstyled, Root } from '@semcore/core'; import React from 'react'; import style from './screenReaderOnlyBox.shadow.css'; -import Box from '../Box'; +import type { NSScreenReaderOnly } from './ScreenReaderOnlyBox.type'; +import Box from '../Box/Box'; -type SROnlyType = { - ariaLive?: boolean; - children?: React.ReactNode; -}; - -function ScreenReaderOnlyComponent(props: SROnlyType) { +function ScreenReaderOnlyComponent(props: Intergalactic.InternalTypings.InferComponentProps) { const SScreenReaderOnly = Root; - const { ariaLive, children } = props; + // have to cast it to component's props since children type is mixed with `Component`'s types. + const { ariaLive, children } = props as NSScreenReaderOnly.Props; const [content, setContent] = React.useState(ariaLive ? null : children); React.useEffect(() => { @@ -41,10 +39,8 @@ function ScreenReaderOnlyComponent(props: SROnlyType) { ); }; -type ScreenReaderOnlyType = Intergalactic.Component<'span', SROnlyType>; - export const ScreenReaderOnly = createComponent< - ScreenReaderOnlyType, + NSScreenReaderOnly.Component, typeof ScreenReaderOnlyComponent >(ScreenReaderOnlyComponent); diff --git a/semcore/base-components/src/components/flex-box/screen-reader-only-box/ScreenReaderOnlyBox.type.ts b/semcore/base-components/src/components/flex-box/screen-reader-only-box/ScreenReaderOnlyBox.type.ts new file mode 100644 index 0000000000..3640dcd07c --- /dev/null +++ b/semcore/base-components/src/components/flex-box/screen-reader-only-box/ScreenReaderOnlyBox.type.ts @@ -0,0 +1,12 @@ +import type { Intergalactic } from '@semcore/core'; + +declare namespace NSScreenReaderOnly { + type Props = { + ariaLive?: boolean; + children?: React.ReactNode; + }; + + type Component = Intergalactic.Component<'span', Props>; +} + +export type { NSScreenReaderOnly }; diff --git a/semcore/base-components/src/components/grid/Grid.tsx b/semcore/base-components/src/components/grid/Grid.tsx index b2c2a130b8..2f12444536 100644 --- a/semcore/base-components/src/components/grid/Grid.tsx +++ b/semcore/base-components/src/components/grid/Grid.tsx @@ -1,17 +1,18 @@ +import type { Intergalactic } from '@semcore/core'; import { createComponent, Component, Root, sstyled } from '@semcore/core'; import React from 'react'; import { Box, Flex } from '../flex-box'; -import type { RowProps, ColProps, RowType, GridContext, RowDefaultProps } from './Grid.types'; +import type { NSGrid } from './Grid.type'; import style from './style/grid.shadow.css'; class RowRoot extends Component< - RowProps, + Intergalactic.InternalTypings.InferComponentProps, [], {}, - GridContext, {}, - RowDefaultProps + {}, + NSGrid.DefaultProps > { static displayName = 'Row'; static style = style; @@ -35,7 +36,9 @@ class RowRoot extends Component< const excludeProps = ['span']; -function Col(props: ColProps) { +function Col( + props: Intergalactic.InternalTypings.InferChildComponentProps, +) { const SCol = Root; const { styles, gutter } = props; let { span, md, sm, xs, offset, mdOffset, smOffset, xsOffset } = props; @@ -76,7 +79,7 @@ function Col(props: ColProps) { } const Row = createComponent< - RowType, + NSGrid.Component, typeof RowRoot >(RowRoot, { Col }); diff --git a/semcore/base-components/src/components/grid/Grid.type.ts b/semcore/base-components/src/components/grid/Grid.type.ts new file mode 100644 index 0000000000..1dd082b786 --- /dev/null +++ b/semcore/base-components/src/components/grid/Grid.type.ts @@ -0,0 +1,61 @@ +import type { PropGetterFn, Intergalactic } from '@semcore/core'; + +import type { NSBox, NSFlex } from '../flex-box'; + +declare namespace NSGrid { + type Props = NSFlex.Props & { + /** + * Gutter between columns + * @default 0 + */ + gutter?: number; + }; + type DefaultProps = { + gutter: 0; + }; + type Ctx = { + getColProps: PropGetterFn; + }; + + namespace Col { + type Props = NSBox.Props & { + /** Column size */ + span?: number | boolean | Array; + /** Column size on device with 1184px screen width and less */ + md?: number | boolean; + /** Column width on device with 768px screen width and less */ + sm?: number | boolean; + /** Column width on device with 414px screen width and less */ + xs?: number | boolean; + /** Column offset, specified in the number of columns */ + offset?: number | Array; + /** Column offset on device with 1184px screen width and less */ + mdOffset?: number; + /** Column offset on device with 768px screen width and less */ + smOffset?: number; + /** Column offset on device with 414px screen width and less */ + xsOffset?: number; + /** Column gutter, determined from Row */ + gutter?: number; + }; + + type Component = Intergalactic.Component<'div', Props, NSGrid.Props>; + } + + type Component = Intergalactic.Component<'div', Props, Ctx> & { + Col: Col.Component; + }; +} + +/** @deprecated It will be removed in v18. */ +export type ColProps = NSGrid.Col.Props; +/** @deprecated It will be removed in v18. */ +export type RowProps = NSGrid.Props; +/** @deprecated It will be removed in v18. */ +export type RowDefaultProps = NSGrid.DefaultProps; +/** @deprecated It will be removed in v18. */ +export type GridContext = NSGrid.Ctx; +/** @deprecated It will be removed in v18. */ +export type RowType = NSGrid.Component; + +export type { NSGrid }; diff --git a/semcore/base-components/src/components/grid/Grid.types.ts b/semcore/base-components/src/components/grid/Grid.types.ts deleted file mode 100644 index ffd5f0db06..0000000000 --- a/semcore/base-components/src/components/grid/Grid.types.ts +++ /dev/null @@ -1,44 +0,0 @@ -import type { PropGetterFn, Intergalactic } from '@semcore/core'; - -import type { BoxProps, FlexProps } from '../flex-box'; - -export type ColProps = BoxProps & { - /** Column size */ - span?: number | boolean | Array; - /** Column size on device with 1184px screen width and less */ - md?: number | boolean; - /** Column width on device with 768px screen width and less */ - sm?: number | boolean; - /** Column width on device with 414px screen width and less */ - xs?: number | boolean; - /** Column offset, specified in the number of columns */ - offset?: number | Array; - /** Column offset on device with 1184px screen width and less */ - mdOffset?: number; - /** Column offset on device with 768px screen width and less */ - smOffset?: number; - /** Column offset on device with 414px screen width and less */ - xsOffset?: number; - /** Column gutter, determined from Row */ - gutter?: number; -}; - -export type RowProps = FlexProps & { - /** - * Gutter between columns - * @default 0 - */ - gutter?: number; -}; - -export type RowDefaultProps = { - gutter: 0; -}; - -export type GridContext = { - getColProps: PropGetterFn; -}; - -export type RowType = Intergalactic.Component<'div', RowProps, GridContext> & { - Col: Intergalactic.Component<'div', ColProps, RowProps>; -}; diff --git a/semcore/base-components/src/components/hint/Hint.tsx b/semcore/base-components/src/components/hint/Hint.tsx index 9314f96055..6304fb1f62 100644 --- a/semcore/base-components/src/components/hint/Hint.tsx +++ b/semcore/base-components/src/components/hint/Hint.tsx @@ -1,75 +1,19 @@ import { computePosition, flip, offset, shift, type Placement } from '@floating-ui/dom'; -import { createComponent, Root, sstyled, Component, lastInteraction } from '@semcore/core'; import type { Intergalactic } from '@semcore/core'; +import { createComponent, Root, sstyled, Component, lastInteraction } from '@semcore/core'; import canUseDOM from '@semcore/core/lib/utils/canUseDOM'; import { getAccessibleName } from '@semcore/core/lib/utils/getAccessibleName'; import { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable'; import { zIndexStackingEnhance } from '@semcore/core/lib/utils/zIndexStacking'; -import type { DataType } from 'csstype'; import React from 'react'; import { Middleware } from './Middleware'; import keyframes from '../animation/style/keyframes.shadow.css'; import { Box } from '../flex-box'; import { Portal } from '../portal'; +import type { NSHint } from './Hint.type'; import styles from './style/hint.shadow.css'; -type Handlers = { - visible: null; -}; - -export type SimpleHintPopperProps = { - /** Ref to the trigger element */ - triggerRef: React.RefObject; - /** - * The position of the popper relative to the trigger that called it. - * @default top - */ - placement?: Placement; - /** - * Timer to show and hide the popper - * @default [500, 500] - */ - timeout?: DefaultProps['timeout']; - /** - * Hint content. - * Better to use here some short text. - * */ - children: React.ReactNode; - - /** Popper visibility value */ - visible?: boolean; - /** Default popper visibility - * @default false */ - defaultVisible?: boolean; - /** Function called when visibility changes */ - onVisibleChange?: (visible: boolean, e?: Event) => boolean | void; - /** - * Set ignore for portal stacking - * @default true - */ - ignorePortalsStacking?: boolean; -}; - -type InnerProps = { - timingFunction: DataType.EasingFunction; -}; - -type DefaultProps = { - defaultVisible?: boolean; - timeout: number | [number, number]; - timingFunction: DataType.EasingFunction; - placement?: Placement; - ignorePortalsStacking?: boolean; -}; - -type State = { - innerVisible: boolean | null; - calculatedPlacement?: Placement; -}; - -type SimpleHintPopperComponent = Intergalactic.Component<'div', SimpleHintPopperProps>; - const enhances = [ zIndexStackingEnhance('z-index-tooltip'), cssVariableEnhance({ @@ -99,12 +43,12 @@ function propToArray(prop: number | [number, number]): [number, number] { const keyframesMap = new Map(); class HintPopperRoot extends Component< - SimpleHintPopperProps, + Intergalactic.InternalTypings.InferComponentProps, typeof enhances, - Handlers, - InnerProps, - State, - DefaultProps + NSHint.Handlers, + NSHint.InnerProps, + NSHint.State, + NSHint.DefaultProps > { public readonly hintRef = React.createRef(); @@ -115,7 +59,7 @@ class HintPopperRoot extends Component< static enhance = enhances; - static defaultProps: DefaultProps = { + static defaultProps: NSHint.DefaultProps = { defaultVisible: false, timeout: [500, 500], timingFunction: 'ease-out', @@ -123,7 +67,7 @@ class HintPopperRoot extends Component< ignorePortalsStacking: true, }; - constructor(props: SimpleHintPopperProps) { + constructor(props: NSHint.Props) { super(props); this.handleFocus = this.handleFocus.bind(this); @@ -161,7 +105,7 @@ class HintPopperRoot extends Component< } } - componentDidUpdate(prevProps: SimpleHintPopperProps) { + componentDidUpdate(prevProps: typeof this.asProps) { if (prevProps.visible !== this.props.visible) { requestAnimationFrame(() => { const trigger = this.props.triggerRef.current; @@ -387,6 +331,6 @@ class HintPopperRoot extends Component< * {@link https://developer.semrush.com/intergalactic/utils/hint/hint-api|API} | {@link https://developer.semrush.com/intergalactic/utils/hint/hint-code|Examples} */ export const Hint = createComponent< - SimpleHintPopperComponent, + NSHint.Component, typeof HintPopperRoot >(HintPopperRoot); diff --git a/semcore/base-components/src/components/hint/Hint.type.ts b/semcore/base-components/src/components/hint/Hint.type.ts new file mode 100644 index 0000000000..b8bb3817a7 --- /dev/null +++ b/semcore/base-components/src/components/hint/Hint.type.ts @@ -0,0 +1,63 @@ +import { type Placement } from '@floating-ui/dom'; +import type { Intergalactic } from '@semcore/core'; +import type { DataType } from 'csstype'; +import type React from 'react'; + +declare namespace NSHint { + type Props = { + /** Ref to the trigger element */ + triggerRef: React.RefObject; + /** + * The position of the popper relative to the trigger that called it. + * @default top + */ + placement?: Placement; + /** + * Timer to show and hide the popper + * @default [500, 500] + */ + timeout?: DefaultProps['timeout']; + /** + * Hint content. + * Better to use here some short text. + * */ + children: React.ReactNode; + + /** Popper visibility value */ + visible?: boolean; + /** Default popper visibility + * @default false */ + defaultVisible?: boolean; + /** Function called when visibility changes */ + onVisibleChange?: (visible: boolean, e?: Event) => boolean | void; + /** + * Set ignore for portal stacking + * @default true + */ + ignorePortalsStacking?: boolean; + }; + type InnerProps = { + timingFunction: DataType.EasingFunction; + }; + type DefaultProps = { + defaultVisible?: boolean; + timeout: number | [number, number]; + timingFunction: DataType.EasingFunction; + placement?: Placement; + ignorePortalsStacking?: boolean; + }; + type State = { + innerVisible: boolean | null; + calculatedPlacement?: Placement; + }; + type Handlers = { + visible: null; + }; + + type Component = Intergalactic.Component<'div', Props>; +} + +/** @deprecated It will be removed in v18. */ +export type SimpleHintPopperProps = NSHint.Props; + +export type { NSHint }; diff --git a/semcore/base-components/src/components/hint/index.ts b/semcore/base-components/src/components/hint/index.ts index 58dae3a55b..5e33b6f767 100644 --- a/semcore/base-components/src/components/hint/index.ts +++ b/semcore/base-components/src/components/hint/index.ts @@ -1,7 +1,8 @@ import { Hint } from './Hint'; -import type { SimpleHintPopperProps } from './Hint'; +import type { SimpleHintPopperProps, NSHint } from './Hint.type'; export { Hint }; export type { SimpleHintPopperProps, + NSHint, }; diff --git a/semcore/base-components/src/components/neighbor-location/NeighborLocation.tsx b/semcore/base-components/src/components/neighbor-location/NeighborLocation.tsx index 4877278c92..9a0cc60652 100644 --- a/semcore/base-components/src/components/neighbor-location/NeighborLocation.tsx +++ b/semcore/base-components/src/components/neighbor-location/NeighborLocation.tsx @@ -1,15 +1,10 @@ +import type { Intergalactic } from '@semcore/core'; import { createComponent, Component, Root, register } from '@semcore/core'; import getOriginChildren from '@semcore/core/lib/utils/getOriginChildren'; import isNode from '@semcore/core/lib/utils/isNode'; import React from 'react'; -import type { - NeighborItemProps, - NeighborLocationUnion, - NeighborLocationDetectProps, - NeighborLocationProps, - NeighborLocation as NeighborLocationType, -} from './NeighborLocation.types'; +import type { NSNeighborLocation } from './NeighborLocation.type'; const Context = register.get( 'neighbor-location-context', @@ -31,9 +26,9 @@ function childrenWithoutFragment(children: React.ReactNode) { function calculateNeighborLocation( length: number, i: number, -): NeighborItemProps['neighborLocation'] { +): NSNeighborLocation.Detect.Props['neighborLocation'] { // default state - let neighborLocation: NeighborLocationUnion = 'both'; + let neighborLocation: NSNeighborLocation.Union = 'both'; // if one child if (length === 1) { return undefined; @@ -49,13 +44,18 @@ function calculateNeighborLocation( return neighborLocation; } -export class NeighborLocationRoot extends Component { +export class NeighborLocationRoot extends Component< + Intergalactic.InternalTypings.InferComponentProps, + [], + {}, + typeof Context +> { static displayName = 'NeighborLocation'; controlsLengthRef = React.createRef() as React.MutableRefObject; cacheChild = new Map(); - calculateNeighborLocation(controlsLength = 0, component = undefined) { + calculateNeighborLocation(controlsLength = 0, component: React.Component | undefined = undefined) { // for not re-render component if (!this.cacheChild.has(component)) { const neighborLocation = calculateNeighborLocation(controlsLength, this.cacheChild.size); @@ -99,7 +99,9 @@ export class NeighborLocationRoot extends Component { +class Detect extends Component< + Intergalactic.InternalTypings.InferChildComponentProps +> { render() { const { children, neighborLocation: selfNeighborLocation, getNeighborLocation } = this.asProps; const calculateNeighborLocation = getNeighborLocation ? getNeighborLocation(this) : undefined; @@ -129,7 +131,7 @@ function useNeighborLocationDetect(index: number) { * {@link https://developer.semrush.com/intergalactic/utils/neighbor-location/neighbor-location-api|API} */ export const NeighborLocation = createComponent< - typeof NeighborLocationType, + NSNeighborLocation.Component, typeof NeighborLocationRoot >( NeighborLocationRoot, diff --git a/semcore/base-components/src/components/neighbor-location/NeighborLocation.type.ts b/semcore/base-components/src/components/neighbor-location/NeighborLocation.type.ts new file mode 100644 index 0000000000..5d77410bdc --- /dev/null +++ b/semcore/base-components/src/components/neighbor-location/NeighborLocation.type.ts @@ -0,0 +1,31 @@ +import type { Intergalactic } from '@semcore/core'; + +declare namespace NSNeighborLocation { + type Union = 'right' | 'both' | 'left'; + type Props = { + /** Number of elements in a group */ + controlsLength?: number; + }; + + namespace Detect { + type Props = { + /** Determines from which side the component has neighbors */ + neighborLocation?: NeighborLocationUnion | false; + }; + + type Component = Intergalactic.Component<'div', Props, 'right' | 'both' | 'left' | undefined>; + } + + type Component = Intergalactic.Component<'div', Props> & { + Detect: Detect.Component; + }; +} + +/** @deprecated It will be removed in v18. */ +export type NeighborLocationUnion = NSNeighborLocation.Union; +/** @deprecated It will be removed in v18. */ +export type NeighborLocationProps = NSNeighborLocation.Props; +/** @deprecated It will be removed in v18. */ +export type NeighborItemProps = NSNeighborLocation.Detect.Props; + +export type { NSNeighborLocation }; diff --git a/semcore/base-components/src/components/neighbor-location/NeighborLocation.types.ts b/semcore/base-components/src/components/neighbor-location/NeighborLocation.types.ts deleted file mode 100644 index f54d372cee..0000000000 --- a/semcore/base-components/src/components/neighbor-location/NeighborLocation.types.ts +++ /dev/null @@ -1,37 +0,0 @@ -import type { Intergalactic } from '@semcore/core'; -import type React from 'react'; - -export type NeighborLocationUnion = 'right' | 'both' | 'left'; - -export type NeighborLocationProps = { - /** Number of elements in a group */ - controlsLength?: number; -}; - -export type NeighborItemProps = { - /** Determines from which side the component has neighbors */ - neighborLocation?: NeighborLocationUnion | false; -}; - -export type NeighborLocationDetectProps = NeighborItemProps & { - children?: - | React.ReactElement - | ((neighborLocation: 'right' | 'both' | 'left' | undefined) => React.ReactElement | null); - - /** Inner from Root */ - getNeighborLocation: (component: any) => NeighborItemProps['neighborLocation']; -}; - -declare const NeighborLocation: Intergalactic.Component<'div', NeighborLocationProps> & { - Detect: Intergalactic.Component<'div', NeighborItemProps, 'right' | 'both' | 'left' | undefined>; -}; - -declare const NeighborLocationRoot: { - new (...args: any[]): any; - cacheChild: Map; - calculateNeighborLocation: () => any; -}; - -declare const useNeighborLocationDetect: (index: number) => 'right' | 'both' | 'left' | false; - -export { NeighborLocation, NeighborLocationRoot, useNeighborLocationDetect }; diff --git a/semcore/base-components/src/components/neighbor-location/index.ts b/semcore/base-components/src/components/neighbor-location/index.ts index fd736049fc..f46250607b 100644 --- a/semcore/base-components/src/components/neighbor-location/index.ts +++ b/semcore/base-components/src/components/neighbor-location/index.ts @@ -3,8 +3,8 @@ import { NeighborLocationRoot, useNeighborLocationDetect, } from './NeighborLocation'; -import type { NeighborLocationProps, NeighborItemProps } from './NeighborLocation.types'; +import type { NeighborLocationProps, NeighborItemProps, NSNeighborLocation } from './NeighborLocation.type'; export { NeighborLocation, NeighborLocationRoot, useNeighborLocationDetect }; -export type { NeighborLocationProps, NeighborItemProps }; +export type { NeighborLocationProps, NeighborItemProps, NSNeighborLocation }; diff --git a/semcore/base-components/src/components/outside-click/OutsideClick.tsx b/semcore/base-components/src/components/outside-click/OutsideClick.tsx index f185626bf8..04c98beede 100644 --- a/semcore/base-components/src/components/outside-click/OutsideClick.tsx +++ b/semcore/base-components/src/components/outside-click/OutsideClick.tsx @@ -1,4 +1,4 @@ -import { createComponent, type Intergalactic, type IRootComponentProps } from '@semcore/core'; +import { createComponent, type Intergalactic } from '@semcore/core'; import { getEventTarget } from '@semcore/core/lib/utils/getEventTarget'; import getOriginChildren from '@semcore/core/lib/utils/getOriginChildren'; import ownerDocument from '@semcore/core/lib/utils/ownerDocument'; @@ -6,35 +6,13 @@ import { useForkRef } from '@semcore/core/lib/utils/ref'; import useEventCallback from '@semcore/core/lib/utils/use/useEventCallback'; import React, { cloneElement } from 'react'; -export type OutsideClickProps = { - /** - * Function called on click outside the component from excludeRefs - * @default () => {} - */ - onOutsideClick?: (e?: React.SyntheticEvent) => void; - - /** - * List of refs that will not trigger `onOutsideClick` when clicked - * @default [] - */ - excludeRefs?: Array>; - - /** Root element - * @default document - * */ - root?: React.RefObject; -}; - -type OutsideClickComponent = Intergalactic.Component< - Intergalactic.Tag, - OutsideClickProps ->; +import type { NSOutsideClick } from './OutsideClick.type'; type OutsideClickEvents = { [key in 'mouseup' | 'mousedown']: EventListenerOrEventListenerObject }; type RootEventsPair = [Element | Document, OutsideClickEvents]; const noop = () => {}; -function OutsideClickRoot(props: OutsideClickProps & IRootComponentProps) { +function OutsideClickRoot(props: Intergalactic.InternalTypings.InferComponentProps) { const { Children, forwardRef, root, excludeRefs = [], onOutsideClick = noop } = props; const children = getOriginChildren(Children); const nodeRef = React.useRef(null); @@ -121,6 +99,6 @@ OutsideClickRoot.displayName = 'OutsideClick'; OutsideClickRoot.eventsMap = [] as RootEventsPair[]; export const OutsideClick = createComponent< - OutsideClickComponent, + NSOutsideClick.Component, typeof OutsideClickRoot >(OutsideClickRoot); diff --git a/semcore/base-components/src/components/outside-click/OutsideClick.type.ts b/semcore/base-components/src/components/outside-click/OutsideClick.type.ts new file mode 100644 index 0000000000..00d45281fd --- /dev/null +++ b/semcore/base-components/src/components/outside-click/OutsideClick.type.ts @@ -0,0 +1,29 @@ +import type { Intergalactic } from '@semcore/core'; + +declare namespace NSOutsideClick { + type Props = { + /** + * Function called on click outside the component from excludeRefs + * @default () => {} + */ + onOutsideClick?: (e?: React.SyntheticEvent) => void; + + /** + * List of refs that will not trigger `onOutsideClick` when clicked + * @default [] + */ + excludeRefs?: Array>; + + /** Root element + * @default document + * */ + root?: React.RefObject; + }; + + type Component = Intergalactic.Component; +} + +/** @deprecated It will be removed in v18. */ +export type OutsideClickProps = NSOutsideClick.Props; + +export type { NSOutsideClick }; diff --git a/semcore/base-components/src/components/outside-click/index.tsx b/semcore/base-components/src/components/outside-click/index.tsx index 04c4e3b734..1e19ea65a8 100644 --- a/semcore/base-components/src/components/outside-click/index.tsx +++ b/semcore/base-components/src/components/outside-click/index.tsx @@ -1,4 +1,4 @@ import { OutsideClick } from './OutsideClick'; -import type { OutsideClickProps } from './OutsideClick'; +import type { OutsideClickProps, NSOutsideClick } from './OutsideClick.type'; -export { OutsideClick, type OutsideClickProps }; +export { OutsideClick, type OutsideClickProps, NSOutsideClick }; diff --git a/semcore/base-components/src/components/popper/Popper.tsx b/semcore/base-components/src/components/popper/Popper.tsx index ca6fa8580b..920c5ad47b 100644 --- a/semcore/base-components/src/components/popper/Popper.tsx +++ b/semcore/base-components/src/components/popper/Popper.tsx @@ -1,8 +1,8 @@ import type { Instance, Modifier } from '@popperjs/core/lib/types'; +import type { Intergalactic } from '@semcore/core'; import { createComponent, Component, - type IRootComponentProps, Root, sstyled, lastInteraction, @@ -35,23 +35,14 @@ import { NeighborLocation } from '../neighbor-location'; import { OutsideClick } from '../outside-click'; import { Portal, PortalProvider } from '../portal'; import createPopper from './createPopper'; -import type { - InnerPopperPopperProps, - InnerPopperTriggerProps, - Popper as PopperType, - PopperComponent, - PopperPopperProps, - PopperProps, - PopperTriggerProps, - PopperDefaultProps, -} from './Popper.types'; +import type { NSPopper } from './Popper.type'; import style from './style/popper.shadow.css'; -function isObject(obj: any) { +function isObject(obj: unknown) { return typeof obj === 'object' && !Array.isArray(obj); } -function someArray(arr1: any[], arr2: any[]) { +function someArray(arr1: unknown[], arr2: unknown[]) { return arr1.filter(function (i) { return arr2.indexOf(i) !== -1; }); @@ -91,18 +82,18 @@ const MODIFIERS_OPTIONS = [ ] as const; class PopperRoot extends Component< - PopperProps, + Intergalactic.InternalTypings.InferComponentProps, typeof PopperRoot.enhance, - { visible: null }, + NSPopper.Uncontrolled, {}, {}, - PopperDefaultProps + NSPopper.DefaultProps > { static displayName = 'Popper'; static style = style; - static defaultProps: PopperDefaultProps = { + static defaultProps: NSPopper.DefaultProps = { defaultVisible: false, placement: 'auto', modifiers: [], @@ -161,7 +152,7 @@ class PopperRoot extends Component< timer = 0; timerMultiTrigger = 0; - constructor(props: PopperProps) { + constructor(props: NSPopper.Props) { super(props); if (canUseDOM()) { this.observer = new ResizeObserver(() => { @@ -290,7 +281,7 @@ class PopperRoot extends Component< } } - componentDidUpdate(prevProps: PopperProps) { + componentDidUpdate(prevProps: typeof this.asProps) { const popperProps = [ 'strategy', 'placement', @@ -325,8 +316,8 @@ class PopperRoot extends Component< } handlersFromInteraction( - interaction: PopperProps['interaction'], - component: PopperComponent, + interaction: NSPopper.Props['interaction'], + component: NSPopper.PopperComponent, visible: boolean, ) { const eventInteraction = @@ -338,13 +329,13 @@ class PopperRoot extends Component< const crossEvents = someArray(showEvents, hideEvents); const handlers: Record = {}; - showEvents.forEach((action: any) => { + showEvents.forEach((action) => { handlers[action] = this.bindHandlerChangeVisibleWithTimer(true, component, action); }); - hideEvents.forEach((action: any) => { + hideEvents.forEach((action) => { handlers[action] = this.bindHandlerChangeVisibleWithTimer(false, component, action); }); - crossEvents.forEach((action) => { + crossEvents.forEach((action: any) => { handlers[action] = visible ? this.bindHandlerChangeVisibleWithTimer(false, component, action) : this.bindHandlerChangeVisibleWithTimer(true, component, action); @@ -352,7 +343,7 @@ class PopperRoot extends Component< return handlers; } - makeKeyDownHandler = (component: PopperComponent) => (e: React.KeyboardEvent) => { + makeKeyDownHandler = (component: NSPopper.PopperComponent) => (e: React.KeyboardEvent) => { const { visible } = this.asProps; if (visible && e.key === 'Escape') { e.stopPropagation(); @@ -363,12 +354,12 @@ class PopperRoot extends Component< bindHandlerKeyDown = ( onKeyDown: (event: React.KeyboardEvent) => void | false, - component: PopperComponent, + component: NSPopper.PopperComponent, ) => callAllEventHandlers(onKeyDown, this.makeKeyDownHandler(component)); lastPopperClick = 0; bindHandlerChangeVisibleWithTimer = - (visible: boolean, component?: PopperComponent, action?: any) => (e: React.SyntheticEvent) => { + (visible: boolean, component?: NSPopper.PopperComponent, action?: any) => (e: React.SyntheticEvent) => { const trigger = this.triggerRef.current; if ( component === 'trigger' && @@ -505,6 +496,7 @@ class PopperRoot extends Component< 'trigger', Boolean(visible), ); + return { ref: explicitTriggerSet ? undefined : this.createTriggerRef, active: visible, @@ -601,7 +593,9 @@ class PopperRoot extends Component< } } -function Trigger(props: PopperTriggerProps & IRootComponentProps & InnerPopperTriggerProps) { +function Trigger( + props: Intergalactic.InternalTypings.InferChildComponentProps & NSPopper.Trigger.InnerProps, +) { const STrigger = Root; const { Children, onKeyboardFocus, highlighted, active, popperRef, forwardRef } = props; @@ -619,7 +613,7 @@ function Trigger(props: PopperTriggerProps & IRootComponentProps & InnerPopperTr if (!active) return; return () => { setTimeout(() => { - if (activeRef.current) return; + if (activeRef.current || popperRef.current === null) return; if (!isFocusInside(popperRef.current) && document.activeElement !== document.body) return; if (!lastInteraction.isKeyboard()) return; @@ -645,7 +639,9 @@ function Trigger(props: PopperTriggerProps & IRootComponentProps & InnerPopperTr ); } -function PopperPopper(props: PopperPopperProps & IRootComponentProps & InnerPopperPopperProps) { +function PopperPopper( + props: Intergalactic.InternalTypings.InferChildComponentProps & NSPopper.Popper.InnerProps, +) { const SPopper = Root; const { Children, @@ -793,7 +789,7 @@ function PopperPopper(props: PopperPopperProps & IRootComponentProps & InnerPopp * {@link https://developer.semrush.com/intergalactic/utils/popper/popper-api|API} */ export const Popper = createComponent< - typeof PopperType, + NSPopper.Component, typeof PopperRoot >(PopperRoot, { Trigger, diff --git a/semcore/base-components/src/components/popper/Popper.type.ts b/semcore/base-components/src/components/popper/Popper.type.ts new file mode 100644 index 0000000000..8c85f37ec3 --- /dev/null +++ b/semcore/base-components/src/components/popper/Popper.type.ts @@ -0,0 +1,206 @@ +import type { Options as OptionsArrow } from '@popperjs/core/lib/modifiers/arrow'; +import type { Options as OptionsComputeStyles } from '@popperjs/core/lib/modifiers/computeStyles'; +import type { Options as OptionsEventListeners } from '@popperjs/core/lib/modifiers/eventListeners'; +import type { Options as OptionsFlip } from '@popperjs/core/lib/modifiers/flip'; +import type { Options as OptionsOffset } from '@popperjs/core/lib/modifiers/offset'; +import type { Options as OptionsPreventOverflow } from '@popperjs/core/lib/modifiers/preventOverflow'; +import type { Options, Instance } from '@popperjs/core/lib/types'; +import type { PropGetterFn, Intergalactic } from '@semcore/core'; +import type { UniqueIDProps } from '@semcore/core/lib/utils/uniqueID'; +import type { DOMAttributes } from 'react'; + +import type { NSAnimation } from '../animation'; +import type { NSBox } from '../flex-box'; +import type { NSNeighborLocation } from '../neighbor-location'; +import type { NSOutsideClick } from '../outside-click'; +import type { NSPortal } from '../portal'; + +declare namespace NSPopper { + type Strategy = Options['strategy']; + type Modifiers = Options['modifiers']; + type Placement = Options['placement']; + type PopperComponent = 'trigger' | 'popper'; + type EventInteraction = { + trigger: [Array>, Array>]; + popper: [Array>, Array>]; + }; + type Props = NSOutsideClick.Props & + NSPortal.Props & + UniqueIDProps & + Omit & { + /** + * Popper can have different positioning options + * @default absolute + */ + strategy?: NSPopper.Strategy; + /** + * Modifiers for popper.js + */ + modifiers?: NSPopper.Modifiers; + /** + * The position of the popper relative to the trigger that called it. + * 'auto-start' | 'auto' | 'auto-end' | 'top-start' | 'top' | 'top-end' | 'right-start' | 'right' | 'right-end' | 'bottom-end' | 'bottom' | 'bottom-start' | 'left-end' | 'left' | 'left-start' + * @default auto + */ + placement?: NSPopper.Placement; + /** + * Interaction with a trigger to show and hide the popper + * @default click + */ + interaction?: 'click' | 'hover' | 'focus' | 'none' | NSPopper.EventInteraction; + /** Timer to show and hide the popper */ + timeout?: number | [number, number]; + /** Popper visibility value */ + visible?: boolean; + /** Default popper visibility + * @default false */ + defaultVisible?: boolean; + /** Function called when visibility changes */ + onVisibleChange?: (visible: boolean, e?: Event) => boolean | void; + /** PopperJS modifier settings for popper indent */ + offset?: Partial | number | [number, number]; + /** PopperJS modifier settings for finding borders */ + preventOverflow?: Partial; + /** PopperJS modifier settings responsible for the arrow */ + arrow?: Partial; + /** PopperJS modifier settings responsible for turning the popper when there is not enough space */ + flip?: Partial; + /** PopperJS modifier settings for applying styles */ + computeStyles?: Partial; + /** PopperJS modifier settings responsible for subscribing to global events */ + eventListeners?: Partial; + /** Internal */ + onFirstUpdate?: Options['onFirstUpdate']; + /** + * Flag for disable Popover (if true, it will close Popper and it will not respond to handlers) + * @default false + */ + disabled?: boolean; + /** + * Disabled focus trap, autofocus and focus return + */ + disableEnforceFocus?: boolean; + /** + * If enabled, after reaching the end of popper the browser focus goes to the start of popper and vice versa. + * If disabled, after reading the end of popper the browser focus returns to trigger and popper is being closed. + * @default `true` (`false` in Tooltip) + */ + focusLoop?: boolean; + /** + * If enabled, you will need to use setTrigger function from children rendering function to set popper trigger. + */ + explicitTriggerSet?: boolean; + /** + * If set, popper will be placed near the place mouse cursor entered the trigger + */ + cursorAnchoring?: boolean; + /** Sets a margin that reduces the maximum size of the popper */ + popperMargin?: number; + }; + type DefaultProps = { + defaultVisible: false; + placement: 'auto'; + modifiers: Props['modifiers']; + arrow: { + padding: 6; + }; + strategy: 'absolute'; + interaction: 'click'; + timeout: 0; + excludeRefs: Props['excludeRefs']; + focusLoop: true; + cursorAnchoring: false; + }; + type Ctx = { + getTriggerProps: PropGetterFn; + getPopperProps: PropGetterFn; + popper: React.MutableRefObject; + // Rename to setTriggerRef + setTrigger: (ref: HTMLElement) => void; + setPopper: (ref: HTMLElement) => void; + }; + type Handlers = { + visible: (visible: boolean) => void; + }; + type Uncontrolled = { + visible: null; + }; + + namespace Trigger { + type Props = NSBox.Props & { + /** + * Disabled focus trap, autofocus and focus return + */ + disableEnforceFocus?: boolean; + }; + type InnerProps = { + /** + * @deprecated + */ + onKeyboardFocus: (event?: { currentTarget?: HTMLElement }) => void; + highlighted: boolean; + active: boolean; + popperRef: React.MutableRefObject; + }; + + type Component = Intergalactic.Component<'div', Props, Ctx, [handlers: Handlers]>; + } + + namespace Popper { + type Props = NSBox.Props & + NSPortal.Props & + NSNeighborLocation.Props & { + /** + * Disabled focus trap, autofocus and focus return + */ + disableEnforceFocus?: boolean; + /** Automatically focus a popper when it opens */ + autoFocus?: boolean | 'enforced'; + }; + type InnerProps = { + visible: boolean; + triggerRef: React.RefObject; + duration: number; + animationsDisabled: boolean; + popper: React.MutableRefObject; + focusMaster: boolean; + handleFocusOut: () => void; + }; + + type Component = Intergalactic.Component<'div', Props, Ctx, [handlers: Handlers]>; + } + + type Component = Intergalactic.Component<'div', Props, Ctx, [handlers: Handlers]> & { + Trigger: Trigger.Component; + Popper: Popper.Component; + }; +} + +/** @deprecated It will be removed in v18. */ +export type PopperComponent = NSPopper.PopperComponent; +/** @deprecated It will be removed in v18. */ +export type eventInteraction = NSPopper.EventInteraction; +/** @deprecated It will be removed in v18. */ +export type Strategy = NSPopper.Strategy; +/** @deprecated It will be removed in v18. */ +export type Modifiers = NSPopper.Modifiers; +/** @deprecated It will be removed in v18. */ +export type Placement = NSPopper.Placement; +/** @deprecated It will be removed in v18. */ +export type PopperProps = NSPopper.Props; +/** @deprecated It will be removed in v18. */ +export type PopperDefaultProps = NSPopper.DefaultProps; +/** @deprecated It will be removed in v18. */ +export type PopperTriggerProps = NSPopper.Trigger.Props; +/** @deprecated It will be removed in v18. */ +export type InnerPopperTriggerProps = NSPopper.Trigger.InnerProps; +/** @deprecated It will be removed in v18. */ +export type PopperPopperProps = NSPopper.Popper.Props; +/** @deprecated It will be removed in v18. */ +export type InnerPopperPopperProps = NSPopper.Popper.InnerProps; +/** @deprecated It will be removed in v18. */ +export type PopperContext = NSPopper.Ctx; +/** @deprecated It will be removed in v18. */ +export type PopperHandlers = NSPopper.Handlers; + +export type { NSPopper }; diff --git a/semcore/base-components/src/components/popper/Popper.types.ts b/semcore/base-components/src/components/popper/Popper.types.ts deleted file mode 100644 index 0ab1389221..0000000000 --- a/semcore/base-components/src/components/popper/Popper.types.ts +++ /dev/null @@ -1,189 +0,0 @@ -import type { Options as OptionsArrow } from '@popperjs/core/lib/modifiers/arrow'; -import type { Options as OptionsComputeStyles } from '@popperjs/core/lib/modifiers/computeStyles'; -import type { Options as OptionsEventListeners } from '@popperjs/core/lib/modifiers/eventListeners'; -import type { Options as OptionsFlip } from '@popperjs/core/lib/modifiers/flip'; -import type { Options as OptionsOffset } from '@popperjs/core/lib/modifiers/offset'; -import type { Options as OptionsPreventOverflow } from '@popperjs/core/lib/modifiers/preventOverflow'; -import type { Options, Instance } from '@popperjs/core/lib/types'; -import type { PropGetterFn, Intergalactic, UnknownProperties } from '@semcore/core'; -import type { UniqueIDProps } from '@semcore/core/lib/utils/uniqueID'; -import type { DOMAttributes } from 'react'; - -import type { ScaleProps } from '../animation'; -import type { BoxProps } from '../flex-box'; -import type { NeighborLocationProps } from '../neighbor-location'; -import type { OutsideClickProps } from '../outside-click'; -import type { PortalProps } from '../portal'; - -export type PopperComponent = 'trigger' | 'popper'; - -export type eventInteraction = { - trigger: [Array>, Array>]; - popper: [Array>, Array>]; -}; - -export type Strategy = Options['strategy']; -export type Modifiers = Options['modifiers']; -export type Placement = Options['placement']; - -export type PopperProps = OutsideClickProps & - PortalProps & - UniqueIDProps & - Omit & { - /** - * Popper can have different positioning options - * @default absolute - */ - strategy?: Strategy; - /** - * Modifiers for popper.js - */ - modifiers?: Modifiers; - /** - * The position of the popper relative to the trigger that called it. - * 'auto-start' | 'auto' | 'auto-end' | 'top-start' | 'top' | 'top-end' | 'right-start' | 'right' | 'right-end' | 'bottom-end' | 'bottom' | 'bottom-start' | 'left-end' | 'left' | 'left-start' - * @default auto - */ - placement?: Placement; - /** - * Interaction with a trigger to show and hide the popper - * @default click - */ - interaction?: 'click' | 'hover' | 'focus' | 'none' | eventInteraction; - /** Timer to show and hide the popper */ - timeout?: number | [number, number]; - /** Popper visibility value */ - visible?: boolean; - /** Default popper visibility - * @default false */ - defaultVisible?: boolean; - /** Function called when visibility changes */ - onVisibleChange?: (visible: boolean, e?: Event) => boolean | void; - /** PopperJS modifier settings for popper indent */ - offset?: Partial | number | [number, number]; - /** PopperJS modifier settings for finding borders */ - preventOverflow?: Partial; - /** PopperJS modifier settings responsible for the arrow */ - arrow?: Partial; - /** PopperJS modifier settings responsible for turning the popper when there is not enough space */ - flip?: Partial; - /** PopperJS modifier settings for applying styles */ - computeStyles?: Partial; - /** PopperJS modifier settings responsible for subscribing to global events */ - eventListeners?: Partial; - /** Internal */ - onFirstUpdate?: Options['onFirstUpdate']; - /** - * Flag for disable Popover (if true, it will close Popper and it will not respond to handlers) - * @default false - */ - disabled?: boolean; - /** - * Disabled focus trap, autofocus and focus return - */ - disableEnforceFocus?: boolean; - /** - * If enabled, after reaching the end of popper the browser focus goes to the start of popper and vice versa. - * If disabled, after reading the end of popper the browser focus returns to trigger and popper is being closed. - * @default `true` (`false` in Tooltip) - */ - focusLoop?: boolean; - /** - * If enabled, you will need to use setTrigger function from children rendering function to set popper trigger. - */ - explicitTriggerSet?: boolean; - /** - * If set, popper will be placed near the place mouse cursor entered the trigger - */ - cursorAnchoring?: boolean; - /** Sets a margin that reduces the maximum size of the popper */ - popperMargin?: number; - }; - -export type PopperDefaultProps = { - defaultVisible: false; - placement: 'auto'; - modifiers: PopperProps['modifiers']; - arrow: { - padding: 6; - }; - strategy: 'absolute'; - interaction: 'click'; - timeout: 0; - excludeRefs: PopperProps['excludeRefs']; - focusLoop: true; - cursorAnchoring: false; -}; - -export type PopperTriggerProps = BoxProps & { - /** - * Disabled focus trap, autofocus and focus return - */ - disableEnforceFocus?: boolean; -}; - -export type InnerPopperTriggerProps = React.HTMLAttributes & { - /** - * @deprecated - */ - onKeyboardFocus: (event?: { currentTarget?: HTMLElement }) => void; - highlighted: boolean; - active: boolean; - popperRef: React.MutableRefObject; -}; - -export type PopperPopperProps = BoxProps & - PortalProps & - NeighborLocationProps & { - /** - * Disabled focus trap, autofocus and focus return - */ - disableEnforceFocus?: boolean; - /** Automatically focus a popper when it opens */ - autoFocus?: boolean | 'enforced'; - }; - -export type InnerPopperPopperProps = React.HTMLAttributes & { - visible: boolean; - triggerRef: React.RefObject; - duration: number; - animationsDisabled: boolean; - popper: React.MutableRefObject; - focusMaster: boolean; - handleFocusOut: () => void; -}; - -export type PopperContext = { - getTriggerProps: PropGetterFn; - getPopperProps: PropGetterFn; - popper: React.MutableRefObject; - // Rename to setTriggerRef - setTrigger: (ref: HTMLElement) => void; - setPopper: (ref: HTMLElement) => void; -}; - -export type PopperHandlers = { - visible: (visible: boolean) => void; -}; - -declare const Popper: Intergalactic.Component< - 'div', - PopperProps, - PopperContext, - [handlers: PopperHandlers] -> & { - Trigger: Intergalactic.Component< - 'div', - PopperTriggerProps, - PopperContext, - [handlers: PopperHandlers] - >; - Popper: Intergalactic.Component< - 'div', - PopperPopperProps, - PopperContext, - [handlers: PopperHandlers] - >; -}; - -export { Popper }; diff --git a/semcore/base-components/src/components/popper/index.ts b/semcore/base-components/src/components/popper/index.ts index 2d51d359ad..a047763234 100644 --- a/semcore/base-components/src/components/popper/index.ts +++ b/semcore/base-components/src/components/popper/index.ts @@ -7,7 +7,8 @@ import type { PopperTriggerProps, PopperPopperProps, eventInteraction, -} from './Popper.types'; + NSPopper, +} from './Popper.type'; export { Popper, isInputTriggerTag }; @@ -19,4 +20,5 @@ export type { PopperTriggerProps, PopperPopperProps, eventInteraction, + NSPopper, }; diff --git a/semcore/base-components/src/components/portal/Portal.tsx b/semcore/base-components/src/components/portal/Portal.tsx index b7cd83b64d..f37667d287 100644 --- a/semcore/base-components/src/components/portal/Portal.tsx +++ b/semcore/base-components/src/components/portal/Portal.tsx @@ -3,28 +3,18 @@ import canUseDOM from '@semcore/core/lib/utils/canUseDOM'; import React from 'react'; import { createPortal } from 'react-dom'; -export type PortalProps = { - /** Disables children rendering in React portal */ - disablePortal?: boolean; - /** Disabled attaching portals to the parent portals and enabling attaching directly to document.body */ - ignorePortalsStacking?: boolean; - /** Called when portal mount state changes */ - onMount?: (mounted: boolean) => void; - /** Manually set node to mount portal content */ - nodeToMount?: HTMLElement; -}; +import type { NSPortal } from './Portal.type'; type PortalContextType = React.RefObject | HTMLElement | null; -type PortalComponent = Intergalactic.Component; - const PortalContext = register.get( 'portal-context', - React.createContext(canUseDOM() ? document.body : null), ); -function Portal(props: PortalProps & { Children: React.FC }) { +function Portal( + props: Intergalactic.InternalTypings.InferComponentProps, +) { const { Children, disablePortal, ignorePortalsStacking, onMount, nodeToMount } = props; const container = React.useContext(PortalContext); const [mountNode, setMountNode] = React.useState(null); @@ -61,6 +51,6 @@ export { PortalProvider, PortalContext }; * {@link https://developer.semrush.com/intergalactic/utils/portal/portal-api|API} */ export default createComponent< - PortalComponent, + NSPortal.Component, typeof Portal >(Portal); diff --git a/semcore/base-components/src/components/portal/Portal.type.ts b/semcore/base-components/src/components/portal/Portal.type.ts new file mode 100644 index 0000000000..d322c5a53b --- /dev/null +++ b/semcore/base-components/src/components/portal/Portal.type.ts @@ -0,0 +1,21 @@ +import { type Intergalactic } from '@semcore/core'; + +declare namespace NSPortal { + type Props = { + /** Disables children rendering in React portal */ + disablePortal?: boolean; + /** Disabled attaching portals to the parent portals and enabling attaching directly to document.body */ + ignorePortalsStacking?: boolean; + /** Called when portal mount state changes */ + onMount?: (mounted: boolean) => void; + /** Manually set node to mount portal content */ + nodeToMount?: HTMLElement; + }; + + type Component = Intergalactic.Component; +} + +/** @deprecated It will be removed in v18. */ +export type PortalProps = NSPortal.Props; + +export type { NSPortal }; diff --git a/semcore/base-components/src/components/portal/index.tsx b/semcore/base-components/src/components/portal/index.tsx index f3b07c27af..6cc9c488b5 100644 --- a/semcore/base-components/src/components/portal/index.tsx +++ b/semcore/base-components/src/components/portal/index.tsx @@ -1,4 +1,4 @@ import Portal, { PortalProvider, PortalContext } from './Portal'; -import type { PortalProps } from './Portal'; +import type { PortalProps, NSPortal } from './Portal.type'; -export { Portal, PortalProvider, PortalContext, type PortalProps }; +export { Portal, PortalProvider, PortalContext, type PortalProps, NSPortal }; diff --git a/semcore/base-components/src/components/scroll-area/ScrollArea.tsx b/semcore/base-components/src/components/scroll-area/ScrollArea.tsx index 7b8b437b2e..1c474b588d 100644 --- a/semcore/base-components/src/components/scroll-area/ScrollArea.tsx +++ b/semcore/base-components/src/components/scroll-area/ScrollArea.tsx @@ -1,4 +1,5 @@ -import { createComponent, sstyled, Component, Root, type IRootComponentProps, lastInteraction } from '@semcore/core'; +import type { Intergalactic } from '@semcore/core'; +import { createComponent, sstyled, Component, Root, lastInteraction } from '@semcore/core'; import { callAllEventHandlers } from '@semcore/core/lib/utils/assignProps'; import canUseDOM from '@semcore/core/lib/utils/canUseDOM'; import { isAdvanceMode } from '@semcore/core/lib/utils/findComponent'; @@ -7,13 +8,8 @@ import uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID'; import React, { type ForwardedRef } from 'react'; import { Box } from '../flex-box'; +import type { NSScrollArea } from './ScrollArea.type'; import { setAreaValue, ScrollBar } from './ScrollBar'; -import type { - ScrollAreaProps, - ScrollArea as ScrollAreaType, - ScrollAreaContainerProps, - ScrollAreaDefaultProps, -} from './ScrollBar.types'; import style from './style/scroll-area.shadow.css'; let eventCalculate: Event | undefined = undefined; @@ -21,46 +17,42 @@ if (typeof window !== 'undefined') { eventCalculate = new Event('calculate'); } -const BoxWithoutPosition = React.forwardRef( - ({ position, ...props }: any, ref: ForwardedRef) => , -); - -type State = { - shadowHorizontal: boolean | string; - shadowVertical: boolean | string; -}; +const BoxWithoutPosition = React.forwardRef(({ position, ...props }: any, ref: ForwardedRef) => ( + +)); const DEFAULT_SHADOW_THEME = 'dark'; class ScrollAreaRoot extends Component< - ScrollAreaProps, + Intergalactic.InternalTypings.InferComponentProps, typeof ScrollAreaRoot.enhance, {}, {}, - State, - ScrollAreaDefaultProps + NSScrollArea.State, + NSScrollArea.DefaultProps > { static displayName = 'ScrollArea'; static style = style; static enhance = [uniqueIDEnhancement()] as const; - static defaultProps = () => ({ - container: React.createRef(), - inner: React.createRef(), - tabIndex: 0, - observeParentSize: false, - disableAutofocusToContent: false, - shadowSize: 5, - shadowTheme: DEFAULT_SHADOW_THEME, - } as const); + static defaultProps = () => + ({ + container: React.createRef(), + inner: React.createRef(), + tabIndex: 0, + observeParentSize: false, + disableAutofocusToContent: false, + shadowSize: 5, + shadowTheme: DEFAULT_SHADOW_THEME, + }) as const; hasAutoFocusToContent = false; $wrapper: HTMLElement | null = null; observer: ResizeObserver | null = null; - horizontalBarRef = React.createRef(); - verticalBarRef = React.createRef(); + horizontalBarRef: React.MutableRefObject = React.createRef(); + verticalBarRef: React.MutableRefObject = React.createRef(); get $container(): HTMLElement | null { const element = this.asProps.container.current; @@ -74,12 +66,12 @@ class ScrollAreaRoot extends Component< return element; } - state: State = { + state: NSScrollArea.State = { shadowHorizontal: false, shadowVertical: false, }; - constructor(props: ScrollAreaProps) { + constructor(props: NSScrollArea.Props) { super(props); if (canUseDOM()) { @@ -235,7 +227,7 @@ class ScrollAreaRoot extends Component< }, 0); }; - toggleShadow = (scroll: number, maxScroll: number, orientation: keyof State) => { + toggleShadow = (scroll: number, maxScroll: number, orientation: keyof NSScrollArea.State) => { const roundedScroll = Math.round(scroll); const roundedMaxScroll = Math.round(maxScroll); let shadow = ''; @@ -259,8 +251,7 @@ class ScrollAreaRoot extends Component< setShadowContainer = () => { if (!this.asProps.shadow || !this.$container || !this.$wrapper) return; - const { scrollWidth, clientWidth, scrollHeight, clientHeight, scrollLeft, scrollTop } = - this.$container; + const { scrollWidth, clientWidth, scrollHeight, clientHeight, scrollLeft, scrollTop } = this.$container; const maxScrollRight = scrollWidth - clientWidth; const maxScrollBottom = scrollHeight - clientHeight; @@ -279,8 +270,7 @@ class ScrollAreaRoot extends Component< } getBarProps() { - const { container, orientation, uid, leftOffset, rightOffset, topOffset, bottomOffset } = - this.asProps; + const { container, orientation, uid, leftOffset, rightOffset, topOffset, bottomOffset } = this.asProps; return { container, @@ -314,7 +304,7 @@ class ScrollAreaRoot extends Component< } } - componentDidUpdate(prevProps: ScrollAreaProps) { + componentDidUpdate(prevProps: typeof this.asProps) { this.calculate(); const { disableAutofocusToContent } = this.asProps; @@ -415,7 +405,9 @@ class ScrollAreaRoot extends Component< } } -function ContainerRoot(props: ScrollAreaContainerProps & IRootComponentProps) { +function ContainerRoot( + props: Intergalactic.InternalTypings.InferChildComponentProps, +) { const SContainer = Root; const { Children, @@ -443,14 +435,16 @@ function ContainerRoot(props: ScrollAreaContainerProps & IRootComponentProps) { ); } +export type ScrollAreaRootType = typeof ScrollAreaRoot; + /** * ScrollArea * * {@link https://developer.semrush.com/intergalactic/components/scroll-area/scroll-area-api|API} | {@link https://developer.semrush.com/intergalactic/components/scroll-area/scroll-area-code|Examples} */ const ScrollArea = createComponent< - typeof ScrollAreaType, - typeof ScrollAreaRoot + NSScrollArea.Component, + ScrollAreaRootType >(ScrollAreaRoot, { Container: ContainerRoot, Bar: ScrollBar, diff --git a/semcore/base-components/src/components/scroll-area/ScrollArea.type.ts b/semcore/base-components/src/components/scroll-area/ScrollArea.type.ts new file mode 100644 index 0000000000..d0138c8931 --- /dev/null +++ b/semcore/base-components/src/components/scroll-area/ScrollArea.type.ts @@ -0,0 +1,137 @@ +import type { PropGetterFn, Intergalactic } from '@semcore/core'; + +import type { NSBox } from '../flex-box'; + +declare namespace NSScrollArea { + type ShadowTheme = 'dark' | 'light'; + type Props = NSBox.Props & { + /** Shadow display on container */ + shadow?: boolean; + /** Scroll direction */ + orientation?: 'horizontal' | 'vertical'; + /** Link to the dom element, which will be a container with overflow */ + container?: React.RefObject; + /** Link to the dom element that will be stretched along with the content */ + inner?: React.RefObject; + /** Callback executed when container change size */ + onResize?: ResizeObserverCallback; + /** Called every time user scrolls area */ + onScroll?: (event: React.SyntheticEvent) => void; + /** Tab index that is being bypassed to the scroll container. */ + tabIndex?: number; + /** + * Flag to enable resizing if the parent of ScrollArea is resized + * @default false + */ + observeParentSize?: boolean; + + /** + * Flag to disable autoscroll to focused content. + * @default false + */ + disableAutofocusToContent?: boolean; + + /** Top offset for scroll positioning */ + topOffset?: number; + /** Right offset for scroll positioning */ + rightOffset?: number; + /** Bottom offset for scroll positioning */ + bottomOffset?: number; + /** Left offset for scroll positioning */ + leftOffset?: number; + /** + * Size for shadows in px. + * @default 5 + */ + shadowSize?: number | { horizontal: number; vertical: number }; + /** + * Style for shadows (black or white). + * @default dark + */ + shadowTheme?: + | NSScrollArea.ShadowTheme + | { + horizontalTop?: NSScrollArea.ShadowTheme; + horizontalBottom?: NSScrollArea.ShadowTheme; + verticalLeft?: NSScrollArea.ShadowTheme; + verticalRight?: NSScrollArea.ShadowTheme; + }; + }; + type DefaultProps = { + container: React.RefObject; + inner: React.RefObject; + tabIndex: 0; + observeParentSize: false; + disableAutofocusToContent: false; + shadowSize: 5; + shadowTheme: 'dark'; + }; + type State = { + shadowHorizontal: boolean | string; + shadowVertical: boolean | string; + }; + type Ctx = { + getContainerProps: PropGetterFn; + getBarProps: PropGetterFn; + }; + + namespace Bar { + type Props = NSBox.Props & { + /** The direction of the scroll that can be calculated automatically */ + orientation?: 'horizontal' | 'vertical'; + /** Reference to the scrollable container element */ + container?: React.RefObject; + }; + type DefaultProps = { + container: React.RefObject; + children: React.JSX.Element; + }; + type State = { + visibleScroll: boolean; + }; + type Ctx = { + getSliderProps: PropGetterFn; + }; + + namespace Slider { + type Component = NSBox.Component; + } + + type Component = Intergalactic.Component<'div', Props, Ctx> & { + Slider: Slider.Component; + }; + } + + namespace Container { + type Props = NSBox.Props & { + /** Inner prop */ + $refInner?: React.RefObject; + }; + + type Component = Intergalactic.Component<'div', Props>; + } + + type Component = Intergalactic.Component<'div', Props, Ctx> & { + Container: Container.Component; + Bar: Bar.Component; + }; +} + +/** @deprecated It will be removed in v18. */ +export type ShadowTheme = NSScrollArea.ShadowTheme; +/** @deprecated It will be removed in v18. */ +export type ScrollAreaProps = NSScrollArea.Props; +/** @deprecated It will be removed in v18. */ +export type ScrollAreaDefaultProps = NSScrollArea.DefaultProps; +/** @deprecated It will be removed in v18. */ +export type ScrollAreaContext = NSScrollArea.Ctx; +/** @deprecated It will be removed in v18. */ +export type ScrollBarProps = NSScrollArea.Bar.Props; +/** @deprecated It will be removed in v18. */ +export type ScrollBarDefaultProps = NSScrollArea.Bar.DefaultProps; +/** @deprecated It will be removed in v18. */ +export type ScrollBarContext = NSScrollArea.Bar.Ctx; +/** @deprecated It will be removed in v18. */ +export type ScrollAreaContainerProps = NSScrollArea.Container.Props; + +export type { NSScrollArea }; diff --git a/semcore/base-components/src/components/scroll-area/ScrollBar.tsx b/semcore/base-components/src/components/scroll-area/ScrollBar.tsx index 1f8083ebbb..e447a4aed3 100644 --- a/semcore/base-components/src/components/scroll-area/ScrollBar.tsx +++ b/semcore/base-components/src/components/scroll-area/ScrollBar.tsx @@ -1,9 +1,11 @@ +import type { Intergalactic } from '@semcore/core'; import { createComponent, sstyled, Component, Root } from '@semcore/core'; import contextEnhance from '@semcore/core/lib/utils/enhances/contextEnhance'; import React from 'react'; import { Box } from '../flex-box'; -import type { ScrollBar as ScrollBarType, ScrollBarProps, ScrollBarDefaultProps } from './ScrollBar.types'; +import type { ScrollAreaRootType } from './ScrollArea'; +import type { NSScrollArea } from './ScrollArea.type'; import style from './style/scroll-bar.shadow.css'; export const hideScrollBarsFromScreenReadersContext = React.createContext(false); @@ -31,17 +33,13 @@ const setAriaValues = ( } }; -type State = { - visibleScroll: boolean; -}; - class ScrollBarRoot extends Component< - ScrollBarProps, + Intergalactic.InternalTypings.InferChildComponentProps, typeof ScrollBarRoot.enhance, {}, { container: React.RefObject }, - State, - ScrollBarDefaultProps + NSScrollArea.Bar.State, + NSScrollArea.Bar.DefaultProps > { static displayName = 'Bar'; @@ -68,7 +66,7 @@ class ScrollBarRoot extends Component< _scroll = { left: 0, top: 0 }; _mouse = { pageX: 0, pageY: 0 }; - state: State = { + state: NSScrollArea.Bar.State = { visibleScroll: false, }; @@ -317,7 +315,7 @@ class ScrollBarRoot extends Component< this.subscribe(this.$container); } - componentDidUpdate(prevProps: ScrollBarProps) { + componentDidUpdate(prevProps: typeof this.asProps) { if (prevProps.container !== this.props.container && prevProps.container === null) { this.subscribe(this.$container); } @@ -395,7 +393,9 @@ class ScrollBarRoot extends Component< } } -function Slider(props: ScrollBarProps) { +function Slider( + props: Intergalactic.InternalTypings.InferChildComponentProps, +) { const { styles } = props; const SSlider = Root; @@ -403,7 +403,7 @@ function Slider(props: ScrollBarProps) { } export const ScrollBar = createComponent< - typeof ScrollBarType, + NSScrollArea.Bar.Component, typeof ScrollBarRoot >(ScrollBarRoot, { Slider, diff --git a/semcore/base-components/src/components/scroll-area/ScrollBar.types.ts b/semcore/base-components/src/components/scroll-area/ScrollBar.types.ts deleted file mode 100644 index f44285a6a9..0000000000 --- a/semcore/base-components/src/components/scroll-area/ScrollBar.types.ts +++ /dev/null @@ -1,104 +0,0 @@ -import type { PropGetterFn, Intergalactic } from '@semcore/core'; - -import type { Box, BoxProps } from '../flex-box'; - -export type ShadowTheme = 'dark' | 'light'; - -export type ScrollAreaProps = BoxProps & { - /** Shadow display on container */ - shadow?: boolean; - /** Scroll direction */ - orientation?: 'horizontal' | 'vertical'; - /** Link to the dom element, which will be a container with overflow */ - container?: React.RefObject; - /** Link to the dom element that will be stretched along with the content */ - inner?: React.RefObject; - /** Callback executed when container change size */ - onResize?: ResizeObserverCallback; - /** Called every time user scrolls area */ - onScroll?: (event: React.SyntheticEvent) => void; - /** Tab index that is being bypassed to the scroll container. */ - tabIndex?: number; - /** - * Flag to enable resizing if the parent of ScrollArea is resized - * @default false - */ - observeParentSize?: boolean; - - /** - * Flag to disable autoscroll to focused content. - * @default false - */ - disableAutofocusToContent?: boolean; - - /** Top offset for scroll positioning */ - topOffset?: number; - /** Right offset for scroll positioning */ - rightOffset?: number; - /** Bottom offset for scroll positioning */ - bottomOffset?: number; - /** Left offset for scroll positioning */ - leftOffset?: number; - - /** - * Size for shadows in px. - * @default 5 - */ - shadowSize?: number | { horizontal: number; vertical: number }; - /** - * Style for shadows (black or white). - * @default dark - */ - shadowTheme?: ShadowTheme | { horizontalTop?: ShadowTheme; horizontalBottom?: ShadowTheme; verticalLeft?: ShadowTheme; verticalRight?: ShadowTheme }; -}; - -export type ScrollAreaDefaultProps = { - container: React.RefObject; - inner: React.RefObject; - tabIndex: 0; - observeParentSize: false; - disableAutofocusToContent: false; - shadowSize: 5; - shadowTheme: 'dark'; -}; - -export type ScrollAreaContext = ScrollAreaProps & { - getContainerProps: PropGetterFn; - getBarProps: PropGetterFn; -}; - -export type ScrollBarProps = BoxProps & { - /** The direction of the scroll that can be calculated automatically */ - orientation?: 'horizontal' | 'vertical'; - /** Reference to the scrollable container element */ - container?: React.RefObject; -}; - -export type ScrollBarDefaultProps = { - container: React.RefObject; - children: React.JSX.Element; -}; - -export type ScrollBarContext = ScrollBarProps & { - getSliderProps: PropGetterFn; -}; - -export type ScrollAreaContainerProps = BoxProps & { - /** Inner prop */ - $refInner?: React.RefObject; -}; - -declare const ScrollBar: Intergalactic.Component<'div', ScrollBarProps, ScrollBarContext> & { - Slider: typeof Box; -}; - -declare const ScrollArea: Intergalactic.Component<'div', ScrollAreaProps, ScrollAreaContext> & { - Container: Intergalactic.Component<'div', ScrollAreaContainerProps>; - Bar: typeof ScrollBar; -}; - -declare const eventCalculate: Event; - -declare const hideScrollBarsFromScreenReadersContext: React.Context; - -export { eventCalculate, hideScrollBarsFromScreenReadersContext, ScrollBar, ScrollArea }; diff --git a/semcore/base-components/src/components/scroll-area/index.ts b/semcore/base-components/src/components/scroll-area/index.ts index a88cc99356..e120ddd707 100644 --- a/semcore/base-components/src/components/scroll-area/index.ts +++ b/semcore/base-components/src/components/scroll-area/index.ts @@ -1,5 +1,5 @@ import { ScrollArea, eventCalculate } from './ScrollArea'; +import type { ScrollAreaProps, NSScrollArea } from './ScrollArea.type'; import { hideScrollBarsFromScreenReadersContext } from './ScrollBar'; -import type { ScrollAreaProps } from './ScrollBar.types'; -export { ScrollArea, eventCalculate, hideScrollBarsFromScreenReadersContext, type ScrollAreaProps }; +export { ScrollArea, eventCalculate, hideScrollBarsFromScreenReadersContext, type ScrollAreaProps, NSScrollArea }; diff --git a/semcore/base-components/tsconfig.json b/semcore/base-components/tsconfig.json index a551c16819..3daf0e528f 100644 --- a/semcore/base-components/tsconfig.json +++ b/semcore/base-components/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "compilerOptions": { "rootDir": "./src" }, diff --git a/semcore/base-trigger/.npmignore b/semcore/base-trigger/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/base-trigger/.npmignore +++ b/semcore/base-trigger/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/base-trigger/src/index.d.ts b/semcore/base-trigger/src/index.d.ts index c89c3777b8..c1333def13 100644 --- a/semcore/base-trigger/src/index.d.ts +++ b/semcore/base-trigger/src/index.d.ts @@ -1,4 +1,4 @@ -import type { Box, BoxProps, NeighborItemProps } from '@semcore/base-components'; +import type { NSBox, NSNeighborLocation } from '@semcore/base-components'; import type { ButtonLinkProps, ButtonLink } from '@semcore/button'; import type { Intergalactic } from '@semcore/core'; import type { WithAnimatedSizeEnhanceProps } from '@semcore/core/lib/utils/enhances/animatedSizeEnhance'; @@ -6,8 +6,8 @@ import type { NSCounter } from '@semcore/counter'; import type { Text } from '@semcore/typography'; import type React from 'react'; -export type BaseTriggerProps = BoxProps & - NeighborItemProps & +export type BaseTriggerProps = NSBox.Props & + NSNeighborLocation.Detect.Props & WithAnimatedSizeEnhanceProps & { /** * Trigger size @@ -73,7 +73,7 @@ export type FilterTriggerCounterProps = { declare const BaseTrigger: Intergalactic.Component<'div', BaseTriggerProps> & { Text: typeof Text; - Addon: typeof Box; + Addon: NSBox.Component; }; declare const ButtonTrigger: Intergalactic.Component<'div', ButtonTriggerProps> & { diff --git a/semcore/base-trigger/tsconfig.json b/semcore/base-trigger/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/base-trigger/tsconfig.json +++ b/semcore/base-trigger/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/breadcrumbs/.npmignore b/semcore/breadcrumbs/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/breadcrumbs/.npmignore +++ b/semcore/breadcrumbs/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/breadcrumbs/src/Breadcrumbs.type.ts b/semcore/breadcrumbs/src/Breadcrumbs.type.ts index 2add7cc9be..25febdad23 100644 --- a/semcore/breadcrumbs/src/Breadcrumbs.type.ts +++ b/semcore/breadcrumbs/src/Breadcrumbs.type.ts @@ -1,11 +1,11 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { NSText } from '@semcore/typography'; import type { LocalizedMessages } from './translations/__intergalactic-dynamic-locales'; declare namespace NSBreadcrumbs { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Links divider * */ @@ -23,7 +23,7 @@ declare namespace NSBreadcrumbs { }; namespace Item { - type Props = BoxProps & { + type Props = NSBox.Props & { /** The property is responsible for the activity of the element */ active?: boolean; /** Specifies the locale for i18n support */ diff --git a/semcore/breadcrumbs/tsconfig.json b/semcore/breadcrumbs/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/breadcrumbs/tsconfig.json +++ b/semcore/breadcrumbs/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/bulk-textarea/.npmignore b/semcore/bulk-textarea/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/bulk-textarea/.npmignore +++ b/semcore/bulk-textarea/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/bulk-textarea/src/BulkTextarea.types.ts b/semcore/bulk-textarea/src/BulkTextarea.types.ts index 68a08b5f3c..00400f98e9 100644 --- a/semcore/bulk-textarea/src/BulkTextarea.types.ts +++ b/semcore/bulk-textarea/src/BulkTextarea.types.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type Button from '@semcore/button'; import type { Intergalactic } from '@semcore/core'; import type { NSCounter } from '@semcore/counter'; @@ -78,7 +78,7 @@ declare namespace NSBulktextarea { }; namespace InputField { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Unique id */ @@ -237,7 +237,7 @@ declare namespace NSBulktextarea { } type RootComponent = (( - props: Intergalactic.InternalTypings.ComponentProps<'div', 'div', BoxProps & NSBulktextarea.Props>, + props: Intergalactic.InternalTypings.ComponentProps<'div', 'div', NSBox.Props & NSBulktextarea.Props>, ) => Intergalactic.InternalTypings.ComponentRenderingResults) & Intergalactic.InternalTypings.ComponentAdditive<'div', 'div', {}>; diff --git a/semcore/bulk-textarea/src/components/InputField/InputField.tsx b/semcore/bulk-textarea/src/components/InputField/InputField.tsx index 3e90cde6c3..2a3acef027 100644 --- a/semcore/bulk-textarea/src/components/InputField/InputField.tsx +++ b/semcore/bulk-textarea/src/components/InputField/InputField.tsx @@ -1,5 +1,5 @@ import { Box } from '@semcore/base-components'; -import type { PopperContext } from '@semcore/base-components'; +import type { NSPopper } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import { Component, sstyled, Root } from '@semcore/core'; import { extractAriaProps } from '@semcore/core/lib/utils/ariaProps'; @@ -57,8 +57,8 @@ class InputField extends Component< containerRef = React.createRef(); textarea: HTMLOListElement; - popper: PopperContext['popper'] | null = null; - setPopperTrigger: PopperContext['setTrigger'] | null = null; + popper: NSPopper.Ctx['popper'] | null = null; + setPopperTrigger: NSPopper.Ctx['setTrigger'] | null = null; errorByInteraction: 'keyboard' | 'mouse' | null = null; diff --git a/semcore/bulk-textarea/tsconfig.json b/semcore/bulk-textarea/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/bulk-textarea/tsconfig.json +++ b/semcore/bulk-textarea/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/button/.npmignore b/semcore/button/.npmignore index 8e53be538d..48c803f7d9 100644 --- a/semcore/button/.npmignore +++ b/semcore/button/.npmignore @@ -4,3 +4,4 @@ coverage __tests__ .publishrc tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/button/src/component/Button/Button.type.ts b/semcore/button/src/component/Button/Button.type.ts index 8c04a0f7a4..e4525a9987 100644 --- a/semcore/button/src/component/Button/Button.type.ts +++ b/semcore/button/src/component/Button/Button.type.ts @@ -1,10 +1,10 @@ -import type { BoxProps, NeighborItemProps, SimpleHintPopperProps } from '@semcore/base-components'; +import type { NSBox, NSNeighborLocation, NSHint } from '@semcore/base-components'; import type { Intergalactic, PropGetterFn } from '@semcore/core'; import type { NSText } from '@semcore/typography'; import type React from 'react'; -export type ButtonProps = BoxProps & - NeighborItemProps & { +export type ButtonProps = NSBox.Props & + NSNeighborLocation.Detect.Props & { /** Button activity state */ active?: boolean; /** Disabled button state */ @@ -19,7 +19,7 @@ export type ButtonProps = BoxProps & * Placement for hint * @default top */ - hintPlacement?: SimpleHintPopperProps['placement']; + hintPlacement?: NSHint.Props['placement']; /** Button size. * @default `m` @@ -42,7 +42,7 @@ export type ButtonDefaultProps = { export type ButtonTextProps = NSText.Props; -export type ButtonAddonProps = BoxProps; +export type ButtonAddonProps = NSBox.Props; export type ButtonContext = { getTextProps: PropGetterFn; diff --git a/semcore/button/src/component/ButtonLink/ButtonLink.type.ts b/semcore/button/src/component/ButtonLink/ButtonLink.type.ts index df6bffbc83..cc2e1c3190 100644 --- a/semcore/button/src/component/ButtonLink/ButtonLink.type.ts +++ b/semcore/button/src/component/ButtonLink/ButtonLink.type.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type { LinkProps } from '@semcore/link'; import type { NSText } from '@semcore/typography'; @@ -20,7 +20,7 @@ export type ButtonLinkDefaultProps = { export type ButtonLinkTextProps = NSText.Props; -export type ButtonLinkAddonProps = BoxProps; +export type ButtonLinkAddonProps = NSBox.Props; export type ButtonLinkChildren = { Text: Intergalactic.Component<'span', ButtonLinkTextProps>; diff --git a/semcore/button/tsconfig.json b/semcore/button/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/button/tsconfig.json +++ b/semcore/button/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/card/.npmignore b/semcore/card/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/card/.npmignore +++ b/semcore/card/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/card/src/Card.type.ts b/semcore/card/src/Card.type.ts index cfc35c283d..4fd538604a 100644 --- a/semcore/card/src/Card.type.ts +++ b/semcore/card/src/Card.type.ts @@ -1,10 +1,10 @@ -import type { Box, BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type { Text, NSText } from '@semcore/typography'; import type React from 'react'; declare namespace NSCard { - type Props = BoxProps; + type Props = NSBox.Props; namespace Title { type Props = NSText.Props & { @@ -29,11 +29,11 @@ declare namespace NSCard { } namespace Header { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Body { - type Component = typeof Box; + type Component = NSBox.Component; } type Component = Intergalactic.Component<'div', Props> & { diff --git a/semcore/card/tsconfig.json b/semcore/card/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/card/tsconfig.json +++ b/semcore/card/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/carousel/.npmignore b/semcore/carousel/.npmignore index 8e53be538d..48c803f7d9 100644 --- a/semcore/carousel/.npmignore +++ b/semcore/carousel/.npmignore @@ -4,3 +4,4 @@ coverage __tests__ .publishrc tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/carousel/src/Carousel.tsx b/semcore/carousel/src/Carousel.tsx index ec8187b086..370ea4ca3c 100644 --- a/semcore/carousel/src/Carousel.tsx +++ b/semcore/carousel/src/Carousel.tsx @@ -1,5 +1,5 @@ import { createBreakpoints, Box, Flex } from '@semcore/base-components'; -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import Button from '@semcore/button'; import type { Intergalactic } from '@semcore/core'; import { createComponent, Component, sstyled, Root } from '@semcore/core'; diff --git a/semcore/carousel/src/Carousel.types.ts b/semcore/carousel/src/Carousel.types.ts index e4b4246c5b..e97e832a7c 100644 --- a/semcore/carousel/src/Carousel.types.ts +++ b/semcore/carousel/src/Carousel.types.ts @@ -1,10 +1,10 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { LocalizedMessages } from './translations/__intergalactic-dynamic-locales'; declare namespace NSCarousel { - type Props = BoxProps & { + type Props = NSBox.Props & { /** Index active item */ index?: number; /** @@ -63,15 +63,15 @@ declare namespace NSCarousel { }; namespace Container { - type Component = Intergalactic.Component<'div', BoxProps>; + type Component = Intergalactic.Component<'div', NSBox.Props>; } namespace ContentBox { - type Component = Intergalactic.Component<'div', BoxProps>; + type Component = Intergalactic.Component<'div', NSBox.Props>; } namespace Indicators { - type Props = BoxProps & { + type Props = NSBox.Props & { items?: NSCarousel.Item[]; inverted?: boolean; }; @@ -79,7 +79,7 @@ declare namespace NSCarousel { } namespace Indicator { - type Props = Omit & { + type Props = Omit & { active?: boolean; onClick?: () => void; inverted?: boolean; @@ -88,7 +88,7 @@ declare namespace NSCarousel { } namespace Item { - type Props = BoxProps & { + type Props = NSBox.Props & { /** Flag for css cursor * @private */ @@ -131,7 +131,7 @@ declare namespace NSCarousel { } namespace Prev { - type Props = BoxProps & { + type Props = NSBox.Props & { label?: string; inverted?: boolean; tabIndex?: number; @@ -140,7 +140,7 @@ declare namespace NSCarousel { } namespace Next { - type Props = BoxProps & { + type Props = NSBox.Props & { label?: string; inverted?: boolean; tabIndex?: number; diff --git a/semcore/carousel/tsconfig.json b/semcore/carousel/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/carousel/tsconfig.json +++ b/semcore/carousel/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/checkbox/.npmignore b/semcore/checkbox/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/checkbox/.npmignore +++ b/semcore/checkbox/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/checkbox/src/Checkbox.type.ts b/semcore/checkbox/src/Checkbox.type.ts index fd937a8f39..6a6e6e4146 100644 --- a/semcore/checkbox/src/Checkbox.type.ts +++ b/semcore/checkbox/src/Checkbox.type.ts @@ -1,11 +1,11 @@ -import type { Box, BoxProps, FlexProps } from '@semcore/base-components'; +import type { Box, NSBox, NSFlex } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { NSText } from '@semcore/typography'; declare namespace NSCheckbox { type Size = 'm' | 'l'; type State = 'normal' | 'invalid'; - type Props = BoxProps & { + type Props = NSBox.Props & { /** Callback when the value changes */ onChange?: (checked: boolean, e?: React.SyntheticEvent) => void; /** Controls the checked state of the checkbox (controlled mode) */ @@ -47,7 +47,7 @@ declare namespace NSCheckbox { type Handlers = { checked: (e: React.ChangeEvent) => boolean; }; - type Props = FlexProps & { + type Props = NSFlex.Props & { /** Callback when the value changes */ onChange?: (checked: boolean, e?: React.SyntheticEvent) => void; }; diff --git a/semcore/checkbox/tsconfig.json b/semcore/checkbox/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/checkbox/tsconfig.json +++ b/semcore/checkbox/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/color-picker/.npmignore b/semcore/color-picker/.npmignore index 4bcb641629..7e7abcc098 100644 --- a/semcore/color-picker/.npmignore +++ b/semcore/color-picker/.npmignore @@ -4,3 +4,5 @@ coverage __tests__ .publishrc src +tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/color-picker/src/ColorPicker.type.ts b/semcore/color-picker/src/ColorPicker.type.ts index 4a72c46eab..bf8406aed7 100644 --- a/semcore/color-picker/src/ColorPicker.type.ts +++ b/semcore/color-picker/src/ColorPicker.type.ts @@ -1,4 +1,4 @@ -import type { BoxProps, Popper } from '@semcore/base-components'; +import type { NSBox, NSPopper } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { DropdownProps } from '@semcore/dropdown'; import type Dropdown from '@semcore/dropdown'; @@ -58,11 +58,11 @@ declare namespace NSColorPicker { } namespace Popper { - type Component = typeof Popper.Popper; + type Component = NSPopper.Popper.Component; } namespace Colors { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Array of color items */ diff --git a/semcore/color-picker/src/components/Item.type.ts b/semcore/color-picker/src/components/Item.type.ts index 5a11c8c98a..57f897acb1 100644 --- a/semcore/color-picker/src/components/Item.type.ts +++ b/semcore/color-picker/src/components/Item.type.ts @@ -1,8 +1,8 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; /** TODO: revise component structure */ /** @deprecated It will be removed in v18. */ -export type ItemProps = BoxProps & { +export type ItemProps = NSBox.Props & { /** * Color item in hexadecimal format. */ diff --git a/semcore/color-picker/tsconfig.json b/semcore/color-picker/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/color-picker/tsconfig.json +++ b/semcore/color-picker/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/core/.npmignore b/semcore/core/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/core/.npmignore +++ b/semcore/core/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/core/tsconfig-utils.json b/semcore/core/tsconfig-utils.json index 17c2930c49..84ea93a0ad 100644 --- a/semcore/core/tsconfig-utils.json +++ b/semcore/core/tsconfig-utils.json @@ -1,4 +1,4 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/utils", "src/decorators", "../../tools/theme/src"] } diff --git a/semcore/core/tsconfig.json b/semcore/core/tsconfig.json index a551c16819..32338c47ed 100644 --- a/semcore/core/tsconfig.json +++ b/semcore/core/tsconfig.json @@ -1,7 +1,8 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "compilerOptions": { - "rootDir": "./src" + "rootDir": "./src", + "outDir": "${configDir}/lib" }, "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"] } diff --git a/semcore/counter/.npmignore b/semcore/counter/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/counter/.npmignore +++ b/semcore/counter/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/counter/src/Counter.type.ts b/semcore/counter/src/Counter.type.ts index 40dd080152..3c75937b7a 100644 --- a/semcore/counter/src/Counter.type.ts +++ b/semcore/counter/src/Counter.type.ts @@ -1,8 +1,8 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; declare namespace NSCounter { - type Props = BoxProps & { + type Props = NSBox.Props & { /** Counter theme or custom color */ theme?: 'warning' | 'danger' | 'info' | string; diff --git a/semcore/counter/tsconfig.json b/semcore/counter/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/counter/tsconfig.json +++ b/semcore/counter/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/d3-chart/.npmignore b/semcore/d3-chart/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/d3-chart/.npmignore +++ b/semcore/d3-chart/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/d3-chart/src/component/Chart/AbstractChart.type.ts b/semcore/d3-chart/src/component/Chart/AbstractChart.type.ts index fbfb75eeab..edcc2fef8e 100644 --- a/semcore/d3-chart/src/component/Chart/AbstractChart.type.ts +++ b/semcore/d3-chart/src/component/Chart/AbstractChart.type.ts @@ -1,4 +1,4 @@ -import type { FlexProps } from '@semcore/base-components'; +import type { NSFlex } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type Icon from '@semcore/icon'; import type React from 'react'; @@ -56,7 +56,7 @@ export type AriaNameProps = Intergalactic.RequireAtLeastOne<{ 'title'?: string; }>; -export type BaseChartProps = FlexProps & { +export type BaseChartProps = NSFlex.Props & { /** * Chart data. For all charts except Donut(Pie), Radar and Venn should be an Array */ diff --git a/semcore/d3-chart/src/component/ChartLegend/BaseLegend.type.ts b/semcore/d3-chart/src/component/ChartLegend/BaseLegend.type.ts index bc3e6fed0d..14f7dd1237 100644 --- a/semcore/d3-chart/src/component/ChartLegend/BaseLegend.type.ts +++ b/semcore/d3-chart/src/component/ChartLegend/BaseLegend.type.ts @@ -1,4 +1,4 @@ -import type { BoxProps, FlexProps } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type { LegendItem, LegendItemKey, ShapeType } from './LegendItem/LegendItem.type'; import type { DataStructureHints } from '../../a11y/hints'; @@ -7,7 +7,7 @@ import type { AriaNameProps } from '../Chart/AbstractChart.type'; export type LSize = 'm' | 'l'; -export type BaseChartLegendProps = FlexProps & +export type BaseChartLegendProps = NSFlex.Props & AriaNameProps & { /** * Size for legend items @@ -29,7 +29,7 @@ export type BaseChartLegendProps = FlexProps & dataHints?: DataStructureHints; }; -export type LegendProps = BoxProps & +export type LegendProps = NSBox.Props & BaseChartLegendProps & { /** * Legend items diff --git a/semcore/d3-chart/src/component/ChartLegend/LegendFlex/LegendFlex.type.ts b/semcore/d3-chart/src/component/ChartLegend/LegendFlex/LegendFlex.type.ts index 64571ee9d2..c746c677f5 100644 --- a/semcore/d3-chart/src/component/ChartLegend/LegendFlex/LegendFlex.type.ts +++ b/semcore/d3-chart/src/component/ChartLegend/LegendFlex/LegendFlex.type.ts @@ -1,4 +1,4 @@ -import type { Flex, FlexProps } from '@semcore/base-components'; +import type { NSFlex } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type { LegendProps } from '../BaseLegend.type'; @@ -32,13 +32,13 @@ type SuffixProps = { type AddonProps = ({ withTrend?: never } & SuffixProps) | ({ suffix?: never } & TrendProps); -export type LegendFlexProps = LegendProps & AddonProps & FlexProps; +export type LegendFlexProps = LegendProps & AddonProps & NSFlex.Props; export type LegendFlexDefaultProps = { direction: 'row'; children: React.JSX.Element; }; -export type LegendFlexType = Intergalactic.Component & { +export type LegendFlexType = Intergalactic.Component & { LegendItem: LegendItemType; }; diff --git a/semcore/d3-chart/src/types/CompactHorizontalBar.d.ts b/semcore/d3-chart/src/types/CompactHorizontalBar.d.ts index d1dba10bf2..e80261adfd 100644 --- a/semcore/d3-chart/src/types/CompactHorizontalBar.d.ts +++ b/semcore/d3-chart/src/types/CompactHorizontalBar.d.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { BackgroundProps } from './Bar'; import type { Context } from './context'; @@ -33,17 +33,17 @@ type BarContext = { index: number; }; -export type CompactHorizontalBarHoverProps = BoxProps; +export type CompactHorizontalBarHoverProps = NSBox.Props; type Hover = IntergalacticD3Component<'rect', CompactHorizontalBarHoverProps, Context>; -export type CompactHorizontalBarAnnotationProps = BoxProps; +export type CompactHorizontalBarAnnotationProps = NSBox.Props; type Annotation = IntergalacticD3Component< 'foreignObject', CompactHorizontalBarAnnotationProps, Context & BarContext >; -export type CompactHorizontalBarLabelProps = BoxProps; +export type CompactHorizontalBarLabelProps = NSBox.Props; type Label = IntergalacticD3Component<'div', CompactHorizontalBarLabelProps, Context & BarContext>; -export type CompactHorizontalBarPercentProps = BoxProps; +export type CompactHorizontalBarPercentProps = NSBox.Props; export type CompactHorizontalBarPercentContext = { formatted: string; percent: number; @@ -53,7 +53,7 @@ type Percent = IntergalacticD3Component< CompactHorizontalBarPercentProps, Context & CompactHorizontalBarPercentContext >; -export type CompactHorizontalBarValueProps = BoxProps; +export type CompactHorizontalBarValueProps = NSBox.Props; export type CompactHorizontalBarValueContext = { formatted: string; value: number } & BarContext; type Value = IntergalacticD3Component< 'div', @@ -62,9 +62,9 @@ type Value = IntergalacticD3Component< >; export type CompactHorizontalBarBarProps = {}; type Bar = IntergalacticD3Component<'g', CompactHorizontalBarBarProps, Context & BarContext>; -export type CompactHorizontalBarBackgroundProps = BoxProps; +export type CompactHorizontalBarBackgroundProps = NSBox.Props; type Background = IntergalacticD3Component<'rect', BackgroundProps, Context & BarContext>; -export type CompactHorizontalBarFillProps = BoxProps & { +export type CompactHorizontalBarFillProps = NSBox.Props & { patterns?: PatternsConfig; color?: string; transparent?: boolean; diff --git a/semcore/d3-chart/src/types/Hover.d.ts b/semcore/d3-chart/src/types/Hover.d.ts index 6928689002..c578a1557d 100644 --- a/semcore/d3-chart/src/types/Hover.d.ts +++ b/semcore/d3-chart/src/types/Hover.d.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { UnknownProperties, ReturnEl } from '@semcore/core'; import type React from 'react'; @@ -31,7 +31,7 @@ type HoverTooltip = (( }) => { children: ReturnEl }; /** Flag for hide line on hovered value */ hideHoverLine?: boolean | ((xIndex: number | null, yIndex: number | null) => boolean); - } & Omit, + } & Omit, ) => ReturnEl) & TooltipTypeBase; diff --git a/semcore/d3-chart/src/types/Line.d.ts b/semcore/d3-chart/src/types/Line.d.ts index cc047b674a..c55c68d21e 100644 --- a/semcore/d3-chart/src/types/Line.d.ts +++ b/semcore/d3-chart/src/types/Line.d.ts @@ -1,4 +1,4 @@ -import type { FadeInOutProps } from '@semcore/base-components'; +import type { NSAnimation } from '@semcore/base-components'; import type { UnknownProperties } from '@semcore/core'; import type { CurveFactory } from 'd3-shape'; @@ -34,7 +34,7 @@ export type LineProps = Context & { /** @deprecated */ export interface ILineDotsProps extends LineDotsProps, UnknownProperties {} export type LineDotsProps = Context & - Omit & { + Omit & { /** Show dots */ display?: boolean | ((index: number, active: boolean, single: boolean) => boolean); /** Hide property */ diff --git a/semcore/d3-chart/src/types/Plot.d.ts b/semcore/d3-chart/src/types/Plot.d.ts index 973a6db5cd..91127f4aa6 100644 --- a/semcore/d3-chart/src/types/Plot.d.ts +++ b/semcore/d3-chart/src/types/Plot.d.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { UnknownProperties, Intergalactic } from '@semcore/core'; import type { DataStructureHints } from './a11y/hints'; @@ -9,7 +9,7 @@ import type { PlotEventEmitter } from './utils'; /** @deprecated */ export interface IPlotProps extends PlotProps, UnknownProperties {} export type PlotProps = Context & - BoxProps & { + NSBox.Props & { /** Width of the svg element * @default 0 */ width?: number; diff --git a/semcore/d3-chart/src/types/Radar.d.ts b/semcore/d3-chart/src/types/Radar.d.ts index 35bbe58db7..b7c0a66b67 100644 --- a/semcore/d3-chart/src/types/Radar.d.ts +++ b/semcore/d3-chart/src/types/Radar.d.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { UnknownProperties } from '@semcore/core'; import type { CurveFactory } from 'd3-shape'; @@ -121,7 +121,7 @@ export type RadialPolygonDotsProps = { /** @deprecated */ export interface IRadarHoverProps extends RadarHoverProps, UnknownProperties {} -export type RadarHoverProps = BoxProps & Context & {}; +export type RadarHoverProps = NSBox.Props & Context & {}; declare const Radar: IntergalacticD3Component<'g', RadarProps, Context> & { Axis: IntergalacticD3Component<'path', RadarAxisProps, Context> & { diff --git a/semcore/d3-chart/src/types/ResponsiveContainer.d.ts b/semcore/d3-chart/src/types/ResponsiveContainer.d.ts index 50346b93fb..c053b3bf1f 100644 --- a/semcore/d3-chart/src/types/ResponsiveContainer.d.ts +++ b/semcore/d3-chart/src/types/ResponsiveContainer.d.ts @@ -1,11 +1,11 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { UnknownProperties } from '@semcore/core'; import type { IntergalacticD3Component } from './Plot'; /** @deprecated */ export interface IResponsiveContainerProps extends ResponsiveContainerProps, UnknownProperties {} -export type ResponsiveContainerProps = BoxProps & { +export type ResponsiveContainerProps = NSBox.Props & { /** Relation between height and width dimensions block */ aspect?: number; /** Callback which will be called after changing the block size */ diff --git a/semcore/d3-chart/src/types/Tooltip.d.ts b/semcore/d3-chart/src/types/Tooltip.d.ts index b91e2b60e1..d8e1737d46 100644 --- a/semcore/d3-chart/src/types/Tooltip.d.ts +++ b/semcore/d3-chart/src/types/Tooltip.d.ts @@ -1,4 +1,4 @@ -import type { Popper, Box, BoxProps, PopperProps, PopperTriggerProps } from '@semcore/base-components'; +import type { NSBox, NSPopper } from '@semcore/base-components'; import type { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core'; import type React from 'react'; @@ -7,8 +7,8 @@ import type { IntergalacticD3Component } from './Plot'; /** @deprecated */ export interface ITooltipChartProps extends TooltipChartProps, UnknownProperties {} -export type TooltipChartProps = PopperProps & - PopperTriggerProps & +export type TooltipChartProps = NSPopper.Props & + NSPopper.Trigger.Props & Context & { /** Field name from `data` array item for the XAxis */ x?: string; @@ -31,15 +31,15 @@ export type TooltipChartContext = { }; export type TooltipTypeBase = { - Trigger: typeof Popper.Trigger; - Popper: typeof Popper.Popper; - Title: typeof Box; - Dot: IntergalacticD3Component<'div', BoxProps & { color?: string }, TooltipChartContext>; - Footer: typeof Box; + Trigger: NSPopper.Trigger.Component; + Popper: NSPopper.Popper.Component; + Title: NSBox.Component; + Dot: IntergalacticD3Component<'div', NSBox.Props & { color?: string }, TooltipChartContext>; + Footer: NSBox.Component; }; export type TooltipType = (< - Tag extends Intergalactic.Tag = typeof Box, + Tag extends Intergalactic.Tag = NSBox.Component, >( props: Intergalactic.InternalTypings.PropsRenderingResultComponentProps< Tag, diff --git a/semcore/d3-chart/src/types/Venn.d.ts b/semcore/d3-chart/src/types/Venn.d.ts index 1d0511e65a..4b6f4aad88 100644 --- a/semcore/d3-chart/src/types/Venn.d.ts +++ b/semcore/d3-chart/src/types/Venn.d.ts @@ -1,4 +1,4 @@ -import type { FadeInOutProps } from '@semcore/base-components'; +import type { NSAnimation } from '@semcore/base-components'; import type { UnknownProperties } from '@semcore/core'; import type { Context } from './context'; @@ -9,7 +9,7 @@ import type { TooltipType } from './Tooltip'; /** @deprecated */ export interface IVennProps extends VennProps, UnknownProperties {} export type VennProps = Context & - FadeInOutProps & { + NSAnimation.FadeInOut.Props & { /** * Rotate sets in the chart * @default Math.PI / 2 @@ -55,7 +55,7 @@ export type CircleProps = Context & { /** @deprecated */ export interface IIntersectionProps extends IntersectionProps, UnknownProperties {} export type IntersectionProps = Context & - FadeInOutProps & { + NSAnimation.FadeInOut.Props & { /** * Name of the field in the data * */ diff --git a/semcore/d3-chart/tsconfig.json b/semcore/d3-chart/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/d3-chart/tsconfig.json +++ b/semcore/d3-chart/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/data-table/.npmignore b/semcore/data-table/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/data-table/.npmignore +++ b/semcore/data-table/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/data-table/src/components/DataTable/DataTable.types.ts b/semcore/data-table/src/components/DataTable/DataTable.types.ts index acd32349f8..b4b8d4fa1c 100644 --- a/semcore/data-table/src/components/DataTable/DataTable.types.ts +++ b/semcore/data-table/src/components/DataTable/DataTable.types.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type Tooltip from '@semcore/tooltip'; import type * as React from 'react'; @@ -42,7 +42,7 @@ export type DataTableData = DataRowItem[]; export type DTUse = 'primary' | 'secondary'; -export type Sizes = Partial>; +export type Sizes = Partial>; export type DataTableProps< Data extends DataTableData, diff --git a/semcore/data-table/tsconfig.json b/semcore/data-table/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/data-table/tsconfig.json +++ b/semcore/data-table/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/date-picker/.npmignore b/semcore/date-picker/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/date-picker/.npmignore +++ b/semcore/date-picker/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/date-picker/src/index.d.ts b/semcore/date-picker/src/index.d.ts index c8698b9046..f50dedaf2a 100644 --- a/semcore/date-picker/src/index.d.ts +++ b/semcore/date-picker/src/index.d.ts @@ -1,4 +1,4 @@ -import type { Flex, Box, BoxProps } from '@semcore/base-components'; +import type { NSFlex, NSBox } from '@semcore/base-components'; import type Popper from '@semcore/base-components'; import type { BaseTriggerProps } from '@semcore/base-trigger'; import type BaseTrigger from '@semcore/base-trigger'; @@ -25,7 +25,7 @@ export type DateConstructorParams = string | number | Date; * */ export type DisabledDates = (DateConstructorParams | (DateConstructorParams | false)[] | string)[]; -export type CalendarProps = BoxProps & { +export type CalendarProps = NSBox.Props & { /** * Locale for displaying the days of a week and months, to be transferred to `Intl` * @default en @@ -64,7 +64,7 @@ export type CalendarMonthsContext = { months: CalendarUnitProps[]; }; -export type CalendarUnitProps = BoxProps & { +export type CalendarUnitProps = NSBox.Props & { /** Indicates if the calendar unit is part of a selected date range */ selected?: boolean; /** Marks units from previous/next months that appear in the current month view */ @@ -225,7 +225,7 @@ WithI18nEnhanceProps & { periods?: (ButtonProps & { value: Date[] })[]; }; -export type DateRangePickerPeriodProps = BoxProps & { +export type DateRangePickerPeriodProps = NSBox.Props & { /** * Current selected period * */ @@ -351,12 +351,12 @@ declare const DatePicker: Intergalactic.Component< }; Trigger: typeof InputTrigger; Popper: typeof Popper.Popper; - Header: typeof Box; + Header: NSBox.Component; Title: Intergalactic.Component<'div', DatePickerProps, DatePickerContext>; Prev: typeof Button; Next: typeof Button; Calendar: typeof Calendar; - Today: typeof Box; + Today: NSBox.Component; add: (date: number | Date, amount: number, unit: dayjs.OpUnitType) => Date; subtract: (date: number | Date, amount: number, unit: dayjs.OpUnitType) => Date; }; @@ -385,7 +385,7 @@ declare const DateRangePicker: Intergalactic.Component< }; Trigger: typeof RangeInputTrigger; Popper: typeof Popper.Popper; - Header: typeof Box; + Header: NSBox.Component; Title: Intergalactic.Component<'div', DateRangePickerProps, DateRangePickerContext>; Prev: typeof Button; Next: typeof Button; @@ -420,7 +420,7 @@ declare const MonthPicker: Intergalactic.Component< }; Trigger: typeof InputTrigger; Popper: typeof Popper.Popper; - Header: typeof Box; + Header: NSBox.Component; Title: Intergalactic.Component<'div', DatePickerProps, MonthPickerContext>; Prev: typeof Button; Next: typeof Button; @@ -453,7 +453,7 @@ declare const MonthRangePicker: Intergalactic.Component< }; Trigger: typeof RangeInputTrigger; Popper: typeof Popper.Popper; - Header: typeof Box; + Header: NSBox.Component; Title: Intergalactic.Component<'div', DateRangePickerProps, MonthRangePickerContext>; Prev: typeof Button; Next: typeof Button; @@ -606,15 +606,15 @@ declare const DateRangeComparator: Intergalactic.Component< DateRangeComparatorContext & CalendarDaysContext > & { Popper: typeof Popper.Popper; - Header: typeof Flex; + Header: NSFlex.Component; Prev: typeof Button; Next: typeof Button; Calendar: typeof Calendar; Apply: typeof Button; Reset: typeof Button; - CalendarHeader: typeof Box; - Title: typeof Box; + CalendarHeader: NSBox.Component; + Title: NSBox.Component; Trigger: Intergalactic.Component<'div', DropdownTriggerProps & BaseTriggerProps> & { Addon: typeof BaseTrigger.Addon; @@ -623,15 +623,15 @@ declare const DateRangeComparator: Intergalactic.Component< ValueDateRange: Intergalactic.Component<'div', InputTriggerProps>; CompareToggle: typeof Checkbox; CompareDateRange: Intergalactic.Component<'div', InputTriggerProps>; - Body: typeof Flex; - RangeCalendar: typeof Flex; - Periods: typeof Flex & { + Body: NSFlex.Component; + RangeCalendar: NSFlex.Component; + Periods: NSFlex.Component & { Divider: typeof Divider; - Column: typeof Flex; - Options: typeof Flex; - Controls: typeof Flex; + Column: NSFlex.Component; + Options: NSFlex.Component; + Controls: NSFlex.Component; }; - Footer: typeof Flex; + Footer: NSFlex.Component; }; declare const MonthDateRangeComparator: typeof DateRangeComparator; diff --git a/semcore/date-picker/tsconfig.json b/semcore/date-picker/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/date-picker/tsconfig.json +++ b/semcore/date-picker/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/divider/.npmignore b/semcore/divider/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/divider/.npmignore +++ b/semcore/divider/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/divider/src/Divider.type.ts b/semcore/divider/src/Divider.type.ts index 1fa445775b..49c4934be8 100644 --- a/semcore/divider/src/Divider.type.ts +++ b/semcore/divider/src/Divider.type.ts @@ -1,8 +1,8 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; declare namespace NSDivider { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Type of the divider * @default primary diff --git a/semcore/divider/tsconfig.json b/semcore/divider/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/divider/tsconfig.json +++ b/semcore/divider/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/dot/.npmignore b/semcore/dot/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/dot/.npmignore +++ b/semcore/dot/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/dot/src/Dot.type.ts b/semcore/dot/src/Dot.type.ts index a444b2ec59..b4047be6ec 100644 --- a/semcore/dot/src/Dot.type.ts +++ b/semcore/dot/src/Dot.type.ts @@ -1,8 +1,8 @@ -import type { AnimationProps, BoxProps } from '@semcore/base-components'; +import type { NSAnimation, NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; declare namespace NSDot { - type Props = BoxProps & AnimationProps & { + type Props = NSBox.Props & NSAnimation.Props & { /** Size of the dot * @default m */ diff --git a/semcore/dot/tsconfig.json b/semcore/dot/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/dot/tsconfig.json +++ b/semcore/dot/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/drag-and-drop/.npmignore b/semcore/drag-and-drop/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/drag-and-drop/.npmignore +++ b/semcore/drag-and-drop/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/drag-and-drop/src/DragAndDrop.type.ts b/semcore/drag-and-drop/src/DragAndDrop.type.ts index 148c82d10b..8899941efa 100644 --- a/semcore/drag-and-drop/src/DragAndDrop.type.ts +++ b/semcore/drag-and-drop/src/DragAndDrop.type.ts @@ -1,4 +1,4 @@ -import type { Box, BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { LocalizedMessages } from './translations/__intergalactic-dynamic-locales'; @@ -12,7 +12,7 @@ type DNDAriaProps = Intergalactic.RequireAtLeastOne<{ 'title'?: string; }>; -export type DragAndDropProps = BoxProps & { +export type DragAndDropProps = NSBox.Props & { /** * Controlled drag and drop handler */ @@ -35,7 +35,7 @@ export type DragAndDropDefaultProps = { locale: 'en'; }; -export type DraggableProps = BoxProps & { +export type DraggableProps = NSBox.Props & { /** Placement of visual drag-and-drop marker * @default right * */ @@ -63,7 +63,7 @@ export type DragAndDropContext = { getDroppableProps: PropGetterFn; }; -export type DropZoneProps = BoxProps & +export type DropZoneProps = NSBox.Props & DNDAriaProps & { /** * Used for add zoneName in a11y hints @@ -77,5 +77,5 @@ export type DragAndDropComponent = Intergalactic.Component< DragAndDropContext > & { Draggable: Intergalactic.Component<'div', DraggableProps & DNDAriaProps>; - DropZone: Intergalactic.Component; + DropZone: Intergalactic.Component; }; diff --git a/semcore/drag-and-drop/tsconfig.json b/semcore/drag-and-drop/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/drag-and-drop/tsconfig.json +++ b/semcore/drag-and-drop/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/dropdown-menu/.npmignore b/semcore/dropdown-menu/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/dropdown-menu/.npmignore +++ b/semcore/dropdown-menu/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/dropdown-menu/src/index.d.ts b/semcore/dropdown-menu/src/index.d.ts index 85260d57c9..815edb7e61 100644 --- a/semcore/dropdown-menu/src/index.d.ts +++ b/semcore/dropdown-menu/src/index.d.ts @@ -1,4 +1,4 @@ -import type { Box, BoxProps, FlexProps, Flex, eventInteraction, ScrollAreaProps } from '@semcore/base-components'; +import type { NSBox, NSFlex, NSPopper, NSScrollArea } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { DropdownContext, @@ -9,7 +9,7 @@ import type { StatusItemComponent, } from '@semcore/dropdown'; import type Dropdown from '@semcore/dropdown'; -import type { Text } from '@semcore/typography'; +import type { NSText } from '@semcore/typography'; import type { VirtualList, RenderRowProps } from './components/VirtualList'; @@ -55,8 +55,8 @@ export type DropdownMenuProps = DropdownProps & { itemsCount?: number; }; -export type DropdownMenuListProps = BoxProps & - ScrollAreaProps & { +export type DropdownMenuListProps = NSBox.Props & + NSScrollArea.Props & { /** * Size of the menu * @default m @@ -66,7 +66,7 @@ export type DropdownMenuListProps = BoxProps & export type DropdownMenuMenuProps = DropdownMenuListProps & {}; -export type DropdownMenuItemProps = FlexProps & { +export type DropdownMenuItemProps = NSFlex.Props & { /** * Enables selected state. For selectable dropdowns only. */ @@ -130,7 +130,7 @@ declare const DropdownMenu: Intergalactic.Component< [handlers: DropdownMenuHandlers] >; Actions: Intergalactic.Component< - typeof Flex, + NSFlex.Component, DropdownMenuListProps, DropdownMenuContext, [handlers: DropdownMenuHandlers] @@ -147,10 +147,10 @@ declare const DropdownMenu: Intergalactic.Component< DropdownMenuContext, [handlers: DropdownMenuHandlers] > & { - Addon: typeof Box; - Content: typeof Flex; - Text: typeof Text; - Hint: typeof Flex; + Addon: NSBox.Component; + Content: NSFlex.Component; + Text: NSText.Component; + Hint: NSFlex.Component; }; Group: typeof Dropdown.Group; @@ -160,7 +160,7 @@ declare const DropdownMenu: Intergalactic.Component< VirtualList: typeof VirtualList; selectedIndexContext: React.Context; - nestedMenuInteraction: eventInteraction; + nestedMenuInteraction: NSPopper.EventInteraction; }; export default DropdownMenu; diff --git a/semcore/dropdown-menu/tsconfig.json b/semcore/dropdown-menu/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/dropdown-menu/tsconfig.json +++ b/semcore/dropdown-menu/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/dropdown/.npmignore b/semcore/dropdown/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/dropdown/.npmignore +++ b/semcore/dropdown/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/dropdown/src/index.d.ts b/semcore/dropdown/src/index.d.ts index 244a66abad..f9c15cfda1 100644 --- a/semcore/dropdown/src/index.d.ts +++ b/semcore/dropdown/src/index.d.ts @@ -1,15 +1,8 @@ -import type { Box, BoxProps, - Popper, - PopperContext, - PopperProps, - PopperHandlers, - PopperTriggerProps, - PopperPopperProps, -} from '@semcore/base-components'; +import type { NSBox, NSPopper } from '@semcore/base-components'; import type { Intergalactic, PropGetterFn } from '@semcore/core'; import type React from 'react'; -export type DropdownProps = PopperProps & { +export type DropdownProps = NSPopper.Props & { /** * Modifier responsible for the size of the pop-up window: * `fixed` - a pop-up window of the same size as trigger; @@ -22,13 +15,13 @@ export type DropdownProps = PopperProps & { locale?: string; }; -export type DropdownContext = PopperContext & { +export type DropdownContext = NSPopper.Ctx & { getGroupProps: PropGetterFn; }; -export type DropdownHandlers = PopperHandlers & {}; +export type DropdownHandlers = NSPopper.Handlers & {}; -export type DropdownTriggerProps = PopperTriggerProps; +export type DropdownTriggerProps = NSPopper.Trigger.Props; /** * DropdownPopper must have an accessible name (aria-dialog-name). @@ -40,7 +33,7 @@ export type DropdownPopperAriaProps = Intergalactic.RequireAtLeastOne<{ 'title'?: string; }>; -export type DropdownPopperProps = PopperPopperProps & +export type DropdownPopperProps = NSPopper.Popper.Props & DropdownPopperAriaProps & { /** * Popper in Dropdown should have role `dialog`. @@ -49,7 +42,7 @@ export type DropdownPopperProps = PopperPopperProps & role?: 'dialog'; }; -export type DropdownGroupProps = BoxProps & { +export type DropdownGroupProps = NSBox.Props & { /** Title for group of dropdown menu items */ title: React.ReactNode; /** Subtitle for group of dropdown menu items */ @@ -77,14 +70,14 @@ declare const Dropdown: Intergalactic.Component< DropdownContext, [handlers: DropdownHandlers] > & { - Trigger: typeof Popper.Trigger; + Trigger: NSPopper.Trigger.Component; Popper: Intergalactic.Component< 'div', DropdownPopperProps, - PopperContext, - [handlers: PopperHandlers] + NSPopper.Ctx, + [handlers: NSPopper.Handlers] >; - Item: Intergalactic.Component; + Item: Intergalactic.Component; Group: Intergalactic.Component<'div', DropdownGroupProps>; StatusItem: StatusItemComponent; }; diff --git a/semcore/dropdown/tsconfig.json b/semcore/dropdown/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/dropdown/tsconfig.json +++ b/semcore/dropdown/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/ellipsis/.npmignore b/semcore/ellipsis/.npmignore index f346cab7f9..939251ac4a 100644 --- a/semcore/ellipsis/.npmignore +++ b/semcore/ellipsis/.npmignore @@ -3,4 +3,6 @@ node_modules coverage __tests__ .publishrc -src \ No newline at end of file +src +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/ellipsis/src/Ellipsis.tsx b/semcore/ellipsis/src/Ellipsis.tsx index 67d2f2b99b..1f89fb5724 100644 --- a/semcore/ellipsis/src/Ellipsis.tsx +++ b/semcore/ellipsis/src/Ellipsis.tsx @@ -1,4 +1,5 @@ -import { Box, type BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; +import { Box } from '@semcore/base-components'; import { createComponent, Component, type Intergalactic, Root, sstyled } from '@semcore/core'; import { callAllEventHandlers } from '@semcore/core/lib/utils/assignProps'; import findComponent, { isAdvanceMode } from '@semcore/core/lib/utils/findComponent'; @@ -40,7 +41,7 @@ type AsPropsMiddle = { tag?: React.ElementType; }; -type EllipsisProps = BoxProps & +type EllipsisProps = NSBox.Props & Partial & { /** * Rows count in multiline Ellipsis @@ -79,7 +80,7 @@ type DefaultProps = { }; type EllipsisComponent = Intergalactic.Component<'div', EllipsisProps> & { - Content: typeof Box; + Content: NSBox.Component; Popper: typeof Tooltip.Popper; }; diff --git a/semcore/ellipsis/src/index.d.ts b/semcore/ellipsis/src/index.d.ts index 836f7061e9..2c450b968f 100644 --- a/semcore/ellipsis/src/index.d.ts +++ b/semcore/ellipsis/src/index.d.ts @@ -1,10 +1,10 @@ -import type { Box, BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { UnknownProperties, Intergalactic } from '@semcore/core'; import type { TooltipProps } from '@semcore/tooltip'; import type Tooltip from '@semcore/tooltip'; import type { RefObject } from 'react'; -export type EllipsisProps = BoxProps & +export type EllipsisProps = NSBox.Props & Partial & { /** * Rows count in multiline Ellipsis. @@ -44,7 +44,7 @@ declare const useResizeObserver: ( * @deprecated. Use Text with ellipsis property for @semcore/typography. */ declare const Ellipsis: Intergalactic.Component<'div', EllipsisProps> & { - Content: typeof Box; + Content: NSBox.Component; Popper: typeof Tooltip.Popper; }; diff --git a/semcore/ellipsis/tsconfig.json b/semcore/ellipsis/tsconfig.json index 9a6274de6f..543f7ee479 100644 --- a/semcore/ellipsis/tsconfig.json +++ b/semcore/ellipsis/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/errors/.npmignore b/semcore/errors/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/errors/.npmignore +++ b/semcore/errors/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/errors/src/Error.type.ts b/semcore/errors/src/Error.type.ts index 5ba33ea523..568dcce6cb 100644 --- a/semcore/errors/src/Error.type.ts +++ b/semcore/errors/src/Error.type.ts @@ -1,10 +1,10 @@ -import type { Box, FlexProps } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type { Intergalactic, PropGetterFn } from '@semcore/core'; import type { TIllustrationNamesErrors } from '@semcore/illustration'; import type React from 'react'; declare namespace NSErrors { - type Props = FlexProps & { + type Props = NSFlex.Props & { /** * Error icon * Icon as a string is a URL to an image. @@ -19,15 +19,15 @@ declare namespace NSErrors { type IconName = TIllustrationNamesErrors; namespace Title { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Description { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Controls { - type Component = typeof Box; + type Component = NSBox.Component; } type Component = Intergalactic.Component<'div', Props, Ctx> & { diff --git a/semcore/errors/tsconfig.json b/semcore/errors/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/errors/tsconfig.json +++ b/semcore/errors/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/feature-highlight/.npmignore b/semcore/feature-highlight/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/feature-highlight/.npmignore +++ b/semcore/feature-highlight/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/feature-highlight/tsconfig.json b/semcore/feature-highlight/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/feature-highlight/tsconfig.json +++ b/semcore/feature-highlight/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/feature-popover/.npmignore b/semcore/feature-popover/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/feature-popover/.npmignore +++ b/semcore/feature-popover/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/feature-popover/src/FeaturePopover.type.ts b/semcore/feature-popover/src/FeaturePopover.type.ts index d7b063160e..19b70ab3e7 100644 --- a/semcore/feature-popover/src/FeaturePopover.type.ts +++ b/semcore/feature-popover/src/FeaturePopover.type.ts @@ -5,18 +5,7 @@ import type { Options as OptionsFlip } from '@popperjs/core/lib/modifiers/flip'; import type { Options as OptionsOffset } from '@popperjs/core/lib/modifiers/offset'; import type { Options as OptionsPreventOverflow } from '@popperjs/core/lib/modifiers/preventOverflow'; import type { Modifier, Options, PositioningStrategy } from '@popperjs/core/lib/types'; -import type { - AnimationProps, - BoxProps, - OutsideClickProps, - PortalProps, - Box, - PopperProps, - PopperContext, - PopperPopperProps, - Placement, - Popper, -} from '@semcore/base-components'; +import type { NSAnimation, NSBox, NSOutsideClick, NSPortal, NSPopper } from '@semcore/base-components'; import type { Intergalactic, PropGetterFn } from '@semcore/core'; import type { WithI18nEnhanceProps } from '@semcore/core/lib/utils/enhances/i18nEnhance'; import type { UniqueIDProps } from '@semcore/core/lib/utils/uniqueID'; @@ -33,7 +22,7 @@ declare namespace NSFeaturePopover { * The position of the popper relative to the trigger that called it. * @default auto */ - placement?: Placement; + placement?: NSPopper.Placement; /** * The theme of FeaturePopover * @default accent @@ -51,25 +40,25 @@ declare namespace NSFeaturePopover { theme: 'accent'; }; type InternalProps = WithI18nEnhanceProps & { - interaction?: PopperProps['interaction']; + interaction?: NSPopper.Props['interaction']; }; type Handlers = { visible: null; }; - type Ctx = PopperContext & { + type Ctx = NSPopper.Ctx & { getSpotProps: PropGetterFn; }; namespace Trigger { - type Props = BoxProps & { + type Props = NSBox.Props & { theme?: NSFeaturePopover.Props['theme']; }; - type Component = Intergalactic.Component; + type Component = Intergalactic.Component; } namespace Popper { - type Props = PopperPopperProps & + type Props = NSPopper.Popper.Props & /** * Popper must have an accessible names (aria-group-name). */ @@ -105,7 +94,7 @@ declare namespace NSFeaturePopover { theme?: NSFeaturePopover.Props['theme']; }; - type Component = Intergalactic.Component; + type Component = Intergalactic.Component; } type Component = Intergalactic.Component<'div', Props, Ctx> & { @@ -117,10 +106,10 @@ declare namespace NSFeaturePopover { // Re-think it since looks like those props aren't needed for the Root component. /** @deprecated It will be removed in v18. */ -export type FPPopperProps = OutsideClickProps & - PortalProps & +export type FPPopperProps = NSOutsideClick.Props & + NSPortal.Props & UniqueIDProps & - AnimationProps & { + NSAnimation.Props & { /** * Popper can have different positioning options * @default absolute diff --git a/semcore/feature-popover/tsconfig.json b/semcore/feature-popover/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/feature-popover/tsconfig.json +++ b/semcore/feature-popover/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/feedback-form/.npmignore b/semcore/feedback-form/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/feedback-form/.npmignore +++ b/semcore/feedback-form/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/feedback-form/src/component/slider-rating/SliderRating.type.ts b/semcore/feedback-form/src/component/slider-rating/SliderRating.type.ts index c01bbe77e0..119f44662d 100644 --- a/semcore/feedback-form/src/component/slider-rating/SliderRating.type.ts +++ b/semcore/feedback-form/src/component/slider-rating/SliderRating.type.ts @@ -1,4 +1,4 @@ -import type { Flex, Box, BoxProps } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type { LocalizedMessages } from '../../translations/__intergalactic-dynamic-locales'; @@ -23,10 +23,10 @@ declare namespace NSSliderRating { filled?: boolean; }; - type Component = Intergalactic.Component; + type Component = Intergalactic.Component; } - type Component = Intergalactic.Component & { + type Component = Intergalactic.Component & { Star: Star.Component; }; } diff --git a/semcore/feedback-form/tsconfig.json b/semcore/feedback-form/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/feedback-form/tsconfig.json +++ b/semcore/feedback-form/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/flags/.npmignore b/semcore/flags/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/flags/.npmignore +++ b/semcore/flags/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/flags/src/index.d.ts b/semcore/flags/src/index.d.ts index 59af6585a4..f183a43a20 100644 --- a/semcore/flags/src/index.d.ts +++ b/semcore/flags/src/index.d.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { UnknownProperties, Intergalactic } from '@semcore/core'; export declare const iso2Name: Record; @@ -313,7 +313,7 @@ export declare const nameWithoutIso: { WALES: string; }; -export type FlagsProps = BoxProps & { +export type FlagsProps = NSBox.Props & { /** URL before css file with a sprite * @default `//static.semrush.com/intergalactic/flags/${version package}` */ diff --git a/semcore/flags/tsconfig.json b/semcore/flags/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/flags/tsconfig.json +++ b/semcore/flags/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/fullscreen-modal/.npmignore b/semcore/fullscreen-modal/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/fullscreen-modal/.npmignore +++ b/semcore/fullscreen-modal/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/fullscreen-modal/src/index.d.ts b/semcore/fullscreen-modal/src/index.d.ts index f8ba21bb6f..11cf4a4e57 100644 --- a/semcore/fullscreen-modal/src/index.d.ts +++ b/semcore/fullscreen-modal/src/index.d.ts @@ -1,4 +1,4 @@ -import type { Flex, Box, BoxProps } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type Button from '@semcore/button'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { NSModal } from '@semcore/modal'; @@ -12,7 +12,7 @@ export type FullscreenModalProps = NSModal.Props & { ) => void; }; -export type FullscreenModalHeaderProps = BoxProps & { +export type FullscreenModalHeaderProps = NSBox.Props & { /** Title content displayed in the modal header */ title?: React.ReactNode; /** Description text that appears alongside the title */ @@ -30,11 +30,11 @@ declare const FullscreenModal: Intergalactic.Component< FullscreenModalContext > & { Header: Intergalactic.Component<'div', FullscreenModalHeaderProps>; - Footer: typeof Flex; + Footer: NSFlex.Component; Close: typeof Button; - Back: typeof Box; - Body: typeof Box; - Section: typeof Box; + Back: NSBox.Component; + Body: NSBox.Component; + Section: NSBox.Component; Title: typeof Text; Description: typeof Text; }; diff --git a/semcore/fullscreen-modal/tsconfig.json b/semcore/fullscreen-modal/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/fullscreen-modal/tsconfig.json +++ b/semcore/fullscreen-modal/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/icon/.npmignore b/semcore/icon/.npmignore index ef494160bd..172976d9b1 100644 --- a/semcore/icon/.npmignore +++ b/semcore/icon/.npmignore @@ -3,4 +3,5 @@ __tests__ src transform-svg-icon.ts tsconfig.json +tsconfig.tsbuildinfo vite.config.ts diff --git a/semcore/icon/tsconfig.json b/semcore/icon/tsconfig.json index a551c16819..3daf0e528f 100644 --- a/semcore/icon/tsconfig.json +++ b/semcore/icon/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "compilerOptions": { "rootDir": "./src" }, diff --git a/semcore/illustration/.npmignore b/semcore/illustration/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/illustration/.npmignore +++ b/semcore/illustration/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/illustration/transform.ts b/semcore/illustration/transform.ts index bea599a493..e5ad14bda4 100644 --- a/semcore/illustration/transform.ts +++ b/semcore/illustration/transform.ts @@ -133,10 +133,10 @@ export default createBaseComponent(${illustration}) `; const typesDeclaration = ` -import { BoxProps } from '@semcore/base-components'; +import { NSBox } from '@semcore/base-components'; import { Intergalactic } from '@semcore/core'; -type IllustrationProps = BoxProps & { +type IllustrationProps = NSBox.Props & { /** * Main color of the illustration **/ diff --git a/semcore/inline-edit/.npmignore b/semcore/inline-edit/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/inline-edit/.npmignore +++ b/semcore/inline-edit/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/inline-edit/src/InlineEdit.tsx b/semcore/inline-edit/src/InlineEdit.tsx index 1839f2187b..f1d77c2cde 100644 --- a/semcore/inline-edit/src/InlineEdit.tsx +++ b/semcore/inline-edit/src/InlineEdit.tsx @@ -1,4 +1,5 @@ -import { FadeInOut, type FadeInOutProps, Box, type BoxProps } from '@semcore/base-components'; +import { FadeInOut, Box } from '@semcore/base-components'; +import type { NSAnimation, NSBox } from '@semcore/base-components'; import { createComponent, Component, @@ -185,7 +186,7 @@ function View(props: AsProps) { ) as React.ReactElement; } -type InlineEditProps = BoxProps & { +type InlineEditProps = NSBox.Props & { editable?: boolean; onEditableChange?: (editable: boolean, event?: React.SyntheticEvent) => void; defaultEditable?: boolean; @@ -197,8 +198,8 @@ type InlineEditDefaultProps = { i18n: LocalizedMessages; locale: 'en'; }; -type InlineEditViewProps = BoxProps & FadeInOutProps & {}; -type InlineEditEditProps = BoxProps & FadeInOutProps & {}; +type InlineEditViewProps = NSBox.Props & NSAnimation.FadeInOut.Props & {}; +type InlineEditEditProps = NSBox.Props & NSAnimation.FadeInOut.Props & {}; type InputCtx = { getViewProps: PropGetterFn; diff --git a/semcore/inline-edit/src/index.d.ts b/semcore/inline-edit/src/index.d.ts index 7ae84108a3..c3f94cf50d 100644 --- a/semcore/inline-edit/src/index.d.ts +++ b/semcore/inline-edit/src/index.d.ts @@ -1,7 +1,7 @@ -import type { FadeInOutProps, BoxProps } from '@semcore/base-components'; +import type { NSAnimation, NSBox } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; -export type InlineEditProps = BoxProps & { +export type InlineEditProps = NSBox.Props & { /** * Determines which children should be displayed */ @@ -22,9 +22,9 @@ export type InlineEditProps = BoxProps & { locale?: string; }; -export type InlineEditViewProps = BoxProps & FadeInOutProps & {}; +export type InlineEditViewProps = NSBox.Props & NSAnimation.FadeInOut.Props & {}; -export type InlineEditEditProps = BoxProps & FadeInOutProps & {}; +export type InlineEditEditProps = NSBox.Props & NSAnimation.FadeInOut.Props & {}; type InputCtx = { getViewProps: PropGetterFn; diff --git a/semcore/inline-edit/tsconfig.json b/semcore/inline-edit/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/inline-edit/tsconfig.json +++ b/semcore/inline-edit/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/inline-input/.npmignore b/semcore/inline-input/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/inline-input/.npmignore +++ b/semcore/inline-input/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/inline-input/src/index.type.ts b/semcore/inline-input/src/index.type.ts index 4b003ba24c..e2da5ba012 100644 --- a/semcore/inline-input/src/index.type.ts +++ b/semcore/inline-input/src/index.type.ts @@ -1,10 +1,10 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { ButtonLinkComponent } from '@semcore/button'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { NSInputNumber } from '@semcore/input-number'; import type React from 'react'; -export type InlineInputProps = BoxProps & { +export type InlineInputProps = NSBox.Props & { /** * Visual state of inline input * @default normal @@ -43,9 +43,9 @@ export type InlineInputProps = BoxProps & { locale?: string; }; -export type InlineInputAddonProps = BoxProps & {}; +export type InlineInputAddonProps = NSBox.Props & {}; -export type InlineInputValueProps = BoxProps & { +export type InlineInputValueProps = NSBox.Props & { /** * id attribute of input tag */ @@ -76,7 +76,7 @@ export type InlineInputValueProps = BoxProps & { placeholder?: string; }; -export type InlineInputConfirmControlProps = BoxProps & { +export type InlineInputConfirmControlProps = NSBox.Props & { /** * Text of tooltip * @default Confirm @@ -89,7 +89,7 @@ export type InlineInputConfirmControlProps = BoxProps & { icon?: React.FC; }; -export type InlineInputCancelControlProps = BoxProps & { +export type InlineInputCancelControlProps = NSBox.Props & { /** * Text of tooltip * @default Cancel diff --git a/semcore/inline-input/tsconfig.json b/semcore/inline-input/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/inline-input/tsconfig.json +++ b/semcore/inline-input/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/input-mask/.npmignore b/semcore/input-mask/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/input-mask/.npmignore +++ b/semcore/input-mask/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/input-mask/tsconfig.json b/semcore/input-mask/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/input-mask/tsconfig.json +++ b/semcore/input-mask/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/input-number/.npmignore b/semcore/input-number/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/input-number/.npmignore +++ b/semcore/input-number/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/input-number/tsconfig.json b/semcore/input-number/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/input-number/tsconfig.json +++ b/semcore/input-number/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/input-tags/.npmignore b/semcore/input-tags/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/input-tags/.npmignore +++ b/semcore/input-tags/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/input-tags/src/InputTags.tsx b/semcore/input-tags/src/InputTags.tsx index c5d25ef62a..9d266360cc 100644 --- a/semcore/input-tags/src/InputTags.tsx +++ b/semcore/input-tags/src/InputTags.tsx @@ -1,5 +1,5 @@ import { ScrollArea, Portal, ScreenReaderOnly } from '@semcore/base-components'; -import { type ScrollAreaProps } from '@semcore/base-components'; +import type { NSScrollArea } from '@semcore/base-components'; import { createComponent, Component, @@ -28,7 +28,7 @@ export type InputTagsValueProps = NSInput.Value.Props & {}; export type InputTagsSize = 'l' | 'm'; export type InputTagsProps = Omit & - ScrollAreaProps & { + NSScrollArea.Props & { /** * Component size * @default m diff --git a/semcore/input-tags/tsconfig.json b/semcore/input-tags/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/input-tags/tsconfig.json +++ b/semcore/input-tags/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/input/.npmignore b/semcore/input/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/input/.npmignore +++ b/semcore/input/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/input/src/Input.type.ts b/semcore/input/src/Input.type.ts index 1ecbed64a3..bbc365227d 100644 --- a/semcore/input/src/Input.type.ts +++ b/semcore/input/src/Input.type.ts @@ -1,13 +1,13 @@ -import type { BoxProps, NeighborItemProps, NeighborLocationProps } from '@semcore/base-components'; +import type { NSBox, NSNeighborLocation } from '@semcore/base-components'; import type { Intergalactic, PropGetterFn } from '@semcore/core'; import type React from 'react'; declare namespace NSInput { type Size = 'm' | 'l'; - type Props = BoxProps & - NeighborItemProps & - NeighborLocationProps & { - /** + type Props = NSBox.Props & + NSNeighborLocation.Detect.Props & + NSNeighborLocation.Props & { + /** * Sets the input and addons to the disabled state * */ disabled?: boolean; @@ -32,8 +32,8 @@ declare namespace NSInput { }; namespace Value { - type Props = BoxProps & - NeighborItemProps & { + type Props = NSBox.Props & + NSNeighborLocation.Detect.Props & { /** * Input value */ @@ -76,7 +76,7 @@ declare namespace NSInput { } namespace Addon { - type Props = BoxProps & NeighborItemProps; + type Props = NSBox.Props & NSNeighborLocation.Detect.Props; type Component = Intergalactic.Component<'div', Props>; } diff --git a/semcore/input/tsconfig.json b/semcore/input/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/input/tsconfig.json +++ b/semcore/input/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/link/.npmignore b/semcore/link/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/link/.npmignore +++ b/semcore/link/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/link/src/Link.types.ts b/semcore/link/src/Link.types.ts index baa4b0b14a..f2fb520c2a 100644 --- a/semcore/link/src/Link.types.ts +++ b/semcore/link/src/Link.types.ts @@ -1,10 +1,10 @@ -import type { BoxProps, SimpleHintPopperProps } from '@semcore/base-components'; -import type { Intergalactic, IRootComponentProps } from '@semcore/core'; +import type { NSBox, NSHint } from '@semcore/base-components'; +import type { Intergalactic } from '@semcore/core'; import type Icon from '@semcore/icon'; import type { NSText } from '@semcore/typography'; import type React from 'react'; -export type LinkProps = BoxProps & NSText.BaseProps & { +export type LinkProps = NSBox.Props & NSText.BaseProps & { /** * CSS property of the display link (inline|inline-block) * @default false @@ -34,10 +34,10 @@ export type LinkProps = BoxProps & NSText.BaseProps & { * The position of the popper relative to the trigger that called it. * @default top */ - hintPlacement?: SimpleHintPopperProps['placement']; + hintPlacement?: NSHint.Props['placement']; }; export type LinkComponent = Intergalactic.Component<'a', LinkProps> & { Text: Intergalactic.Component<'span', NSText.Props>; - Addon: Intergalactic.Component<'span', BoxProps>; + Addon: Intergalactic.Component<'span', NSBox.Props>; }; diff --git a/semcore/link/tsconfig.json b/semcore/link/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/link/tsconfig.json +++ b/semcore/link/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/mini-chart/.npmignore b/semcore/mini-chart/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/mini-chart/.npmignore +++ b/semcore/mini-chart/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/mini-chart/src/component/score/Donut.tsx b/semcore/mini-chart/src/component/score/Donut.tsx index e0a625ec0d..374375bd85 100644 --- a/semcore/mini-chart/src/component/score/Donut.tsx +++ b/semcore/mini-chart/src/component/score/Donut.tsx @@ -1,4 +1,5 @@ -import { Box, type BoxProps } from '@semcore/base-components'; +import { Box } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import { createComponent, Component, Root, sstyled, assignProps } from '@semcore/core'; import { extractAriaProps } from '@semcore/core/lib/utils/ariaProps'; @@ -10,7 +11,7 @@ import style from './donut.shadow.css'; import type { CommonScoreProps } from './Score'; import { ScoreDonutUtils } from '../../utils/ScoreDonutUtils'; -export type ScoreDonutProps = BoxProps & CommonScoreProps; +export type ScoreDonutProps = NSBox.Props & CommonScoreProps; type ScoreDonutDefaultProps = { animate: true; diff --git a/semcore/mini-chart/src/component/score/Line.types.ts b/semcore/mini-chart/src/component/score/Line.types.ts index 7932852db2..452719b55b 100644 --- a/semcore/mini-chart/src/component/score/Line.types.ts +++ b/semcore/mini-chart/src/component/score/Line.types.ts @@ -1,4 +1,4 @@ -import type { BoxProps, Box } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance'; import type React from 'react'; @@ -53,7 +53,7 @@ type CustomRenderScoreProps = { children: SegmentComponent[]; }; -export type ScoreLineGaugeProps = BoxProps & +export type ScoreLineGaugeProps = NSBox.Props & Intergalactic.InternalTypings.EfficientOmit & (ValuedScoreProps | CustomRenderScoreProps); @@ -66,5 +66,5 @@ export type Enhances = [() => { }]; export type ScoreLineComponent = Intergalactic.Component<'svg', ScoreLineGaugeProps, {}, Enhances> & { - Segment: Intergalactic.Component; + Segment: Intergalactic.Component; }; diff --git a/semcore/mini-chart/src/component/trend/Trend.tsx b/semcore/mini-chart/src/component/trend/Trend.tsx index 9cbef88100..6885da0c3c 100644 --- a/semcore/mini-chart/src/component/trend/Trend.tsx +++ b/semcore/mini-chart/src/component/trend/Trend.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import { Component } from '@semcore/core'; import React from 'react'; -export type CommonTrendProps = BoxProps & { +export type CommonTrendProps = NSBox.Props & { /** * Flag to enable animate of charts * @default true diff --git a/semcore/mini-chart/tsconfig.json b/semcore/mini-chart/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/mini-chart/tsconfig.json +++ b/semcore/mini-chart/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/modal/.npmignore b/semcore/modal/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/modal/.npmignore +++ b/semcore/modal/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/modal/src/Modal.type.ts b/semcore/modal/src/Modal.type.ts index 85059ff904..0f5201b22b 100644 --- a/semcore/modal/src/Modal.type.ts +++ b/semcore/modal/src/Modal.type.ts @@ -1,4 +1,4 @@ -import type { FadeInOutProps, SlideProps, Box, BoxProps, PortalProps } from '@semcore/base-components'; +import type { NSAnimation, NSBox, NSPortal } from '@semcore/base-components'; import type Button from '@semcore/button'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { NSText } from '@semcore/typography'; @@ -7,9 +7,9 @@ import type React from 'react'; import type { LocalizedMessages } from './translations/__intergalactic-dynamic-locales'; declare namespace NSModal { - type Props = PortalProps & - BoxProps & - FadeInOutProps & { + type Props = NSPortal.Props & + NSBox.Props & + NSAnimation.FadeInOut.Props & { /** Duration of animation, ms * @default 200 */ @@ -56,13 +56,13 @@ declare namespace NSModal { }; namespace Window { - type Props = BoxProps & SlideProps; + type Props = NSBox.Props & NSAnimation.Slide.Props; type Component = Intergalactic.Component<'div', Props>; } namespace Overlay { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Close { diff --git a/semcore/modal/tsconfig.json b/semcore/modal/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/modal/tsconfig.json +++ b/semcore/modal/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/notice-bubble/.npmignore b/semcore/notice-bubble/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/notice-bubble/.npmignore +++ b/semcore/notice-bubble/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/notice-bubble/src/NoticeBubble.type.ts b/semcore/notice-bubble/src/NoticeBubble.type.ts index 7c11cf4b2c..03997c5992 100644 --- a/semcore/notice-bubble/src/NoticeBubble.type.ts +++ b/semcore/notice-bubble/src/NoticeBubble.type.ts @@ -1,17 +1,17 @@ -import type { PortalProps, BoxProps } from '@semcore/base-components'; +import type { NSPortal, NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type { useI18n } from '@semcore/core/lib/utils/enhances/WithI18n'; import type { RefObject } from 'react'; -import type { NoticeBubbleManager, NoticeItem } from './NoticeBubbleManager'; +import type { NoticeItem } from './NoticeBubbleManager'; import type { LocalizedMessages } from './translations/__intergalactic-dynamic-locales'; /** * @deprecated. Pass noticeBubbleContainer property from window.sm2.getNoticeBubbleContainer() */ -export type NoticeBubbleContainerPortalProps = PortalProps; +export type NoticeBubbleContainerPortalProps = NSPortal.Props; -export type NoticeBubbleContainerProps = BoxProps & +export type NoticeBubbleContainerProps = NSBox.Props & NoticeBubbleContainerPortalProps & { /** Ref to mount bubbles in. You should use element form window.sm2.getNoticeBubbleContainer() */ containerNode?: HTMLElement | null; @@ -34,7 +34,7 @@ export type NoticeBubbleViewItemProps = NoticeBubbleProps & { styles: React.DetailedHTMLProps, HTMLStyleElement> | undefined; }; -export type NoticeBubbleProps = BoxProps & { +export type NoticeBubbleProps = NSBox.Props & { /** Notice type */ type?: 'info' | 'warning'; /** diff --git a/semcore/notice-bubble/tsconfig.json b/semcore/notice-bubble/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/notice-bubble/tsconfig.json +++ b/semcore/notice-bubble/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/notice/.npmignore b/semcore/notice/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/notice/.npmignore +++ b/semcore/notice/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/notice/src/Notice.type.ts b/semcore/notice/src/Notice.type.ts index a3a294f705..483e4a2869 100644 --- a/semcore/notice/src/Notice.type.ts +++ b/semcore/notice/src/Notice.type.ts @@ -1,4 +1,4 @@ -import type { FadeInOutProps, Box, BoxProps } from '@semcore/base-components'; +import type { NSAnimation, NSBox } from '@semcore/base-components'; import type Button from '@semcore/button'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { Text } from '@semcore/typography'; @@ -7,9 +7,9 @@ import type { LocalizedMessaged } from './translations/__intergalactic-dynamic-l declare namespace NSNotice { type Theme = 'danger' | 'warning' | 'success' | 'info' | 'muted'; - type Props = BoxProps & - FadeInOutProps & { - /** Property for managing visibility of Notice */ + type Props = NSBox.Props & + NSAnimation.FadeInOut.Props & { + /** Property for managing visibility of Notice */ hidden?: boolean; /** * Notice theme @@ -33,7 +33,7 @@ declare namespace NSNotice { }; namespace Label { - type Props = BoxProps & { + type Props = NSBox.Props & { theme?: NSNotice.Theme; }; @@ -41,11 +41,11 @@ declare namespace NSNotice { } namespace Actions { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Content { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Title { diff --git a/semcore/notice/tsconfig.json b/semcore/notice/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/notice/tsconfig.json +++ b/semcore/notice/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/pagination/.npmignore b/semcore/pagination/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/pagination/.npmignore +++ b/semcore/pagination/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/pagination/src/Pagination.type.ts b/semcore/pagination/src/Pagination.type.ts index 226f8acadc..276d515523 100644 --- a/semcore/pagination/src/Pagination.type.ts +++ b/semcore/pagination/src/Pagination.type.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type Button from '@semcore/button'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { WithI18nEnhanceProps } from '@semcore/core/lib/utils/enhances/i18nEnhance'; @@ -9,7 +9,7 @@ import type { NSText } from '@semcore/typography'; import type { LocalizedMessages } from './translations/__intergalactic-dynamic-locales'; declare namespace NSPagination { - type Props = BoxProps & + type Props = NSBox.Props & WithI18nEnhanceProps & { /** * Total number of pages diff --git a/semcore/pagination/tsconfig.json b/semcore/pagination/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/pagination/tsconfig.json +++ b/semcore/pagination/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/pills/.npmignore b/semcore/pills/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/pills/.npmignore +++ b/semcore/pills/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/pills/src/Pills.type.ts b/semcore/pills/src/Pills.type.ts index 8638f22305..a7ef617f55 100644 --- a/semcore/pills/src/Pills.type.ts +++ b/semcore/pills/src/Pills.type.ts @@ -1,11 +1,11 @@ -import type { Box, BoxProps, NeighborItemProps, NeighborLocationProps } from '@semcore/base-components'; +import type { NSBox, NSNeighborLocation } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type React from 'react'; declare namespace NSPills { // TODO: It looks like the value isn't accurate. Revise and align it with the component's logic. type Value = string | number | boolean | null; - type Props = NeighborLocationProps & BoxProps & { + type Props = NSNeighborLocation.Props & NSBox.Props & { /** Pills size */ size?: 'l' | 'm'; /** Disabled state */ @@ -42,7 +42,7 @@ declare namespace NSPills { behavior: Props['behavior']; }; namespace Pill { - type Props = BoxProps & NeighborItemProps & { + type Props = NSBox.Props & NSNeighborLocation.Detect.Props & { /** Pill value */ value?: NSPills.Value; /** Disabled state */ @@ -55,10 +55,10 @@ declare namespace NSPills { addonRight?: React.ElementType; }; namespace Text { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Addon { - type Component = typeof Box; + type Component = NSBox.Component; } type Component = Intergalactic.Component<'button', Props, [handlers: Handlers]>; diff --git a/semcore/pills/tsconfig.json b/semcore/pills/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/pills/tsconfig.json +++ b/semcore/pills/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/product-head/.npmignore b/semcore/product-head/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/product-head/.npmignore +++ b/semcore/product-head/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/product-head/src/Info.tsx b/semcore/product-head/src/Info.tsx index f27f0a241a..ed74550f7f 100644 --- a/semcore/product-head/src/Info.tsx +++ b/semcore/product-head/src/Info.tsx @@ -1,4 +1,5 @@ -import { Box, type BoxProps } from '@semcore/base-components'; +import { Box } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import { createComponent, Component, @@ -11,18 +12,18 @@ import React from 'react'; import style from './style/info.shadow.css'; -export type InfoItemProps = BoxProps & { +export type InfoItemProps = NSBox.Props & { /** A label content that appears before the main item content */ label?: React.ReactNode; }; -type InfoComponent = typeof Box & { +type InfoComponent = NSBox.Component & { Item: Intergalactic.Component<'div', InfoItemProps> & { - Label: typeof Box; + Label: NSBox.Component; }; }; -class InfoRoot extends Component { +class InfoRoot extends Component { static displayName = 'Info'; static style = style; diff --git a/semcore/product-head/src/ProductHead.tsx b/semcore/product-head/src/ProductHead.tsx index f11c05cb22..82f7a42b8c 100644 --- a/semcore/product-head/src/ProductHead.tsx +++ b/semcore/product-head/src/ProductHead.tsx @@ -1,16 +1,17 @@ -import { Box, type BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; +import { Box } from '@semcore/base-components'; import { createComponent, Component, sstyled, Root } from '@semcore/core'; import React from 'react'; import style from './style/product-head.shadow.css'; -type HeaderComponent = typeof Box & { - Buttons: typeof Box; - Links: typeof Box; - Row: typeof Box; +type HeaderComponent = NSBox.Component & { + Buttons: NSBox.Component; + Links: NSBox.Component; + Row: NSBox.Component; }; -class HeaderRoot extends Component { +class HeaderRoot extends Component { static displayName = 'ProductHead'; static style = style; diff --git a/semcore/product-head/src/Title.tsx b/semcore/product-head/src/Title.tsx index 64a1a28ab3..2fa3131b6f 100644 --- a/semcore/product-head/src/Title.tsx +++ b/semcore/product-head/src/Title.tsx @@ -1,4 +1,5 @@ -import { Box, type BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; +import { Box } from '@semcore/base-components'; import { createComponent, Component, @@ -11,13 +12,13 @@ import React from 'react'; import style from './style/title.shadow.css'; -export type HeaderTitleProps = BoxProps & { +export type HeaderTitleProps = NSBox.Props & { /** A tool name that appears as part of the header title */ toolName?: React.ReactNode; }; type HeaderTitleComponent = Intergalactic.Component<'h1', HeaderTitleProps> & { - Tool: typeof Box; + Tool: NSBox.Component; }; class TitleRoot extends Component { diff --git a/semcore/product-head/tsconfig.json b/semcore/product-head/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/product-head/tsconfig.json +++ b/semcore/product-head/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/progress-bar/.npmignore b/semcore/progress-bar/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/progress-bar/.npmignore +++ b/semcore/progress-bar/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/progress-bar/src/ProgressBar.type.ts b/semcore/progress-bar/src/ProgressBar.type.ts index a94593b7f4..f66a8cc99b 100644 --- a/semcore/progress-bar/src/ProgressBar.type.ts +++ b/semcore/progress-bar/src/ProgressBar.type.ts @@ -1,8 +1,8 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; declare namespace NSProgressBar { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Progress bar theme * @default invert @@ -32,7 +32,7 @@ declare namespace NSProgressBar { }; namespace Value { - type Props = BoxProps & { + type Props = NSBox.Props & { /** Controls the size of the value bar */ size?: 's' | 'm' | 'l'; /** Progress value */ diff --git a/semcore/progress-bar/tsconfig.json b/semcore/progress-bar/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/progress-bar/tsconfig.json +++ b/semcore/progress-bar/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/radio/.npmignore b/semcore/radio/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/radio/.npmignore +++ b/semcore/radio/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/radio/src/Radio.type.ts b/semcore/radio/src/Radio.type.ts index eb618b5861..a1eaef076e 100644 --- a/semcore/radio/src/Radio.type.ts +++ b/semcore/radio/src/Radio.type.ts @@ -1,4 +1,4 @@ -import type { Flex, BoxProps } from '@semcore/base-components'; +import type { NSFlex, NSBox } from '@semcore/base-components'; import type { Intergalactic, PropGetterFn } from '@semcore/core'; import type { NSText } from '@semcore/typography'; @@ -6,7 +6,7 @@ declare namespace NSRadio { type Size = 'm' | 'l'; type State = 'normal' | 'invalid'; type Value = string | number | boolean; - type Props = BoxProps & { + type Props = NSBox.Props & { /** Radio item value **/ value?: NSRadio.Value; /** Radio item checked flag **/ @@ -36,7 +36,7 @@ declare namespace NSRadio { type Handlers = { checked: (e: React.ChangeEvent) => boolean; }; - type Props = BoxProps & { + type Props = NSBox.Props & { /** List of elements that can be put on a hidden input */ includeInputProps?: string[]; }; @@ -88,9 +88,9 @@ declare namespace NSRadio { defaultValue: ''; }; type Component = (( - props: Intergalactic.InternalTypings.ComponentProps> & PropsExtending, + props: Intergalactic.InternalTypings.ComponentProps> & PropsExtending, ) => Intergalactic.InternalTypings.ComponentRenderingResults) & - Intergalactic.InternalTypings.ComponentAdditive<'div', typeof Flex, Props>; + Intergalactic.InternalTypings.ComponentAdditive<'div', NSFlex.Component, Props>; } type Component = Intergalactic.Component<'label', Props, Ctx> & { Value: Value.Component; diff --git a/semcore/radio/tsconfig.json b/semcore/radio/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/radio/tsconfig.json +++ b/semcore/radio/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/select/.npmignore b/semcore/select/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/select/.npmignore +++ b/semcore/select/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/select/src/index.d.ts b/semcore/select/src/index.d.ts index 27e01b7ec6..ff2ba94744 100644 --- a/semcore/select/src/index.d.ts +++ b/semcore/select/src/index.d.ts @@ -1,4 +1,4 @@ -import type { BoxProps, Flex } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type { ButtonTrigger, BaseTriggerProps, ButtonTriggerProps, LinkTriggerProps } from '@semcore/base-trigger'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type Divider from '@semcore/divider'; @@ -92,7 +92,7 @@ export type SelectOptionProps = DropdownMenuItemProps & { value: string | number; }; -export type SelectOptionCheckboxProps = BoxProps & { +export type SelectOptionCheckboxProps = NSBox.Props & { /** Checkbox theme */ theme?: string; /** Visual indeterminate state */ @@ -155,9 +155,9 @@ declare const Select: IntergalacticSelectComponent & { > & { Addon: typeof DropdownMenu.Item.Addon; Checkbox: Intergalactic.Component<'div', SelectOptionCheckboxProps>; - Content: typeof Flex; + Content: NSFlex.Component; Text: typeof Text; - Hint: typeof Flex; + Hint: NSFlex.Component; }; Divider: typeof Divider; InputSearch: typeof InputSearch; diff --git a/semcore/select/tsconfig.json b/semcore/select/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/select/tsconfig.json +++ b/semcore/select/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/side-panel/.npmignore b/semcore/side-panel/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/side-panel/.npmignore +++ b/semcore/side-panel/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/side-panel/src/SidePanel.type.ts b/semcore/side-panel/src/SidePanel.type.ts index 7182b0cf2d..95ed7f0a2c 100644 --- a/semcore/side-panel/src/SidePanel.type.ts +++ b/semcore/side-panel/src/SidePanel.type.ts @@ -1,13 +1,13 @@ -import type { FadeInOutProps, SlideProps, Box, BoxProps, Flex, PortalProps } from '@semcore/base-components'; +import type { NSAnimation, NSBox, NSFlex, NSPortal } from '@semcore/base-components'; import type Button from '@semcore/button'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { Text } from '@semcore/typography'; import type React from 'react'; declare namespace NSSidePanel { - type Props = PortalProps & - BoxProps & { - /** Animation display duration in ms + type Props = NSPortal.Props & + NSBox.Props & { + /** Animation display duration in ms * @default 350 */ duration?: number; @@ -53,7 +53,7 @@ declare namespace NSSidePanel { type Placement = 'top' | 'left' | 'right' | 'bottom'; namespace Header { - type Props = BoxProps & { + type Props = NSBox.Props & { title?: React.ReactNode; }; @@ -61,15 +61,15 @@ declare namespace NSSidePanel { } namespace Back { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Body { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Footer { - type Component = typeof Flex; + type Component = NSFlex.Component; } namespace Title { @@ -77,14 +77,14 @@ declare namespace NSSidePanel { } namespace Overlay { - type Props = FadeInOutProps & BoxProps; + type Props = NSAnimation.FadeInOut.Props & NSBox.Props; type Component = Intergalactic.Component<'div', Props>; } namespace Panel { - type Props = SlideProps & - BoxProps & { + type Props = NSAnimation.Slide.Props & + NSBox.Props & { /** Callback that is triggered when click outside is occured */ onOutsideClick?: (e?: React.SyntheticEvent) => void; /** diff --git a/semcore/side-panel/tsconfig.json b/semcore/side-panel/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/side-panel/tsconfig.json +++ b/semcore/side-panel/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/skeleton/.npmignore b/semcore/skeleton/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/skeleton/.npmignore +++ b/semcore/skeleton/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/skeleton/src/Skeleton.type.ts b/semcore/skeleton/src/Skeleton.type.ts index 3e9447b8fc..a43a967d5b 100644 --- a/semcore/skeleton/src/Skeleton.type.ts +++ b/semcore/skeleton/src/Skeleton.type.ts @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type { UniqueIDProps } from '@semcore/core/lib/utils/uniqueID'; declare namespace NSSkeleton { - type Props = BoxProps & UniqueIDProps & { + type Props = NSBox.Props & UniqueIDProps & { /** * Skeleton visibility control property */ @@ -36,7 +36,7 @@ declare namespace NSSkeleton { }; namespace Text { - type Props = BoxProps & { + type Props = NSBox.Props & { // TODO: It looks like it should be number (def. not a string...) /** * Number of items to be returned diff --git a/semcore/skeleton/tsconfig.json b/semcore/skeleton/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/skeleton/tsconfig.json +++ b/semcore/skeleton/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/slider/.npmignore b/semcore/slider/.npmignore index 8e53be538d..48c803f7d9 100644 --- a/semcore/slider/.npmignore +++ b/semcore/slider/.npmignore @@ -4,3 +4,4 @@ coverage __tests__ .publishrc tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/slider/src/Slider.type.ts b/semcore/slider/src/Slider.type.ts index fac85e1db4..7a933787b7 100644 --- a/semcore/slider/src/Slider.type.ts +++ b/semcore/slider/src/Slider.type.ts @@ -1,4 +1,4 @@ -import type { Box, BoxProps, FlexProps } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type React from 'react'; @@ -16,7 +16,7 @@ declare namespace NSSlider { value: V; label: React.ReactNode; }; - type Props = BoxProps & { + type Props = NSBox.Props & { /** Numeric value */ value?: V; @@ -57,13 +57,13 @@ declare namespace NSSlider { }; namespace Knob { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Bar { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Options { - type Props = FlexProps; + type Props = NSFlex.Props; type Component = Intergalactic.Component< 'div', Props, @@ -72,7 +72,7 @@ declare namespace NSSlider { >; } namespace Item { - type Props = BoxProps; + type Props = NSBox.Props; type Component = Intergalactic.Component<'div', Props, NSSlider.Ctx, [handlers: NSSlider.Handlers]>; } diff --git a/semcore/slider/tsconfig.json b/semcore/slider/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/slider/tsconfig.json +++ b/semcore/slider/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/spin-container/.npmignore b/semcore/spin-container/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/spin-container/.npmignore +++ b/semcore/spin-container/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/spin-container/src/SpinContainer.type.ts b/semcore/spin-container/src/SpinContainer.type.ts index f13b784e15..b6d4f853b1 100644 --- a/semcore/spin-container/src/SpinContainer.type.ts +++ b/semcore/spin-container/src/SpinContainer.type.ts @@ -1,9 +1,9 @@ -import type { FadeInOutProps, BoxProps } from '@semcore/base-components'; +import type { NSAnimation, NSBox } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { NSSpin } from '@semcore/spin'; declare namespace NSSpinContainer { - type Props = BoxProps & + type Props = NSBox.Props & NSSpin.Props & { /** * Color of container spinner; you can use your own color @@ -28,13 +28,13 @@ declare namespace NSSpinContainer { }; namespace Content { - type Props = BoxProps & FadeInOutProps; + type Props = NSBox.Props & NSAnimation.FadeInOut.Props; type Component = Intergalactic.Component<'div', Props>; } namespace Overlay { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Css background; you can use your own color */ diff --git a/semcore/spin-container/tsconfig.json b/semcore/spin-container/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/spin-container/tsconfig.json +++ b/semcore/spin-container/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/spin/.npmignore b/semcore/spin/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/spin/.npmignore +++ b/semcore/spin/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/spin/src/Spin.type.ts b/semcore/spin/src/Spin.type.ts index 64ef196129..0f56505ecf 100644 --- a/semcore/spin/src/Spin.type.ts +++ b/semcore/spin/src/Spin.type.ts @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; declare namespace NSSpin { type Size = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'; - type Props = BoxProps & { + type Props = NSBox.Props & { /** Spinner size * @default m **/ diff --git a/semcore/spin/tsconfig.json b/semcore/spin/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/spin/tsconfig.json +++ b/semcore/spin/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/switch/.npmignore b/semcore/switch/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/switch/.npmignore +++ b/semcore/switch/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/switch/src/Switch.type.ts b/semcore/switch/src/Switch.type.ts index 21e8c4e2f5..f0bebbe68c 100644 --- a/semcore/switch/src/Switch.type.ts +++ b/semcore/switch/src/Switch.type.ts @@ -1,4 +1,4 @@ -import type { BoxProps, NeighborItemProps, NeighborLocationProps } from '@semcore/base-components'; +import type { NSBox, NSNeighborLocation } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type React from 'react'; @@ -8,8 +8,8 @@ declare namespace NSSwitch { getAddonProps: PropGetterFn; getValueProps: PropGetterFn; }; - type Props = BoxProps & - NeighborLocationProps & { + type Props = NSBox.Props & + NSNeighborLocation.Props & { /** Switch size * @default m */ @@ -27,8 +27,8 @@ declare namespace NSSwitch { }; namespace Value { - type Props = BoxProps & - NeighborItemProps & { + type Props = NSBox.Props & + NSNeighborLocation.Detect.Props & { /** Handler on change */ onChange?: (checked: boolean, e?: React.SyntheticEvent) => void; /** Control state */ @@ -51,7 +51,7 @@ declare namespace NSSwitch { } namespace Addon { - type Props = BoxProps & NeighborItemProps; + type Props = NSBox.Props & NSNeighborLocation.Detect.Props; type Component = Intergalactic.Component<'div', Props>; } diff --git a/semcore/switch/tsconfig.json b/semcore/switch/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/switch/tsconfig.json +++ b/semcore/switch/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/tab-line/.npmignore b/semcore/tab-line/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/tab-line/.npmignore +++ b/semcore/tab-line/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/tab-line/src/TabLine.type.ts b/semcore/tab-line/src/TabLine.type.ts index 721857954f..b14a97c9cb 100644 --- a/semcore/tab-line/src/TabLine.type.ts +++ b/semcore/tab-line/src/TabLine.type.ts @@ -1,12 +1,12 @@ -import type { Box, BoxProps, NeighborItemProps, NeighborLocationProps } from '@semcore/base-components'; +import type { NSBox, NSNeighborLocation } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { NSText } from '@semcore/typography'; import type React from 'react'; declare namespace NSTabLine { type Value = string | number | boolean; - type Props = BoxProps & - NeighborLocationProps & { + type Props = NSBox.Props & + NSNeighborLocation.Props & { /** TabLine size * @default m * */ @@ -49,8 +49,8 @@ declare namespace NSTabLine { }; namespace Item { - type Props = BoxProps & - NeighborItemProps & { + type Props = NSBox.Props & + NSNeighborLocation.Detect.Props & { /** Makes a tab selected. This property is determined automatically depending on the value. */ selected?: boolean; /** Disabled state */ @@ -69,7 +69,7 @@ declare namespace NSTabLine { } namespace Addon { - type Component = typeof Box; + type Component = NSBox.Component; } type Component = Intergalactic.Component<'div', Props, {}, [handlers: NSTabLine.Handlers]> & { diff --git a/semcore/tab-line/tsconfig.json b/semcore/tab-line/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/tab-line/tsconfig.json +++ b/semcore/tab-line/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/tab-panel/.npmignore b/semcore/tab-panel/.npmignore index 229b5c941a..0d8f506aa2 100644 --- a/semcore/tab-panel/.npmignore +++ b/semcore/tab-panel/.npmignore @@ -1,4 +1,5 @@ node_modules __tests__ src -tsconfig.json \ No newline at end of file +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/tab-panel/src/TabPanel.type.ts b/semcore/tab-panel/src/TabPanel.type.ts index b7d16654ed..76fc4aa840 100644 --- a/semcore/tab-panel/src/TabPanel.type.ts +++ b/semcore/tab-panel/src/TabPanel.type.ts @@ -1,10 +1,10 @@ -import type { Box, BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic, PropGetterFn } from '@semcore/core'; import type { NSText } from '@semcore/typography'; declare namespace NSTabPanel { type Value = string | number | boolean; - type Props = BoxProps & { + type Props = NSBox.Props & { /** Is invoked when changing the selection */ onChange?: | ((value: V, e?: React.SyntheticEvent) => void) @@ -35,7 +35,7 @@ declare namespace NSTabPanel { }; namespace Item { - type Props = BoxProps & { + type Props = NSBox.Props & { /** Makes a tab selected. This property is determined automatically depending on the value. */ selected?: boolean; /** Disabled state */ @@ -54,7 +54,7 @@ declare namespace NSTabPanel { } namespace Addon { - type Component = typeof Box; + type Component = NSBox.Component; } type Component = Intergalactic.Component<'div', Props, {}, [handlers: NSTabPanel.Handlers]> & { diff --git a/semcore/tab-panel/tsconfig.json b/semcore/tab-panel/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/tab-panel/tsconfig.json +++ b/semcore/tab-panel/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/tag/.npmignore b/semcore/tag/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/tag/.npmignore +++ b/semcore/tag/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/tag/src/Tag.type.ts b/semcore/tag/src/Tag.type.ts index 54932e862e..e3711afdbd 100644 --- a/semcore/tag/src/Tag.type.ts +++ b/semcore/tag/src/Tag.type.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { PropGetterFn, Intergalactic } from '@semcore/core'; import type { IconProps } from '@semcore/icon'; import type { NSText } from '@semcore/typography'; @@ -13,7 +13,7 @@ declare namespace NSTag { type Ctx = Props & { getCloseProps?: PropGetterFn; }; - type Props = BoxProps & { + type Props = NSBox.Props & { /** Value responsible for tag availability */ disabled?: boolean; @@ -54,12 +54,12 @@ declare namespace NSTag { } namespace Addon { - type Props = BoxProps; + type Props = NSBox.Props; type Component = Intergalactic.Component<'div', Props>; } namespace Circle { - type Props = BoxProps; + type Props = NSBox.Props; type Component = Intergalactic.Component<'div', Props>; } diff --git a/semcore/tag/tsconfig.json b/semcore/tag/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/tag/tsconfig.json +++ b/semcore/tag/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/textarea/.npmignore b/semcore/textarea/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/textarea/.npmignore +++ b/semcore/textarea/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/textarea/src/Textarea.type.ts b/semcore/textarea/src/Textarea.type.ts index 3b21e2be8d..1c9f318b33 100644 --- a/semcore/textarea/src/Textarea.type.ts +++ b/semcore/textarea/src/Textarea.type.ts @@ -1,10 +1,10 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type { Property } from 'csstype'; import type { SyntheticEvent } from 'react'; declare namespace NSTextarea { - type Props = BoxProps & { + type Props = NSBox.Props & { /** * Text value of textarea */ diff --git a/semcore/textarea/tsconfig.json b/semcore/textarea/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/textarea/tsconfig.json +++ b/semcore/textarea/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/time-picker/.npmignore b/semcore/time-picker/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/time-picker/.npmignore +++ b/semcore/time-picker/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/time-picker/src/component/PickerFormat/PickerFormat.type.ts b/semcore/time-picker/src/component/PickerFormat/PickerFormat.type.ts index 1da2e26e45..ea593daa40 100644 --- a/semcore/time-picker/src/component/PickerFormat/PickerFormat.type.ts +++ b/semcore/time-picker/src/component/PickerFormat/PickerFormat.type.ts @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { useI18n } from '@semcore/core/lib/utils/enhances/WithI18n'; import type { TimePickerMeridiem } from '../TimePicker/TimePicker.type'; -export type TimePickerFormatProps = BoxProps & {}; +export type TimePickerFormatProps = NSBox.Props & {}; export type TimePickerFormatPropsInternal = { /** @Internal */ diff --git a/semcore/time-picker/tsconfig.json b/semcore/time-picker/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/time-picker/tsconfig.json +++ b/semcore/time-picker/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/tooltip/.npmignore b/semcore/tooltip/.npmignore index e314fbca9e..9617755b62 100644 --- a/semcore/tooltip/.npmignore +++ b/semcore/tooltip/.npmignore @@ -2,4 +2,5 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo __stories diff --git a/semcore/tooltip/src/index.d.ts b/semcore/tooltip/src/index.d.ts index ffd2157481..423d6fd953 100644 --- a/semcore/tooltip/src/index.d.ts +++ b/semcore/tooltip/src/index.d.ts @@ -1,9 +1,4 @@ -import type { - PopperContext, - PopperProps, - PopperTriggerProps, - eventInteraction, -} from '@semcore/base-components'; +import type { NSPopper } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type React from 'react'; @@ -12,8 +7,8 @@ export type ArrowCustom = { arrowShadowColor?: string; }; -export type TooltipProps = Intergalactic.InternalTypings.EfficientOmit & - PopperTriggerProps & { +export type TooltipProps = Intergalactic.InternalTypings.EfficientOmit & + NSPopper.Trigger.Props & { /** * Tooltip text */ @@ -30,25 +25,25 @@ export type TooltipProps = Intergalactic.InternalTypings.EfficientOmit & { - Trigger: Intergalactic.Component<'div', PopperTriggerProps, TooltipTriggerContext>; + Trigger: Intergalactic.Component<'div', NSPopper.Trigger.Props, TooltipTriggerContext>; Popper: Intergalactic.Component<'div', TooltipProps & ArrowCustom, TooltipContext>; }; export type TooltipHintProps = Intergalactic.InternalTypings.EfficientOmit< - PopperProps, + NSPopper.Props, 'interaction' > & -PopperTriggerProps & { +NSPopper.Trigger.Props & { /** * Tooltip text */ @@ -65,15 +60,15 @@ export type TooltipHintPopperProps = Intergalactic.InternalTypings.EfficientOmit >; declare const Hint: Intergalactic.Component<'div', TooltipHintProps, TooltipTriggerContext> & { - Trigger: Intergalactic.Component<'div', PopperTriggerProps, TooltipTriggerContext>; + Trigger: Intergalactic.Component<'div', NSPopper.Trigger.Props, TooltipTriggerContext>; Popper: Intergalactic.Component<'div', TooltipHintPopperProps & ArrowCustom, TooltipContext>; }; export type DescriptionTooltipProps = Intergalactic.InternalTypings.EfficientOmit< - PopperProps, + NSPopper.Props, 'interaction' > & -PopperTriggerProps & { +NSPopper.Trigger.Props & { /** * Tooltip theme. You can use the default themes or create your own * @default default @@ -113,7 +108,7 @@ declare const DescriptionTooltip: Intergalactic.Component< DescriptionTooltipProps, TooltipTriggerContext > & { - Trigger: Intergalactic.Component<'div', PopperTriggerProps, TooltipTriggerContext>; + Trigger: Intergalactic.Component<'div', NSPopper.Trigger.Props, TooltipTriggerContext>; Popper: Intergalactic.Component<'div', DescriptionTooltipPopperProps, TooltipContext>; }; diff --git a/semcore/tooltip/tsconfig.json b/semcore/tooltip/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/tooltip/tsconfig.json +++ b/semcore/tooltip/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/tsconfig.json b/semcore/tsconfig.json new file mode 100644 index 0000000000..30f04e9343 --- /dev/null +++ b/semcore/tsconfig.json @@ -0,0 +1,202 @@ +{ + "extends": "../tsconfig.base.json", + "compilerOptions": { + "composite": true, + "incremental": true, + + "outDir": "${configDir}/lib/types", + "tsBuildInfoFile": "${configDir}/tsconfig.tsbuildinfo" + }, + "files": [], + "references": [ + { + "path": "./accordion" + }, + { + "path": "./add-filter" + }, + { + "path": "./badge" + }, + { + "path": "./base-components" + }, + { + "path": "./base-trigger" + }, + { + "path": "./breadcrumbs" + }, + { + "path": "./bulk-textarea" + }, + { + "path": "./button" + }, + { + "path": "./card" + }, + { + "path": "./carousel" + }, + { + "path": "./checkbox" + }, + { + "path": "./color-picker" + }, + { + "path": "./core" + }, + { + "path": "./counter" + }, + { + "path": "./d3-chart" + }, + { + "path": "./data-table" + }, + { + "path": "./date-picker" + }, + { + "path": "./divider" + }, + { + "path": "./dot" + }, + { + "path": "./drag-and-drop" + }, + { + "path": "./dropdown" + }, + { + "path": "./dropdown-menu" + }, + { + "path": "./ellipsis" + }, + { + "path": "./errors" + }, + { + "path": "./feature-highlight" + }, + { + "path": "./feature-popover" + }, + { + "path": "./feedback-form" + }, + { + "path": "./flags" + }, + { + "path": "./fullscreen-modal" + }, + { + "path": "./icon" + }, + { + "path": "./inline-edit" + }, + { + "path": "./inline-input" + }, + { + "path": "./input" + }, + { + "path": "./input-mask" + }, + { + "path": "./input-number" + }, + { + "path": "./input-tags" + }, + { + "path": "./link" + }, + { + "path": "./mini-chart" + }, + { + "path": "./modal" + }, + { + "path": "./notice" + }, + { + "path": "./notice-bubble" + }, + { + "path": "./pagination" + }, + { + "path": "./pills" + }, + { + "path": "./product-head" + }, + { + "path": "./progress-bar" + }, + { + "path": "./radio" + }, + { + "path": "./select" + }, + { + "path": "./side-panel" + }, + { + "path": "./skeleton" + }, + { + "path": "./slider" + }, + { + "path": "./spin" + }, + { + "path": "./spin-container" + }, + { + "path": "./switch" + }, + { + "path": "./tab-line" + }, + { + "path": "./tab-panel" + }, + { + "path": "./tag" + }, + { + "path": "./textarea" + }, + { + "path": "./time-picker" + }, + { + "path": "./tooltip" + }, + { + "path": "./typography" + }, + { + "path": "./ui" + }, + { + "path": "./widget-empty" + }, + { + "path": "./wizard" + } + ] +} \ No newline at end of file diff --git a/semcore/typography/.npmignore b/semcore/typography/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/typography/.npmignore +++ b/semcore/typography/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/typography/src/components/Blockquote/Blockquote.type.ts b/semcore/typography/src/components/Blockquote/Blockquote.type.ts index 8f0b2dd854..a3f4b17e84 100644 --- a/semcore/typography/src/components/Blockquote/Blockquote.type.ts +++ b/semcore/typography/src/components/Blockquote/Blockquote.type.ts @@ -1,8 +1,8 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; declare namespace NSBlockquote { - type Props = BoxProps & { + type Props = NSBox.Props & { /** Source of the quote */ author?: React.ReactNode; }; diff --git a/semcore/typography/src/components/List/List.type.ts b/semcore/typography/src/components/List/List.type.ts index 6036142a89..4badbf1ad1 100644 --- a/semcore/typography/src/components/List/List.type.ts +++ b/semcore/typography/src/components/List/List.type.ts @@ -1,4 +1,4 @@ -import type { Flex, FlexProps } from '@semcore/base-components'; +import type { NSFlex } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import type React from 'react'; @@ -22,8 +22,8 @@ declare namespace NSList { }; namespace Content { - type Props = FlexProps; - type Component = Intergalactic.Component; + type Props = NSFlex.Props; + type Component = Intergalactic.Component; } type Component = Intergalactic.Component<'li', Props> & { diff --git a/semcore/typography/src/components/Text/Text.tsx b/semcore/typography/src/components/Text/Text.tsx index 7325a49c7d..38be451e35 100644 --- a/semcore/typography/src/components/Text/Text.tsx +++ b/semcore/typography/src/components/Text/Text.tsx @@ -1,4 +1,5 @@ -import { Ellipsis, Hint, Box, type EllipsisSettings } from '@semcore/base-components'; +import type { NSEllipsis } from '@semcore/base-components'; +import { Ellipsis, Hint, Box } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; import { Root, sstyled, Component, createComponent } from '@semcore/core'; import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance'; @@ -40,7 +41,7 @@ class TextRoot extends Component< } componentDidUpdate(prevProps: NSText.EllipsisProps) { - const ellipsisKeys: Array = [ + const ellipsisKeys: Array = [ 'cropPosition', 'maxLine', 'lastRequiredSymbols', diff --git a/semcore/typography/src/components/Text/Text.type.ts b/semcore/typography/src/components/Text/Text.type.ts index 1668338dfe..59821c4c5b 100644 --- a/semcore/typography/src/components/Text/Text.type.ts +++ b/semcore/typography/src/components/Text/Text.type.ts @@ -1,7 +1,7 @@ import type { - BoxProps, - EllipsisSettings, - SimpleHintPopperProps, + NSBox, + NSEllipsis, + NSHint, Ellipsis as EllipsisInstance, } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; @@ -57,7 +57,7 @@ declare namespace NSText { hint?: boolean; } & { /** Settings for a hint with full text (cropped by ellipsis) */ - [K in keyof SimpleHintPopperProps as `hint:${string & K}`]?: SimpleHintPopperProps[K]; + [K in keyof NSHint.Props as `hint:${string & K}`]?: NSHint.Props[K]; }; type EllipsisProps = { @@ -65,10 +65,10 @@ declare namespace NSText { ellipsis?: boolean | EllipsisInstance; } & { /** Settings for an Ellipsis */ - [K in keyof EllipsisSettings as `ellipsis:${string & K}`]?: EllipsisSettings[K]; + [K in keyof NSEllipsis.Settings as `ellipsis:${string & K}`]?: NSEllipsis.Settings[K]; }; - type Props = BoxProps & NSText.BaseProps & + type Props = NSBox.Props & NSText.BaseProps & ( | { /** Enable formatting/styling for all nested HTML tags with our default styles for them */ diff --git a/semcore/typography/tsconfig.json b/semcore/typography/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/typography/tsconfig.json +++ b/semcore/typography/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/ui/.npmignore b/semcore/ui/.npmignore index 5e6a4457e9..6e9dbac15c 100644 --- a/semcore/ui/.npmignore +++ b/semcore/ui/.npmignore @@ -3,6 +3,7 @@ __tests__ components.json generate.js tsconfig.json +tsconfig.tsbuildinfo clear.ts generate-reexports.ts update-dependencies.ts \ No newline at end of file diff --git a/semcore/ui/tsconfig.json b/semcore/ui/tsconfig.json index ad7c0db81c..1f72175b3b 100644 --- a/semcore/ui/tsconfig.json +++ b/semcore/ui/tsconfig.json @@ -1,4 +1,4 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["__tests__", "generate.js", "index.js"] } diff --git a/semcore/widget-empty/.npmignore b/semcore/widget-empty/.npmignore index 882388da4b..036da2936b 100644 --- a/semcore/widget-empty/.npmignore +++ b/semcore/widget-empty/.npmignore @@ -2,3 +2,4 @@ node_modules __tests__ src tsconfig.json +tsconfig.tsbuildinfo diff --git a/semcore/widget-empty/src/WidgetEmpty.type.ts b/semcore/widget-empty/src/WidgetEmpty.type.ts index 1d2be40bdb..8154c15afd 100644 --- a/semcore/widget-empty/src/WidgetEmpty.type.ts +++ b/semcore/widget-empty/src/WidgetEmpty.type.ts @@ -1,8 +1,8 @@ -import type { Box, FlexProps } from '@semcore/base-components'; +import type { NSBox, NSFlex } from '@semcore/base-components'; import type { Intergalactic } from '@semcore/core'; declare namespace NSWidgetEmpty { - type Props = FlexProps & { + type Props = NSFlex.Props & { /** * URL before the icon or the whole component */ @@ -10,11 +10,11 @@ declare namespace NSWidgetEmpty { }; namespace Title { - type Component = typeof Box; + type Component = NSBox.Component; } namespace Description { - type Component = typeof Box; + type Component = NSBox.Component; } type Component = Intergalactic.Component<'div', Props> & { diff --git a/semcore/widget-empty/tsconfig.json b/semcore/widget-empty/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/widget-empty/tsconfig.json +++ b/semcore/widget-empty/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/semcore/wizard/.npmignore b/semcore/wizard/.npmignore index 6dbfcb3935..8f6072f302 100644 --- a/semcore/wizard/.npmignore +++ b/semcore/wizard/.npmignore @@ -2,4 +2,6 @@ node_modules *.log coverage __tests__ -.publishrc \ No newline at end of file +.publishrc +tsconfig.json +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/semcore/wizard/src/Wizard.types.ts b/semcore/wizard/src/Wizard.types.ts index 32a69079c0..8332dde7a0 100644 --- a/semcore/wizard/src/Wizard.types.ts +++ b/semcore/wizard/src/Wizard.types.ts @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/base-components'; +import type { NSBox } from '@semcore/base-components'; import type { ButtonProps } from '@semcore/button'; import type { Intergalactic } from '@semcore/core'; import type { useI18n } from '@semcore/core/lib/utils/enhances/WithI18n'; @@ -18,7 +18,7 @@ export type WizardProps = NSModal.Props & { locale?: string; }; -export type WizardSidebarProps = BoxProps & { +export type WizardSidebarProps = NSBox.Props & { /** * Sidebar title */ @@ -30,7 +30,7 @@ export type WizardSidebarProps = BoxProps & { id?: string; }; -export type WizardStepProps = BoxProps & { +export type WizardStepProps = NSBox.Props & { /** * Ordered step position from 0 */ @@ -46,7 +46,7 @@ export type WizardStepProps = BoxProps & { active?: boolean; }; -export type WizardStepperProps = BoxProps & { +export type WizardStepperProps = NSBox.Props & { /** * Ordered step position from 0 */ @@ -87,7 +87,7 @@ export type WizardStepperProps = BoxProps & { focusPrev?: () => void; }; -export type WizardContentProps = BoxProps & { +export type WizardContentProps = NSBox.Props & { /** * Renders wizard content container with border-radius on the left side */ diff --git a/semcore/wizard/tsconfig.json b/semcore/wizard/tsconfig.json index ddb8b6811a..3ed2a1cc8b 100644 --- a/semcore/wizard/tsconfig.json +++ b/semcore/wizard/tsconfig.json @@ -1,5 +1,5 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" diff --git a/stories/components/accordion/docs/examples/basic_usage.tsx b/stories/components/accordion/docs/examples/basic_usage.tsx index 3ac0c87f72..04f7356cab 100644 --- a/stories/components/accordion/docs/examples/basic_usage.tsx +++ b/stories/components/accordion/docs/examples/basic_usage.tsx @@ -1,10 +1,10 @@ import Accordion from '@semcore/ui/accordion'; import type { NSAccordion } from '@semcore/ui/accordion'; import { Box } from '@semcore/ui/base-components'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import React from 'react'; -type ExampleAccordionProps = NSAccordion.Props & { duration?: number } & NSAccordion.Item.Collapse.Props & BoxProps; +type ExampleAccordionProps = NSAccordion.Props & { duration?: number } & NSAccordion.Item.Collapse.Props & NSBox.Props; const Demo = (props: ExampleAccordionProps) => { const [value, onChange] = React.useState([0]); diff --git a/stories/components/badge/tests/examples/badge-bg-colors.tsx b/stories/components/badge/tests/examples/badge-bg-colors.tsx index 1932a4125d..f478d87e35 100644 --- a/stories/components/badge/tests/examples/badge-bg-colors.tsx +++ b/stories/components/badge/tests/examples/badge-bg-colors.tsx @@ -1,10 +1,10 @@ import Badge from '@semcore/ui/badge'; import type { NSBadge } from '@semcore/ui/badge'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Flex } from '@semcore/ui/base-components'; import React from 'react'; -type ExampleBadgeProps = NSBadge.Props & BoxProps; +type ExampleBadgeProps = NSBadge.Props & NSBox.Props; const Demo = (props: ExampleBadgeProps) => { return ( diff --git a/stories/components/base-components/animation/tests/examples/basic-usage.tsx b/stories/components/base-components/animation/tests/examples/basic-usage.tsx index fbab11f8ff..780aa3128d 100644 --- a/stories/components/base-components/animation/tests/examples/basic-usage.tsx +++ b/stories/components/base-components/animation/tests/examples/basic-usage.tsx @@ -1,11 +1,11 @@ -import type { AnimationProps } from '@semcore/ui/base-components'; +import type { NSAnimation } from '@semcore/ui/base-components'; import { Flex, Animation, FadeInOut, Transform } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import React from 'react'; import stylePopper from './basic-usage.module.css'; -const Demo = (props: AnimationProps) => { +const Demo = (props: NSAnimation.Props) => { return ( <> @@ -54,7 +54,7 @@ const Demo = (props: AnimationProps) => { ); }; -export const defaultAnimationProps: AnimationProps = { +export const defaultAnimationProps: NSAnimation.Props = { visible: true, duration: 500, initialAnimation: true, diff --git a/stories/components/base-components/ellipsis/tests/examples/trim_with_special_text_size.tsx b/stories/components/base-components/ellipsis/tests/examples/trim_with_special_text_size.tsx index 80ff961cc3..ca41dece5e 100644 --- a/stories/components/base-components/ellipsis/tests/examples/trim_with_special_text_size.tsx +++ b/stories/components/base-components/ellipsis/tests/examples/trim_with_special_text_size.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import type { NSText } from '@semcore/ui/typography'; import { Text } from '@semcore/ui/typography'; import React from 'react'; @@ -6,7 +6,7 @@ import React from 'react'; type TextExampleProps = { ellipsis?: NSText.EllipsisProps; size: NSText.Props['size']; - w: BoxProps['w']; + w: NSBox.Props['w']; hintProps?: false; hintPlacement?: 'top' | 'bottom' | 'left' | 'right'; }; diff --git a/stories/components/base-components/flex-box/tests/examples/box-all-props.tsx b/stories/components/base-components/flex-box/tests/examples/box-all-props.tsx index 3855011934..def1758fe0 100644 --- a/stories/components/base-components/flex-box/tests/examples/box-all-props.tsx +++ b/stories/components/base-components/flex-box/tests/examples/box-all-props.tsx @@ -1,8 +1,8 @@ import { Box } from '@semcore/ui/base-components'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import React from 'react'; -type ExampleProps = BoxProps & { +type ExampleProps = NSBox.Props & { tag?: React.ElementType; focusRingTopOffset?: string; focusRingRightOffset?: string; diff --git a/stories/components/base-components/grid/docs/examples/automatic-column-size-detection.tsx b/stories/components/base-components/grid/docs/examples/automatic-column-size-detection.tsx index 7f15b9bbb8..12317c010f 100644 --- a/stories/components/base-components/grid/docs/examples/automatic-column-size-detection.tsx +++ b/stories/components/base-components/grid/docs/examples/automatic-column-size-detection.tsx @@ -1,8 +1,9 @@ -import { Box, Col, Row, type BoxProps } from '@semcore/ui/base-components'; +import { Box, Col, Row } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 4, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/grid/docs/examples/change-in-general-offset.tsx b/stories/components/base-components/grid/docs/examples/change-in-general-offset.tsx index ec7c148e91..fae6766db6 100644 --- a/stories/components/base-components/grid/docs/examples/change-in-general-offset.tsx +++ b/stories/components/base-components/grid/docs/examples/change-in-general-offset.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box, Col, Row } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 2, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/grid/docs/examples/change-in-the-general-gutter-between-the-columns.tsx b/stories/components/base-components/grid/docs/examples/change-in-the-general-gutter-between-the-columns.tsx index 212dda0b72..b18515d758 100644 --- a/stories/components/base-components/grid/docs/examples/change-in-the-general-gutter-between-the-columns.tsx +++ b/stories/components/base-components/grid/docs/examples/change-in-the-general-gutter-between-the-columns.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box, Col, Row } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 4, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/grid/docs/examples/example-use.tsx b/stories/components/base-components/grid/docs/examples/example-use.tsx index 80f466d644..a11e6f49a0 100644 --- a/stories/components/base-components/grid/docs/examples/example-use.tsx +++ b/stories/components/base-components/grid/docs/examples/example-use.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box, Col, Row } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 4, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/grid/docs/examples/responsive-alternative-api.tsx b/stories/components/base-components/grid/docs/examples/responsive-alternative-api.tsx index 4a27402b2f..6b420733bd 100644 --- a/stories/components/base-components/grid/docs/examples/responsive-alternative-api.tsx +++ b/stories/components/base-components/grid/docs/examples/responsive-alternative-api.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box, Col, Row } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 2, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/grid/docs/examples/responsive.tsx b/stories/components/base-components/grid/docs/examples/responsive.tsx index 53be2d9547..6ed53c807f 100644 --- a/stories/components/base-components/grid/docs/examples/responsive.tsx +++ b/stories/components/base-components/grid/docs/examples/responsive.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box, Col, Row } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 2, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/grid/tests/examples/auto-span.tsx b/stories/components/base-components/grid/tests/examples/auto-span.tsx index d28727ec4e..72e0767911 100644 --- a/stories/components/base-components/grid/tests/examples/auto-span.tsx +++ b/stories/components/base-components/grid/tests/examples/auto-span.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box, Col, Row } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 4, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/grid/tests/examples/span-number.tsx b/stories/components/base-components/grid/tests/examples/span-number.tsx index adff003a2d..757a5ca259 100644 --- a/stories/components/base-components/grid/tests/examples/span-number.tsx +++ b/stories/components/base-components/grid/tests/examples/span-number.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box, Col, Row } from '@semcore/ui/base-components'; import React from 'react'; const Demo = () => { - const boxProps: BoxProps = { + const boxProps: NSBox.Props = { p: 4, mb: 5, bg: 'bg-primary-advertising', diff --git a/stories/components/base-components/hint/tests/examples/base-example-props.tsx b/stories/components/base-components/hint/tests/examples/base-example-props.tsx index 2442e86d78..58bcdda33d 100644 --- a/stories/components/base-components/hint/tests/examples/base-example-props.tsx +++ b/stories/components/base-components/hint/tests/examples/base-example-props.tsx @@ -1,10 +1,10 @@ import FileExportM from '@semcore/icon/FileExport/m'; import { Hint } from '@semcore/ui/base-components'; -import type { SimpleHintPopperProps } from '@semcore/ui/base-components'; +import type { NSHint } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import React from 'react'; -const Demo = (props: Partial) => { +const Demo = (props: Partial) => { const ref = React.useRef(null); return ( @@ -29,7 +29,7 @@ const Demo = (props: Partial) => { ); }; -export const defaultProps: Partial = { +export const defaultProps: Partial = { placement: undefined, timeout: undefined, visible: undefined, diff --git a/stories/components/base-components/scroll-area/tests/examples/scroll-props.tsx b/stories/components/base-components/scroll-area/tests/examples/scroll-props.tsx index 0df4f03fd0..26457b67ee 100644 --- a/stories/components/base-components/scroll-area/tests/examples/scroll-props.tsx +++ b/stories/components/base-components/scroll-area/tests/examples/scroll-props.tsx @@ -1,8 +1,8 @@ import { ScrollArea, Box, Flex } from '@semcore/ui/base-components'; -import type { ScrollAreaProps } from '@semcore/ui/base-components'; +import type { NSScrollArea } from '@semcore/ui/base-components'; import React from 'react'; -export type ScrollAreaExampleProps = ScrollAreaProps & { +export type ScrollAreaExampleProps = NSScrollArea.Props & { shadow?: boolean; orientation?: 'horizontal' | 'vertical'; topOffset?: number; diff --git a/stories/components/bulk-textarea/tests/examples/basic-props.tsx b/stories/components/bulk-textarea/tests/examples/basic-props.tsx index 0f032acb03..7a1b59f29d 100644 --- a/stories/components/bulk-textarea/tests/examples/basic-props.tsx +++ b/stories/components/bulk-textarea/tests/examples/basic-props.tsx @@ -1,5 +1,5 @@ import { Box, Flex } from '@semcore/ui/base-components'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import BulkTextarea from '@semcore/ui/bulk-textarea'; import type { NSBulktextarea } from '@semcore/ui/bulk-textarea'; import Button from '@semcore/ui/button'; @@ -55,7 +55,7 @@ type PasteProps = NonNullable['pasteProps']>; type ExampleProps = Omit, 'linesDelimiters'> & { autoFocus?: boolean; - w?: BoxProps['w']; + w?: NSBox.Props['w']; pasteDelimiter?: PasteProps['delimiter']; pasteSkipEmptyLines?: boolean; pasteLineProcessing?: PasteProps['lineProcessing']; diff --git a/stories/components/data-table/advanced/examples/accordion_with_many_rows.tsx b/stories/components/data-table/advanced/examples/accordion_with_many_rows.tsx index b5e70e0456..9da006d75e 100644 --- a/stories/components/data-table/advanced/examples/accordion_with_many_rows.tsx +++ b/stories/components/data-table/advanced/examples/accordion_with_many_rows.tsx @@ -1,4 +1,4 @@ -import type { EllipsisSettings } from '@semcore/ui/base-components'; +import type { NSEllipsis } from '@semcore/ui/base-components'; import type { DataTableProps } from '@semcore/ui/data-table'; import { DataTable, ACCORDION } from '@semcore/ui/data-table'; import { Text } from '@semcore/ui/typography'; @@ -13,7 +13,7 @@ export type TableInTableProps = { >['onAccordionToggle']; accordionDuration?: DataTableProps['accordionDuration']; accordionAnimationRows?: DataTableProps['accordionAnimationRows']; - cropPosition?: EllipsisSettings['cropPosition']; + cropPosition?: NSEllipsis.Settings['cropPosition']; hintProps?: false; }; diff --git a/stories/components/data-table/advanced/examples/table_perf/cells/index.tsx b/stories/components/data-table/advanced/examples/table_perf/cells/index.tsx index c67e48223e..b1be04f227 100644 --- a/stories/components/data-table/advanced/examples/table_perf/cells/index.tsx +++ b/stories/components/data-table/advanced/examples/table_perf/cells/index.tsx @@ -1,5 +1,4 @@ import CopyM from '@semcore/icon/Copy/m'; -import type { EllipsisSettings } from '@semcore/ui/base-components'; import { Box, Flex } from '@semcore/ui/base-components'; import Tooltip from '@semcore/ui/tooltip'; import { Text } from '@semcore/ui/typography'; diff --git a/stories/components/data-table/advanced/examples/table_perf/table_perf.tsx b/stories/components/data-table/advanced/examples/table_perf/table_perf.tsx index 8236a90b45..200ac733bd 100644 --- a/stories/components/data-table/advanced/examples/table_perf/table_perf.tsx +++ b/stories/components/data-table/advanced/examples/table_perf/table_perf.tsx @@ -1,4 +1,3 @@ -import type { EllipsisSettings } from '@semcore/ui/base-components'; import type { DataTableData } from '@semcore/ui/data-table'; import { DataTable, ACCORDION } from '@semcore/ui/data-table'; import { Text } from '@semcore/ui/typography'; diff --git a/stories/components/data-table/tests/examples/accordion-tests/table-in-table/accordion-duration.tsx b/stories/components/data-table/tests/examples/accordion-tests/table-in-table/accordion-duration.tsx index 1d17c2f768..82700ea6e4 100644 --- a/stories/components/data-table/tests/examples/accordion-tests/table-in-table/accordion-duration.tsx +++ b/stories/components/data-table/tests/examples/accordion-tests/table-in-table/accordion-duration.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { DataTable, ACCORDION } from '@semcore/ui/data-table'; import type { DataTableProps } from '@semcore/ui/data-table'; import { Text } from '@semcore/ui/typography'; @@ -11,7 +11,7 @@ type TableProps = { accordionAnimationRows: DataTableProps['accordionAnimationRows']; }; -export type AccordionDurationProps = TableProps & BoxProps; +export type AccordionDurationProps = TableProps & NSBox.Props; const WidgetEmpty = () => { return ( diff --git a/stories/components/data-table/tests/examples/accordion-tests/with-component/with-button-not-in-accordion-cell.tsx b/stories/components/data-table/tests/examples/accordion-tests/with-component/with-button-not-in-accordion-cell.tsx index 48ba63e283..0b9618a0e7 100644 --- a/stories/components/data-table/tests/examples/accordion-tests/with-component/with-button-not-in-accordion-cell.tsx +++ b/stories/components/data-table/tests/examples/accordion-tests/with-component/with-button-not-in-accordion-cell.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import { Plot, Line, XAxis, YAxis, ResponsiveContainer, minMax } from '@semcore/ui/d3-chart'; import type { DataTableData, DataTableProps } from '@semcore/ui/data-table'; @@ -14,7 +14,7 @@ export type AccordionWithButtonExampleProps = { loading?: DataTableProps['loading']; defaultGridTemplateColumnWidth?: DataTableProps['defaultGridTemplateColumnWidth']; -} & BoxProps; +} & NSBox.Props; const Demo = (props: AccordionWithButtonExampleProps) => { return ( diff --git a/stories/components/data-table/tests/examples/accordion-tests/with-component/with-horizontal-scroll.tsx b/stories/components/data-table/tests/examples/accordion-tests/with-component/with-horizontal-scroll.tsx index 84778270dd..6118aaed4d 100644 --- a/stories/components/data-table/tests/examples/accordion-tests/with-component/with-horizontal-scroll.tsx +++ b/stories/components/data-table/tests/examples/accordion-tests/with-component/with-horizontal-scroll.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import type { DataTableData, DataTableSort, DataTableProps } from '@semcore/ui/data-table'; import { DataTable, ACCORDION } from '@semcore/ui/data-table'; import { NoData } from '@semcore/ui/widget-empty'; @@ -12,7 +12,7 @@ type AccordionWithHorizontalScrollProps = { defaultGridTemplateColumnWidth?: DataTableProps['defaultGridTemplateColumnWidth']; }; -export type AccordionWithHorizontalScrollExampleProps = AccordionWithHorizontalScrollProps & BoxProps; +export type AccordionWithHorizontalScrollExampleProps = AccordionWithHorizontalScrollProps & NSBox.Props; const Demo = (props: AccordionWithHorizontalScrollExampleProps) => { const [sort, setSort] = React.useState>(['kd', 'desc']); diff --git a/stories/components/data-table/tests/examples/header-tests/base-one-level-header-props.tsx b/stories/components/data-table/tests/examples/header-tests/base-one-level-header-props.tsx index 7b3401e4fa..adc9563c3d 100644 --- a/stories/components/data-table/tests/examples/header-tests/base-one-level-header-props.tsx +++ b/stories/components/data-table/tests/examples/header-tests/base-one-level-header-props.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import type { DataTableData, DataTableProps } from '@semcore/ui/data-table'; import { DataTable } from '@semcore/ui/data-table'; import React from 'react'; @@ -12,7 +12,7 @@ export type OneLevelHeaderBaseProps = { withScrollBar?: boolean; sideIndents?: DataTableProps['sideIndents']; top?: number; -} & BoxProps; +} & NSBox.Props; const Demo = (props: OneLevelHeaderBaseProps) => { return ( diff --git a/stories/components/data-table/tests/examples/header-tests/long-header-ellipsis.tsx b/stories/components/data-table/tests/examples/header-tests/long-header-ellipsis.tsx index 443dc1003e..bdfc9f2a86 100644 --- a/stories/components/data-table/tests/examples/header-tests/long-header-ellipsis.tsx +++ b/stories/components/data-table/tests/examples/header-tests/long-header-ellipsis.tsx @@ -1,6 +1,6 @@ import AmazonM from '@semcore/icon/color/Amazon/m'; import WhatsAppM from '@semcore/icon/color/WhatsApp/m'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { ButtonLink } from '@semcore/ui/button'; import { DataTable } from '@semcore/ui/data-table'; import type { DataTableProps } from '@semcore/ui/data-table'; @@ -16,7 +16,7 @@ export type LongHeaderEllipsisProps = { withScrollBar?: boolean; sideIndents?: DataTableProps['sideIndents']; top?: number; -} & BoxProps; +} & NSBox.Props; const columns = [ { name: 'keyword', gtcWidth: '65px', sortable: true, diff --git a/stories/components/data-table/tests/examples/header-tests/multi-level-header-non-interactive.tsx b/stories/components/data-table/tests/examples/header-tests/multi-level-header-non-interactive.tsx index 29bf3ab5fc..f2d5a0d023 100644 --- a/stories/components/data-table/tests/examples/header-tests/multi-level-header-non-interactive.tsx +++ b/stories/components/data-table/tests/examples/header-tests/multi-level-header-non-interactive.tsx @@ -1,5 +1,5 @@ import AmazonM from '@semcore/icon/color/Amazon/m'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Flex } from '@semcore/ui/base-components'; import { ButtonLink } from '@semcore/ui/button'; import { DataTable } from '@semcore/ui/data-table'; @@ -16,7 +16,7 @@ export type MultiLevelNonInteractiveProps = { sideIndents?: DataTableProps['sideIndents']; top?: number; -} & BoxProps; +} & NSBox.Props; const columns = [ { name: 'other', children: 'Other' }, diff --git a/stories/components/data-table/tests/examples/header-tests/multi-level-with-interactive.tsx b/stories/components/data-table/tests/examples/header-tests/multi-level-with-interactive.tsx index b83c643f36..538754dc9e 100644 --- a/stories/components/data-table/tests/examples/header-tests/multi-level-with-interactive.tsx +++ b/stories/components/data-table/tests/examples/header-tests/multi-level-with-interactive.tsx @@ -1,6 +1,6 @@ import InfoM from '@semcore/icon/Info/m'; import { Flex } from '@semcore/ui/base-components'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { LinkTrigger } from '@semcore/ui/base-trigger'; import { ButtonLink } from '@semcore/ui/button'; import Checkbox from '@semcore/ui/checkbox'; @@ -22,7 +22,7 @@ export type MultiLevelInteractiveProps = { sideIndents?: DataTableProps['sideIndents']; top?: number; -} & BoxProps; +} & NSBox.Props; const options = Array(6) .fill('') diff --git a/stories/components/data-table/tests/examples/header-tests/one-level-interactive-header.tsx b/stories/components/data-table/tests/examples/header-tests/one-level-interactive-header.tsx index 6940ebf64c..8a1fe81552 100644 --- a/stories/components/data-table/tests/examples/header-tests/one-level-interactive-header.tsx +++ b/stories/components/data-table/tests/examples/header-tests/one-level-interactive-header.tsx @@ -1,7 +1,7 @@ import InfoM from '@semcore/icon/Info/m'; import LinkExternalM from '@semcore/icon/LinkExternal/m'; import { Flex } from '@semcore/ui/base-components'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { ButtonLink } from '@semcore/ui/button'; import Checkbox from '@semcore/ui/checkbox'; import { DataTable, SelectableRows } from '@semcore/ui/data-table'; @@ -23,7 +23,7 @@ export type OneLevelInteractiveExampleProps = { sideIndents?: DataTableProps['sideIndents']; top?: number; -} & BoxProps; +} & NSBox.Props; const columns: DataTableProps['columns'] = [ diff --git a/stories/components/data-table/tests/examples/header-tests/sorting/multi-level-sorting.tsx b/stories/components/data-table/tests/examples/header-tests/sorting/multi-level-sorting.tsx index 42f40a87d6..5bd9dd437a 100644 --- a/stories/components/data-table/tests/examples/header-tests/sorting/multi-level-sorting.tsx +++ b/stories/components/data-table/tests/examples/header-tests/sorting/multi-level-sorting.tsx @@ -1,5 +1,5 @@ import AmazonM from '@semcore/icon/color/Amazon/m'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Box } from '@semcore/ui/base-components'; import { ButtonLink } from '@semcore/ui/button'; import { DataTable } from '@semcore/ui/data-table'; @@ -20,7 +20,7 @@ export type MultiLevelSortingProps = { sideIndents?: DataTableProps['sideIndents']; top?: number; -} & BoxProps; +} & NSBox.Props; const columns: DataTableProps['columns'] = [ { name: 'group1', diff --git a/stories/components/data-table/tests/examples/header-tests/sorting/one-level-header-sorting-props.tsx b/stories/components/data-table/tests/examples/header-tests/sorting/one-level-header-sorting-props.tsx index 13138c902e..22ac1f2c49 100644 --- a/stories/components/data-table/tests/examples/header-tests/sorting/one-level-header-sorting-props.tsx +++ b/stories/components/data-table/tests/examples/header-tests/sorting/one-level-header-sorting-props.tsx @@ -1,6 +1,6 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { DataTable } from '@semcore/ui/data-table'; -import type { DataTableSort, DataTableData, DataTableProps } from '@semcore/ui/data-table'; +import type { DataTableSort, DataTableProps } from '@semcore/ui/data-table'; import React from 'react'; type SortableColumn = Exclude; @@ -16,7 +16,7 @@ type BaseExampleProps = { top?: number; }; -export type OneLevelHeaderSortingProps = BaseExampleProps & BoxProps; +export type OneLevelHeaderSortingProps = BaseExampleProps & NSBox.Props; const Demo = (props: OneLevelHeaderSortingProps) => { const [sort, setSort] = React.useState>(['cpc', 'desc']); diff --git a/stories/components/data-table/tests/examples/limited-mode/accordion.tsx b/stories/components/data-table/tests/examples/limited-mode/accordion.tsx index 80f3ac3130..62773d453c 100644 --- a/stories/components/data-table/tests/examples/limited-mode/accordion.tsx +++ b/stories/components/data-table/tests/examples/limited-mode/accordion.tsx @@ -1,4 +1,4 @@ -import { type EllipsisSettings, Flex } from '@semcore/ui/base-components'; +import { Flex } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import { DataTable, ACCORDION } from '@semcore/ui/data-table'; import type { DataTableProps } from '@semcore/ui/data-table'; diff --git a/stories/components/data-table/tests/examples/scroll-tests/scroll-in-table.tsx b/stories/components/data-table/tests/examples/scroll-tests/scroll-in-table.tsx index 7008e47319..c8406997aa 100644 --- a/stories/components/data-table/tests/examples/scroll-tests/scroll-in-table.tsx +++ b/stories/components/data-table/tests/examples/scroll-tests/scroll-in-table.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Flex } from '@semcore/ui/base-components'; import { DataTable } from '@semcore/ui/data-table'; import type { DataTableProps } from '@semcore/ui/data-table'; @@ -13,7 +13,7 @@ export type ScrollInTableProps = { withScrollBar?: boolean; sideIndents?: DataTableProps['sideIndents']; multiLevel?: boolean; -} & BoxProps; +} & NSBox.Props; const flatColumns = [ { name: 'keyword', children: 'Keyword' }, diff --git a/stories/components/data-table/tests/examples/scroll-tests/sticky-header-scroll-sync.tsx b/stories/components/data-table/tests/examples/scroll-tests/sticky-header-scroll-sync.tsx index 0568b558d6..51a578669e 100644 --- a/stories/components/data-table/tests/examples/scroll-tests/sticky-header-scroll-sync.tsx +++ b/stories/components/data-table/tests/examples/scroll-tests/sticky-header-scroll-sync.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Flex } from '@semcore/ui/base-components'; import { DataTable } from '@semcore/ui/data-table'; import type { DataTableData } from '@semcore/ui/data-table'; @@ -12,7 +12,7 @@ export type StickyHeaderScrollSyncProps = { limitEnabled?: boolean; rowsLimit?: number; columnsLimit?: number; -} & BoxProps; +} & NSBox.Props; const flatColumns = [ { name: 'keyword', children: 'Keyword', gtcWidth: '200px' }, diff --git a/stories/components/data-table/tests/examples/scroll-tests/sticky-header-sorting.tsx b/stories/components/data-table/tests/examples/scroll-tests/sticky-header-sorting.tsx index 3ca82e7370..ac4a8cd74a 100644 --- a/stories/components/data-table/tests/examples/scroll-tests/sticky-header-sorting.tsx +++ b/stories/components/data-table/tests/examples/scroll-tests/sticky-header-sorting.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import type { DataTableSort } from '@semcore/ui/data-table'; import { DataTable } from '@semcore/ui/data-table'; import React from 'react'; @@ -9,7 +9,7 @@ export type StickyHeaderSortingProps = { withScrollBar?: boolean; fixedFirstColumn?: boolean; fixedLastColumn?: boolean; -} & BoxProps; +} & NSBox.Props; type ColumnName = keyof (typeof data)[0]; diff --git a/stories/components/data-table/tests/examples/scroll-tests/with-fixed-column.tsx b/stories/components/data-table/tests/examples/scroll-tests/with-fixed-column.tsx index 38396b8abe..b8dd20c2c8 100644 --- a/stories/components/data-table/tests/examples/scroll-tests/with-fixed-column.tsx +++ b/stories/components/data-table/tests/examples/scroll-tests/with-fixed-column.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { DataTable } from '@semcore/ui/data-table'; import type { DataTableProps } from '@semcore/ui/data-table'; import React from 'react'; @@ -12,7 +12,7 @@ export type WithFixedColumnProps = { withScrollBar?: boolean; sideIndents?: DataTableProps['sideIndents']; multiLevel?: boolean; -} & BoxProps; +} & NSBox.Props; const oneLevelColumns = [ { name: 'keyword', children: 'Keyword', fixed: 'left' as const, gtcWidth: '150px' }, diff --git a/stories/components/divider/tests/examples/divider-styles.tsx b/stories/components/divider/tests/examples/divider-styles.tsx index ab357b3b25..65b21b48e2 100644 --- a/stories/components/divider/tests/examples/divider-styles.tsx +++ b/stories/components/divider/tests/examples/divider-styles.tsx @@ -1,4 +1,4 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Flex } from '@semcore/ui/base-components'; import Divider from '@semcore/ui/divider'; import type { NSDivider } from '@semcore/ui/divider'; diff --git a/stories/components/dropdown/tests/examples/disable-enforce-focus-and-auto-focus.tsx b/stories/components/dropdown/tests/examples/disable-enforce-focus-and-auto-focus.tsx index 4c9e7a8b76..b7d5243df7 100644 --- a/stories/components/dropdown/tests/examples/disable-enforce-focus-and-auto-focus.tsx +++ b/stories/components/dropdown/tests/examples/disable-enforce-focus-and-auto-focus.tsx @@ -1,5 +1,5 @@ import FileExportM from '@semcore/icon/FileExport/m'; -import type { PopperProps, PopperTriggerProps, PopperPopperProps } from '@semcore/ui/base-components'; +import type { NSPopper } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import Dropdown from '@semcore/ui/dropdown'; import type { DropdownProps } from '@semcore/ui/dropdown'; @@ -7,7 +7,11 @@ import Tooltip from '@semcore/ui/tooltip'; import { Text } from '@semcore/ui/typography'; import React from 'react'; -type DisableEnforceAndAutoFocusExampleProps = PopperPopperProps & PopperTriggerProps & PopperProps & DropdownProps; +type DisableEnforceAndAutoFocusExampleProps = + & NSPopper.Popper.Props + & NSPopper.Trigger.Props + & NSPopper.Props + & DropdownProps; const Demo = (props: DisableEnforceAndAutoFocusExampleProps) => ( <> diff --git a/stories/components/dropdown/tests/examples/example-with-props.tsx b/stories/components/dropdown/tests/examples/example-with-props.tsx index 836b39b230..f5376915bb 100644 --- a/stories/components/dropdown/tests/examples/example-with-props.tsx +++ b/stories/components/dropdown/tests/examples/example-with-props.tsx @@ -1,5 +1,5 @@ import FileExportM from '@semcore/icon/FileExport/m'; -import type { PopperProps, PopperTriggerProps, PopperPopperProps } from '@semcore/ui/base-components'; +import type { NSPopper } from '@semcore/ui/base-components'; import { Flex } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import Dropdown from '@semcore/ui/dropdown'; @@ -8,7 +8,13 @@ import Tooltip from '@semcore/ui/tooltip'; import { Text } from '@semcore/ui/typography'; import React from 'react'; -type DropdownExampleProps = PopperPopperProps & PopperTriggerProps & PopperProps & DropdownProps & { autofocus?: boolean }; +type DropdownExampleProps = + & NSPopper.Popper.Props + & NSPopper.Trigger.Props + & NSPopper.Props + & DropdownProps + & { autofocus?: boolean }; + const Demo = (props: DropdownExampleProps) => ( React.ReactElement) & { defaultProps: ExampleProps } = (props) => { const [visible, setVisible] = React.useState(true); diff --git a/stories/components/feature-popover/tests/examples/base-usage-with-medium-illustration.tsx b/stories/components/feature-popover/tests/examples/base-usage-with-medium-illustration.tsx index 1d97d36f25..c097f9d501 100644 --- a/stories/components/feature-popover/tests/examples/base-usage-with-medium-illustration.tsx +++ b/stories/components/feature-popover/tests/examples/base-usage-with-medium-illustration.tsx @@ -1,6 +1,6 @@ import FileExport from '@semcore/icon/FileExport/m'; import { Flex, Box } from '@semcore/ui/base-components'; -import type { PopperProps, PopperTriggerProps, PopperPopperProps } from '@semcore/ui/base-components'; +import type { NSPopper } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import DropdownMenu from '@semcore/ui/dropdown-menu'; import FeaturePopover from '@semcore/ui/feature-popover'; @@ -8,7 +8,7 @@ import type { NSFeaturePopover } from '@semcore/ui/feature-popover'; import { Text } from '@semcore/ui/typography'; import React from 'react'; -type ExampleProps = NSFeaturePopover.Popper.Props & PopperProps & PopperTriggerProps & PopperPopperProps; +type ExampleProps = NSFeaturePopover.Popper.Props & NSPopper.Props & NSPopper.Trigger.Props & NSPopper.Popper.Props; const Demo: ((props: ExampleProps) => React.ReactElement) & { defaultProps: ExampleProps } = (props) => { const [visible, setVisible] = React.useState(true); diff --git a/stories/components/input-tags/docs/examples/entering_and_editing_tags.tsx b/stories/components/input-tags/docs/examples/entering_and_editing_tags.tsx index effaa4cdb7..9f4fb8a987 100644 --- a/stories/components/input-tags/docs/examples/entering_and_editing_tags.tsx +++ b/stories/components/input-tags/docs/examples/entering_and_editing_tags.tsx @@ -1,4 +1,4 @@ -import { Flex, type EllipsisSettings } from '@semcore/ui/base-components'; +import { Flex } from '@semcore/ui/base-components'; import type { InputTagsProps, InputTagsValueProps } from '@semcore/ui/input-tags'; import InputTags from '@semcore/ui/input-tags'; import { Text } from '@semcore/ui/typography'; diff --git a/stories/components/input/tests/examples/input-base-example.tsx b/stories/components/input/tests/examples/input-base-example.tsx index 75a4b87a20..c845cb4864 100644 --- a/stories/components/input/tests/examples/input-base-example.tsx +++ b/stories/components/input/tests/examples/input-base-example.tsx @@ -1,13 +1,13 @@ import Search from '@semcore/icon/Search/m'; import Badge from '@semcore/ui/badge'; import { Flex } from '@semcore/ui/base-components'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import type { NSInput } from '@semcore/ui/input'; import Input from '@semcore/ui/input'; import { Text } from '@semcore/ui/typography'; import React from 'react'; -type BaseExampleProps = NSInput.Props & NSInput.Value.Props & BoxProps; +type BaseExampleProps = NSInput.Props & NSInput.Value.Props & NSBox.Props; const Demo = (props: BaseExampleProps) => { return ( diff --git a/stories/components/input/tests/examples/input-with-label.tsx b/stories/components/input/tests/examples/input-with-label.tsx index 5078737026..55d028c616 100644 --- a/stories/components/input/tests/examples/input-with-label.tsx +++ b/stories/components/input/tests/examples/input-with-label.tsx @@ -1,5 +1,5 @@ import { Flex } from '@semcore/ui/base-components'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { LinkTrigger } from '@semcore/ui/base-trigger'; import Counter from '@semcore/ui/counter'; import Input from '@semcore/ui/input'; @@ -16,7 +16,7 @@ const options = Array(6) children: `Option ${index}`, })); -type WithLabelExampleProps = NSInput.Props & NSInput.Value.Props & BoxProps; +type WithLabelExampleProps = NSInput.Props & NSInput.Value.Props & NSBox.Props; const Demo = (props: WithLabelExampleProps) => { return ( diff --git a/stories/components/input/tests/examples/input-with-neighborlocation.tsx b/stories/components/input/tests/examples/input-with-neighborlocation.tsx index f561e6108f..4c5462bd74 100644 --- a/stories/components/input/tests/examples/input-with-neighborlocation.tsx +++ b/stories/components/input/tests/examples/input-with-neighborlocation.tsx @@ -1,12 +1,12 @@ import ShowYesM from '@semcore/icon/ShowYes/m'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Flex, NeighborLocation } from '@semcore/ui/base-components'; import { ButtonLink } from '@semcore/ui/button'; import type { NSInput } from '@semcore/ui/input'; import Input from '@semcore/ui/input'; import React from 'react'; -type WithNeighborLocationExampleProps = NSInput.Props & NSInput.Value.Props & BoxProps; +type WithNeighborLocationExampleProps = NSInput.Props & NSInput.Value.Props & NSBox.Props; const Demo = (props: WithNeighborLocationExampleProps) => { return ( <> diff --git a/stories/components/modal/tests/examples/with-table-link-and-ellipsis.tsx b/stories/components/modal/tests/examples/with-table-link-and-ellipsis.tsx index bac18a2170..3994d8160d 100644 --- a/stories/components/modal/tests/examples/with-table-link-and-ellipsis.tsx +++ b/stories/components/modal/tests/examples/with-table-link-and-ellipsis.tsx @@ -1,5 +1,5 @@ import LinkExternalM from '@semcore/icon/LinkExternal/m'; -import { type EllipsisSettings } from '@semcore/ui/base-components'; +import type { NSEllipsis } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import { DataTable } from '@semcore/ui/data-table'; import Link from '@semcore/ui/link'; @@ -11,7 +11,7 @@ type WithTableLinkProps = NSModal.Props & { title?: string; content?: string; showCloseButton?: boolean; - ellipsis?: true | EllipsisSettings; + ellipsis?: true | NSEllipsis.Settings; }; const removeProtocol = (url: string): string => url.replace(/^(http|https):\/\//, ''); @@ -131,7 +131,7 @@ const Demo = (props: WithTableLinkProps) => { // } // }, []); // - // const ellipsisSettings: EllipsisSettings = React.useMemo(() => { + // const ellipsisSettings: NSEllipsis.Settings = React.useMemo(() => { // return { // cropPosition: 'end', // containerElement: columnElement, diff --git a/stories/components/skeleton/tests/examples/skeleton-themes.tsx b/stories/components/skeleton/tests/examples/skeleton-themes.tsx index ab567f7734..9183637f2c 100644 --- a/stories/components/skeleton/tests/examples/skeleton-themes.tsx +++ b/stories/components/skeleton/tests/examples/skeleton-themes.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import Skeleton from '@semcore/ui/skeleton'; import type { NSSkeleton } from '@semcore/ui/skeleton'; import React from 'react'; -type ExampleProps = NSSkeleton.Props & NSSkeleton.Text.Props & BoxProps; +type ExampleProps = NSSkeleton.Props & NSSkeleton.Text.Props & NSBox.Props; const Demo = (props: ExampleProps) => { return ( <> diff --git a/stories/components/tab-line/tests/examples/tab_line_item_addons_and_props.tsx b/stories/components/tab-line/tests/examples/tab_line_item_addons_and_props.tsx index 44d6c9afad..62019ba6a9 100644 --- a/stories/components/tab-line/tests/examples/tab_line_item_addons_and_props.tsx +++ b/stories/components/tab-line/tests/examples/tab_line_item_addons_and_props.tsx @@ -2,14 +2,14 @@ import FacebookM from '@semcore/icon/Facebook/m'; import InstagramM from '@semcore/icon/Instagram/m'; import TwitterM from '@semcore/icon/Twitter/m'; import Badge from '@semcore/ui/badge'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import Counter from '@semcore/ui/counter'; import TabLine from '@semcore/ui/tab-line'; import type { NSTabLine } from '@semcore/ui/tab-line'; import { Text, type NSText } from '@semcore/ui/typography'; import React from 'react'; -type TabLineDefProps = NSTabLine.Props & BoxProps & NSTabLine.Item.Props & { +type TabLineDefProps = NSTabLine.Props & NSBox.Props & NSTabLine.Item.Props & { ellipsis?: NSText.EllipsisProps; hintPlacement?: 'top' | 'bottom' | 'left' | 'right'; hintProps?: false; diff --git a/stories/components/tab-panel/tests/examples/tab_panel_item_addons_and_props.tsx b/stories/components/tab-panel/tests/examples/tab_panel_item_addons_and_props.tsx index 91739157fd..3f90b886be 100644 --- a/stories/components/tab-panel/tests/examples/tab_panel_item_addons_and_props.tsx +++ b/stories/components/tab-panel/tests/examples/tab_panel_item_addons_and_props.tsx @@ -2,7 +2,7 @@ import FacebookM from '@semcore/icon/Facebook/m'; import InstagramM from '@semcore/icon/Instagram/m'; import TwitterM from '@semcore/icon/Twitter/m'; import Badge from '@semcore/ui/badge'; -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import Counter from '@semcore/ui/counter'; import TabPanel from '@semcore/ui/tab-panel'; import type { NSTabPanel } from '@semcore/ui/tab-panel'; @@ -10,7 +10,7 @@ import type { NSText } from '@semcore/ui/typography'; import { Text } from '@semcore/ui/typography'; import React from 'react'; -type TabPanelDefProps = NSTabPanel.Props & BoxProps & NSTabPanel.Item.Props & { +type TabPanelDefProps = NSTabPanel.Props & NSBox.Props & NSTabPanel.Item.Props & { ellipsis?: NSText.EllipsisProps; hintPlacement?: 'top' | 'bottom' | 'left' | 'right'; hintProps?: false; diff --git a/stories/components/tooltip/docs/examples/placement-properties.tsx b/stories/components/tooltip/docs/examples/placement-properties.tsx index 3eaaeb1cf4..36003df3bc 100644 --- a/stories/components/tooltip/docs/examples/placement-properties.tsx +++ b/stories/components/tooltip/docs/examples/placement-properties.tsx @@ -1,5 +1,5 @@ import { Box } from '@semcore/ui/base-components'; -import type { Placement } from '@semcore/ui/base-components'; +import type { NSPopper } from '@semcore/ui/base-components'; import Button from '@semcore/ui/button'; import Tooltip from '@semcore/ui/tooltip'; import React from 'react'; @@ -13,7 +13,7 @@ const styleBox = { }; const Demo = () => { - const placements: Placement[] = [ + const placements: NSPopper.Placement[] = [ 'top-start', 'top', 'top-end', diff --git a/stories/components/typography/tests/examples/text-with-diff-combimations.tsx b/stories/components/typography/tests/examples/text-with-diff-combimations.tsx index c2f9445428..796f47941a 100644 --- a/stories/components/typography/tests/examples/text-with-diff-combimations.tsx +++ b/stories/components/typography/tests/examples/text-with-diff-combimations.tsx @@ -1,9 +1,9 @@ -import type { BoxProps } from '@semcore/ui/base-components'; +import type { NSBox } from '@semcore/ui/base-components'; import { Text } from '@semcore/ui/typography'; import type { NSText } from '@semcore/ui/typography'; import React from 'react'; -type ExampleProps = NSText.Props & BoxProps & { formatTags: boolean }; +type ExampleProps = NSText.Props & NSBox.Props & { formatTags: boolean }; type DemoComponent = ((props: ExampleProps) => React.ReactElement) & { defaultProps?: Partial }; diff --git a/stories/patterns/core/tests/all-components/components/Tables/table_perf/cells/index.tsx b/stories/patterns/core/tests/all-components/components/Tables/table_perf/cells/index.tsx index a6a68e2694..7fb2c37831 100644 --- a/stories/patterns/core/tests/all-components/components/Tables/table_perf/cells/index.tsx +++ b/stories/patterns/core/tests/all-components/components/Tables/table_perf/cells/index.tsx @@ -1,5 +1,4 @@ import CopyM from '@semcore/icon/Copy/m'; -import type { EllipsisSettings } from '@semcore/ui/base-components'; import { Box, Flex } from '@semcore/ui/base-components'; import Tooltip from '@semcore/ui/tooltip'; import { Text } from '@semcore/ui/typography'; diff --git a/tools/babel-plugin-react-semcore/tsconfig.json b/tools/babel-plugin-react-semcore/tsconfig.json index 68cec7f0a2..40556ff83c 100644 --- a/tools/babel-plugin-react-semcore/tsconfig.json +++ b/tools/babel-plugin-react-semcore/tsconfig.json @@ -1,4 +1,4 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src", "lib", "index.js"] -} +} \ No newline at end of file diff --git a/tools/babel-plugin-root/tsconfig.json b/tools/babel-plugin-root/tsconfig.json index ddb8b6811a..36ec497c31 100644 --- a/tools/babel-plugin-root/tsconfig.json +++ b/tools/babel-plugin-root/tsconfig.json @@ -1,7 +1,7 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" } -} +} \ No newline at end of file diff --git a/tools/babel-plugin-styles/tsconfig.json b/tools/babel-plugin-styles/tsconfig.json index ddb8b6811a..36ec497c31 100644 --- a/tools/babel-plugin-styles/tsconfig.json +++ b/tools/babel-plugin-styles/tsconfig.json @@ -1,7 +1,7 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" } -} +} \ No newline at end of file diff --git a/tools/babel-preset-ui/tsconfig.json b/tools/babel-preset-ui/tsconfig.json index ddb8b6811a..36ec497c31 100644 --- a/tools/babel-preset-ui/tsconfig.json +++ b/tools/babel-preset-ui/tsconfig.json @@ -1,7 +1,7 @@ { - "extends": "../../tsconfig.json", + "extends": "../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { "rootDir": "./src" } -} +} \ No newline at end of file diff --git a/tools/builder/bin/index.ts b/tools/builder/bin/index.ts index e75752bc61..15a6b8e6db 100755 --- a/tools/builder/bin/index.ts +++ b/tools/builder/bin/index.ts @@ -27,6 +27,8 @@ process.chdir(babelPresetPackagePath); const makeCommand: Record string> = { CLEANUP: () => `${workingDir}/lib`, + // TODO: Remove it when the project migrate to incremental TS build + CLEANUP_TS_BUILD_INFO: () => `${workingDir}/tsconfig.tsbuildinfo`, TYPES: (output: string) => `tsc --emitDeclarationOnly --project ${workingDir}/tsconfig.json --outDir ${workingDir}/lib/${output}`, COPY_TYPES: (output: string) => @@ -64,6 +66,8 @@ const MAP_BABEL_ENV: Record = { console.log(`running builder from dir ${workingDir}\n`); await rm(makeCommand.CLEANUP(), { recursive: true, force: true }).catch((err) => {}); +// TODO: Remove it when the project migrate to incremental TS build +await rm(makeCommand.CLEANUP_TS_BUILD_INFO(), { force: true }).catch((err) => {}); if (process.platform === 'win32') process.exit(0); diff --git a/tools/continuous-delivery/tsconfig.json b/tools/continuous-delivery/tsconfig.json index 7fc747ba0c..ddb8b6811a 100644 --- a/tools/continuous-delivery/tsconfig.json +++ b/tools/continuous-delivery/tsconfig.json @@ -1,7 +1,4 @@ { - "compilerOptions": { - "strict": true - }, "extends": "../../tsconfig.json", "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"], "compilerOptions": { diff --git a/tsconfig.base.json b/tsconfig.base.json new file mode 100644 index 0000000000..9e1ab16a8e --- /dev/null +++ b/tsconfig.base.json @@ -0,0 +1,20 @@ +{ + "compilerOptions": { + "module": "esnext", + "target": "esnext", + "lib": ["dom", "ESNext"], + "jsx": "react", + "declaration": true, + "declarationMap": true, + "esModuleInterop": true, + "skipLibCheck": true, + "strict": true, + "noEmit": false, + "sourceMap": true, + "importHelpers": false, + "noEmitHelpers": true, + "moduleResolution": "bundler", + "resolveJsonModule": true, + "types": ["node", "vitest", "@workspace/types/deps", "@workspace/types/globals", "@workspace/types/styles", "@workspace/types/vite"], + }, +} diff --git a/tsconfig.json b/tsconfig.json index 7b976eaa6b..a634522397 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,34 +1,19 @@ { + "extends": "./tsconfig.base.json", "compilerOptions": { - "module": "esnext", - "target": "esnext", - "lib": ["dom", "ESNext"], - "jsx": "react", - "declaration": true, - "esModuleInterop": true, "allowImportingTsExtensions": true, - "skipLibCheck": true, - "strict": true, - "noEmit": false, - "sourceMap": true, - "importHelpers": false, - "noEmitHelpers": true, - "moduleResolution": "bundler", - "resolveJsonModule": true, - "types": ["node", "vitest", "@workspace/types/deps", "@workspace/types/globals", "@workspace/types/styles", "@workspace/types/vite"], "paths": { - "@semcore/illustration/*": ["${configDir}/semcore/illustration/lib/*"], - "@semcore/illustration": ["${configDir}/semcore/illustration"], - "@semcore/icon/*": ["${configDir}/semcore/icon/lib/*"], - "@semcore/ui/d3-chart": ["${configDir}/semcore/d3-chart"], - "@semcore/ui/core/lib/*": ["${configDir}/semcore/core/src/*"], - "@semcore/ui/*": ["${configDir}/semcore/*/src"], - "@semcore/*": ["${configDir}/semcore/*/src"], - "@tools/*": ["${configDir}/tools/*"] + "@semcore/illustration/*": ["./semcore/illustration/lib/*"], + "@semcore/illustration": ["./semcore/illustration"], + "@semcore/icon/*": ["./semcore/icon/lib/*"], + "@semcore/ui/d3-chart": ["./semcore/d3-chart"], + "@semcore/ui/core/lib/*": ["./semcore/core/src/*"], + "@semcore/ui/*": ["./semcore/*/src"], + "@semcore/*": ["./semcore/*/src"], + "@tools/*": ["./tools/*"] }, }, - "project": ["./semcore/*/tsconfig.json", "./tools/*/tsconfig.json"], - "include": ["semcore", "tools", "stories", "playground"], + "include": ["tools", "stories", "playground"], "exclude": [ "node_modules", "tools/icon-transform-svg/__tests__" diff --git a/website/docs/components/accordion/accordion-api.md b/website/docs/components/accordion/accordion-api.md index a5c906596b..b4957744f9 100644 --- a/website/docs/components/accordion/accordion-api.md +++ b/website/docs/components/accordion/accordion-api.md @@ -31,7 +31,7 @@ import { Accordion } from '@semcore/ui/accordion'; ; ``` -Has all properties as [BoxProps](/layout/box-system/box-system-api) prop does. +Has all properties as [NSBox.Props](/layout/box-system/box-system-api) prop does. ## Accordion.Item.Collapse @@ -43,7 +43,7 @@ import { Accordion } from '@semcore/ui/accordion'; -Has all properties as [BoxProps](/layout/box-system/box-system-api) prop does. +Has all properties as [NSBox.Props](/layout/box-system/box-system-api) prop does. ## Accordion.Item.Chevron @@ -53,6 +53,6 @@ import { Accordion } from '@semcore/ui/accordion'; ; ``` -Has all properties as [BoxProps](/layout/box-system/box-system-api) prop does. +Has all properties as [NSBox.Props](/layout/box-system/box-system-api) prop does. diff --git a/website/docs/components/dropdown-menu/dropdown-menu-api.md b/website/docs/components/dropdown-menu/dropdown-menu-api.md index f771f7e202..3988f04178 100644 --- a/website/docs/components/dropdown-menu/dropdown-menu-api.md +++ b/website/docs/components/dropdown-menu/dropdown-menu-api.md @@ -77,7 +77,7 @@ import DropdownMenu from '@semcore/ui/dropdown-menu'; ; ``` - + ## DropdownMenu.Item.Text @@ -110,7 +110,7 @@ import DropdownMenu from '@semcore/ui/dropdown-menu'; ; ``` - + ## DropdownMenu.StatusItem diff --git a/website/docs/components/dropdown/dropdown-api.md b/website/docs/components/dropdown/dropdown-api.md index d17da5c58f..d93d765c51 100644 --- a/website/docs/components/dropdown/dropdown-api.md +++ b/website/docs/components/dropdown/dropdown-api.md @@ -28,7 +28,7 @@ import Dropdown from '@semcore/ui/dropdown'; ; ``` - + ## Dropdown.Popper @@ -39,6 +39,6 @@ import Dropdown from '@semcore/ui/dropdown'; ; ``` - + diff --git a/website/docs/components/modal/modal-api.md b/website/docs/components/modal/modal-api.md index dce02523cb..4af2d4da9c 100644 --- a/website/docs/components/modal/modal-api.md +++ b/website/docs/components/modal/modal-api.md @@ -15,7 +15,7 @@ import Modal from '@semcore/ui/modal'; ## Modal.Overlay -Component which represents the background. Has all properties as [BoxProps](/layout/box-system/box-system-api) prop does. +Component which represents the background. Has all properties as [NSBox.Props](/layout/box-system/box-system-api) prop does. ```jsx import Modal from '@semcore/ui/modal'; @@ -24,7 +24,7 @@ import Modal from '@semcore/ui/modal'; ## Modal.Window -Component which represents the modal window itself. Has all properties as [BoxProps](/layout/box-system/box-system-api) prop does. +Component which represents the modal window itself. Has all properties as [NSBox.Props](/layout/box-system/box-system-api) prop does. ```jsx import Modal from '@semcore/ui/modal'; @@ -33,7 +33,7 @@ import Modal from '@semcore/ui/modal'; ## Modal.Close -Component which represents the closing icon. The component is the `CloseS` icon with the configured styles. Has all properties as [BoxProps](/layout/box-system/box-system-api) prop and [IconProps](/style/icon/icon-api) prop does. +Component which represents the closing icon. The component is the `CloseS` icon with the configured styles. Has all properties as [NSBox.Props](/layout/box-system/box-system-api) prop and [IconProps](/style/icon/icon-api) prop does. ```jsx import Modal from '@semcore/ui/modal'; diff --git a/website/docs/components/scroll-area/scroll-area-api.md b/website/docs/components/scroll-area/scroll-area-api.md index 97701c5f99..3495f66d4a 100644 --- a/website/docs/components/scroll-area/scroll-area-api.md +++ b/website/docs/components/scroll-area/scroll-area-api.md @@ -11,7 +11,7 @@ import { ScrollArea } from '@semcore/ui/base-components'; ; ``` - + ## ScrollArea.Container @@ -29,7 +29,7 @@ import { ScrollArea } from '@semcore/ui/base-components'; ; ``` - + ## ScrollArea.Bar.Slider diff --git a/website/docs/layout/box-system/box-system-api.md b/website/docs/layout/box-system/box-system-api.md index 1e30fc93f5..727160664f 100644 --- a/website/docs/layout/box-system/box-system-api.md +++ b/website/docs/layout/box-system/box-system-api.md @@ -13,7 +13,7 @@ import { Box } from '@semcore/ui/base-components'; ; ``` - + ## Flex @@ -24,6 +24,6 @@ import { Flex } from '@semcore/ui/base-components'; ; ``` - + diff --git a/website/docs/utils/hint/hint-api.md b/website/docs/utils/hint/hint-api.md index ba58b8567c..79196d915f 100644 --- a/website/docs/utils/hint/hint-api.md +++ b/website/docs/utils/hint/hint-api.md @@ -7,6 +7,6 @@ tabs: Design('hint'), A11y('hint-a11y'), API('hint-api'), Examples('hint-code'), import { Hint } from '@semcore/base-components'; ``` - + diff --git a/website/docs/utils/neighbor-location/neighbor-location-api.md b/website/docs/utils/neighbor-location/neighbor-location-api.md index 222fe2252b..d2d485a8d0 100644 --- a/website/docs/utils/neighbor-location/neighbor-location-api.md +++ b/website/docs/utils/neighbor-location/neighbor-location-api.md @@ -20,7 +20,7 @@ import NeighborLocation from '@semcore/ui/base-components'; ; ``` - + ## NeighborLocation.Detect @@ -32,6 +32,6 @@ import NeighborLocation from '@semcore/ui/base-components'; ; ``` - + diff --git a/website/docs/utils/neighbor-location/neighbor-location.md b/website/docs/utils/neighbor-location/neighbor-location.md index 00119d780d..cb3ff5245a 100644 --- a/website/docs/utils/neighbor-location/neighbor-location.md +++ b/website/docs/utils/neighbor-location/neighbor-location.md @@ -79,7 +79,7 @@ By default, `` doesn't create an HTML wrapper, but you can pa ::: tip For the correct type mapping in the TC, you must also pass the interface. -` tag={Flex} w={200}/>` +` tag={Flex} w={200}/>` ::: ::: sandbox diff --git a/website/docs/utils/popper/popper-api.md b/website/docs/utils/popper/popper-api.md index 2c0cdc924b..2bd9d8ecfc 100644 --- a/website/docs/utils/popper/popper-api.md +++ b/website/docs/utils/popper/popper-api.md @@ -13,7 +13,7 @@ import { Popper } from '@semcore/ui/base-components'; ; ``` - + ## Popper.Trigger @@ -24,7 +24,7 @@ import { Popper } from '@semcore/ui/base-components'; ; ``` - + ## Popper.Popper @@ -35,6 +35,6 @@ import { Popper } from '@semcore/ui/base-components'; ; ``` - + diff --git a/website/docs/utils/portal/portal-api.md b/website/docs/utils/portal/portal-api.md index 598f5366f4..bc259cf81f 100644 --- a/website/docs/utils/portal/portal-api.md +++ b/website/docs/utils/portal/portal-api.md @@ -8,6 +8,6 @@ tabs: Design('portal'), API('portal-api'), Changelog('portal-changelog') import { Portal, PortalProvider } from '@semcore/ui/base-components'; ``` - +