@kenmori/copy-name-manager
v0.0.5
Published
A versatile JavaScript/TypeScript library for managing and generating sequentially named copies with customizable naming patterns. Perfect for applications requiring dynamic duplication and renaming.
Downloads
136
Maintainers
Readme
CopyManager
CopyManager
is a lightweight JavaScript/TypeScript library that helps manage unique copy names in applications. This is particularly useful when you need to create multiple copies of items with distinct names and want to ensure that each copy has a unique name, even after some copies are deleted.
Features
- Automatically generates unique copy names in the format
name
,nameのコピー
,nameのコピー2
, etc. - Handles deletion of copies and reuses deleted copy numbers when new copies are added.
- Provides easy integration with frontend frameworks like React.
Installation
You can install the library via npm:
npm install copy-name-manager
Usage
Basic Example
Here is how you can use CopyManager in a JavaScript/TypeScript project:
import { CopyManager } from "copy-name-manager";
const copyManager = new CopyManager();
const firstCopy = copyManager.addCopy("Document");
console.log(firstCopy); // Output: "Document"
const secondCopy = copyManager.addCopy("Document");
console.log(secondCopy); // Output: "Documentのコピー"
const thirdCopy = copyManager.addCopy("Document");
console.log(thirdCopy); // Output: "Documentのコピー2"
// Removing a copy
copyManager.removeCopy("Documentのコピー");
console.log(copyManager.getCopies()); // Output: ["Document", "Documentのコピー2"]
// Adding a new copy after deletion
const newCopy = copyManager.addCopy("Document");
console.log(newCopy); // Output: "Documentのコピー"
React Example
CopyManager can be easily integrated into React applications. Below is an example of how to use it:
import React, { useState } from "react";
import { CopyManager } from "copy-name-manager";
const CopyManagerComponent = () => {
const copyManager = new CopyManager();
const [copies, setCopies] = useState<string[]>([]);
const handleAddCopy = () => {
const newCopy = copyManager.addCopy("Document");
setCopies([...copyManager.getCopies()]);
};
const handleRemoveCopy = (name: string) => {
copyManager.removeCopy(name);
setCopies([...copyManager.getCopies()]);
};
return (
<div>
<button onClick={handleAddCopy}>コピー</button>
<ul>
{copies.map((copy, index) => (
<li key={index}>
{copy} <button onClick={() => handleRemoveCopy(copy)}>削除</button>
</li>
))}
</ul>
</div>
);
};
export default CopyManagerComponent;
Visualization
To better understand how CopyManager works, here's a visual example:
API
addCopy(name: string): string
Adds a new copy with a unique name based on the given name. Returns the generated copy name.
removeCopy(name: string): boolean
Removes the specified copy. Returns true if the copy was successfully removed, otherwise returns false.
getCopies(): string[]
Returns an array of all the current copies.
License
This project is licensed under the MIT License.