-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #46 from shefing/reload
Reload
- Loading branch information
Showing
11 changed files
with
209 additions
and
36 deletions.
There are no files selected for viewing
4 changes: 4 additions & 0 deletions
4
library/math/numbersLine/public/assets/icons/toolbar/reloadDisable.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| import { | ||
| AlertDialog, | ||
| AlertDialogAction, | ||
| AlertDialogCancel, | ||
| AlertDialogContent, | ||
| AlertDialogFooter, | ||
| AlertDialogHeader, | ||
| AlertDialogTitle, | ||
| } from "@/components/ui/alert-dialog"; | ||
| import { useNumbersLineContext } from "@/context/numbersLineContext"; | ||
|
|
||
| const Reload = () => { | ||
| const { initializationDialog, setInitializationDialog, initialization } = useNumbersLineContext(); | ||
|
|
||
| return ( | ||
| <> | ||
| <AlertDialog open={initializationDialog} onOpenChange={setInitializationDialog}> | ||
| <AlertDialogContent> | ||
| <AlertDialogHeader> | ||
| <AlertDialogTitle>?אתם רוצים להתחיל מחדש</AlertDialogTitle> | ||
| </AlertDialogHeader> | ||
| <AlertDialogFooter> | ||
| <AlertDialogCancel>הישארו</AlertDialogCancel> | ||
| <AlertDialogAction onClick={initialization}>מחק הכל</AlertDialogAction> | ||
| </AlertDialogFooter> | ||
| </AlertDialogContent> | ||
| </AlertDialog> | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| export default Reload; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
98 changes: 98 additions & 0 deletions
98
library/math/numbersLine/src/components/ui/alert-dialog.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,98 @@ | ||
| import * as React from "react"; | ||
| import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog"; | ||
|
|
||
| import { cn } from "@/lib/utils"; | ||
| import { buttonVariants } from "@/components/ui/button"; | ||
|
|
||
| const AlertDialog = AlertDialogPrimitive.Root; | ||
|
|
||
| const AlertDialogTrigger = AlertDialogPrimitive.Trigger; | ||
|
|
||
| const AlertDialogPortal = AlertDialogPrimitive.Portal; | ||
|
|
||
| const AlertDialogOverlay = React.forwardRef< | ||
| React.ElementRef<typeof AlertDialogPrimitive.Overlay>, | ||
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay> | ||
| >(({ className, ...props }, ref) => ( | ||
| <AlertDialogPrimitive.Overlay | ||
| className={cn( | ||
| "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", | ||
| className | ||
| )} | ||
| {...props} | ||
| ref={ref} | ||
| /> | ||
| )); | ||
| AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName; | ||
|
|
||
| const AlertDialogContent = React.forwardRef< | ||
| React.ElementRef<typeof AlertDialogPrimitive.Content>, | ||
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content> | ||
| >(({ className, ...props }, ref) => ( | ||
| <AlertDialogPortal> | ||
| <AlertDialogOverlay /> | ||
| <AlertDialogPrimitive.Content | ||
| ref={ref} | ||
| className={cn( | ||
| "fixed left-[50%] top-[50%] h-[146px] z-50 grid w-[350px] max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg border border-radius-[5px] border-[#009FDE]", | ||
| className | ||
| )} | ||
| {...props} | ||
| /> | ||
| </AlertDialogPortal> | ||
| )); | ||
| AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName; | ||
|
|
||
| const AlertDialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => ( | ||
| <div className={cn("flex flex-col space-y-2 text-center sm:text-center", className)} {...props} /> | ||
| ); | ||
| AlertDialogHeader.displayName = "AlertDialogHeader"; | ||
|
|
||
| const AlertDialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => ( | ||
| <div className={cn("sm:flex-row sm:justify-center sm:space-x-2", className)} {...props} /> | ||
| ); | ||
| AlertDialogFooter.displayName = "AlertDialogFooter"; | ||
|
|
||
| const AlertDialogTitle = React.forwardRef< | ||
| React.ElementRef<typeof AlertDialogPrimitive.Title>, | ||
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title> | ||
| >(({ className, ...props }, ref) => ( | ||
| <AlertDialogPrimitive.Title ref={ref} className={cn("text-lg font-semibold text-[26px] font-[400] font-[Abraham] ", className)} {...props} /> | ||
| )); | ||
| AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName; | ||
|
|
||
| const AlertDialogDescription = React.forwardRef< | ||
| React.ElementRef<typeof AlertDialogPrimitive.Description>, | ||
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description> | ||
| >(({ className, ...props }, ref) => <AlertDialogPrimitive.Description ref={ref} className={cn("text-sm text-muted-foreground", className)} {...props} />); | ||
| AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName; | ||
|
|
||
| const AlertDialogAction = React.forwardRef< | ||
| React.ElementRef<typeof AlertDialogPrimitive.Action>, | ||
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action> | ||
| >(({ className, ...props }, ref) => ( | ||
| <AlertDialogPrimitive.Action ref={ref} className={cn(buttonVariants({ variant: "action" }), "mt-2 sm:mt-0", className)} {...props} /> | ||
| )); | ||
| AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName; | ||
|
|
||
| const AlertDialogCancel = React.forwardRef< | ||
| React.ElementRef<typeof AlertDialogPrimitive.Cancel>, | ||
| React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel> | ||
| >(({ className, ...props }, ref) => ( | ||
| <AlertDialogPrimitive.Cancel ref={ref} className={cn(buttonVariants({ variant: "cancel" }), "mt-2 sm:mt-0", className)} {...props} /> | ||
| )); | ||
| AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName; | ||
|
|
||
| export { | ||
| AlertDialog, | ||
| AlertDialogPortal, | ||
| AlertDialogOverlay, | ||
| AlertDialogTrigger, | ||
| AlertDialogContent, | ||
| AlertDialogHeader, | ||
| AlertDialogFooter, | ||
| AlertDialogTitle, | ||
| AlertDialogDescription, | ||
| AlertDialogAction, | ||
| AlertDialogCancel, | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,27 +1,25 @@ | ||
| import { LineRange, RulerLenth, unitAmount } from "../type/ruler" | ||
| import { type ClassValue, clsx } from "clsx" | ||
| import { twMerge } from "tailwind-merge" | ||
| import { LineRange, RulerLenth, unitAmount } from "../type/ruler"; | ||
| import { type ClassValue, clsx } from "clsx"; | ||
| import { twMerge } from "tailwind-merge"; | ||
|
|
||
| export function cn(...inputs: ClassValue[]) { | ||
| return twMerge(clsx(inputs)) | ||
| return twMerge(clsx(inputs)); | ||
| } | ||
|
|
||
| export const calculatScreenWidth = (windowWidth:number)=>{ | ||
| return -windowWidth*((LineRange.hundred-RulerLenth.hundred)/RulerLenth.hundred) | ||
| } | ||
| export const calculatScreenWidth = (windowWidth: number) => { | ||
| return -windowWidth * ((LineRange.hundred - RulerLenth.hundred) / RulerLenth.hundred); | ||
| }; | ||
|
|
||
| export const calculatRulerWidth = (windowWidth:number, RulerPadding:number)=>{ | ||
| return windowWidth - RulerPadding*2; | ||
| } | ||
| export const calculatRulerWidth = (windowWidth: number, RulerPadding: number) => { | ||
| return windowWidth - RulerPadding * 2; | ||
| }; | ||
|
|
||
| export const getImageSrc = (url: string,isHovered:boolean , isOpen:boolean) => { | ||
| const dotIndex = url.indexOf('.'); | ||
| export const getImageSrc = (url: string, isHovered: boolean, isOpen: boolean, isDisable?: boolean) => { | ||
| const dotIndex = url.indexOf("."); | ||
| const beforeDot = url.substring(0, dotIndex); | ||
| return isOpen? beforeDot+'Open.svg': isHovered ? beforeDot+'Hover.svg' : url; | ||
| } | ||
|
|
||
| export const calculatUnitsAmount = (type: LineRange)=>{ | ||
| return type == LineRange.hundred || type == LineRange.twenty? unitAmount.twenty: unitAmount.ten; | ||
| } | ||
|
|
||
| return isOpen ? beforeDot + "Open.svg" : isHovered ? beforeDot + "Hover.svg" : isDisable ? beforeDot + "Disable.svg" : url; | ||
| }; | ||
|
|
||
| export const calculatUnitsAmount = (type: LineRange) => { | ||
| return type == LineRange.hundred || type == LineRange.twenty ? unitAmount.twenty : unitAmount.ten; | ||
| }; |