{"version":3,"file":"Drawer-b1b0c757.js","sources":["../../../app/packs/src/design-system/components/molecules/Sort/Root.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/context/SkillsDrawerProvider.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/DrawerHeader.tsx","../../../app/packs/src/design-system/components/molecules/Search/Root.tsx","../../../app/packs/src/design-system/components/molecules/Search/Input.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/SkillsList.tsx","../../../app/packs/src/design-system/components/organisms/Skills/CollectionList/index.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/tabs/Default.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/tabs/New.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/Footer.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/DrawerContent.tsx","../../../app/packs/src/design-system/components/organisms/Skills/SkillsDrawer/Drawer.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { PropsWithRequiredChildren } from '../../../types/helpers'\nimport { SortContext } from './SortContext'\nimport type { TSort } from './utils'\n\ntype WithoutDefaultSort = {\n /**\n * Prop to disable default sorting. This must be used in conjunction with `initialSort`, so the context knows which sort to apply as a starting point\n */\n allowDefaultSort: false\n /**\n * Required sort object used to set the initial sort. This is required when setting the `allowDefaultSort` prop to false, so the context knows which sort to apply as a starting point\n */\n initialSort: NonNullable<TSort>\n}\n\ntype WithDefaultSort = {\n allowDefaultSort?: never\n initialSort?: TSort\n}\n\nexport type RootProps = {\n onSortChange?: (newSort: TSort) => void\n} & PropsWithRequiredChildren<React.ComponentPropsWithoutRef<'div'>> &\n (WithDefaultSort | WithoutDefaultSort)\n\nexport const Root: React.VFC<RootProps> = (props) => {\n const {\n children,\n initialSort,\n allowDefaultSort,\n onSortChange,\n ...restProps\n } = props\n\n const [activeSort, setActiveSort] = React.useState<TSort>(initialSort || null)\n\n return (\n <SortContext.Provider\n value={{ activeSort, setActiveSort, onSortChange, allowDefaultSort }}\n >\n <div {...restProps}>{children}</div>\n </SortContext.Provider>\n )\n}\n","import { merge } from 'merge-anything'\nimport * as React from 'react'\nimport {\n TCollection,\n TSkill,\n TSkillVariant,\n TSkillWithOrg,\n} from '../../../../../types/entities'\nimport { SkillsDrawerProps, SkillType } from '../SkillsDrawer.types'\nimport { SkillsDrawerContext } from './SkillsDrawerContext'\n\ntype SkillsDrawerProviderProps = {\n children: React.ReactNode\n frameworkSkills?: readonly TSkill[]\n skills?: readonly TSkillWithOrg[]\n collections?: readonly TCollection[]\n eventHandlers: SkillsDrawerProps['eventHandlers']\n}\n\nexport const SkillsDrawerProvider = (props: SkillsDrawerProviderProps) => {\n const {\n children,\n skills = [],\n collections = [],\n frameworkSkills = [],\n eventHandlers,\n ...restProps\n } = props\n\n /**\n * Org skills are matched by its `id`\n */\n const usedFrameworkSkillsIDs = React.useMemo(() => {\n return frameworkSkills.map((s) => Number(s.id))\n }, [frameworkSkills])\n\n const getSkill = (skillId: string) => {\n return skills.find((s) => s.id.toString() === skillId)\n }\n\n /**\n * Function for checking if the skill is in use in the skills grid\n */\n const inCurrentFramework = (skill: TSkill): boolean => {\n if (skill.cloneable) return false\n\n return usedFrameworkSkillsIDs.includes(Number(skill.id))\n }\n\n const usedFrameworkSkillVariantsIDs = React.useMemo(() => {\n return frameworkSkills\n .map((s) =>\n s.skillVariants\n ?.filter((v) => v.inCurrentFramework)\n .map((v) => Number(v.id))\n )\n .flat()\n }, [frameworkSkills])\n\n const inCurrentFrameworkVariant = (variant: TSkillVariant): boolean => {\n return usedFrameworkSkillVariantsIDs.includes(Number(variant.id))\n }\n\n const inCurrentFrameworkAnyVariant = (\n skillVariants: TSkillVariant[]\n ): boolean => {\n return skillVariants.some((skillVariant) =>\n inCurrentFrameworkVariant(skillVariant)\n )\n }\n\n const providerProps = merge(restProps, {\n collections,\n eventHandlers,\n getSkill,\n inCurrentFramework,\n inCurrentFrameworkAnyVariant,\n inCurrentFrameworkVariant,\n skills,\n })\n\n return (\n <SkillsDrawerContext.Provider value={providerProps}>\n {children}\n </SkillsDrawerContext.Provider>\n )\n}\n","import { ArrowLeft, X } from '@phosphor-icons/react'\nimport * as React from 'react'\nimport { useDrawerContext } from '../../../../contexts/drawer-context'\nimport styles from './DrawerHeader.module.scss'\n\ntype HeaderProps = {\n title: string\n onClickBack?: () => void\n}\n\nexport const Header = (props: HeaderProps) => {\n const { title, onClickBack } = props\n\n const { closeDrawer } = useDrawerContext()\n\n return (\n <div className={styles.header}>\n {!!onClickBack && (\n <button onClick={onClickBack} title=\"Go back\">\n <ArrowLeft weight=\"bold\" className={styles.backIcon} />\n </button>\n )}\n <h3 className={styles.title}>{title}</h3>\n <button onClick={closeDrawer} title=\"Close drawer\">\n <X weight=\"bold\" className={styles.closeIcon} />\n </button>\n </div>\n )\n}\n","import * as React from 'react'\nimport { merge } from 'merge-anything'\nimport type { DistributiveOmit } from '../../../types/helpers'\nimport * as Sort from '../Sort'\nimport { TSort } from '../Sort/utils'\nimport { SearchContext, SearchContextProps } from './SearchContext'\nimport { useDebouncedCallback } from 'use-debounce'\nimport { SearchObject } from './Search.types'\n\nexport type RootProps = {\n /**\n * Event handler called when any search related content changes such as query, sort, filters etc.\n * @example onSearchChange={(search) => console.log(search.query)}\n */\n onSearchChange?: (search: SearchObject) => void | Promise<void>\n /**\n * Optional debounce time in ms to implement throttling on the onSearchChange function. By default this is 0, but you could set it to a value like 200 which would ensure 200ms had passed since the last change before calling the onSearchChange handler\n * @example debounceTime={200}\n */\n debounceTime?: number\n /**\n * Children to pass through to the root. If passed a function you can access the internal search object\n * @example\n * <Search.Root>\n * {({ search }) => (\n * <div>Query: {search.query}</div>\n * )}\n * </Search.Root>\n */\n children:\n | React.ReactNode\n | ((ctx: {\n /**\n * Search object containing query, sort, filters etc.\n */\n search: SearchContextProps['search']\n /**\n * method for updating the search object programmatically, useful for things like changing filters when swapping between tabs. This will merge any new values with the existing search object\n * @example updateSearch({ filters: { source: \"library\" } })\n */\n updateSearch: SearchContextProps['updateSearch']\n }) => React.ReactNode)\n} & DistributiveOmit<Sort.RootProps, 'onSortChange' | 'children'>\n\n/**\n * A group of search related components which support passing a single search object containing query, sort, filters etc. to a change handler which can subsequently perform external searches with the information provided. Handles things like hitting `Esc` to clear search input.\n */\nexport const Root: React.VFC<RootProps> = (props) => {\n const { children, onSearchChange, debounceTime = 0, ...restProps } = props\n\n const [search, setSearch] = React.useState({\n query: '',\n sort: props.initialSort,\n })\n\n const debouncedOnSearchChange = useDebouncedCallback(\n (search: SearchObject) => {\n onSearchChange?.(search)\n },\n debounceTime\n )\n\n const updateSearch = React.useCallback(\n (newSearch: SearchObject) => {\n setSearch((search) => {\n const combinedSearch = merge({ ...search }, newSearch)\n if (debounceTime > 0) debouncedOnSearchChange(combinedSearch)\n else onSearchChange?.(combinedSearch)\n return combinedSearch\n })\n },\n [debounceTime]\n )\n\n const resetQuery = () => updateSearch({ query: '' })\n const updateSort = (sort: TSort) => updateSearch({ sort })\n\n const content =\n children instanceof Function ? children({ search, updateSearch }) : children\n\n return (\n <SearchContext.Provider\n value={{ search, updateSearch, resetQuery, onSearchChange }}\n >\n <Sort.Root onSortChange={updateSort} {...restProps}>\n {content}\n </Sort.Root>\n </SearchContext.Provider>\n )\n}\n","import * as React from 'react'\nimport cn from 'classnames'\nimport type { PropsWithoutChildren } from '../../../types/helpers'\nimport styles from './Input.module.scss'\nimport { Search } from '@easy-eva-icons/react'\nimport { SearchContext } from './SearchContext'\nimport { composeEventHandlers } from '../../../utils/compose-event-handlers'\nimport { Input } from '../../atoms/Input'\n\nexport type SearchInputProps = {\n /**\n * Optional props to pass through to the label which wraps around the input - can be used for positioning if needed\n */\n labelProps?: PropsWithoutChildren<React.ComponentPropsWithoutRef<'label'>>\n} & Omit<\n PropsWithoutChildren<React.ComponentPropsWithoutRef<'input'>>,\n 'role' | 'autoComplete' | 'type'\n>\n\n/**\n * A search input component which supports hitting escape to clear the current query, as well as passing any content up to the `<Search.Root>` component which can subsequently perform external searches using the passed through search object, containing things like query, sort, filters etc.\n */\nexport const SearchInput: React.VFC<SearchInputProps> = (props) => {\n const { labelProps, className, onKeyDown, onChange, ...restProps } = props\n\n const { search, updateSearch, resetQuery } = React.useContext(SearchContext)\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Escape') resetQuery()\n }\n\n const handleOnChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n updateSearch({ query: e.target.value })\n }\n\n return (\n <label\n {...labelProps}\n className={cn('relative flex', labelProps?.className)}\n >\n <Search aria-hidden className={cn(styles.searchIcon)} />\n <Input\n type=\"search\"\n role=\"searchbox\"\n autoComplete=\"off\"\n value={search.query}\n onKeyDown={composeEventHandlers(onKeyDown, handleKeyDown)}\n onChange={composeEventHandlers(onChange, handleOnChange)}\n className={cn(styles.input, className)}\n {...restProps}\n />\n </label>\n )\n}\n","import * as React from 'react'\nimport { SkillCard } from './SkillCard'\nimport styles from './SkillsDrawer.module.scss'\nimport type { TSkill } from '../../../../types/entities'\n\nexport type SkillsListProps = {\n source: 'library' | 'org' | 'all'\n skills?: readonly TSkill[]\n allowEdit: boolean\n}\n\nexport const SkillsList = (props: SkillsListProps) => {\n const { source, skills = [], ...restProps } = props\n\n const filteredSkills = skills // change to show added skills at all times to avoid blank page\n\n return (\n <div className={styles.skillsList}>\n <div className={styles.sortedBy}>\n {source === 'library'\n ? 'Sorted by: Most popular'\n : 'Sorted by: Most used'}\n </div>\n {filteredSkills.length > 0 ? (\n filteredSkills.map((skill) => (\n <SkillCard\n key={`${skill.cloneable ? 'library' : 'org'}-${skill.id}`}\n source={source}\n skill={skill}\n {...restProps}\n />\n ))\n ) : (\n <div className=\"\">\n <div className=\"px-4 pt-8 text-center text-gray-500\">\n <p>No skills available</p>\n </div>\n <div className=\"flex flex-col\">\n {Array.from({ length: 3 }).map((_, index) => (\n <div key={index} className=\"p-4 w-full flex gap-x-4\">\n <div className=\"w-16 h-16 rounded bg-gray-25\"></div>\n <div className=\"py-2 flex flex-col items-start h-full gap-2\">\n <div className=\"h-3 rounded-full bg-gray-25 w-36\"></div>\n <div className=\"h-3 rounded-full bg-gray-25 w-24\"></div>\n </div>\n </div>\n ))}\n </div>\n </div>\n )}\n </div>\n )\n}\n","import * as React from 'react'\nimport { TCollection } from '../../../../types/entities'\nimport { CollectionCard } from '../CollectionCard'\nimport { PropsWithoutChildren } from '../../../../types/helpers'\n\nexport type CollectionListProps = {\n source: 'library' | 'org' | 'all'\n /**\n * Array of collections to display in the list\n */\n collections?: readonly TCollection[]\n /**\n * Hook called when the user adds a collection from the drawer\n */\n onAddCollection?(collection: TCollection): void\n /**\n * Hook called when the user clicks a collection\n */\n onClick?(collection: TCollection): void\n /**\n * Whether or not the collection cards are draggable\n */\n draggable?: boolean\n} & PropsWithoutChildren<Omit<React.ComponentPropsWithoutRef<'div'>, 'onClick'>>\n\nexport const CollectionList: React.VFC<CollectionListProps> = (props) => {\n const {\n collections = [],\n source,\n onClick,\n onAddCollection,\n draggable,\n ...restProps\n } = props\n\n return (\n <div {...restProps}>\n {collections.length && (\n <div className=\"p-4 text-gray-500\">Collections</div>\n )}\n {collections.map((collection: TCollection) => (\n <CollectionCard\n draggable={draggable}\n key={collection.id}\n source={source}\n collection={collection}\n onAddCollection={onAddCollection}\n onClick={onClick}\n />\n ))}\n </div>\n )\n}\n","import * as React from 'react'\nimport {\n TCategory,\n TCollection,\n TSkillWithOrg,\n} from '../../../../../types/entities'\nimport * as TabbedContent from '../../../TabbedContent'\nimport styles from '../SkillsDrawer.module.scss'\nimport * as Search from '../../../../molecules/Search'\nimport { useSkillsDrawer } from '../context'\nimport { useDrawerContext } from '../../../../../contexts/drawer-context'\nimport { SkillsList } from '../SkillsList'\nimport { CollectionList } from '../../CollectionList'\nimport { SKILLS_DRAWER_ID } from '../utils'\nimport { SearchObject } from '../../../../molecules/Search'\n\nexport type SkillsDrawerDefaultTabProps = {\n source: 'library' | 'org' | 'all'\n orgName?: string\n skills?: readonly TSkillWithOrg[]\n collections?: readonly TCollection[]\n /**\n * Whether or not to show the \"No results\" message\n */\n showNoResults?: boolean\n /**\n * Whether or not to show already added skills in the drawer. Useful for hiding them from an initial state\n */\n showAddedSkills?: boolean\n}\n\nexport const SkillsDrawerDefaultTab: React.VFC<SkillsDrawerDefaultTabProps> = (\n props\n) => {\n const {\n source,\n orgName,\n skills = [],\n collections = [],\n showNoResults,\n showAddedSkills,\n } = props\n\n const { closeDrawer, getDrawerProps } = useDrawerContext()\n\n const {\n eventHandlers: { onAddCollection, onSearchChange, onClickCollection },\n } = useSkillsDrawer()\n\n const { category } = getDrawerProps<{ category: TCategory | null }>(\n SKILLS_DRAWER_ID\n )\n\n const addCollection = React.useCallback(\n (collection: TCollection) => {\n onAddCollection?.(collection, category?.id.toString())\n closeDrawer()\n },\n [onAddCollection, closeDrawer]\n )\n\n const onSearchChangeHandler = (search: SearchObject) => {\n onSearchChange?.(search)\n }\n\n const placeholder = React.useMemo(() => {\n if (source === 'library') return \"Search Progression's Library\"\n return `Search ${orgName || 'your org'}'s skills`\n }, [source, category])\n\n return (\n <TabbedContent.Content tabId=\"default\" className={styles.tabbedContent}>\n <Search.Root\n allowDefaultSort={false}\n initialSort={{ id: 'created_at', direction: 'desc' }}\n onSearchChange={onSearchChangeHandler}\n debounceTime={200}\n >\n {!!onSearchChange && (\n <Search.Input\n autoFocus\n placeholder={placeholder}\n onKeyDown={(e) => e.stopPropagation()}\n labelProps={{ className: styles.searchInput }}\n />\n )}\n\n <SkillsList source={source} skills={skills} allowEdit />\n\n {source === 'library' && (\n <CollectionList\n draggable\n source={source}\n collections={collections}\n onAddCollection={addCollection}\n onClick={onClickCollection}\n />\n )}\n\n {showNoResults && <div className={styles.noResults}>No results</div>}\n </Search.Root>\n </TabbedContent.Content>\n )\n}\n","import * as React from 'react'\nimport { useDrawerContext } from '../../../../../contexts/drawer-context'\nimport * as TabbedContent from '../../../TabbedContent'\nimport { NewSkillForm } from '../../NewSkillForm'\nimport styles from '../SkillsDrawer.module.scss'\n\nexport type SkillsDrawerNewTabProps = {\n onCreateNewSkill?: (name: string) => void | Promise<void>\n}\n\nexport const SkillsDrawerNewTab: React.VFC<SkillsDrawerNewTabProps> = (\n props\n) => {\n const { onCreateNewSkill } = props\n\n const { closeDrawer } = useDrawerContext()\n\n return (\n <TabbedContent.Content tabId=\"new\" className={styles.tabbedContent}>\n <NewSkillForm\n onSubmit={async (name) => {\n await onCreateNewSkill?.(name)\n closeDrawer()\n }}\n className={styles.newForm}\n />\n </TabbedContent.Content>\n )\n}\n","import * as React from 'react'\nimport cn from 'classnames'\nimport { Drawer } from '../../../molecules/Drawer'\nimport styles from './Footer.module.scss'\nimport { Book, Plus, Sparkle } from '@phosphor-icons/react'\n\nexport type SkillsDrawerFooterProps = {\n showAiSkillGenerator?: boolean\n skillGeneratorUrl?: string\n orgSkillsUrl?: string\n onClickCreateNewSkill?: (categoryId?: string) => void\n onClickGenerateSkill?: (categoryId?: string) => void\n categoryId?: string\n source: string\n}\n\nexport const SkillsDrawerFooter: React.VFC<SkillsDrawerFooterProps> = (\n props\n) => {\n const {\n source,\n categoryId,\n showAiSkillGenerator,\n skillGeneratorUrl,\n orgSkillsUrl,\n onClickGenerateSkill,\n onClickCreateNewSkill,\n } = props\n\n const content = (\n <>\n {showAiSkillGenerator && (\n <a\n href={skillGeneratorUrl}\n onClick={() => onClickGenerateSkill?.(categoryId)}\n className={styles.item}\n >\n <div\n className={cn(\n styles.iconContainer,\n styles.generateNewSkillIconContainer\n )}\n >\n <Sparkle weight=\"bold\" className={styles.icon} />\n </div>\n <div className=\"flex flex-col items-start\">\n <h5 className={styles.title}>Generate new skill</h5>\n <p className={styles.description}>\n AI Assistant · Powered by GPT-3\n </p>\n </div>\n </a>\n )}\n\n <button\n type=\"button\"\n onClick={() => onClickCreateNewSkill?.(categoryId)}\n className={styles.item}\n >\n <div className={cn(styles.iconContainer, styles.newSkillIconContainer)}>\n <Plus weight=\"bold\" className={styles.icon} />\n </div>\n <div className=\"flex flex-col items-start\">\n <h5 className={styles.title}>Create new skill</h5>\n {!showAiSkillGenerator && (\n <p className={styles.description}>\n Build from scratch with our AI Assistant\n </p>\n )}\n </div>\n </button>\n </>\n )\n\n if (source === 'library') {\n return <div className={styles.header}>{content}</div>\n }\n\n return (\n <Drawer.Footer animation={false} className={styles.footer}>\n {content}\n {orgSkillsUrl && (\n <a href={orgSkillsUrl} className={styles.item}>\n <div\n className={cn(\n styles.iconContainer,\n styles.addFromLibraryIconContainer\n )}\n >\n <Book weight=\"bold\" className={styles.icon} />\n </div>\n <div className=\"flex flex-col items-start\">\n <h5 className={styles.title}>Add from library</h5>\n <p className={styles.description}>\n Add new skills to your org from Progression's library\n </p>\n </div>\n </a>\n )}\n </Drawer.Footer>\n )\n}\n","import * as React from 'react'\nimport * as TabbedContent from '../../TabbedContent'\nimport { useDrawerProps } from '../../../../hooks/use-drawer-props'\nimport { TCategory } from '../../../../types/entities'\nimport { SkillsDrawerProps } from './SkillsDrawer.types'\nimport { SKILLS_DRAWER_ID } from './utils'\nimport { Header } from './DrawerHeader'\nimport { Loader } from '../../../atoms/Loader'\nimport { SkillsDrawerDefaultTab, SkillsDrawerNewTab } from './tabs'\nimport { SkillsDrawerFooter } from './Footer'\nimport styles from './DrawerContent.module.scss'\n\nexport type SkillsDrawerContentProps = Pick<\n SkillsDrawerProps,\n | 'source'\n | 'collections'\n | 'eventHandlers'\n | 'frameworkName'\n | 'orgName'\n | 'showAddedSkills'\n | 'showAiSkillGenerator'\n | 'showLoadingSpinner'\n | 'showNoResults'\n | 'skillGeneratorUrl'\n | 'orgSkillsUrl'\n | 'skills'\n | 'title'\n>\n\nexport const SkillsDrawerContent: React.VFC<SkillsDrawerContentProps> = (\n props\n) => {\n const {\n source,\n collections,\n eventHandlers,\n frameworkName,\n orgName,\n showAddedSkills,\n showAiSkillGenerator,\n showLoadingSpinner,\n showNoResults,\n skillGeneratorUrl,\n orgSkillsUrl,\n skills,\n title: baseTitle,\n } = props\n\n const initialTabId = 'default'\n\n const { category } = useDrawerProps<{ category: TCategory | null }>(\n SKILLS_DRAWER_ID\n )\n\n let title = baseTitle || `Add skills to ${frameworkName || 'your framework'}`\n if (source === 'library') title = `Add skills to ${orgName || 'your org'}`\n if (category) title = `Add skills to \"${category.name}\"`\n\n return (\n <TabbedContent.Root initialTabId={initialTabId} className={styles.content}>\n {({ activeTab, setActiveTab }) => (\n <>\n <Header\n title={activeTab === 'new' ? 'Create new skill' : title}\n onClickBack={\n activeTab === 'new' ? () => setActiveTab(initialTabId) : undefined\n }\n />\n <SkillsDrawerFooter\n source={source}\n categoryId={category?.id.toString()}\n onClickCreateNewSkill={(categoryId) => {\n eventHandlers?.onClickCreateSkill?.(categoryId)\n setActiveTab('new')\n }}\n showAiSkillGenerator={showAiSkillGenerator}\n skillGeneratorUrl={skillGeneratorUrl}\n orgSkillsUrl={orgSkillsUrl}\n />\n {showLoadingSpinner && <Loader className={styles.loader} />}\n\n {!showLoadingSpinner && (\n <>\n <SkillsDrawerDefaultTab\n source={source}\n skills={skills}\n orgName={orgName}\n collections={collections}\n showNoResults={showNoResults}\n showAddedSkills={showAddedSkills}\n />\n\n <SkillsDrawerNewTab\n onCreateNewSkill={(name) => {\n eventHandlers?.onCreateNewSkill?.(\n name,\n category?.id.toString()\n )\n }}\n />\n </>\n )}\n </>\n )}\n </TabbedContent.Root>\n )\n}\n","import * as React from 'react'\nimport { GlobalDrawer } from '../../../molecules/GlobalDrawer'\nimport styles from './SkillsDrawer.module.scss'\nimport { SkillsDrawerProps } from './SkillsDrawer.types'\nimport { SKILLS_DRAWER_ID } from './utils'\nimport { SkillsDrawerProvider } from './context'\nimport { SkillsDrawerContent } from './DrawerContent'\n\nexport const SkillsDrawer: React.VFC<SkillsDrawerProps> = (props) => {\n const {\n source,\n collections,\n eventHandlers,\n frameworkSkills,\n frameworkName,\n orgName,\n showAddedSkills,\n showLoadingSpinner,\n showNoResults,\n skillGeneratorUrl,\n orgSkillsUrl,\n skills,\n showAiSkillGenerator = true,\n title: baseTitle,\n ...restProps\n } = props\n\n const title = baseTitle || 'Add skills to your framework'\n\n return (\n <SkillsDrawerProvider\n collections={collections}\n eventHandlers={eventHandlers}\n skills={skills}\n frameworkSkills={frameworkSkills}\n >\n <GlobalDrawer\n id={SKILLS_DRAWER_ID}\n title={title}\n className={styles.drawer}\n {...restProps}\n >\n <SkillsDrawerContent\n source={source}\n collections={collections}\n eventHandlers={eventHandlers}\n frameworkName={frameworkName}\n orgName={orgName}\n showAddedSkills={showAddedSkills}\n showAiSkillGenerator={showAiSkillGenerator}\n showLoadingSpinner={showLoadingSpinner}\n showNoResults={showNoResults}\n skillGeneratorUrl={skillGeneratorUrl}\n orgSkillsUrl={orgSkillsUrl}\n skills={skills}\n title={baseTitle}\n />\n </GlobalDrawer>\n </SkillsDrawerProvider>\n )\n}\n"],"names":["Root","props","children","initialSort","allowDefaultSort","onSortChange","restProps","activeSort","setActiveSort","React.useState","jsx","SortContext","SkillsDrawerProvider","skills","collections","frameworkSkills","eventHandlers","usedFrameworkSkillsIDs","React.useMemo","s","getSkill","skillId","inCurrentFramework","skill","usedFrameworkSkillVariantsIDs","_a","v","inCurrentFrameworkVariant","variant","providerProps","merge","skillVariants","skillVariant","SkillsDrawerContext","Header","title","onClickBack","closeDrawer","useDrawerContext","jsxs","styles","ArrowLeft","X","onSearchChange","debounceTime","search","setSearch","debouncedOnSearchChange","useDebouncedCallback","updateSearch","React.useCallback","newSearch","combinedSearch","resetQuery","updateSort","sort","content","SearchContext","Sort.Root","SearchInput","labelProps","className","onKeyDown","onChange","React.useContext","handleKeyDown","e","handleOnChange","cn","Search","Input","composeEventHandlers","SkillsList","source","filteredSkills","SkillCard","_","index","CollectionList","onClick","onAddCollection","draggable","collection","CollectionCard","SkillsDrawerDefaultTab","orgName","showNoResults","showAddedSkills","getDrawerProps","onClickCollection","useSkillsDrawer","category","SKILLS_DRAWER_ID","addCollection","onSearchChangeHandler","placeholder","TabbedContent.Content","Search.Root","Search.Input","SkillsDrawerNewTab","onCreateNewSkill","NewSkillForm","name","SkillsDrawerFooter","categoryId","showAiSkillGenerator","skillGeneratorUrl","orgSkillsUrl","onClickGenerateSkill","onClickCreateNewSkill","Fragment","Sparkle","Plus","Drawer","Book","SkillsDrawerContent","frameworkName","showLoadingSpinner","baseTitle","initialTabId","useDrawerProps","TabbedContent.Root","activeTab","setActiveTab","Loader","SkillsDrawer","GlobalDrawer"],"mappings":"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"}