I want to selectively pass props to the library component.
Library has created an inline type by hardcoding multiple values.
I interest of my code upgrading automatically with additions to the library defined type can I reuse those inline values without recreating them
Inside library --> component.d.ts file has
export interface TooltipProps {
...manyOtherProps,
placement?: | 'bottom-end' | 'bottom-start' | 'bottom' | 'left-end' | 'left-start' | 'left' | 'right-end' | 'right-start' | 'right' | 'top-end' | 'top-start' | 'top';
}
I tried some attempts with keyof and valueof
type ValueOf<T> = T[keyof T];
type PlacementStrings = ValueOf<TooltipProps>
interface JustPlacement {
placement: "top"
}
type PlacementStringsKeys = keyof TooltipProps & keyof JustPlacement
type stpls = ValueOf<PlacementStringsKeys>
But not getting the needed thing.
which would be without rewriting it
interface CustomTooltipProps {
placement?: | 'bottom-end' | 'bottom-start' | 'bottom' | 'left-end' | 'left-start' | 'left' | 'right-end' | 'right-start' | 'right' | 'top-end' | 'top-start' | 'top';
}
You can use the Pick helper to create a new object type including all keys/values where the key is assignable to the specified type:
// mylib.ts
export interface TooltipProps {
foo: "bar";
placement?: | 'bottom-end' | 'bottom-start' | 'bottom' | 'left-end' | 'left-start' | 'left' | 'right-end' | 'right-start' | 'right' | 'top-end' | 'top-start' | 'top';
}
// otherfile.ts
import type { TooltipProps } from "./mylib";
type CustomTooltipProps = Pick<TooltipProps, "placement">;
// this is expanded into the following:
type CustomTooltipProps = {
placement?: "bottom-end" | "bottom-start" | "bottom" | "left-end" | "left-start" | "left" | "right-end" | "right-start" | "right" | "top-end" | "top-start" | "top" | undefined;
}